Small knowledge, big challenge! This article is participating in the creation activity of “Essential Tips for Programmers”.

This article has participated in the “Digitalstar Project” and won a creative gift package to challenge the creative incentive money.

A journey of a thousand miles begins with single step

preface

Last night, I saw a big guy posted the above picture when I was browsing the moments of friends, which perfectly illustrated the 8 common methods of the array. Here I wrote an article to share with you, after all, alone lele is better than all lele, no more words, we get to the point.

map()

The map() method returns a new array with the values of the elements in the original array.

Return value: new array

Grammar:

array.map(function(currentValue,index,arr), thisValue)
Copy the code

Parameters:

  • function(currentValue, index, arr)Each element in the array executes this function (usually using the arrow function) required
    • currentValue: Specifies the value of the current element
    • index: The index value of the current element is optional
    • arr: The array object to which the current element belongs is optional
  • thisValueThe: object is used when the callback is executed, passed to the function, and used asthisThe value of the. optional

Note:

The map() method processes the elements in their original array order

Map () does not detect empty arrays

Map () does not change the original array

Case study:

let nums = [1.2.3.4]
let newNums = []
newNums = nums.map(item= > {
  return item * 2
})
console.log(newNums)
// [2, 4, 6, 8]
console.log(nums)
// [1, 2, 3, 4]

Copy the code

filter()

The filter() method creates a new array by checking all eligible elements in the specified array.

Return value: new array

Grammar:

array.filter(function(currentValue,index,arr), thisValue)
Copy the code

Parameters:

  • function(currentValue, index, arr)Each element in the array executes this function (usually using the arrow function) required
    • currentValue: Specifies the value of the current element
    • index: The index value of the current element is optional
    • arr: The array object to which the current element belongs is optional
  • thisValueThe: object is used when the callback is executed, passed to the function, and used asthisThe value of the. optional

Note:

Filter () does not detect an empty array

Filter () does not change the original array

Case study:

// Use filter for array de-duplicating
const unique = oldArr= > {
  return oldArr.filter((item, index, arr) = > {
    // The current element, the first index in the original array equals the current index value, otherwise the current element is returned
    return arr.indexOf(item, 0) === index
  })
}
var options = [5.'vience'.5.'vience'.true.15.true]
var newArr = unique(options)
console.log(options)
// [ 5, 'vience', 5, 'vience', true, 15, true ]
console.log(newArr)
// [ 5, 'vience', true, 15 ]

Copy the code

every()

The every() method checks all elements in an array using the specified function

If one element in the array is detected to be unsatisfactory, the entire expression returns FASle and the remaining elements are not detected

The expression returns true if all elements in the array meet the criteria

Return value: Boolean true/fasle

Grammar:

array.every(function(currentValue,index,arr), thisValue)
Copy the code

Parameters:

  • function(currentValue, index, arr)Each element in the array executes this function (usually using the arrow function) required
    • currentValue: Specifies the value of the current element
    • index: The index value of the current element is optional
    • arr: The array object to which the current element belongs is optional
  • thisValueThe: object is used when the callback is executed, passed to the function, and used asthisThe value of the. optional

Note:

Every () does not check for empty arrays

Every () does not change the original array

Case study:

let ages = [18.20.33.15.23]
let isAllAdult = ages.every(item= > {
  return item >= 17
})
console.log(ages)
// [18, 20, 33, 15, 23]
console.log(isAllAdult)
// false

Copy the code

some()

The some() method executes each element of the array in turn

If one element in the array meets the criteria, the entire expression returns true, and the remaining elements are not tested

If none of the elements in the array meet the criteria, the expression returns false

Return value: Boolean true/fasle

Grammar:

array.some(function(currentValue,index,arr),thisValue)
Copy the code

Parameters:

  • function(currentValue, index, arr)Each element in the array executes this function (usually using the arrow function) required
    • currentValue: Specifies the value of the current element
    • index: The index value of the current element is optional
    • arr: The array object to which the current element belongs is optional
  • thisValueThe: object is used when the callback is executed, passed to the function, and used asthisThe value of the. optional

Note:

Some () does not check for empty arrays

Some () doesn't change the original array

Case study:

