Here, the array of several commonly used methods are summarized for subsequent review and improve the efficiency of daily development

1. Array archiving (grouping array objects by a field)

This article juejin.cn/post/700408… There are related methods of introduction, digg friends also gives a new method, choose their own easy to understand the summary of experience

2. Array deduplication

I wrote a previous article about array de-duplication, but it only works for arrays of simple data types. For simple array deduplicating, check out the following methods: juejin.cn/post/698626… Here’s a compatible approach (array objects & primitive data types)

const objArr = [{
    userId: 1.userName: 'Zhang Haiyang'
}, {
    userId: 2.userName: 'Wang Xiaoxiao'
}, {
    userId: 1.userName: 'Zhang Haiyang'
}, {
    userId: 4.userName: 'luggage'
}, {
    userId: 2.userName: 'Wang Xiaoxiao'
}]

const numberArr = [1.3.1.5.3.2.1.5.2.4];

/ * * * *@desc Array duplicates (ARR, key) *@param {Array} Arr: Array * to be de-duplicated@param {String} Key: deduplication key *@return {Array} Returns an array */
function arrRmDuplicates(arr, key) {
    let obj = {};
    return arr.reduce((newArr, item) = > (key ? (obj[item[key]] ? ' ' : obj[item[key]] = 1 && newArr.push(item)) : newArr = Array.from(new Set(arr)), newArr), [])
}

console.log(arrRmDuplicates(numberArr))
console.log(arrRmDuplicates(objArr, 'userId'))
Copy the code

3. Array union

const num_1 = [1.2.3.4.5]
const num_2 = [2.3.4.5.6.8.10]

const objArr_1 = [{
    userId: 1.userName: 'Zhang Haiyang'
}, {
    userId: 2.userName: 'Wang Xiaoxiao'
}, {
    userId: 3.userName: 'Tian Ba Lee'
}, {
    userId: 4.userName: 'luggage'
}]

const objArr_2 = [{
    userId: 1.userName: 'Zhang Haiyang'
}, {
    userId: 2.userName: 'Wang Xiaoxiao'
}, {
    userId: 6.userName: 'Wu Xiaofei'
}, {
    userId: 8.userName: 'don'
}]

/ * * * *@desc Array union arrUnio(ARR_1, ARR_2, key) *@param {Array, the Array} Arr_1, ARR_2: original array *@param {String} Key: indicates the keyword *@return {Array} Returns an array */
function arrUnio(arr_1, arr_2, key) {
    return arr_1.concat(arr_2.filter(item= >key ? ! arr_1.map(it= >it[key]).includes(item[key]) : ! arr_1.includes(item))) }console.log(arrUnio(num_1, num_2))
console.log(arrUnio(objArr_1, objArr_2, 'userId'))
Copy the code

4. Array intersection

const num_1 = [1.2.3.4.5]
const num_2 = [2.3.4.5.6.8.10]

const objArr_1 = [{
    userId: 1.userName: 'Zhang Haiyang'
}, {
    userId: 2.userName: 'Wang Xiaoxiao'
}, {
    userId: 3.userName: 'Tian Ba Lee'
}, {
    userId: 4.userName: 'luggage'
}]

const objArr_2 = [{
    userId: 1.userName: 'Zhang Haiyang'
}, {
    userId: 2.userName: 'Wang Xiaoxiao'
}, {
    userId: 6.userName: 'Wu Xiaofei'
}, {
    userId: 8.userName: 'don'
}]

/ * * * *@desc ArrIntersection (ARR_1, ARR_2, key) *@param {Array, the Array} Arr_1, ARR_2: original array *@param {String} Key: indicates the keyword *@return {Array} Returns an array */
function arrIntersection(arr_1, arr_2, key) {
    return arr_1.filter(item= > key ? arr_2.map(it= > it[key]).includes(item[key]) : arr_2.includes(item))
}

console.log(arrIntersection(num_1, num_2))
console.log(arrIntersection(objArr_1, objArr_2, 'userId'))
Copy the code

5. Array difference set

const num_1 = [1.2.3.4.5]
const num_2 = [2.3.4.5.6.8.10]

