这几天有大神推荐读underscore源码,趁着项目测试的空白时间,看了一下。
整个underscore包括了常用的工具函数,下面以1.3.3源码为例分析一下。
_.size = function(obj) {
return _.isArray(obj) ? obj.length : _.keys(obj).length;
};
整个underscore源码基本上都是以上这种方式写的,所以弄懂上面这段源码,整个underscore的源码就大概清楚了六七成了,剩下的源码用些时间,也就迎刃而解。
因为上面的函数内有_.keys,可能无法一下子弄清楚,下面这个函数源码更容易入门。
_.isNaN = function(obj) { return obj !== obj; };
只需弄明白对象_和函数参数obj这两个具体做了什么即可。
var _ = function(obj) {
return new wrapper(obj);
};
_定义为一个函数,该函数接受一个名为obj的形参,然后返回一个wrapper类的实例。
在浏览器环境中,_被定位全局对象window的属性。
var root = this;
root['_'] = _;
这样,浏览器全局的_与IIFE中的_都指向了同一个对象,在IIFE中对_的操作,也同样反应在全局环境的_中。
此时,我们就明白了_的一部分原理了。上面提到的_.isNaN,在构造函数对象_上增加了一个isNaN的属性,该属性是一个函数方法。
下面,接着研究wrapper
var _ = function(obj) {
return new wrapper(obj);
};
var wrapper = function(obj) {
this._wrapped = obj;
};
_.prototype = wrapper.prototype;
函数_返回wrapper类的一个实例,该实例中属性_wrapped是传给函数_的参数,_与wrapper的原型对象指向相同。将underscore相关的方法添加到wrapper原型, 创建的_对象就具备了underscore的方法。
_.each(list, iteratee, [context]);
context为上下文,如果传递了context参数,则把iterator绑定到context对象上
如果要修改iterator的调用对象为context,即函数中this为context,就传递这个参数,否则context为undefined
下面两个示例,运行看看打印出来的this就明白了
var arr = [1, 2, 3];
console.log(this);
var newArr =_.map(arr,function(item){
console.log(this);
return item*3;
});
var arr = [1, 2, 3];
console.log(this);
var newArr =_.map(arr,function(item){
console.log(this);
return item*3;
},arr);