MeloGuo Blog

努力给生活加点甜

【翻译】如何写出一份优秀的设计文档

真的要好好写文档

作为一名软件工程师,我花费了许多时间来阅读和编写设计文档。在看了几百份这样的文档后发现,优秀的设计文档与项目最终的成功有很大的关系。 在这篇文章中,我尝试去阐述是什么让一份设计文档如此重要。 这篇文章可分为 4 个部分: 为什么要写设计文档 设计文档应该包含什么内容 如何写 具体过程 为什么要写设计文档? 设计文档(也被称为技术手册)是对你计划如何解决问题的描述...

列表渲染中的 Key 值与组件更新

很基础却容易被忽视

上周在圈子首页发生一个诡异的 Bug,用户打卡后的内容会和上一条内容的图片相同!但是点击预览大图又不同,并且刷新也不会好,只有退出再重新进入页面后才会恢复。 @张译文 临时修复的一版,将 <x-image> 组件换成 <image> 便解决了问题。但是在我俩后续深入发掘问题时,发现了隐藏在表象背后的惊人秘密…… TL;DR 如果你不喜欢故弄玄虚的风格,可以一开始...

gitignore不生效怎么办

不该放的东西被存起来了

gitignore 文件是用来指定忽略掉还未被添加(untracked)到 Git 中的文件。如果文件已经被添加(tracked)到 Git 中,那么 gitignore 是不会对其产生影响的。 如果让已经添加的文件也遵循 gitignore 文件中的规则,需要对目标文件使用 git rm —cached 命令将其移出相关目录。 例如在项目中向 Git 添加了 test/index.js...

【翻译】赋值逻辑操作符

只能靠抄 Ruby 过活的样子

ECMAScript 提案:逻辑赋值操作符 ECMAScript 提案 “逻辑赋值运算符” 引入了以下复合赋值运算符。 a ||= b a &&= b a ??= b 现存的复合赋值运算符 JavaScript 已经存在以下几种复合赋值操作符: 算数赋值操作符:+= -= *= /= %= **= 位赋值操作符:&= ^= |= ...

微信小程序转义字符渲染问题

日常吐槽小程序

微信小程序中转义字符的渲染问题 今天开发遇到了一个诡异的现象,后端返回的字符串中包含了 \n 转义字符。将其放在 <text> 组件下即可实现换行的效果。 但是将内容通过 setData 渲染到页面上后,\n 却变成了 \\n 。这就造成了二次转义,无法实现换行的效果,其他转义字符也是同样的现象。在查阅了相关资料后并没有发现微信小程序的相关解释,所以只能自己解决。 二次转义...

小程序曝光埋点组件

手写 Observer 太累了...

组件内的埋点 在当前项目中,前端埋点更多是一个萝卜一个坑,产品需要埋在哪里直接就埋上了,缺少一些系统性的思考。 在整理了大部分埋点后可以发现,埋点可以分为两种: 全局埋点 全局埋点一般应用于通用的全局业务组件或者其他全局行为中,例如分享,页面跳转等。这种埋点行为如果发生在业务组件中直接在组件中进行埋点行为即可。但是还需要注意一个问题,如果此组件在未来有可能复用到其他项目...

迭代器模式

下一个,下一个,下一个...

迭代器模式是指提供一种方法顺序访问一个聚合对象中的各个元素, 而又不需要暴露该对象的内部表示。迭代器模式可以把迭代的过程从业务逻辑中分离出来,在使用迭代器模式之后,即使不关心对象的内部构造,也可以按顺序访问其中的每个元素。 内部迭代器 内部迭代器的内部定义好了迭代规则,它完全接手整个迭代过程,外部只需要一次调用。优点是外部仅需一次调用,简洁高效。缺点是功能单一,难以...

依赖注入与控制反转

反过身来,让我注入

依赖注入与控制反转 依赖注入(DI)和控制反转(IOC)基本是一个意思,因为说起来谁都离不开谁。 简单来说,a 依赖 b,但 a 不控制 b 的创建和销毁,仅使用 b,那么 b 的控制权交给 a 之外处理,这叫控制反转(IOC),而 a 要依赖 b,必然要使用 b 的 instance,那么 通过 a 的接口,把 b 传入; 通过 a 的构造,把 b 传入; 通过设置 a ...

面试官初体验

当我成为面试官的那一刻,一切全变了

面试的契机 面试是一件大部分人都逃不过的事情。除了那些少数的天才们一毕业就被企业哄抢,剩下的人都要经历许多次面试。我从大学毕业之后一共参加了大概 10 次面试,拿到了 5 个 offer,比起动辄几十次面试经验的人我是很克制自己。相对于被面试,面试别人的经历就不是每个人都有体验过,尤其是对于职场新人。碰巧最近公司积极招聘,面试者实在太多,于是面试的一部分任务便落到了我的头上。 在面对一件陌...

【翻译】globalThis 全知道

补丁上面打补丁,globalThis 实属无奈之举

由 Jordan Harband 提出的 ECMAScript 的新特性 globalThis 提供了一种获取全局对象的标准方式。 JavaScript 的全局作用域 JavaScript 的作用域从全局作用域开始为节点,形成了一个嵌套的树形结构。 仅仅在浏览器里直接使用 <script> 标签时的代码直接运行在全局作用域中。在这当中有两种全局变量: 普通的全局声明变量 ...