原生js实现jq的$.each()方法

jq的$.each()方法：

语法：jQuery.each(object, [callback])

回调函数拥有两个参数：第一个为对象的成员或数组的索引，第二个为对应变量或内容。如果需要退出 each 循环可使回调函数返回 false，其它返回值将被忽略。

示例1 遍历数组：

示例2 遍历对象

原生方法实现如下：

// 通过字面量方式实现的函数each
var each =  function(object, callback){
  var type = (function(){
          switch (object.constructor){
            case Object:
                return 'Object';
                break;
            case Array:
                return 'Array';
                break;
            case NodeList:
                return 'NodeList';
                break;
            default:
                return 'null';
                break;
        }
    })();
    // 为数组或类数组时, 返回: index, value
    if(type === 'Array' || type === 'NodeList'){
        // 由于存在类数组NodeList, 所以不能直接调用every方法
        [].every.call(object, function(v, i){
            return callback.call(v, i, v) === false ? false : true;
        });
    }
    // 为对象格式时,返回:key, value
    else if(type === 'Object'){
        for(var i in object){
            if(callback.call(object[i], i, object[i]) === false){
                break;
            }
        }
    }
}

测试下：

数组类型：

对象类型：

类数组类型：

增加退出循环条件:

var obj= {name:'box', color: 'red', size:'big', number: '100',}
each(obj, function(i, v){
  if(i === 'color'){ 
    console.log('箱子的颜色是，'+v+'');
    return true;
  }
  if(i === 'size' && v=== 'big'){
    console.log('型号，数量符合收货');
    return false;
  }
  console.log(i + ': ' + v);
});

原文链接：http://www.jianshu.com/p/8b9f09fe656b