Summary of new methods of es6 array

Array.from()

The Array.from() method is to convert an array-like object or traversable object into a real array.
Array.from(arrayLike[, mapFunction[, thisArg]])
arrayLike: mandatory parameters, pseudo-array objects or iterable objects that you want to convert into an array.
mapFunction: optional parameter, mapFunction(item, index){...} is a function to be called on each item in the collection. The returned value will be inserted into the new collection.
thisArg: optional parameter, this object when executing the callback function mapFunction. This parameter is rarely used

1. Convert an array-like array to an array

let arrayLike = {
    
    
	'0': 'a',
	'1': 'b',
	'2': 'c',
	length: 3
};
//es5写法
var arr1 = [].slice.call(arrayLike);//["a", "b", "c"]
//es6写法
let arr2=Array.from(arrayLike);//["a", "b", "c"]

2. Clone an array

let arr = [1,2,3]
let copy_arr=Array.from(arr)
console.log(arr===copy_arr)//false

Array.from(arr) creates a shallow copy of the arr array, the result of arr===copy_arr is false, which means that although arr and copy_arr have the same items, they are different array objects.

3. Fill the array

Array.from({
    
     length: 5 }, () => 0)	//[0, 0, 0, 0, 0]

4. Generate a range of numbers

let arr=Array.from({
    
    length:4},(item,index)=>{
    
    
	return index+1
})
console.log(arr) //[1, 2, 3, 4]

5. Array de-duplication

let arr=[1,2,2,3,3,4,2]
let unique_arr=Array.from(new Set(arr))
console.log(unique_arr) //[1, 2, 3, 4]

Array.of()

The Array.of method is used to convert a set of values ​​into an array.

Array.of(element0[, element1][, …][,elementN]);
element0,…,elementN are optional. The element to be placed in the array. This will create an array with n + 1 elements and a length of n + 1.

Array.of(1, 2, 3, 4) // [1,2,3,4]
Array.of(1) // [1]
Array.of(1).length // 1
Array.of() // []如果没有参数,就返回一个空数组。
Array.of(undefined) // [undefined]

Fill() of array instance

The fill() method fills all the elements in an array from the start index to the end index with a fixed value. Does not include the termination index.

Array.fill(value, start, end)
value: Fill value.
start: Optional, fill the starting position.
end: Optional, fill the end position, the actual end position is end-1.

let arr = [1, 2, 3, 4, 5, 6]
arr.fill(2)//[2, 2, 2, 2, 2, 2]
arr.fill(8, 3)//[2, 2, 2, 8, 8, 8]
arr.fill(0, 2, 4)// [2, 2, 0, 0, 8, 8]

Find() and findIndex() of array instance

The find method of an array instance is used to find the first qualified array member. Its parameter is a callback function, and all array members execute the callback function in turn until the first member whose return value is true is found, and then the member is returned. If there are no eligible members, undefined is returned.

The callback function of the find method can accept three parameters, which are the current value, the current position, and the original array in turn.

The usage of the findIndex method of an array instance is very similar to the find method. It returns the position of the first array member that meets the condition. If all members do not meet the condition, it returns -1.

let arr=[1,2,3,4,5,6,NaN]
let a=arr.find((value,index,arr)=>{
    
    
	return value<3
})
console.log(a)  //1
let b=arr.findIndex((value,index,arr)=>{
    
    
	return value<3
})
console.log(b)  //0
        
let c=arr.indexOf(NaN)
console.log(c)  //-1
let d=arr.find((value,index,arr)=>{
    
    
	return Object.is(NaN,value)
})
console.log(d)  //NaN
let e=arr.findIndex((value,index,arr)=>{
    
    
	return Object.is(NaN,value)
})
console.log(e)  //6

The indexOf method cannot identify the NaN member of the array, but the findIndex method can be done with the help of the Object.is method.
Both methods can find NaN, which makes up for the deficiency of the IndexOf method of the array

CopyWithin() of array instance

The copyWithin method of the array instance, in the current array, copies the member at the specified position to another position (it will overwrite the original member), and then returns the current array. In other words, using this method will modify the current array.

Array.prototype.copyWithin(target, start = 0, end = this.length)
It accepts three parameters.

target (required): replace data from this position.
start (optional): start reading data from this position, the default is 0. If it is negative, it means the countdown.
end (optional): stop reading data before reaching this position, the default is equal to the array length. If it is negative, it means the countdown.
These three parameters should all be numerical values, if not, they will be automatically converted to numerical values.

// 将3号位复制到0号位
[1, 2, 3, 4, 5].copyWithin(0, 3, 4)	// [4, 2, 3, 4, 5]

// -2相当于3号位,-1相当于4号位
[1, 2, 3, 4, 5].copyWithin(0, -2, -1)	// [4, 2, 3, 4, 5]

Includes() for array instance

The Array.prototype.includes method returns a Boolean value indicating whether an array contains a given value, similar to the includes method of a string

The second parameter of this method indicates the starting position of the search, and the default is 0. If the second parameter is negative, it indicates the position of the countdown. If it is greater than the length of the array (for example, the second parameter is -4, but the array length is 3), it will be reset to start from 0.

[1, 2, 3].includes(2);     // true
[1, 2, 3].includes(4);     // false
[1, 2, NaN].includes(NaN); // true
[1, 2, 3].includes(3, 3);  // false
[1, 2, 3].includes(3, -1); // true

Guess you like

Origin blog.csdn.net/eightNine1102/article/details/106021583