概述

很早就想研究underscore源码了,虽然underscore.js这个库有些过时了,但是我还是想学习一下库的架构,函数式编程以及常用方法的编写这些方面的内容,又恰好没什么其它要研究的了,所以就了结研究underscore源码这一心愿吧。

underscore.js源码研究(1)

underscore.js源码研究(2)

underscore.js源码研究(3)

underscore.js源码研究(4)

underscore.js源码研究(5)

underscore.js源码研究(6)

underscore.js源码研究(7)

underscore.js源码研究(8)

参考资料:underscore.js官方注释undersercore 源码分析undersercore 源码分析 segmentfault

解决冲突

我们知道,_既是underscore的函数也是对象,我们把方法先挂载到它的对象属性上,使得方法可以直接调用,然后我们利用mixin方法把这些方法挂载到它的原型属性上,使得这个函数返回的underscore对象可以利用这些方法。

那么如果其它库也用到了_这个符号呢?underscore中是这样解决的:

var previousUnderscore = root._;

_.noConflict = function() {
root._ = previousUnderscore;
return this;
}; //给underscore重新定义一个符号:
var __ = _.noConflict();

内建方法

underscore这个库里面有一些私有的变量和方法,也会暴露出一些方法,这些暴露出的方法一旦被用户改写,可能整个库就不能按照希望的方向运行了。所以underscore把一些暴露的方法赋给一些内建方法,然后在其它方法使用这些方法的时候可以用内建方法判断是否被改写了。示例如下:

//声明内建方法
var builtinIteratee; //双重赋值赋给内建方法
_.iteratee = builtinIteratee = function(value, context) {
return cb(value, context, Infinity);
}; //cb函数中判断iteratee方法是否被改写。
var cb = function(value, context, argCount) {
if (_.iteratee !== builtinIteratee) return _.iteratee(value, context);
if (value == null) return _.identity;
if (_.isFunction(value)) return optimizeCb(value, context, argCount);
if (_.isObject(value) && !_.isArray(value)) return _.matcher(value);
return _.property(value);
};

值得一提的是,由于js中传递的是引用,所以赋给内建方法并不会有太大的内存开销,所以我觉得这个想法非常好。

创建对象

new Person()实际上为我们做了如下事情:

//创建一个对象,并设置其指向的原型
var obj = {'__proto__': Person.prototype}; //调用Person()的构造方法,并且将上下文(this)绑定到obj上
Person.apply(obj, arguments); //返回创建的对象
return obj;

但是使用new需要一个构造函数,这在很多时候非常不方便。更多时候,我们希望通过一个对象直接创建另一个对象,于是就有了Object.create()方法。Object.create(obj)的原理是这样的:

//创建一个临时的构造函数,并将原型指向
var Ctor = function() {};
ctor.prototype = obj; //通过new新建一个对象
var obj2 = new Ctor(); //清除Ctor,防止内存泄漏。并返回obj2
Ctor.prototype = null;
return obj2;

所以,mdn上这样描述Object.create()方法:创建一个新对象,使用现有的对象来提供新创建的对象的__proto__。

需要注意的是,为了提升速度,underscore把Ctor进行了缓存

var Ctor = function() {};

所以后面当我们为了防止内存泄漏清除Ctor的时候,只是清除它的原型。

而underscore的baseCreate方法就是对Object.create()方法的polyfill

var baseCreate = function(prototype) {
if (!_.isObject(prototype)) return {};
//nativeCreate即是Object.create()方法
if (nativeCreate) return nativeCreate(prototype); Ctor.prototype = prototype;
var result = new Ctor;
Ctor.prototype = null; return result;
};

需要注意的是,Object.create()方法支持多个参数,但是underscore的baseCreate方法只支持一个参数

