这几天有大神推荐读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的方法。

 引自underscore.js context参数用法

  _.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);

underscore源码阅读记录的更多相关文章

  1. underscore源码阅读记录(二)

    引自underscore.js context参数用法 _.each(list, iteratee, [context]); context为上下文,如果传递了context参数,则把iterator ...

  2. EventBus源码解析 源码阅读记录

    EventBus源码阅读记录 repo地址: greenrobot/EventBus EventBus的构造 双重加锁的单例. static volatile EventBus defaultInst ...

  3. Underscore源码阅读极简版入门

    看了网上的一些资料,发现大家都写得太复杂,让新手难以入门.于是写了这个极简版的Underscore源码阅读. 源码: https://github.com/hanzichi/underscore-an ...

  4. underscore源码阅读

    1:函数式编程初探 2:if(obj.length === +obj.length)的判断 3:JS对象属性用中括号表示的优点在于可以用变量表示属性 4:callee,caller---JS高级程序设 ...

  5. flutter_boot android和flutter源码阅读记录

    版本号0.1.54 看源码之前,我先去看下官方文档,对于其源码的设计说明,文中所说的原生都是指android 看完官方文档的说明,我有以下几个疑问 第一个:容器是怎么设计的? 第二个:native和f ...

  6. Vue2.x 响应式部分源码阅读记录

    之前也用了一段时间Vue,对其用法也较为熟练了,但是对各种用法和各种api使用都是只知其然而不知其所以然.最近利用空闲时间尝试的去看看Vue的源码,以便更了解其具体原理实现,跟着学习学习. Proxy ...

  7. ReactiveCocoa 源码阅读记录。

    1:RACSingle 需要订阅信号 RACSignal *signal = [RACSignal createSignal:^RACDisposable * _Nullable(id<RACS ...

  8. Linux内核源码阅读记录一之分析存储在不同段中的函数调用过程

    在写驱动的过程中,对于入口函数与出口函数我们会用一句话来修饰他们:module_init与module_exit,那会什么经过修饰后,内核就能狗调用我们编写的入口函数与出口函数呢?下面就来分析内核调用 ...

  9. JQuery源码阅读记录

    新建html文件,在浏览器中打开文件,在控制台输入consoole.log(window);新建html文件,引入JQuery后在浏览器中打开,在控制台同样输入consoole.log(window) ...

随机推荐

  1. 模拟XShell的小项目

    不知道大家有没有用过XShell这款工具,这款工具通过windows可以远程操作处于开机状态的linux操作系统,也就是说把你的电脑和一台服务器连入网络,你通过输入服务器所在的IP地址建立一个会话就可 ...

  2. k-sum问题

    给定一个数组,里面的是任意整数,可能有重复,再给定一个目标T,从数组中找出所有和为T的K个数,要求结果中没有重复. Note: Elements in a quadruplet (a,b,c,d) m ...

  3. js中创建数组的方法

    1.声明或创建一个不指定长度的数组(Array)的方式为: 如:var arrayObj = new Array(); 2.声明或创建一个数组并指定长度的数组(Array)的方式为: 如:var ar ...

  4. maven 环境的配置 JAVA_HOME not found in your envirnment

    maven 的环境配置在配置maven前 先做好java的环境配置现在假定java已经配置好了.在环境变量中添加;maven的解压路径\bin 例如:D:\soft\java\apache-maven ...

  5. Tomcat中使用JNDI加载JDBC数据源

    以前写JDBC的时候总是手工写一个类,用硬代码写上className.url.用户名和密码什么的,然后通过DriverManager获取到Connection.那样写是很方便,但是如果想更改的话,需要 ...

  6. 用ADMM求解大型机器学习问题

    [本文链接:http://www.cnblogs.com/breezedeus/p/3496819.html,转载请注明出处] 从等式约束的最小化问题说起:                       ...

  7. JSON 基础解释.

    JSON.(JavaScript Object Notation) JSON 指的是 JavaScript 对象表示法(JavaScript Object Notation) JSON 是轻量级的文本 ...

  8. install skype4.3 in ubuntu15.04

    Canonical Partners repository finally adds support for Ubuntu 15.04. Here’s how to enable the reposi ...

  9. windows编程:第一个windows程序

    #define WIN32_LEAN_AND_MEAN #include <windows.h> #include <windowsx.h> #include <math ...

  10. android wifi P2P CONNECT, INVITE和JOIN流程选择

    android wifi P2P CONNECT, INVITE和JOIN流程选择