underscore的设计思想

2018-11-18  本文已影响6人  悦者生存

1.定义变量

在es6之前,js没有块级作用域(例如for里面定义变量外面是能访问到的),只有函数级作用域(在函数里面定义变量才是私有变量,外面不会访问到),所以为了避免全局性的污染,underscore使用立即执行函数

(function() {
 
}())

2.如何_()来生成对象实例,并把所有的函数绑定在其prototype上

当使用_符号调用函数的时候,可以有以下两种写法

// 函数式风格
_.each([1, 2, 3], function(item){
    console.log(item)
});

// 面向对象风格
_([1, 2, 3]).each(function(item){
    console.log(item)
});

所以我们可以得出结论,underscore是一个函数

var _=function(obj){

}

第一种方式好说,因为这是直接引用的方法。
重点是第二种,我们如何做到
([1,2,3])返回一个对象,而这个对象又能调用_原型上的方法呢

var _ = function(obj) {
    if (!(this instanceof _)) return new _(obj);
    this._wrapped = obj;
};

这是underscore的源码,我们来解析一下其中的思想

第一步:当执行_([1,2.3]),因为此时没有new,所以this等于window,不是_的实例,返回new _(obj);
第二部:这时this是_的实例,执行this._wrapped=[1,2,3];
第三步:因为这是构造函数,所以会返回return this;这个this就是实例,实例的_proto_指向其构造函数的prototype,所以我们就可以使用_的原型上的方法了

这也是我们为什么使用构造函数创建对象的原因,构造函数原型上的方法实例都可以使用

上一篇 下一篇

猜你喜欢

热点阅读