ES6 Standard Learning: 4, array expansion

Expansion of arrays

One, class array objects and traversed objects are converted to arrays

The Array.from () method is used to convert a class array object, a traversal object, to an array, which can traverse objects including ES6 new set and map structures

The so-called Class array object, the intrinsic characteristic is that the length property must be

1Let Arraylikeobj = {2' 0 ': ' A ',3' 1 ': ' B ',4' 2 ': ' C ',5Length:36 }7 8 ES5 conversion to an array:9Let arr = [].slice.call (arraylikeobj)//[' A ', ' B ', ' C ']Ten  One ES6 conversion to an array: ALet arr = Array.from (arraylikeobj)//[' A ', ' B ', ' C ']

What kind of array objects do you actually have?

1. NodeList collection returned by Dom operation

2. Arguments object of function

If the parameter is an array, Array.from will return an identical new array.

Array.from () can also accept the second parameter, similar to the map method, which is used to process each element and put the processed value into the returned array.

Array.from (arraylikeobj, x = x * x)//  equals to Array.from (arraylikeobj). Map (x = x * x)

It is worth noting that if this is used in the second parameter, the third parameter can be passed in to bind this

Two or one group value conversions to an array

Array.of () to convert a set of values to an array

1 // [1, 1, 1]

The main purpose of this function is to compensate for the insufficiency of the array () constructor. Because the number of parameters causes the behavior of array () to be different.

1 // []2//  [,,,]3//  [1, 1, 1]

Array () returns a new array consisting of parameters only if the number of arguments is not less than 2 o'clock.

Array.of always returns an array of parameter values, and returns an empty array if there are no arguments.

Third, Copywithin ()

The Copywithin method of the array instance, where the member at the specified position within the current array is copied to another location (overwritten), and then returns the current array

Array.prototype.copyWithin (target, start, end)

Target: Required parameter, starting from this position to replace data

Start: Optional, start reading data from this location, default to 0

End: Optional, stop reading data before the location, default equals array length

Start,end can be negative, and if negative, it means reciprocal

These three parameters should all be numeric values, if not numeric, will be converted to numeric values

1 [1,2,3,4,5].copywithin (0,3)  //  [4, 5, 3, 4, 5]

The above code indicates that the member (4, 5) from position 3rd until the end of the array is copied to the position starting at No. 0, and the result overwrites the original 1, 2.

Iv. find (), FindIndex ()

The Find method is used to find the first qualifying array member, whose argument is a callback function, where all members execute the callback function sequentially until the first member that returns true is found, and then the member is returned. If not found, return to undefined

1 [1, 4,-6, 10].find ((value) = value < 0)  //  -6

1 [1,5, 15].find (function(value, index, arr)) {2   return value > 93 }  //  

The callback function for find has three parameters

Value: Current value

Index: Current Index

Arr: Original Array

The use of the FindIndex () method is very similar to the method of find, returning the position of the first qualifying array member, returning 1 if all members are not qualified.

[1, 5, 15].findindex (function(value, index, arr)) {    return value > 9}   // 2

The above two functions can accept the second parameter, which binds to the callback function's this

What is worth one is that both methods can find Nan, which makes up for the insufficiency of the IndexOf method.

1 // -1 2 3 // 0

V. Fill ()

Fill () method fills the array with the given value

[1, 2, 3].fill (7)  ///[7, 7, 7]

The Fill method can be used to initialize an empty array, and the Fill method can also accept the second and third parameters for setting the start and end positions of the fill (excluding the end position)

1 // [' A ', 7, ' C ']

Vi. entries (), keys (), VALUES ()

ES6 provides these three new methods for iterating through the array, and they all return a Walker object that can be used for ... of the loop traversal, the difference is that the keys () is the key name traversal, values () is the key value of the traversal, entries () is a key value pair traversal

1  for(Let index of [' A ', ' B '].keys ()) {2 Console.log (Index)3 }4 //05 //16 7  for(Let index of [' A ', ' B '].values ()) {8 Console.log (Index)9 }Ten //' A ' One //' B ' A  -  for(Let [index, ele] of [' A ', ' B '].entries ()) { - Console.log (Index, ele) the } - //0 "a" - //1 "B"

Vii. includes ()

The Array.prototype.includes () method returns a Boolean value that indicates whether a number group contains the given value, similar to the Include method for the string, but the method belongs to Es7.

1 [1, 2, 3].includes (2)  //  true2//  true

The second parameter of the method represents the starting position of the search, which defaults to 0. If the second argument is a negative number, it represents the position from the back to the next, if the position exceeds the length of the array (for example, the second parameter is-5, but the array length is only 4), it resets from 0 onwards

1 [1, 2, 3].includes (3, 3)  //  true2//  true

When this method is not available, we usually use indexof, but the IndexOf method has two drawbacks:

1, not enough semantics, its meaning is to find the first occurrence of the parameter value, but the comparison is really not equal to-1

2, its internal use = = = to judge, will lead to the lack of accurate Nan

1 // -1

Eight , the empty array

There is no value for a position of an array of empty exponential groups:

Note that the vacancy is not undefined, the value of a position is equal to undefined is still a value, the vacancy is not any value

1 inch [undefined] 2 true 3 inch []4false

ES5 is very inconsistent with the processing of vacancies, and in most cases ignores vacancies:

ForEach (), filter (), every (), some () skips the empty space

Map () will skip the empty space, but it will retain this value

Join () and ToString () treat the vacancy as undefined, while undefined and null are processed into an empty string

1[, ' A '].foreach ((x, i) = Console.log (i))//12 3[' A ', ' B '].filter (x =true)//[' A ', ' B ']4 5[, ' A '].every (x = = = = = ' A ')//true6 7[, ' A '].some (x = x!== ' a ')//false8 9[, ' A '].map (x = 1)//[, 1]Ten  One[, ' A ', Undefined,NULL].join (' # ')//' #a # # ' A  -[, ' A ', Undefined,NULL].tostring ()//', A,, '

ES6 is to explicitly convert the vacancy to undefined

Array.from will convert the empty array to undefined, that is, this method will not ignore the empty space

Array.from ([' A ',, ' B '])//[' A ', Undefined, ' B ']

Copywithin () will copy the empty space together

[, ' A ', ' B ',,].copywithin (2, 0)//[, ' A ',, ' a ']

For ... the loop also iterates through the slots

Let arr = [,,]

For (let index of arr) {

Console.log (1)

}//1 1

ES6 Standard Learning: 4, array expansion