underscore.js源码研究(2)的更多相关文章

  1. underscore.js源码研究(8)

    概述 很早就想研究underscore源码了,虽然underscore.js这个库有些过时了,但是我还是想学习一下库的架构,函数式编程以及常用方法的编写这些方面的内容,又恰好没什么其它要研究的了,所以 ...

  2. underscore.js源码研究(7)

    概述 很早就想研究underscore源码了,虽然underscore.js这个库有些过时了,但是我还是想学习一下库的架构,函数式编程以及常用方法的编写这些方面的内容,又恰好没什么其它要研究的了,所以 ...

  3. underscore.js源码研究(6)

    概述 很早就想研究underscore源码了,虽然underscore.js这个库有些过时了,但是我还是想学习一下库的架构,函数式编程以及常用方法的编写这些方面的内容,又恰好没什么其它要研究的了,所以 ...

  4. underscore.js源码研究(5)

    概述 很早就想研究underscore源码了,虽然underscore.js这个库有些过时了,但是我还是想学习一下库的架构,函数式编程以及常用方法的编写这些方面的内容,又恰好没什么其它要研究的了,所以 ...

  5. underscore.js源码研究(4)

    概述 很早就想研究underscore源码了,虽然underscore.js这个库有些过时了,但是我还是想学习一下库的架构,函数式编程以及常用方法的编写这些方面的内容,又恰好没什么其它要研究的了,所以 ...

  6. underscore.js源码研究(3)

    概述 很早就想研究underscore源码了,虽然underscore.js这个库有些过时了,但是我还是想学习一下库的架构,函数式编程以及常用方法的编写这些方面的内容,又恰好没什么其它要研究的了,所以 ...

  7. underscore.js源码研究(1)

    概述 很早就想研究underscore源码了,虽然underscore.js这个库有些过时了,但是我还是想学习一下库的架构,函数式编程以及常用方法的编写这些方面的内容,又恰好没什么其它要研究的了,所以 ...

  8. underscore.js源码解析(五)—— 完结篇

    最近公司各种上线,所以回家略感疲惫就懒得写了,这次我准备把剩下的所有方法全部分析完,可能篇幅过长...那么废话不多说让我们进入正题. 没看过前几篇的可以猛戳这里: underscore.js源码解析( ...

  9. underscore.js 源码

    underscore.js 源码 underscore]JavaScript 中如何判断两个元素是否 "相同" Why underscore 最近开始看 underscore.js ...

随机推荐

  1. Django之url定义和ORM框架的使用

    前言,Django安装 pip install django # 官网安装最新版本 pip install django -i "https://pypi.doubanio.com/simp ...

  2. Element ui 使用 Tree 树形控件

    使用树形控件需要映入 jsx才能运行链接:https://github.com/vuejs/babel-plugin-transform-vue-jsx#usage npm install\ babe ...

  3. mysql之存储引擎和文件配置

    (查看系统服务,在运行里输入services.msc) 补充:将mysql做成系统服务:mysqld --install 取消:mysqld --romove 在服务中可以直接鼠标操作mysql服务的 ...

  4. 2019.01.08 bzoj3809: Gty的二逼妹子序列(莫队+权值分块)

    传送门 题意:多组询问,问区间[l,r]中权值在[a,b]间的数的种类数. 看了一眼大家应该都知道要莫队了吧. 然后很容易想到用树状数组优化修改和查询做到O(mnlogamax)O(m\sqrt nl ...

  5. vi三种模式的切换

    基础上vi/vim共分为三种模式,分别是命令模式,输入模式和底线命令模式. 一.命令模式 用户刚刚启动vi/vim,便进入了命令模式. 在此状态下敲击键盘动作会被vim识别为命令,而非输入字符.比如我 ...

  6. const修饰指针时应注意的问题

    1.指向常量的指针 顾名思义,一个指针指向const对象,则称它为指向常量的指针. ; int* ptr=&a; //错误 const int* ptr=&a; //必须用const来 ...

  7. CodeForces 916B Jamie and Binary Sequence (changed after round) (贪心)

    题意:给定两个数字n,m,让你把数字 n 拆成一个长度为 m 的序列a1,a2,a3...am,并且∑2^ai = n,如果有多组,要求序列中最大的数最小,然后再相同就要求除了最大数字典序最大. 析: ...

  8. asp.net上传文件夹

    最近公司做工程项目,实现文件夹上传. 网上找了一天,发现网上很多代码都存在相似问题,最后终于找到了一个符合要求的项目. 工程如下: 这里对项目的文件夹上传进行分析,实现文件夹上传,如何进行文件夹上传. ...

  9. LoadIcon

    1.LoadIcon(HINSTANCE hInstance,LPCSTR lpIconName);该函数从与 hInstance 模块相关联的可执行文件中装入lpIconName指定的图标资源,仅当 ...

  10. Matlab作图

    修改线宽 plot(x,y,'LineWidth',1.5) 在xlabel,ylabel,title中使用latex语言 xlabel('$x$','interpreter','latex') yl ...