大家好,我是前端西瓜哥。最近,我试图打开一个源代码解读系列,不时地解释一些简单或复杂的源代码。
今天要解读 npm 第三方库源码:only,仓库地址如下:https://github.com/tj/node-only
这个库是 tj 大神写的工具方法。tj 大神是程序员大佬,主要是 nodejs 该领域做出了许多开源贡献 Express、Koa、node-canvas 一系列著名开源项目的创造者和贡献者。
only 方法能做什么?
only 功能简单:。具体来说,指定对象的一些属性被提取到新对象中,并返回到新对象中。
const only = require('only'); var obj = {
name: 'tobi', last: 'holowaychuk', email: 'tobi@learnboost.com', _id: '12345' }; only(obj, 'name last email'); /* { name: 'tobi', last: 'holowaychuk', email: 'tobi@learnboost.com' } */
only 该方法需要输入一个对象和一个白名单列表,可以是属性名数组或通过空间间隔属性名表示的字符串。
第二个参数支持字符串格式,因为使用更方便,可以少写引号。
only 库的实现
module.exports = function(obj, keys){
obj = obj || {
}; if ('string' == typeof keys) keys = keys.split(/ /); return keys.reduce(function(ret, key){
if (null == obj[key]) return ret; ret[key] = obj[key]; return ret; }, {
});
};
代码解读
首先是对第一个参数 obj 做简单容错。如果 obj 是一个值为 undefined 或 null 之类的假值,我们就将其设置为一个空对象,防止抛出错误。
然后就是将可能是字符串形式的白名单转换为数组的格式。
使用的方法为:keys.split(/ +/)
,这里用到了 split 的正则表达式参数写法,/ +/
这个正则表达式代表一个数量大于等于 1 的多个空格符。这其实是很常见的分割字符串拿到数组的写法。
最后用老鸟非常喜欢用的 Array.prototype.reduce()
的写法,来对 keys 数组进行迭代。
对于每个 key,只要原数组中不为 null 或 undefined,就将其浅拷贝到新对象中。
reduce()
方法的返回值就是我们要的新对象,直接将其返回。
我们再说说为什么一些资深前端喜欢用 reduce()
方法。其实是因为 forEach 没有返回值,而 map 只能返回数组类型且大小相同的数组,虽然符合单一职责原则,但也因此失去了灵活性。
我曾经写过一篇关于 reduce 的文章,你感兴趣的话可以看看:为什么说数组实例的 reduce 方法灵活?
only 方法解读完毕。