isArrayLike 检测是数组对象还是纯数组

    var property = function(key) {

      return function(obj) {

        return obj == null ? void 0 : obj[key];

      };

    };

    var getLength = property('length');

    var isArrayLike = function(collection) {

        var length = getLength(collection);

        return typeof length == 'number' && length >= 0 && length <= MAX_ARRAY_INDEX;

    };

从下往上看  isArrayLike -> getLength -> property

property是个闭包

简化后：

getLength 返回的是一个函数

var getLength =  function(obj){

    return obj['length'];

 }

当调用

// collection = [1,2,3]

var length = getLength(collection);

    var isArrayLike = function(collection) {

       //  var length = [1,2,3]['length'];

        var length = getLength(collection);

        return typeof length == 'number' && length >= 0 && length <= MAX_ARRAY_INDEX;

    };

T5.html

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8" />

<title>Underscore</title>

<script src="underscore.js"></script>

</head>

<body>

</body>

</html>

<script type="text/javascript" src="T5.js"></script>

T5.js

_.each([1, 2, 3], alert);

执行过程：

1.  接着就进入了optimizeCb函数。

  // obj = [1,2,3], iteratee = alert(), context = undefined

 _.each = _.forEach = function(obj, iteratee, context) {

    iteratee = optimizeCb(iteratee, context);

    var i, length;

    if (isArrayLike(obj)) {

      for (i = 0, length = obj.length; i < length; i++) {

        iteratee(obj[i], i, obj);

      }

    } else {

      var keys = _.keys(obj);

      for (i = 0, length = keys.length; i < length; i++) {

        iteratee(obj[keys[i]], keys[i], obj);

      }

    }

    return obj;

  };

2. optimizeCb 函数

  // Internal function that returns an efficient (for current engines) version

  // of the passed-in callback, to be repeatedly applied in other Underscore

  // functions.

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

      };

      // The 2-parameter case has been omitted only because no current consumers

      // made use of it.

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

    };

  };

因为argCount = underfined。switch中的条件都不满足。

等于就直接执行了

    return function() {

      return func.apply(context, arguments);

    };

3.  isArrayLike 上面已分析过

  var isArrayLike = function(collection) {

    var length = getLength(collection);

    return typeof length == 'number' && length >= 0 && length <= MAX_ARRAY_INDEX;

  };

返回true

4.

// 接着执行each中的

    if (isArrayLike(obj)) {

      for (i = 0, length = obj.length; i < length; i++) {

        iteratee(obj[i], i, obj);

      }

    }

Tips:

1.   context === void 0 判断context是否为undefined。具体解释

												


											
underscore.js 源码分析5 基础函数和each函数的使用的更多相关文章
	

    
								
  1. Vue.js 源码分析(十三) 基础篇 组件 props属性详解
		
    父组件通过props属性向子组件传递数据,定义组件的时候可以定义一个props属性,值可以是一个字符串数组或一个对象. 例如: <!DOCTYPE html> <html lang= ...
    
		
    2. 
						
  2. Vue.js 源码分析(四) 基础篇  响应式原理 data属性
		
    官网对data属性的介绍如下: 意思就是:data保存着Vue实例里用到的数据,Vue会修改data里的每个属性的访问控制器属性,当访问每个属性时会访问对应的get方法,修改属性时会执行对应的set方 ...
    
		
    3. 
						
  3. Vue.js 源码分析(三) 基础篇 模板渲染 el、emplate、render属性详解
		
    Vue有三个属性和模板有关,官网上是这样解释的: el ;提供一个在页面上已存在的 DOM 元素作为 Vue 实例的挂载目标 template ;一个字符串模板作为 Vue 实例的标识使用.模板将会  ...
    
		
    4. 
						
  4. Vue.js 源码分析(二) 基础篇  全局配置
		
    Vue.config是一个对象,包含Vue的全局配置,可以在启动应用之前修改下列属性,如下: ptionMergeStrategies        ;自定义合并策略的选项silent         ...
    
		
    5. 
						
  5. Vue.js 源码分析(九)  基础篇 生命周期详解
		
    先来看看官网的介绍: 主要有八个生命周期,分别是: beforeCreate.created.beforeMount.mounted.beforeupdate.updated   .beforeDes ...
    
		
    6. 
						
  6. Vue.js 源码分析(八) 基础篇 依赖注入 provide/inject组合详解
		
    先来看看官网的介绍: 简单的说,当组件的引入层次过多,我们的子孙组件想要获取祖先组件的资源,那么怎么办呢,总不能一直取父级往上吧,而且这样代码结构容易混乱.这个就是这对选项要干的事情 provide和 ...
    
		
    7. 
						
  7. Vue.js 源码分析(七) 基础篇 侦听器 watch属性详解
		
    先来看看官网的介绍: 官网介绍的很好理解了,也就是监听一个数据的变化,当该数据变化时执行我们的watch方法,watch选项是一个对象,键为需要观察的数据名,值为一个表达式(函数),还可以是一个对象, ...
    
		
    8. 
						
  8. Vue.js 源码分析(十一)  基础篇 过滤器 filters属性详解
		
    Vue.js 允许你自定义过滤器,可被用于一些常见的文本格式化.过滤器可以用在两个地方:双花括号插值和 v-bind 表达式 (后者从 2.1.0+ 开始支持).过滤器应该被添加在 JavaScrip ...
    
		
    9. 
						
  9. Vue.js 源码分析(十)  基础篇 ref属性详解
		
    ref 被用来给元素或子组件注册引用信息.引用信息将会注册在父组件的 $refs 对象上.如果在普通的 DOM 元素上使用,引用指向的就是 DOM 元素:如果用在子组件上,引用就指向组件实例,例如:  ...
    
		
    10. 
		

	


