JavaScript的ES6中的省略号是展开运算符（ ...）

2021-06-02 乐帮网

javascript

展开运算符做为JavaScript ES6标准中一项重要改进语法,我们必须掌握，虽着ES6的普及，越来越多的第三方库使用这种语法，我也从网上搜索了常见的用法做一个汇总。
首先说一下它的语法形式。const myArray = ['item', ...anotherItem]; 它的表现为半个省略号（...），名称是："展开运算"，首先从名称上理解它关键字【展开】+【运算】。

（1）代表省略的元素对象

 let page = { "title": "home", "url": "https://lebang2020.cn" };
 let authpage = { "user":"admin", ...page };
 console.log(authpage);
// Object { user: "admin", title: "home", url: "https://lebang2020.cn" }

这种理解可以放到数组中例如：

let pages = ['p1.html','p2.html','p3.html','p4.html','p5.html','p6.html'];
let mypages = ['p7.html',...pages]
console.log(mypages);
//Array(7) [ "p7.html", "p1.html", "p2.html", "p3.html", "p4.html", "p5.html", "p6.html" ]

以上用法多表现在赋值当中。

（2）参数占位符

 const fun = (...args) => { console.log('length is:' + args.length + ' and first one is:' + args[0]); };
 fun(1,2);
//length is:2 and first one is:1

（3）拆分字符串

   const site = 'https://lebang2020.cn';
        let chars = {...site};
        console.log(chars);
//Object { 0: "h", 1: "t", 2: "t", 3: "p", 4: "s", 5: ":", 6: "/", 7: "/", 8: "l", 9: "e", … }

以上就是它的主要用法，当然使用方法1的特性可以合并数组和对象。

关注我的微信公众号
在公众号里留言交流
投稿邮箱：1052839972@qq.com

庭院深深深几许？杨柳堆烟，帘幕无重数。
玉勒雕鞍游冶处，楼高不见章台路。
雨横风狂三月暮。门掩黄昏，无计留春住。
泪眼问花花不语，乱红飞过秋千去。

如果感觉对您有帮助
欢迎向作者提供捐赠
这将是创作的最大动力