zoukankan      html  css  js  c++  java
  • Underscore.js学习

    each_.each(list, iteratee, [context]) 别名: forEach 
    遍历list中的所有元素,按顺序用遍历输出每个元素。如果传递了context参数,则把iteratee绑定到context对象上。每次调用iteratee都会传递三个参数:(element, index, list)。如果list是个JavaScript对象,iteratee的参数是 (value, key, list))。返回list以方便链式调用。(注:如果存在原生的forEach方法,Underscore就使用它代替。)

    刚开始看到的时候不太理解里面的参数的意思,于是写了段代码测试一下:

    _ = require('underscore'); 
    var a = [1, 2, 3];
    function test(element, index, list) {
        if(list[index] == 2) {
                console.log(element);
                console.log(index);
                console.log(list);
            };
    };
    _.each(a,test(element, index, list));
    
    /* 输出
    2
    1
    [ 1, 2, 3 ]
    第一行是数组中当前迭代到的值,第二行是该值的代码,第三行是这个数组
    */

    但是最后的那个[context]还是不理解是什么意思,又改了一下:

    _ = require('underscore'); 
    var a = [1, 2, 3];
    _.each(a,console.log);
    
    /* 输出
    1 0 [ 1, 2, 3 ]
    2 1 [ 1, 2, 3 ]
    3 2 [ 1, 2, 3 ]
    */

    看不懂的输出,看到有提到源码,去看源码:

    // _.each的源码部分
    _.each = _.forEach = function(obj, iteratee, context) {
        if (obj == null) return obj;
        // 涉及到context的地方
        iteratee = createCallback(iteratee, context);
        var i, length = obj.length;
        if (length === +length) {
            for (i = 0; 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;
    };

    于是去看createCallback是什么鬼:

    var createCallback = 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);
        };
    };

    这么长,容我慢慢看。。。

  • 相关阅读:
    GUI编程基础
    MyBatisPlus详解
    MYSQL数据库优化(一)
    设计模式遵循的原则
    MYSQL计算连续与不连续区间的方法
    CentOS安装MySQL5.7多实例步骤详解
    CentOS下安装Mysql 8.0步骤详解
    RDD和DataFrame和DataSet三者间的区别
    Spark读取Mysql,Redis,Hbase数据(一)
    Spark中Broadcast的理解
  • 原文地址:https://www.cnblogs.com/lswit/p/5212427.html
Copyright © 2011-2022 走看看