随机推荐
	

    
									
  1. 安装chrome jsonView插件
			
    1.打开 https://github.com : 2.搜索 jsonView 链接:https://github.com/search?utf8=%E2%9C%93&q=jsonview:  ...
    
			
    2. 
						
  2. G、CSL 的训练计划【BFS 贪心】（“新智认知”杯上海高校程序设计竞赛暨第十七届上海大学程序设计春季联赛）
			
    题目传送门:https://ac.nowcoder.com/acm/contest/551/G 链接:https://ac.nowcoder.com/acm/contest/551/G来源:牛客网 题 ...
    
			
    3. 
						
  3. Codeforce Round #554 Div.2 D - Neko and Aki's Prank
			
    dp 找规律 我好菜啊好菜啊,完全没有思路. 在合法的括号序列中,左括号数一定大于等于右括号数的,所以我们可以先定义平衡度为左括号数-右括号数. 然后可以发现一个惊人的规律..就是在trie同一深度上 ...
    
			
    4. 
						
  4. Linux内存管理学习笔记——内存寻址
			
    最近开始想稍微深入一点地学习Linux内核,主要参考内容是<深入理解Linux内核>和<深入理解Linux内核架构>以及源码,经验有限,只能分析出有限的内容,看完这遍以后再更深 ...
    
			
    5. 
						
  5. Dubbo实践（十七）telnet
			
    telnet的介绍可以参看<java网络编程3>中有一段介绍telnet,我们可以理解为,telnet命令是通过socket协议与服务器端通信.Dubbo提供了telnet命令去查看服务功 ...
    
			
    6. 
						
  6. 解决dpdk中出现IOMMU not found的问题
			
    问题 在使用VFIO前,需要在BIOS打开VT-x和VT-d,想把一个PCIe网卡透传到虚拟机中,发现虚拟机启动失败,提示IOMMU没有找到. 输入以下命令确定vt-d开启 dmesg | grep  ...
    
			
    7. 
						
  7. MySQL架构与引擎初识
			
    一.MySQL逻辑架构 1.连接层: 最上层是一些客户端和连接服务,所包含的服务并不是MySQL所独有的技术.它们都是服务于C/S程序或者是这些程序所需要的 :连接处理,身份验证,安全性等等. 2.服 ...
    
			
    8. 
						
  8. es6 入坑笔记(五)
			
    Symbol 主要用做key或私有变量,Symbol是唯一的不可重复的,也是一个单独的数据类型 定义形式: let demo=Symbol("aaaa"); 1.Symbol不能使 ...
    
			
    9. 
						
  9. JavaWeb开发使用jsp还是html做前端页面
			
    一.概述 刚开始学习Javaweb开发的小伙伴都有一个疑惑:用jsp开发前端还是用HTML开发前端呢? 这个疑惑的来源主要是:刚接触完前端但又不深入学习js,接着学习jsp,发现老师们都一直用着jsp ...
    
			
    10. 
						
  10. CTF-安恒19年一月月赛部分writeup
			
    CTF-安恒19年一月月赛部分writeup MISC1-赢战2019 是一道图片隐写题 linux下可以正常打开图片,首先到binwalk分析一下. 里面有东西,foremost分离一下 有一张二维 ...
    
			
    11.