每天学习API之四 ,zepto源码each,map

来源:互联网 发布:帝国时代2蛮王崛起mac 编辑:程序博客网 时间:2024/05/06 17:26

工具函数

$.each 遍历数组元素或以key-value值对方式遍历对象。回调函数返回 false 时停止遍历。

$.each = function (elements, callback) {  var i,key;  //类数组 likeArray  if (likeArray(elements)) {    for (i = 0; i < elements.length; i++) {      if (callback.call(elements[i], i, elements[i]) === false) {        return elements;      }    }  } else {    for (key in elements) {      if (callback.call(elements[key], key, elements[key]) === false) {        return elements;      }    }  }  return flatten(elements);}

先来看看调用方式:$.each(collection, function(index, item){ ... })

$.each 接收两个参数,第一个参数 elements 为需要遍历的数组或者对象,第二个 callback 为回调函数。
如果 elements 为数组,用 for 循环,调用 callback ,并且将数组索引 index 和元素值 item 传给回调函数作为参数;如果为对象,用 for···in 遍历属性值,并且将属性 key 及属性值传给回调函数作为参数。

注意回调函数调用了 call 方法,call 的第一个参数为当前元素值或当前属性值,所以回调函数的上下文变成了当前元素值或属性值,也就是说回调函数中的 this 指向的是 item 。这在dom集合的遍历中相当有用。

在遍历的时候,还对回调函数的返回值进行判断,如果回调函数返回 false (if (callback.call(elements[i], i, elements[i]) === false)) ,立即中断遍历。

$.each 调用结束后,会将遍历的数组或对象( elements )返回。

$.map 可以遍历数组(类数组)或对象中的元素,根据回调函数的返回值,将返回值组成一个新的数组,并将该数组扁平化后返回,会将 nullundefined 排除。

$.map = function(elements, callback) {  var value, values = [],i, key;  if (likeArray(elements)) {    for (i = 0; i < elements.length; i++) {      value = callback(elements[i], i);      if (value != null) {        values.push(value);      }    }  } else {    for (key in elements) {      value = callback(elements[key], key);      if (value != null) {        values.push(value);      }    }  }  return values;}

先来看看调用方式: $.map(collection, function(item, index){ ... })

elements 为类数组或者对象。callback 为回调函数。当为类数组时,用 for 循环,当为对象时,

for···in 循环。并且将对应的元素(属性值)及索引(属性名)传递给回调函数,如果回调函数的返

回值不为 null 或者 undefined ,则将返回值存入新数组中,最后将新数组扁平化后返回。

  • likeArray类数组
  • 将数组扁平化flatten
原创粉丝点击