今日分享:
每一步都是曼妙的风景~
lodash官网地址
_.intersection([arrays])
使用:
创建唯一值的数组,这个数组包含所有给定数组都包含的元素,使用SameValueZero进行相等性比较。(注:可以理解为给定数组的交集)
使用示例:
_.intersection([2, 1], [4, 2], [1, 2]);
// => [2]
尝试手写:
①返回数组 ②“查重” ③ 返回重合部分
let inter_arr1 = [5, 2],inter_arr2 = [2, 1],inter_arr3 = [4, 2];function my_intersection (...args) {let n = 0,len = args[0].length, arr = [];while (n<len) {for(let i = 0; i < args.length; i++) {if(args[i].indexOf(args[0][n]) === -1) {break;}if(i == args.length -1) {arr.push(args[0][n])}}n++;}return arr;}console.log(my_intersection(inter_arr1, inter_arr2, inter_arr3)); // [2]
源码方案:
var intersection = baseRest(function(arrays) {
// 判断并取出array中的每一项都是键值对类型var mapped = arrayMap(arrays, castArrayLikeObject);return (mapped.length && mapped[0] === arrays[0])? baseIntersection(mapped): [];
});
var nativeMin = Math.min;
// 核心处理逻辑
/*** The base implementation of methods like `_.intersection`, without support* for iteratee shorthands, that accepts an array of arrays to inspect.** @private* @param {Array} arrays The arrays to inspect.* @param {Function} [iteratee] The iteratee invoked per element.* @param {Function} [comparator] The comparator invoked per element.* @returns {Array} Returns the new array of shared values.*/
function baseIntersection(arrays, iteratee, comparator) {
// 通过参数 comparator 确定使用哪种比较函数var includes = comparator ? arrayIncludesWith : arrayIncludes, length = arrays[0].length,// 取第一项lengthothLength = arrays.length,// 全部要比较的数组长度othIndex = othLength, // 全部要比较的数组下标caches = Array(othLength), // 声明一个空数组maxLength = Infinity, // 最大长度result = []; // 声明一个空数组用来存放结果while (othIndex--) {var array = arrays[othIndex];// 存在迭代器,先迭代再比较if (othIndex && iteratee) {array = arrayMap(array, baseUnary(iteratee));}// 取数组长度和最大长度的小值maxLength = nativeMin(array.length, maxLength);// 如果存在比较器并 需要迭代处理内容或数组内容过多,则使用setcache去处理caches[othIndex] = !comparator && (iteratee || (length >= 120 && array.length >= 120))? new SetCache(othIndex && array): undefined;}array = arrays[0];var index = -1,seen = caches[0];outer:while (++index < length && result.length < maxLength) {var value = array[index],computed = iteratee ? iteratee(value) : value;value = (comparator || value !== 0) ? value : 0;if (!(seen? cacheHas(seen, computed): includes(result, computed, comparator))) {othIndex = othLength;while (--othIndex) {var cache = caches[othIndex];if (!(cache? cacheHas(cache, computed): includes(arrays[othIndex], computed, comparator))) {continue outer;}}if (seen) {seen.push(computed);}result.push(value);}}return result;
}
相关方法
__.ntersectionBy([arrays], [iteratee=_.identity])
使用:
这个方法类似_.intersection,区别是它接受一个 iteratee 调用每一个arrays的每个值以产生一个值,通过产生的值进行了比较。结果值是从第一数组中选择。iteratee 会传入一个参数:(value)。
使用示例:
_.intersectionBy([2.1, 1.2], [4.3, 2.4], Math.floor);
// => [2.1]// The `_.property` iteratee shorthand.
_.intersectionBy([{ 'x': 1 }], [{ 'x': 2 }, { 'x': 1 }], 'x');
// => [{ 'x': 1 }]
源码方案
var intersectionBy = baseRest(function(arrays) {var iteratee = last(arrays),mapped = arrayMap(arrays, castArrayLikeObject);if (iteratee === last(mapped)) {iteratee = undefined;} else {mapped.pop();}return (mapped.length && mapped[0] === arrays[0])? baseIntersection(mapped, baseIteratee(iteratee, 2)): [];
});
_.intersectionWith([arrays], [comparator])
使用:
这个方法类似_.intersection,区别是它接受一个 comparator 调用比较arrays中的元素。结果值是从第一数组中选择。comparator 会传入两个参数:(arrVal, othVal)。
使用示例:
var objects = [{ 'x': 1, 'y': 2 }, { 'x': 2, 'y': 1 }];
var others = [{ 'x': 1, 'y': 1 }, { 'x': 1, 'y': 2 }];_.intersectionWith(objects, others, _.isEqual);
// => [{ 'x': 1, 'y': 2 }]
源码方案
var intersectionWith = baseRest(function(arrays) {var comparator = last(arrays),mapped = arrayMap(arrays, castArrayLikeObject);comparator = typeof comparator == 'function' ? comparator : undefined;if (comparator) {mapped.pop();}return (mapped.length && mapped[0] === arrays[0])? baseIntersection(mapped, undefined, comparator): [];
});
思考
lodash在实践中非常方便,不用担心会出现莫名其妙的意外bug,数据格式不正确顶多结果为空。
但是稍微复杂一点的逻辑处理,就会涉及很多子方法的调用,像以上对比取重,其实只需要两个循环逻辑去一一对比就好,只是选双指针或者别的对比方式去优化处理性能的区别。有点不确定使用lodash对数据处理时是否对性能方面消耗较大。