🔥码云GVP开源项目 12k star Uniapp+ElementUI 功能强大 支持多语言、二开方便! 广告
## 展开运算符(...) **展开运算符(spread)**是三个点(...),可以将一个数组转为用逗号分隔的参数序列 拆解字符串与数组 ``` var arr = [1,2,3,4] console.log(...arr) // 1 2 3 4 var str = 'String' console.log(...str) // S t r i n g ``` 使用Math.max()求数组最大值时 ``` var array = [1,2,3,4,3] var maxItem = Math.max(...array) console.log(maxItem) // 4 ``` * 代替数组的`push`、`concat`等方法——把 arr2 塞进 arr1 中 ``` var arr1 = [0,1,2] var arr2 = [3,4,5] arr1.push(...arr2) // arr1 → [0,1,2,3,4,5] ``` * 将伪数组转化为数组 ``` var nodeList = document.querySelectorAll('div') // querySelectorAll 方法返回的是一个 nodeList 对象。它不是数组,而是一个类似数组的对象。 console.log([...nodeList]) // [div,div,div,...] ``` ## rest运算符 **(剩余运算符)** 展开元素会'展开'数组变成多个元素, 剩余元素会收集多个元素和'压缩'成一个单一的元素,数组 ``` function sumRest(...m) { var total = 0 for(var i of m){ total += i } return total } console.log(sumRest(1,2,3)) // 6 ``` * `rest`参数代替`arguments`变量 ``` // arguments写法 function sortNumbers(){ return Array.prototype.slice.call(arguments).sort() } // Es6 rest参数写法 const sortNumbers = (...numbers) => { numbers.sort() } var a = { 0: 'bob', 1: '12', 2: 'male', length: 3}; console.log(Array.prototype.slice.call(a)); // ["bob", "12", "male"] ``` `Array.prototype.slice.call()`方法能够将一个具有`length`属性的对象转换为数组 等价 `[].slice.call(arguments)`。 * 与解构赋值组合使用 ``` var array = [1,2,3,4,5,6] var [a,b,...c] = array console.log(a) // 1 console.log(b) // 2 console.log(c) // [3,4,5,6] ``` **❗ 小知识:** > rest参数可理解为剩余的参数,所以必须在最后一位定义,如果定义在中间会报错。 ~~~ var array = [1,2,3,4,5,6]; var [a,b,...c,d,e] = array; // Uncaught SyntaxError: Rest element must be last element ~~~