let ages = [18.20.33.15.23]
let haveChildLabor = ages.some(item= > {
  return item < 18
})
console.log(ages)
// [18, 20, 33, 15, 23]
console.log(haveChildLabor)
// true

Copy the code

fill()

Action: The fill() method is used to replace an element of an array with a fixed value

Return value: Changed array

Grammar:

array.fill(value, start, end)
Copy the code

Parameters:

  • value: The padded value is required
  • start: Optional position to start filling
  • end: Location to stop filling (default: array.length) Optional

Note:

Fill () changes the original array

Case study:

let fruits = ["Banana"."Orange"."Apple"."Mango"]
fruits.fill("Pears".1)
console.log(fruits)
// [ 'Banana', 'Pears', 'Pears', 'Pears' ]

Copy the code

findIndex()

The findIndex() method returns the position of the first element in an array passed in to test the condition

The findIndex() method calls function execution once for each element in the array

FindIndex () returns the index position of the element that meets the condition when the array summary element returns true when the condition is tested, and the subsequent value is not called

Returns -1 if no element matches the criteria

Return value: Returns the index of the first array element that matches the test criteria, or -1 if none.

Grammar:

array.findIndex(function(currentValue, index, arr), thisValue)
Copy the code

Parameters:

  • function(currentValue, index, arr): a function that executes every element in the array (typically using arrow functions) required
    • currentValue: Specifies the value of the current element
    • index: The index value of the current element is optional
    • arr: The array object to which the current element belongs is optional
  • thisValueThe: object is used when the callback is executed, passed to the function, and used asthisThe value of the. optional

Case study:

let ages = [18.20.33.15.23]
let haveChildLaborIndex = ages.findIndex(item= > {
  return item < 18
})
console.log(ages)
// [18, 20, 33, 15, 23]
console.log(haveChildLaborIndex)
/ / 3

Copy the code

find()

The find() method returns the value of the first element of the array that passes the test.

The find() method calls function execution once for each element in the array

When the array’s summarized elements return true on a test condition, find() returns the element that matches the condition, and the subsequent value is not called

Returns undefined if there are no eligible elements

Return value: Returns the value of the first array element that matches the test criteria, or undefined if none.

Grammar:

array.find(function(currentValue, index, arr),thisValue)
Copy the code

Parameters:

  • function(currentValue, index, arr): a function that executes every element in the array (typically using arrow functions) required
    • currentValue: Specifies the value of the current element
    • index: The index value of the current element is optional
    • arr: The array object to which the current element belongs is optional
  • thisValueThe: object is used when the callback is executed, passed to the function, and used asthisThe value of the. optional

Note:

Find () For an empty array, the function is not executed.

Find () does not change the original value of the array.

Case study:

let ages = [18.20.33.15.23]
let haveChildLaborAge = ages.find(item= > {
  return item < 18
})
console.log(ages)
// [18, 20, 33, 15, 23]
console.log(haveChildLaborAge)
/ / 15

Copy the code

reduce()

What it does: The reduce() method takes a function as an accumulator, and each value in the array (from left to right) is reduced to a value

Reduce (), as a higher-order function, is used for compose of the function

When the array’s summarized elements return true on a test condition, find() returns the element that matches the condition, and the subsequent value is not called

Returns undefined if there are no eligible elements

Return value: Returns the calculation result

Grammar:

array.reduce(function(total, currentValue, currentIndex, arr), initialValue)
Copy the code

Parameters:

  • function(total, currentValue, currentIndex, arr): The function used to execute each array element (typically using arrow functions) is required
    • total: The initial value, or the return value after the calculation is complete
    • currentValue: Specifies the value of the current element
    • index: The index value of the current element is optional
    • arr: The array object to which the current element belongs is optional
  • initialValue: The initial value passed to the function is optional

Note:

Find () does not perform a callback on an empty array.

Find () does not change the original value of the array.

Case study:

let salarys = [18.20.34.15.23]
let totalSalary = 0
totalSalary = salarys.reduce((total, item) = > {
  return total + item
}, 40)
console.log(salarys)
// [18, 20, 33, 15, 23]
console.log(totalSalary)
/ / 150

Copy the code

Case code

Gitee.com/yunxii/code…