meaning
The expansion operator (spread) is three dots (...) )。 It's like the inverse of a rest parameter, turning an array into a comma-separated sequence of parameters.
This operator is mainly used for function calls.
In the code above, array.push(...) items) and add(...) numbers), both of which are calls to functions, and they both use extension operators. This operator turns an array into a sequence of parameters. Extension operators can be used in combination with normal function parameters, which is very flexible.
Apply method for alternative arrays
Since the extension operator can expand the array, there is no need to use the apply method to turn the array into an argument to the function.
Here's a practical example of an extension operator replacing the apply method, applying Math.max method to simplify the writing of the largest element of an array.
The above code says that since JavaScript doesn't provide a function to find the largest element of an array, you can only apply Math.max function to turn the array into a sequence of parameters and then find the maximum value. With the extension operator, you can use Math.max directly. Another example is by adding an array to the tail of another array via the push function.
In the ES5 writing method of the above code, the parameters of the push method cannot be arrays, so we have to use the push method flexibly through the apply method. With the extension operator, the array can be passed directly into the push method. Here's another example.
Extend the application of operators
(1) Merge arrays
The extension operator provides a new way to write the combination of numbers.
(2) combined with deconstructed assignment
Extension operators can be combined with deconstructed assignments to generate arrays.
If you use the extension operator for array assignment, it can only be placed at the last digit of the parameter, otherwise an error will be reported.
(3) The return value of the function
JavaScript functions can only return one value, and if multiple values need to be returned, only arrays or objects. Extension operators provide a workaround to solve this problem.
The above code takes a line of data from the database, extends the operator, and passes it directly to the constructor Date.
(4) String
Extension operators can also turn strings into real arrays.
The above writing has an important advantage, that is, it can correctly recognize 32-bit Unicode characters.
The first way to write the above code, JavaScript recognizes 32-bit Unicode characters as 2 characters, and there is no problem with extension operators. So the function that correctly returns the length of the string, can be written like this:
This is the problem for any function that involves manipulating 32-bit Unicode characters. Therefore, it is best to rewrite them all with extension operators.
In the above code, if you don't use the extension operator, the string reverse operation is incorrect.
(5) Objects that implement the Iterator interface
Any object in the Iterator interface can be converted into a true array with an extension operator.
In the above code, the querySelectorAll method returns a nodeList object. It is not an array, but an array-like object. In this case, the extension operator can turn it into a real array because the NodeList object implements the Iterator interface. For those array-like objects that don't have an Iterator interface deployed, the extension operator can't turn them into a real array.
In the above code, arrayLike is an array-like object, but without deploying the Iterator interface, the extension operator will report an error. In this case, you can use the Array.from method to convert arrayLike to a real array instead.
(6) Map and Set structures, Generator functions
The extension operator internally calls the Iterator interface of the data structure, so any object with an Iterator interface can use an extension operator, such as a Map structure.
When the Generator function runs, it returns a traverser object, so extension operators can also be used.
In the above code, the variable go is a Generator function, and after execution, it returns a traverser object, and executing an extension operator on this traversal object will convert the values obtained from internal traversal into an array. If you use an extension operator for an object without an iterator interface, an error will be reported.
|