This is the third day of my participation in the First Challenge 2022.

Before the article continues, it is recommended to read from the previous article juejin.cn/post/706151… The experience is better. This is the next chapter, which is slightly more complicated than the last one.

1.concatAll:

ConcatAll is to concatenate all nested arrays into one array, which is also called demotion.

🚀 Let’s take a look at the concatAll implementation:

/ / concatAll implementation
const concatAll = (array) = >{
  let result = [];
  for(const value of array){
    result.push.apply(result,value);
  };
  return result;
}
Copy the code
  • result.push.apply(result,value)This code is actually an arrayapplyMethod, the number is composed ofapplyMethod, so as to achieve the array dimension reduction.
  • Then thereclosureIn combination withfor ofReturns the corresponding result.

🚀 Take a look at the following example to get the title and author objects from appressBooks2 with a score higher than 4.5.

  • First trialmapTo obtainbook.bookDetailsIs composed of arrays, butbook.bookDetailIt is an array itself, generating an array nested array data structure.
let apressBooks2 = [
  {
    name : "beginners".bookDetails: [{"id": 111."title": "Js you Don't Know (PART 1)"."author": "ANDREW TROELSEN"."rating": [4.7]."reviews": [{good : 4 , excellent : 12}]}, {"id": 222."title": "Js you Don't Know (Middle)"."author": "Rahul Khanna"."rating": [4.5]."reviews": []}]}, {name : "pro".bookDetails: [{"id": 333."title": "Javascript Advanced Programming"."author": "Adam Freeman"."rating": [4.0]."reviews": []}, {"id": 444."title": "Javascript enlightenment."."author": "Adam Freeman"."rating": [4.2]."reviews": [{good : 14 , excellent : 12}]}];var concatAllResult = arrayFuncs.concatAll(arrayFuncs.map(apressBooks2,(book) = >{
  return book.bookDetails
}));
console.log(concatAllResult);
Copy the code
  • As shown in the example code above,concatAllReceives a two-dimensional array, and finally reduces to a one-dimensional array.

The result of the generated one-dimensional array is shown below:

2. Reduce:

Js array reduce method, you should be familiar with, of course, can also refer to the MDN documentation (developer.mozilla.org/zh-CN/docs/…)

The author here does not take up more space, directly on the implementation of the function (here focuses on the implementation, reduce application is divided separately later) :

//reduce
const reduce = (array,fn,initVal) = >{
  let accumlator;
  if(initVal ! = =undefined){
    accumlator = initVal;
  }else{
    accumlator = array[0];
  }
  if(initVal === undefined) {for(let i = 1; i<array.length; i++){ accumlator = fn(accumlator,array[i]); }}else{
    for (const value ofarray){ accumlator = fn(accumlator,value); }}return [accumlator]
};
Copy the code
  • Fn functionReceives two arguments, one from last timeThe cumulative valueAnd the other is for this runThe new value
  • According to thereduceWhether the function has an initial valueinitValTo determine whether the loop is from0To start or to start1start

3. Zip function:

The zip function is used to merge two given arrays. The implementation is as follows:

//zip
const zip = (arr1,arr2,fn) = >{
  let result = [];
  for(let index= 0; index<Math.min(arr1.length,arr2.length); index++){ result.push(fn(arr1[index],arr2[index])); }return result;
}
Copy the code
  • throughMath.minTo get the lengthsmallerOf that array and take his length asThe benchmark
  • throughforThe loop puts the results inresult, and then return.

🚀 test:

console.log(arrayFuncs.zip([1.2.3], [4.5.6].(x,y) = >x+y));
// result is [5,7,9]
Copy the code

It is important to note that data of reference type (array, object, etc.) needs to be cloned, so that cloned data can be used for processing without affecting the original data.

  • Object.assign({}," Object to clone "), but it is important to note that this method is shallow copy.