JS设计模式之单例模式
意图
保证一个类仅有一个实例，并提供一个访问它的全局访问点。
——《设计模式：可复用面向对象软件的基础》中文版第96页
这个概念有些类似于全局变量，它确保所有引用都访问到唯一的实例对象，这可以节省掉创建对象的开销。但是，相应地，在懒加载模式下，它也带来了检查是否已经创建对象的开销。所以还是要根据情况灵活选择使用与否。
示例
有两种实现方法，下面都列出。或许还有更多，这里就不深究了。
更改构造函 ...
JS设计模式之建造者模式
意图
将一个复杂对象的构建与它的表示（即实例对象）分离，使得同样的构建过程可以创建不同的表示
——《设计模式：可复用面向对象软件的基础》中文版第74页
这句话里包含着两个要素：第一个是分离构建与表示，也就是说我们要单独创建一个新的类XxxBuilder来进行构建操作；第二个是这个XxxBuilder可以被继承然后重写方法，使得调用同样的接口却创建了不同的对象。下面通过一段代码来解释清楚。
示例 ...
JS设计模式之工厂模式
工厂方法模式
定义一个用于创建对象的接口，让子类决定实例化哪一个类。工厂方法使一个类的实例化延迟到子类。
——《设计模式：可复用面向对象软件的基础》中文版第81页
在我理解中，所谓工厂方法，是指我们通过调用已知的接口，获得未知的对象，做出预期的行为。工厂方法为我们提供这一对象。试想一下，如果我们有将当前网页分享给QQ或者微信的需求，可以通过以下代码实现：
1234567891011121314 ...
JS实现函数重载
需求
假设我们有这样一个数据（来源于参考文章中的浅谈JavaScript函数重载，链接在文章尾部给出）：
123const users = { values: ["Dean Edwards", "Alex Russell", "Dean Tom"]}
要定义一个find方法，使得它可以在下列三种情况工作：
当不 ...
通过EventBus实现发布与订阅模式
源码
来自半年后的说明：我把代码转放到 gists 里了，当时代码风格受 Python 影响较大，这里就不再更改了，毕竟大家本地都有自己的格式化工具。
点击这里前往Github获取本文源码。
背景
后注: 发布-订阅模式属于设计模式中的行为型模式，基本上和观察者模式相同，至于具体定义存在争议，这里不进行讨论。
在Vue中，我们经常通过全局事件总线进行简单的组件间通信，那么究其原理其实并不难 ...
Nginx自定义错误页面
打开配置文件，找到你想自定义错误页面的location块：
1234location / { error_page 404 /404.html; # 其它配置}
确保你有404.html这一文件，如果还想捕捉更多错误，可以这样写：
1error_page 404 403 500 /error.html;
这样就完成了，不用再看经典的Nginx默认错误页面了。
扁平结构和树形结构相互转化
背景
假设我们有一堆评论的数据需要存储，通常来说数据库中是上面的扁平形式，而我们显示出来应该是树形结构。
于是就有了这里的内容，扁平结构和树形结构相互转换。
扁平转树状
如下，内容都在注释里：
1234567891011121314151617181920212223242526272829303132333435const flatComments = [ { id: 1, co ...
实现观察者模式
源码
来自半年后的说明：我把代码转放到 gists 里了，当时代码风格受 Python 影响较大，这里就不再更改了，毕竟大家本地都有自己的格式化工具。
点击这里前往Github查看本文源码。
实现
我们要定义一个observer函数，它会把我们传入的对象复制一份再进行代理，并且返回的代理对象上还有一个observe方法，用来添加一个观察者：
12345678910111213141516171 ...
原生JS实现哈希路由
源码
使用Codepen在线体验和查看源码。
页面代码
在我们用前端框架的时候，经常用到路由技术，就是在地址栏确实发生了变化但是页面没有刷新，那么本文就介绍通过更改哈希的方式实现这样一种路由，下面是页面代码：
123456789<h1>Hash Router</h1><div> <a href="#/">Home</a ...
从实例中学习reduce方法
需求
如下：
123['Red', 'White', 'Yellow']// 转为{ Red: 'Red', White: 'White', Yellow: 'Yellow' }
接下我来用几个方法去实现这个功能。
传统方法
自然是没有for循环解决不了的问题 ...