Es6 Notes 2 ^_^ array, es6 Notes 2 array

Es6 Notes 2 ^_^ array, es6 Notes 2 array
1. Array. from ()

Array. the from method is used to convert two types of objects into real Arrays: array-like objects and iterable objects) (including the data structure Set and Map added by ES6 ).

if(1){    let list = document.querySelectorAll('ul.fancy li');    Array.from(list).forEach(function (li) {       console.log(li);    });}

In the code above, the querySelectorAll method returns an object similar to an array. The forEach method can be used only when this object is converted into a real array.
Any object with the length attribute can be converted to an Array through the Array. from method.

    let array1 = Array.from({ 0: "a", 1: "b", 2: "c", length: 3 });    console.log((array1));    // [ "a", "b" , "c" ]

Array. from () can also accept the second parameter, which acts like the map method of the Array and is used to process each element.

Let array = [0, 1, 2, 3, 4]; let arrNew = Array. from (array, x => x * x); console. log (arrNew); // equivalent to // let arrNew = Array. from (array ). map (x => x * x );

In the following example, convert a Member whose Boolean value is false to 0.

    let arr1=Array.from([1, , 2, , 3], (n) => n || 0);    console.log(arr1);// [1, 0, 2, 0, 3]

An Application of Array. from (): converts a string into an Array and returns the length of the string. This avoids the bug where JavaScript counts Unicode characters larger than \ uFFFF as two characters.

Function countSymbols (string) {return Array. from (string ). length;} console. log (countSymbols ('Nick '); let arg; function test () {arg = arguments; console. log (arg); // a class array console. log (arg instanceof Array);} test (1, 2); console. log (Array. from (arg, x => x + 1); let person = {0: 'zhang san', 1: 'Li si', 2: 'wang wu', length: 3 }; console. log (Array. from (person ));

2. Array. of () converts the value to an Array

// The Array. of method is used to convert a group of values to an Array. Console. log (Array. of (3, 11, 8); // [3, 11, 8] console. log (Array. of (3); // [3] console. log (Array. of (3, 1 ). length); // 1

3. arr. find (callback [, thisArg]) to find the first qualified array member and Position

The find method of the array instance to find the first qualified array member.

Its parameters are a callback function. All array members execute the callback function in sequence until they find the first member whose return value is true and then return the Member. If no qualified member exists, undefined is returned.

Let array = [1, 4,-5, 10]. find (n) => n <0); console. log ("array:", array); // The code above finds the first member smaller than 0 in the array. Let array1 = [1, 5, 10, 15]. find (function (value, index, arr) {console. log (value); console. log (index); console. log (arr); return value> 9;}); console. log (array1); // 10

In the code above, 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 findIndex method of the array instance. Its usage is very similar to the find method. The position of the first qualified array member is returned. If all the Members do not meet the condition,-1 is returned.

    let index = [1, 5, 10, 15].findIndex(function(value, index, arr) {        return value > 9;    })    console.log(index);  // 2

Both methods can accept the second parameter, which is used to bind the this object of the callback function.
In addition, both methods can find NaN, making up for the shortcomings of the array IndexOf method.

    console.log([NaN].indexOf(NaN));// -1    console.log([NaN].findIndex(y => Object.is(NaN, y)));// 0    console.log([NaN].findIndex(function(v){if(Object.is(NaN, v)){return true;}}));// 0

In the code above, the indexOf method cannot identify the NaN Member of the array, but the findIndex method can be implemented using the Object. is method.

4. fill an array with the given value in fill.

Let arr = ['A', 'B', 'C']. fill (7) console. log (arr); // [7, 7, 7] let newArr = new Array (3 ). fill (7) console. log (newArr); // [7, 7, 7]/* the above Code shows that the fill method is very convenient for the initialization of empty arrays. All existing elements in the array are erased. Fill () can also accept the second and third parameters, used to specify the starting position and ending position of the fill. */Let newArr1 = ['A', 'B', 'C']. fill (7, 1, 2) console. log (newArr1); // ['A', 7, 'C']

V. Cyclic entries (), keys (), values ()

ES6 provides three new methods:
Entries () keys () values ()
Used to traverse arrays. They all return a traversal device that can be traversed using the for... of loop,
The only difference is that keys () is the traversal of key names, values () is the traversal of key values, and entries () is the traversal of key-value pairs.

    for (let index of ['a', 'b'].keys()) {        console.log(index);// 0 1    }    for (let elem of ['a', 'b'].values()) {        console.log(elem);// 'a' 'b'    }    for (let [index, elem] of ['a', 'b'].entries()) {        console.log(index, elem);// 0 "a"    1 "b"    }

All code for this article:

<! DOCTYPE html> This article is to be continued ......