ES6 Common Summary--chapter III (Expansion of arrays, functions, objects)

1.1. Array.from ()

The Array.from method is used to convert two types of objects into real arrays: arrays-like objects (Array-like object) and objects that can traverse (iterable), including ES6 The new data structure Set and the Map ).

The following is an array-like object, Array.from it into a real array.

Let Arraylike = {    ' 0 ': ' A ',    ' 1 ': ' B ',    ' 2 ': ' C ',    

　　

Array.from can also accept the second parameter, which acts like a map method of an array , which is used to process each element and put the processed value into the returned array.

Array.from (arraylike, x = x * x), or//equivalent to Array.from (arraylike). Map (x = x × * x); Array.from ([1, 2, 3], (x) = x * x)//[1, 4, 9]

　　

1.2. Array.of ()

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

Array.of (3, one, 8)//[3,11,8]array.of (3)//[3]array.of (3). Length//1

　　

1.3. the entries () of the array instance ,keys ( ), and values ()

ES6 provides three new methods - -entries (), keys (), and values ()-- for iterating through an array. They all return a Walker object that can be traversed with a for...of loop, the only difference being that keys () is the traversal of the key name,and values () is the traversal of the key value , Entries () is a traversal of key-value pairs.

For (Let index of [' A ', ' B '].keys ()) {  console.log (index);} 0//1for (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"

　　

1.4. default values for function parameters

ES6 allows you to set a default value for the function's parameters, which is written directly after the parameter definition.

function log (x, y = ' world ') {  console.log (x, y);} Log (' hello ')//Hello Worldlog (' hello ', ' China ')//Hello Chinalog (' hello ', ')//Hello

　　

parameter variables are declared by default, so they cannot be declared again with let or const .

function foo (x = 5) {Let  x = 1;//error  const x = 2;//Error}

　　

In the above code, the parameter variable x is declared by default, in the function body, cannot be declared again with let or const , otherwise it will be an error.

1.5. application of extension operators

(1) merging arrays

The extension operator provides a new notation for array merging.

Es5[1, 2].concat (more)//es6[1, 2, ... more]var arr1 = [' A ', ' B '];var arr2 = [' C '];var arr3 = [' d ', ' E '];//ES5 of merged arrays ARR1 . Concat (ARR2, ARR3);//[' A ', ' B ', ' C ', ' d ', ' E ']//ES6 's merged array [... arr1, ... arr2, ... arr3]//[' A ', ' B ', ' C ', ' d ', ' e ']

　　

1.6. Arrow Functions

ES6 allows you to define functions using the arrow (= =).

var f = v + V;

The above arrow functions are equivalent to:

var f = function (V) {

return v;

};

Example

$ (function () {       var a= () =>{         Const [A, B, C, D, e] = ' Hello ';            Console.log (A + "__" +b+ "__" +c+ "__" +d+ "__" +e);       }        A ();//without Parameters//h__e__l__l__o    var b= (name,password) =>{                     console.log ("Username:" +name+ ", Password:" +password);       }      B ("Zhang San", "123456");//with parameter//user name: Zhang San, password: 123456        });

　　

1.7. extension of the object1.8. Concise representation of attributes

ES6 allows you to write directly to variables and functions as properties and methods of an object. This kind of writing is more concise.

var foo = ' Bar ', var baz = {foo};baz//{foo: ' bar '}//equals var baz = {Foo:foo};

　　

The above code shows that ES6 allows you to write variables directly among objects. At this point, the property name is the variable name and the property value is the value of the variable.

1.9. Traversal of Attributes

ES6 There are altogether 5 ways to traverse the properties of an object.

(1)for...in

For...in loops through the object's own and inherited enumerable properties (without the Symbol attribute).

(2)object.keys (obj)

Object.keys Returns an array that includes all enumerable properties (without the Symbol attribute) of the object itself (without inheritance) .

(3)object.getownpropertynames (obj)

Object.getownpropertynames Returns an array that contains all the properties of the object itself (without the Symbol attribute, but includes non-enumerable properties).

(4)object.getownpropertysymbols (obj)

Object.getownpropertysymbols Returns an array that contains all the Symbol properties of the object itself .

(5)reflect.ownkeys (obj)

Reflect.ownkeys Returns an array that contains all the properties of the object itself, regardless of whether the property name is a Symbol or a string, or if it is enumerable.

the 5 methods above traverse the properties of the object, all following the same order rules for property traversal.

• First, all attributes named numeric are traversed, sorted by number.
• Next, iterate through all properties that have property names as strings, sorted by build time.
• the last traversal of all properties named the properties of the Symbol value, sorted by build time.

Reflect.ownkeys ({[Symbol ()]:0, b:0, 10:0, 2:0, a:0}) [' 2 ', ' Ten ', ' B ', ' A ', Symbol ()]

　　

in the above code, The Reflect.ownkeys method returns an array that contains all the properties of the Parameter object. The order of the properties of this array is, first, the numeric attributes 2 and ten, followed by the string attributes B and a, and finally the Symbol property.

Note: for Object.values and other ES2017 just out of the function, most browsers do not support, for the time being not listed

ES6 Common Summary--chapter III (Expansion of arrays, functions, objects)