2. es6扩展运算符

1. es扩展运算符

扩展运算符将一个数组转为用逗号分隔的参数序列;

<script>
    console.log(...[1, 2, 3]) //1 2 3

    // (1)将一个数组,变为参数序列
    let add = (x, y) => x + y;
    let numbers = [1, 2];
    console.log(add(...numbers))//3

    // (2)使用扩展运算符展开数组代替apply方法,将数组转为函数的参数
    // ES5 取数组最大值
    console.log(Math.max.apply(this, [654, 233, 727])); //727
    // ES6 扩展运算符
    console.log(Math.max(...[654, 233, 727])) //727
    // 相当于
    console.log(Math.max(654, 233, 727))//727

    // (3)使用push将一个数组添加到另一个数组的尾部
    // ES5  写法
    let arr1 = [1, 2, 3];
    let arr2 = [4, 5, 6];
    Array.prototype.push.apply(arr1, arr2);
    console.log(arr1) // [1, 2, 3, 4, 5, 6]
    // push方法的参数不能是数组,通过apply方法使用push方法
    // ES6  写法
    let arr3 = [1, 2, 3];
    let arr4 = [4, 5, 6];
    arr3.push(...arr4);
    console.log(arr3) // [1, 2, 3, 4, 5, 6]

    // (4)合并数组
    let a = [‘a‘, ‘b‘];
    let b = [‘c‘];
    let c = [‘d‘, ‘e‘];
    // ES5 的合并数组
    let d = a.concat(b, c);
    console.log(d) //["a", "b", "c", "d", "e"]
    // ES6 的合并数组
    let e = [...a, ...b, ...c]
    console.log(e) //["a", "b", "c", "d", "e"]

    // (6)将字符串转换为数组
    let h = [...‘hello‘]
    console.log(h) //["h", "e", "l", "l", "o"]
    // ES5
    let str = ‘world‘.split(‘‘) //["w", "o", "r", "l", "d"]
    console.log(str)

    // (6)转换伪数组为真数组
    var nodeList = document.querySelectorAll(‘p‘);
    console.log(nodeList)
    var array = [...nodeList];
    console.log(array)
    // 具有iterator接口的伪数组,非iterator对象用Array.from方法

    // (7)map结构
    let map = new Map([
        [1, ‘one‘],
        [2, ‘two‘],
        [3, ‘three‘],
    ]);
    let arr = [...map.keys()];
    console.log(arr) //[1, 2, 3]

</script>

参考文档:

  es6三点扩展运算符

原文地址:https://www.cnblogs.com/shiyun32/p/11182692.html

时间: 2024-10-10 09:11:32

2. es6扩展运算符的相关文章

ES6扩展运算符(三点运算符)“...”用法和对象拷贝

es6拷贝数组对象有以下方法: 方法一: Object.assign() // 对象浅拷贝,obj1复制给obj2,这种方法要把obj2设置为{},不能const obj2 = ""; const obj1 = {a: 1}; const obj2 = {}; Object.assign( obj2, obj1) 方法二 :ES6扩展运算符(...) //对象浅拷贝,obj1复制给obj2 const obj1 = {a: 1}; const obj2 = {...obj1}; 方法三

ES6扩展运算符的用途

ES6的扩展运算符可以说是非常使用的,在给多参数函数传参,替代Apply,合并数组,和解构配合进行赋值方面提供了很好的便利性. 扩展运算符就是三个点“...”,就是将实现了Iterator 接口的对象中的每个元素都一个个的迭代并取出来变成单独的被使用. 看这个例子: console.log(...[3, 4, 5]) 结果: 3 4 5 调用其实就是: console.log(3, 4, 5) 合并数组 可以使用扩展运算符将多个数组进行合并. let arr1 = [1, 2, 3] let a

es6 扩展运算符 三个点(...)

1  含义 扩展运算符( spread )是三个点(...).它好比 rest 参数的逆运算,将一个数组转为用逗号分隔的参数序列. console.log(...[1, 2, 3]) // 1 2 3 console.log(1, ...[2, 3, 4], 5) // 1 2 3 4 5 [...document.querySelectorAll('div')] // [<div>, <div>, <div>] 该运算符主要用于函数调用. function push(

es6扩展运算符 (...)

扩展即展开,例如 var arr = [2,3,4] console.log(...arr) //2 3 4 这样就可以用于数组的添加,代码会优雅很多 console.log([1, ...arr ,5]) //2[1, 2, 3, 4, 5] 也可以通过push,将一个数组添加另一个数组的尾部 es5 var arr1 = [0, 1, 2]; var arr2 = [3, 4, 5]; Array.prototype.push.apply(arr1, arr2); console.log(a

es6~扩展运算符(未完)

扩展运算符 含义 扩展运算符(spread)是三个点(...).它好比 rest 参数的逆运算,将一个数组转为用逗号分隔的参数序列. console.log(...[1, 2, 3]) //1 2 3 console.log(1, ...[2, 3, 4], 5) //1 2 3 4 5 [...document.querySelectorAll('div')] //[<div>, <div>, <div>] 该运算符主要用于函数调用. function push(ar

es6~扩展运算符后续

对象的扩展运算符 扩展运算符(...).ES2018 将这个运算符引入了对象. 解构赋值 对象的解构赋值用于从一个对象取值,相当于将目标对象自身的所有可遍历的(enumerable).但尚未被读取的属性,分配到指定的对象上面.所有的键和它们的值,都会拷贝到新对象上面. let { x, y, ...z } = { x: 1, y: 2, a: 3, b: 4 }; x // 1 y // 2 z // { a: 3, b: 4 } 上面代码中,变量z是解构赋值所在的对象.它获取等号右边的所有尚未

ES6&quot;...&quot;扩展运算符

在数组中的应用 扩展运算符(spread)是三个点(...).它好比 rest 参数的逆运算,++将一个数组转为用逗号分隔的参数序列++. console.log(...[1, 2, 3]) // 1 2 3 console.log(1, ...[2, 3, 4], 5) // 1 2 3 4 5 [...document.querySelectorAll('div')] // [<div>, <div>, <div>] 扩展运算符与正常的函数参数可以结合使用,非常灵活

ES6扩展运算符(三点运算符)...的用法

1. 第一个叫做 展开运算符(spread operator),作用是和字面意思一样,就是把东西展开.可以用在array和object上都行. let a = [1,2,3]; let b = [0, ...a, 4]; // [0,1,2,3,4] let obj = { a: 1, b: 2 }; let obj2 = { ...obj, c: 3 }; // { a:1, b:2, c:3 } let obj3 = { ...obj, a: 3 }; // { a:3, b:2 } 2.

ES6拓展运算符(...)用例

1.找出数组中最大的数 使用Math.max()函数来获取最大值,数组是不能直接作为Math.max()的参数,我们需要把它展开.在ES6之前,我们也是需要结合apply来处理: var arr = [2, 4, 8, 6, 0]; function max(arr) { return Math.max.apply(null, arr); } console.log(max(arr)); 使用ES6扩展运算符(...) var arr = [2, 4, 8, 6, 0]; console.log