underscore.js源码解析（四）
没看过前几篇的可以猛戳这里：
underscore.js源码GitHub地址： https://github.com/jashkenas/underscore/blob/master/underscore.js本文解析的underscore.js版本是1.8.3
_.pluck
1 _.pluck = function(obj, key) { 2 return _.map(obj, _.property(key)); 3 };
_.pluck的作用就是获取数据对象中的相应属性，然后存在数组当中返回
_.where
1 _.where = function(obj, attrs) { 2 return _.filter(obj, _.matcher(attrs)); 3 };
_.where就是遍历数据，然后返回所有满足条件的值，存在数组当中
_.findWhere
1 _.findWhere = function(obj, attrs) { 2 return _.find(obj, _.matcher(attrs)); 3 }
_.findWhere和where不同的是只返回第一个满足条件的
_.max
1 _.max = function(obj, iteratee, context) { 2 var result = -Infinity, lastComputed = -Infinity, 3 value, computed; 4 //如果没有iteratee 5 if (iteratee == null || (typeof iteratee == 'number' && typeof obj[0] != 'object') && obj != null) { 6 obj = isArrayLike(obj) ? obj : _.values(obj); 7 //循环遍历求出最大值 8 for (var i = 0, length = obj.length; i < length; i++) { 9 value = obj[i]; 10 if (value != null && value > result) { 11 result = value; 12 } 13 } 14 } else { 15 //有iteratte的情况 16 iteratee = cb(iteratee, context); 17 _.each(obj, function(v, index, list) { 18 //迭代出的最大值结果 19 computed = iteratee(v, index, list); 20 if (computed > lastComputed || computed === -Infinity && result === -Infinity) { 21 result = v; 22 lastComputed = computed; 23 } 24 }); 25 } 26 return result; 27 };
获取obj中的最大值
_.min
1 _.min = function(obj, iteratee, context) { 2 var result = Infinity, lastComputed = Infinity, 3 value, computed; 4 if (iteratee == null || (typeof iteratee == 'number' && typeof obj[0] != 'object') && obj != null) { 5 obj = isArrayLike(obj) ? obj : _.values(obj); 6 for (var i = 0, length = obj.length; i < length; i++) { 7 value = obj[i]; 8 if (value != null && value < result) { 9 result = value; 10 } 11 } 12 } else { 13 iteratee = cb(iteratee, context); 14 _.each(obj, function(v, index, list) { 15 computed = iteratee(v, index, list); 16 if (computed < lastComputed || computed === Infinity && result === Infinity) { 17 result = v; 18 lastComputed = computed; 19 } 20 }); 21 } 22 return result; 23 };
获取最小值，跟max差不多，就不分析了
_.sample
1 _.sample = function(obj, n, guard) { 2 //判断是否有n这个参数，如果没有 3 if (n == null || guard) { 4 if (!isArrayLike(obj)) obj = _.values(obj); 5 //随机取一个随机样本 6 return obj[_.random(obj.length - 1)]; 7 } 8 var sample = isArrayLike(obj) ? _.clone(obj) : _.values(obj); 9 var length = getLength(sample); 10 n = Math.max(Math.min(n, length), 0); 11 var last = length - 1; 12 //下面就是一个打乱数组顺序的过程 13 for (var index = 0; index < n; index++) { 14 //生成一个随机的索引 15 var rand = _.random(index, last); 16 var temp = sample[index]; 17 sample[index] = sample[rand]; 18 sample[rand] = temp; 19 } 20 //最后返回前n个 21 return sample.slice(0, n); 22 };
从数组中取出随意样本，如果有n则从被打乱的数组中返回前n个数据，如果没有则返回一个随机样本
_.shuffle
1 _.shuffle = function(obj) { 2 return _.sample(obj, Infinity); 3 };
_.shuffle调用_.sample函数，并且出入infinity参数，来实现返回一个乱序的数组
_.sortBy
1 _.sortBy = function(obj, iteratee, context) { 2 var index = 0; 3 iteratee = cb(iteratee, context); 4 return _.pluck(_.map(obj, function(value, key, list) { 5 return { 6 value: value, 7 index: index++, 8 criteria: iteratee(value, key, list) 9 }; 10 }).sort(function(left, right) { 11 //先用criteria比较 12 var a = left.criteria; 13 var b = right.criteria; 14 if (a !== b) { 15 if (a > b || a === void 0) return 1; 16 if (a < b || b === void 0) return -1; 17 } 18 //如果相等再用index来排序 19 return left.index - right.index; 20 }), 'value'); 21 };
_.sortBy 就是一个返回按需排序后的数组，这个函数结构看上去挺复杂，其实拆分来看，就是调用_.pluck获取对象的属性值，然后里面是_.map.sort()来做一个排序，最后返回一个数组，这样拆分完是不是清晰了不少。
不理解sort的可以点击这里：https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array/sort
group
1 var group = function(behavior, partition) { 2 return function(obj, iteratee, context) { 3 //判断是否需要拆分为两个数组，这个在下面介绍_.partition的时候具体解释 4 var result = partition ? [[], []] : {}; 5 iteratee = cb(iteratee, context); 6 _.each(obj, function(value, index) { 7 var key = iteratee(value, index, obj); 8 behavior(result, value, key); 9 }); 10 return result; 11 }; 12 };
group第一眼一看也是有点复杂，函数里面返回函数，然后behavior参数还是个函数
结构简化之后其实就是下面这样：
function A(B){ return function(){ B(); } }
从return的函数里面来看就是遍历obj取出相应的key，然后把它传给behavior中，具体behavior这里怎么理解，放到下面groupBy一起说，容易理解一些。
_.groupBy
1 _.groupBy = group(function(result, value, key) { 2 //判断result中是否有key值，如果有则加入value，如果没有将把value放入数组当中 3 if (_.has(result, key)) result[key].push(value); else result[key] = [value]; 4 });
_.groupBy的作用就是根据相应的参数将集合进行分组
_.groupBy就是调用了group函数，把group融合到其中更容易理解一些
1 _.groupBy = function(obj, iteratee, context) { 2 var result = partition ? [[], []] : {}; 3 iteratee = cb(iteratee, context); 4 _.each(obj, function(value, index) { 5 var key = iteratee(value, index, obj); 6 if (_.has(result, key)) result[key].push(value); else result[key] = [value]; 7 }); 8 return result; 9 };
这样看group的结构彻底清晰了。
_.indexBy
1 _.indexBy = group(function(result, value, key) { 2 result[key] = value; 3 });
返回每一项索引的对象
_.countBy
1 _.countBy = group(function(result, value, key) { 2 if (_.has(result, key)) result[key]++; else result[key] = 1; 3 });
这个就是返回符合条件的对象数量
_.partition = group(function(result, value, pass) {
result[pass ? 0 : 1].push(value);
}, true);
这就是一个按要求把一个数组拆分成两个的函数，调用group函数，遍历数组，将符合条件的放在第一个数组当中，不符合的放在第二个函数当中
_.toArray
1 _.toArray = function(obj) { 2 //如果为空，返回空数组 3 if (!obj) return []; 4 //如果是数组，拷贝数组 5 if (_.isArray(obj)) return slice.call(obj); 6 if (_.isString(obj)) { 7 // 如果是字符串，则利用正则表达式提取匹配项 8 return obj.match(reStrSymbol); 9 } 10 //如果类数组，通过map方法转化数组 11 if (isArrayLike(obj)) return _.map(obj); 12 //对象，取出属性值存入数组 13 return _.values(obj); 14 };
_.size
1 _.size = function(obj) { 2 //判断是否为空 3 if (obj == null) return 0; 4 //如果是数组则返回数组长度，如果是对象返回属性的数量 5 return isArrayLike(obj) ? obj.length : _.keys(obj).length; 6 };
_.initial
1 _.initial = function(array, n, guard) { 2 return slice.call(array, 0, Math.max(0, array.length - (n == null || guard ? 1 : n))); 3 };
返回筛选后的数组，n是第几个开始，如果n不存在那么就是array.length-1，也就是数组全拷贝一遍，Math.max是为了规避负数的情况
_.first
1 _.first = _.head = _.take = function(array, n, guard) { 2 //参数判空处理 3 if (array == null) return void 0; 4 if (n == null || guard) return array[0]; 5 return _.initial(array, array.length - n); 6 };
first就是取前几个元素的作用，调用了initial函数
_.rest
1 _.rest = _.tail = _.drop = function(array, n, guard) { 2 return slice.call(array, n == null || guard ? 1 : n); 3 };
_.rest是获取第n个元素之后的元素
_.last
1 _.last = function(array, n, guard) { 2 if (array == null) return void 0; 3 if (n == null || guard) return array[array.length - 1]; 4 return _.rest(array, Math.max(0, array.length - n)); 5 };
返回最后n个元素，结构跟first差不多
flatten
1 var flatten = function(input, shallow, strict, output) { 2 //output是存放结果的数组 3 output = output || []; 4 var idx = output.length; 5 //遍历input，input是要处理的数组 6 for (var i = 0, length = getLength(input); i < length; i++) { 7 var value = input[i]; 8 //判断是不是数组或者arguments对象 9 if (isArrayLike(value) && (_.isArray(value) || _.isArguments(value))) { 10 // 是否只合并一次 11 if (shallow) { 12 var j = 0, len = value.length; 13 while (j < len) output[idx++] = value[j++]; 14 } else { 15 //如果不是，则递归调用flatten 16 flatten(value, shallow, strict, output); 17 idx = output.length; 18 } 19 //如果不是数组，并且是非严格的 20 } else if (!strict) { 21 //直接将value拷贝到output数组当中 22 output[idx++] = value; 23 } 24 } 25 return output; 26 };
flatten作用就是将多维数组合并成一维数组，如果参数shallow为true的话，就只合并一次
_.difference
1 _.difference = restArgs(function(array, rest) { 2 rest = flatten(rest, true, true); 3 return _.filter(array, function(value){ 4 return !_.contains(rest, value); 5 }); 6 });
作用是剔除第一数组中其他数组也有的元素，它是先调用flatten将其合并，再调用filter选出符合条件的，里面的条件是!_.cotains，也就是不存在的，所以最后取出的就是剔除完之后的元素数组了
_.uniq
1 _.uniq = _.unique = function(array, isSorted, iteratee, context) { 2 //如果没有isSorted参数则对参数进行调整 3 if (!_.isBoolean(isSorted)) { 4 context = iteratee; 5 iteratee = isSorted; 6 isSorted = false; 7 } 8 //参数不为空，生成回调函数 9 if (iteratee != null) iteratee = cb(iteratee, context); 10 var result = []; 11 var seen = []; //缓存数据用的 12 for (var i = 0, length = getLength(array); i < length; i++) { 13 var value = array[i], 14 computed = iteratee ? iteratee(value, i, array) : value; 15 //如果是排序好的 16 if (isSorted) { 17 //因为是排序好的，按顺序比较就好了 18 if (!i || seen !== computed) result.push(value); 19 seen = computed; 20 } else if (iteratee) { 21 //处理对象，computed是上面回调函数返回的结果，然后比较，没有就添加 22 if (!_.contains(seen, computed)) { 23 seen.push(computed); 24 result.push(value); 25 } 26 //判断result里是否有value，如果没有就添加 27 } else if (!_.contains(result, value)) { 28 result.push(value); 29 } 30 } 31 return result; 32 };
就是一个去重的函数，分别对有序的，对象和普通三种情况分别进行处理
_.intersection
1 _.intersection = function(array) { 2 var result = []; 3 var argsLength = arguments.length; 4 //遍历第一个数组 5 for (var i = 0, length = getLength(array); i < length; i++) { 6 var item = array[i]; 7 //判断result中是否有 8 if (_.contains(result, item)) continue; 9 var j; 10 //遍历其他数组 11 for (j = 1; j < argsLength; j++) { 12 //如果其他数组中，存在没有的情况就结束循环 13 if (!_.contains(arguments[j], item)) break; 14 } 15 //如果循环完，说明每个里面都有，那么就是我们想要的交集结果 16 if (j === argsLength) result.push(item); 17 } 18 return result; 19 };
作用就是去数组的交集，就是拿第一个数组中每一个元素跟后面的数组作比较
_.unzip
1 _.unzip = function(array) { 2 //取出一个最大长度值 3 var length = array && _.max(array, getLength).length || 0; 4 var result = Array(length); 5 //循环取出每个数组中相同位置的元素，最后组成一个新的二维数组 6 for (var index = 0; index < length; index++) { 7 result[index] = _.pluck(array, index); 8 } 9 return result; 10 };
_.object
1 _.object = function(list, values) { 2 var result = {}; 3 for (var i = 0, length = getLength(list); i < length; i++) { 4 if (values) { 5 result[list[i]] = values[i]; 6 } else { 7 result[list[i][0]] = list[i][1]; 8 } 9 } 10 return result; 11 };
作用就是将数组转化为对象
_.range
1 _.range = function(start, stop, step) { 2 //判断是否有stop参数 3 if (stop == null) { 4 stop = start || 0; 5 start = 0; 6 } 7 //step参数不存在的时候赋予默认值 8 if (!step) { 9 step = stop < start ? -1 : 1; 10 } 11 //获取数组长度 12 var length = Math.max(Math.ceil((stop - start) / step), 0); 13 var range = Array(length); 14 for (var idx = 0; idx < length; idx++, start += step) { 15 //数组赋值 16 range[idx] = start; 17 } 18 return range; 19 };
作用是按需生成一个整数数组
_.chunk
1 _.chunk = function(array, count) { 2 //如果count为空或小于1，则返回空 3 if (count == null || count < 1) return []; 4 var result = []; 5 var i = 0, length = array.length; 6 while (i < length) { 7 //进行拆分 8 result.push(slice.call(array, i, i += count)); 9 } 10 return result; 11 };
小结
本打算上周就发出来的，但是忙着其他的事情耽搁了，underscore.js剩下的所有内容会在下一篇中都写完（不出意外的话是下周发出来）。
感谢大家的观看，也希望能够和大家互相交流学习，有什么分析的不对的地方欢迎大家批评指出
参考资料
http://www.w3cfuns.com/house/17398/note/class/id/bb6dc3cabae6651b94f69bbd562ff370
