看了网上的一些资料,发现大家都写得太复杂,让新手难以入门。于是写了这个极简版的Underscore源码阅读。

源码:

https://github.com/hanzichi/underscore-analysis/blob/master/underscore-1.8.3.js/src/underscore-1.8.3.js

一、架构的实现

1.1:架构

(function(){
var _={};
this._=_;
}.call(this));

1.2:引入exports判断,如果不支持exports则继续使用this

(function(){
var root = this;
var _={};if (typeof exports !== 'undefined') {
if (typeof module !== 'undefined' && module.exports) {
exports = module.exports = _;
}
exports._ = _;
} else {
root._ = _;
}
}.call(this));

1.3:对_进行进一步实例化判断:

(function(){
var root = this;
var previousUnderscore = root._;//保存_
//初始化
var _=function(obj){
if(obj instanceof _) return obj;
if(!(this instanceof _)) return new _(obj);
this._wrapped=obj;//保存obj
};
//导出_
if (typeof exports !== 'undefined') {
if (typeof module !== 'undefined' && module.exports) {
exports = module.exports = _;
}
exports._ = _;
} else {
root._ = _;
}
}.call(this));

第一步就先这到这里,接下来就是常用函数的包装了。先不用管其他函数。

二、常用函数包装

(function(){
var root = this;
var previousUnderscore = root._;//保存_
//初始化
var _=function(obj){
if(obj instanceof _) return obj;
if(!(this instanceof _)) return new _(obj);
this._wrapped=obj;//保存obj
};
//导出_
if (typeof exports !== 'undefined') {
if (typeof module !== 'undefined' && module.exports) {
exports = module.exports = _;
}
exports._ = _;
} else {
root._ = _;
} //添加判断Boolean类型方法
_.isBoolean = function(obj) {
return obj === true || obj === false || toString.call(obj) === '[object Boolean]';
};
}.call(this));

恭喜你,接下来就可以直接使用_.isBoolean了。

三、重要函数

optimizeCb,没有太懂这里Cb是什么,可能是Context bound,上下文绑定,其实主要就是使用call改变this到当前func上。

var optimizeCb = function(func, context, argCount) {
if (context === void 0) return func;
switch (argCount == null ? 3 : argCount) {
case 1: return function(value) {
return func.call(context, value);
};
case 2: return function(value, other) {
return func.call(context, value, other);
};
case 3: return function(value, index, collection) {
return func.call(context, value, index, collection);
};
case 4: return function(accumulator, value, index, collection) {
return func.call(context, accumulator, value, index, collection);
};
}
return function() {
return func.apply(context, arguments);
};
};

cb函数就调用了上面的函数,如果是传入的value是Function,就执行optimizeCb;如果是Object就直接matcher;否则_.property

var cb = function(value, context, argCount) {
if (value == null) return _.identity;
if (_.isFunction(value)) return optimizeCb(value, context, argCount);
if (_.isObject(value)) return _.matcher(value);
return _.property(value);
};

链式调用chain,类似jQuery的反复调用

_.chain = function(obj) {
var instance = _(obj);
instance._chain = true;
return instance;
};

Underscore源码阅读极简版入门的更多相关文章

  1. underscore源码阅读记录

    这几天有大神推荐读underscore源码,趁着项目测试的空白时间,看了一下. 整个underscore包括了常用的工具函数,下面以1.3.3源码为例分析一下. _.size = function(o ...

  2. underscore源码阅读

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

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

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

  4. Flink源码阅读(一)——Flink on Yarn的Per-job模式源码简析

    一.前言 个人感觉学习Flink其实最不应该错过的博文是Flink社区的博文系列,里面的文章是不会让人失望的.强烈安利:https://ververica.cn/developers-resource ...

  5. Underscore 源码

    Underscore 源码 作者:韩子迟 What? 不知不觉间,「Underscore 源码解读系列」进入了真正的尾声,也请允许我最后一次 po 下项目的原始地址 https://github.co ...

  6. SpringMVC源码阅读系列汇总

    1.前言 1.1 导入 SpringMVC是基于Servlet和Spring框架设计的Web框架,做JavaWeb的同学应该都知道 本文基于Spring4.3.7源码分析,(不要被图片欺骗了,手动滑稽 ...

  7. 如何阅读Java源码 阅读java的真实体会

    刚才在论坛不经意间,看到有关源码阅读的帖子.回想自己前几年,阅读源码那种兴奋和成就感(1),不禁又有一种激动. 源码阅读,我觉得最核心有三点:技术基础+强烈的求知欲+耐心.   说到技术基础,我打个比 ...

  8. 转-OpenJDK源码阅读导航跟编译

    OpenJDK源码阅读导航 OpenJDK源码阅读导航 博客分类: Virtual Machine HotSpot VM Java OpenJDK openjdk 这是链接帖.主体内容都在各链接中.  ...

  9. [收藏] Java源码阅读的真实体会

    收藏自http://www.iteye.com/topic/1113732 刚才在论坛不经意间,看到有关源码阅读的帖子.回想自己前几年,阅读源码那种兴奋和成就感(1),不禁又有一种激动. 源码阅读,我 ...

随机推荐

  1. xcodebuild 错误:unknown error -1=ffffffffffffffff

    1.security list-keychains 2.security unlock-keychains -p "your password" "your login ...

  2. https://blog.csdn.net/uftjtt/article/details/79044186

    https://blog.csdn.net/uftjtt/article/details/79044186

  3. IP通信基础学习第七周(下)

    H3C的配置指令包括:基本配置,查看指令,接口配置. 基本配置包括:查看可用指令:进入系统视图,全局配置模式:给设备命名:退回上一层模式:直接退回到用户模式. 查看指令包括:显示设备系统版本信息:显示 ...

  4. Go语言代码规范指导

    本规范旨在为日常Go项目开发提供一个代码的规范指导,方便团队形成一个统一的代码风格,提高代码的可读性,规范性和统一性.本规范将从命名规范,注释规范,代码风格和 Go 语言提供的常用的工具这几个方面做一 ...

  5. 中国省市县数据库sql文件(2017年10月31日之前)

    摘自国家统计局 sql文件下载地址:https://files.cnblogs.com/files/zxj95121/%E7%9C%81%E5%B8%82%E5%8E%BFsql.zip 2019.4 ...

  6. es2018(es9)前瞻

    命名捕获 语法 : ?<name> 一:举个栗子 我们要把从2018-05-20取出年月日 1:普通方法 let str = '2018-05-20'; let reg1 = /(\d{4 ...

  7. Josephina and RPG HDU - 4800

    A role-playing game (RPG and sometimes roleplaying game) is a game in which players assume the roles ...

  8. Linux的文件系统

    根文件系统(rootfs): root filesystem LSB, FHS: (FileSystem Heirache Standard) /etc, /usr, /var, /root, /ho ...

  9. 使用AtomicLong,经典银行账户问题

    1.新建Account类,使用AtomicLong定义账户余额,增加和减少金额方法使用getAndAdd方法. package com.xkzhangsan.atomicpack.bank; impo ...

  10. Django多表查询

    一.前言 1.什么是ORM? ORM,即Object-Relational Mapping(对象关系映射),它的作用是在关系型数据库和业务实体对象之间作一个映射,这样,我们在具体的操作业务对象的时候, ...