一个合格的中级前端工程师必须要掌握的28个JavaScript技巧(3)

20. new 关键字

21. 实现 Object.assign

22. instanceof

原理是递归遍历 right 参数的原型链，每次和 left 参数作比较，遍历到原型链终点时则返回 false，找到则返回 true

23. 私有变量的实现

使用 Proxy 代理所有含有 _ 开头的变量，使其不可被外部访问

通过闭包的形式保存私有变量，缺点在于类的所有实例访问的都是同一个私有变量

另一种闭包的实现，解决了上面那种闭包的缺点，每个实例都有各自的私有变量，缺点是舍弃了 class 语法的简洁性，将所有的特权方法(访问私有变量的方法)都保存在构造函数中

通过 WeakMap 和闭包，在每次实例化时保存当前实例和所有私有变量组成的对象，外部无法访问闭包中的 WeakMap，使用 WeakMap 好处在于不需要担心内存溢出的问题

24. 洗牌算法

早前的 chrome 对于元素小于 10 的数组会采用插入排序，这会导致对数组进行的乱序并不是真正的乱序，即使最新的版本 chrome 采用了原地算法使得排序变成了一个稳定的算法，对于乱序的问题仍没有解决

通过洗牌算法可以达到真正的乱序，洗牌算法分为原地和非原地，图一是原地的洗牌算法，不需要声明额外的数组从而更加节约内存占用率，原理是依次遍历数组的元素，将当前元素和之后的所有元素中随机选取一个，进行交换

25. 单例模式

通过 ES6 的 Proxy 拦截构造函数的执行方法来实现的单例模式

26. promisify

使用方法：

promisify 函数是将回调函数变为 promise 的辅助函数，适合 error-first 风格(nodejs)的回调函数，原理是给 error-first 风格的回调无论成功或者失败，在执行完毕后都会执行最后一个回调函数，我们需要做的就是让这个回调函数控制 promise 的状态即可

这里还用了 Proxy 代理了整个 fs 模块，拦截 get 方法，使得不需要手动给 fs 模块所有的方法都包裹一层 promisify 函数，更加的灵活

27. 优雅的处理 async/await

使用方法：

无需每次使用 async/await 都包裹一层 try/catch ，更加的优雅，这里提供另外一个思路，如果使用了 webpack 可以编写一个 loader，分析 AST 语法树，遇到 await 语法，自动注入 try/catch，这样连辅助函数都不需要使用

28. 发布订阅 EventEmitter

通过 on 方法注册事件，trigger 方法触发事件，来达到事件之间的松散解耦，并且额外添加了 once 和 off 辅助函数用于注册只触发一次的事件以及注销事件

29. 实现 JSON.stringify(附加)

使用 JSON.stringify 将对象转为 JSON 字符串时，一些非法的数据类型会失真，主要表现如下

• 如果对象含有 toJSON 方法会调用 toJSON
• 当属性的值是 NaN，正负Inifinty，会变成字符串 null
• 在数组中

1. 存在 Undefined/Symbol/Function 数据类型时会变为 null
2. 存在 Infinity/NaN 也会变成 null

• 在对象中

1. 属性值为 Undefined/Symbol/Function 数据类型时，属性和值都不会转为字符串
2. 属性值为 Infinity/NaN ，属性值会变为 null

• 日期数据类型的值会调用 toISOString
• 非数组/对象/函数/日期的复杂数据类型会变成一个空对象
• 循环引用会抛出错误

另外 JSON.stringify 还可以传入第二第三个可选参数，有兴趣的朋友可以深入了解

（编辑：ASP站长网）