Home > Web Front-end > Front-end Q&A > What is the usage of three dots in es6

What is the usage of three dots in es6

WBOY
Release: 2022-03-31 11:20:21
Original
3479 people have browsed it

Usage: 1. Merge arrays, the syntax is "[...arr1, ...arr2]"; 2. Copy array objects, the syntax is "name= [...array object]"; 3. , string to character array, the syntax is "[...string object]"; 4. Deconstructing variables, the syntax is "[variable object,...name]=value".

What is the usage of three dots in es6

The operating environment of this tutorial: Windows 10 system, ECMAScript version 6.0, Dell G3 computer.

What is the usage of three dots in es6

The spread operator (spread) is three dots (...), which is a new operator in ES6. It has many functions, such as You can convert an array into a comma-separated parameter sequence, etc. In application scenarios, two types are usually used: object spread operator and array operator.

The functions are as follows:

1. Get the maximum value of the array.

Conventional: Math.max(1,2,3)

Writing: Math.max(…[1,2,3]) is equivalent to the above example

2. Call the method

function sum(a,b){
  console.log(a+b)//5
}
sum(...[2,3])
Copy after login

The output result is:

What is the usage of three dots in es6

3. Connect the array

var arr1 = [0, 1, 2]; 
var arr2 = [3, 4, 5];  
arr1.push(...arr2);
Copy after login

The result array elements are 0, 1, 2, 3, 4, 5.

4. Connect the array

var arr1 = ['a', 'b']; 
var arr2 = ['c']; 
var arr3 = ['d', 'e'];
[...arr1, ...arr2, ...arr3]
Copy after login

The connected array elements For: a, b, c, d, e

5. Convert the string to a real array

[...'hello']  //
Copy after login

The result is:

What is the usage of three dots in es6

6. Convert the class array into a real array and remove duplicates

[...new Set([1,2,3,3])] //
Copy after login

new Set returns a class array,...Convert the class array into a real array

7. Expansion algorithm

let map = new Map([  
      [1, 'one'],  
       [2, 'two'],  
       [3, 'three'],  
]);  
let arr = [...map.keys()]; // [1, 2, 3]
Copy after login

When writing a vue project, since you don’t know how many params there are, you can directly params:param.data or params: {undefined

...param.data}
return axios({
  method: param.type,
  url: value.prefix + param.url + value.postfix,
       params: {
      ...param.data  // 将数组展开
       }
})
Copy after login

[Related recommendations: javascript video tutorial, web front-end

The above is the detailed content of What is the usage of three dots in es6. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
es6
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template