const objArr_1 = [{
    userId: 1.userName: 'Zhang Haiyang'
}, {
    userId: 2.userName: 'Wang Xiaoxiao'
}, {
    userId: 3.userName: 'Tian Ba Lee'
}, {
    userId: 4.userName: 'luggage'
}]

const objArr_2 = [{
    userId: 1.userName: 'Zhang Haiyang'
}, {
    userId: 2.userName: 'Wang Xiaoxiao'
}, {
    userId: 6.userName: 'Wu Xiaofei'
}, {
    userId: 8.userName: 'don'
}]

/ * * * *@desc Array arrDifference(ARR_1, ARR_2, key) *@param {Array, the Array} Arr_1, ARR_2: original array *@param {String} Key: indicates the keyword *@return {Array} Returns an array */
function arrDifference(arr_1, arr_2, key) {
    let duplicatesArr = arrRmDuplicates([...arr_1, ...arr_2], key) // arrRmDuplicates are the array deduplication methods mentioned earlier
    return duplicatesArr.filter(item= >(! [arr_1, arr_2].every(it= > key ? (it.map(its= > its[key]).includes(item[key])) : it.includes(item))))
}

console.log(arrDifference(num_1, num_2))
console.log(arrDifference(objArr_1, objArr_2, 'userId'))
Copy the code

6. Array flattening

"Method one" : Encapsulate recursive functionsconst arr = [1.2[3.4].5[6[7[8.9]]]]
const objArr = [{
    userId: 1.userName: 'Zhang Haiyang'[{},userId: 2.userName: 'Wang Xiaoxiao'[{},userId: 3.userName: 'Reese'{}]],userId: 6.userName: 'Wu Xiaofei'
}, {
    userId: 8.userName: 'don'
}]

/ * * * *@desc Array flattening arrFlat(ARr, I) *@param {Array} Arr: original array *@param {Number} I: Number of layers to be leveled. The default value is 1 *@return {Array} Returns an array */
function arrFlat(arr, i = 1) {
    return arr.reduce((newArr, item) = > newArr.concat((i>1&&Array.isArray(item))? arrFlat(item,i-1):item), [])
}

console.log(arrFlat(arr))
console.log(arrFlat(arr,2))
console.log(arrFlat(objArr, 1))

/ * -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- - * /Method 2: Added in ES6`Array.prototype.flat()`Used to "flatten" a nested array into a one-dimensional array. This method returns a new array with no effect on the original data.console.log(arr.flat())
console.log(arr.flat(2))
console.log(objArr.flat(1))

Copy the code

7. Two elements in an array are swapped

const arr = [1.2.3.4.5.6]

/ * * * *@desc Array values swap arrExchange(ARR, index_1, index_2) *@param {Array} Arr: original array *@param {Number} Index_1: The index * of the first exchange value@param {Number} Index_2: The index * of the second exchange value@return {Array} Returns an array */
function arrExchange(arr, index_1, index_2) {
    arr.splice(index_1, 1, arr.splice(index_2, 1, arr[index_1])[0])
    return arr
}

console.log(arrExchange(arr, 1.3))
Copy the code

The above method will change the original array. If you do not want to change the original array, you can consider adding a switch to control and achieve compatible effect. The method is as follows:

const arr = [1.2.3.4.5.6]

/ * * * *@desc Array value swap arrExchange(arr, index_1, index_2,isChangeSourceArr=false) *@param {Array} Arr: original array *@param {Number} Index_1: The index * of the first exchange value@param {Number} Index_2: The index * of the second exchange value@param {Boolean} IsChangeSourceArr: Whether to change the original array, default does not change *@return {Array} Returns an array */
function arrExchange(arr, index_1, index_2, isChangeSourceArr = false) {
    let newArr = isChangeSourceArr ? arr : JSON.parse(JSON.stringify(arr)); // The deep copy here does not apply to arrays whose elements are functions and data types such as Symbol
    newArr.splice(index_1, 1, newArr.splice(index_2, 1, newArr[index_1])[0])
    return newArr
}

console.log(arrExchange(arr, 1.3),arr) // Do not change the original array
console.log(arrExchange(arr, 1.3.true),arr) // Change the original array
Copy the code

8, the end

All of the above approaches to arrays are common at work, so if you find this article useful, keep your mind at 😁😁