标签：ES6 console log ... 运算符 spread let var 写法

spread操作符(...)

1.数组使用扩展运算符

例子1：

let a = [1,2];
let b = ['a','b'];
let c = a.concat(b);//老写法
console.log(c);//[1,2,'a','b]
//新写法  在数组里面能扩展的值是可迭代的
let d = [...a,...b];
console.log(d);//[1,2,'a','b]

例子2：

let s = 'hello word';
s.split(');//[...s] 拆分[ "h", "e", "l", "l", "o", " ", "w", "o", "r", "l","d"]
console.log([1,2,...s,3,4]);[1, 2, "h", "e", "l", "l", "o", " ", "w", "o", "r", "l","d", 3, 4]

例子3：把类数组的对象转为数组

//老写法
let ps = Array.prototype.slice.call(document.querySelectorAll('p'));
console.log(ps);//[p,p,p,p]
//新写法
let p2 = [...document.querySelectorAll('p')];
console.log(ps2);//[p,p,p,p]

2.对对象使用扩展运算符

例子1：

var a = {x:1,y:2};
var copy = {};
//老写法
for(var key in a){
    copy[key] = a[key];  
}
console.log(copy);//{x:1,y:2}
//新写法
let copy2 = {...a};
console.log(copy2);//{x:1,y:2}

例子2：

var obj1 = {x:1,y:2,z:3};
var obj2 = {type:'cat',age:1,z:'abc'};
//老写法
var m = Obeject.assign({},obj1,obj2);
console.log(m);//{x: 1, y: 2, z: "abc", type: "cat", age: 1}
//新写法
let m2 = {x:100,...obj1,...obj2,y:200};
console.log(m2);//x: 1, y: 2, z: "abc", type: "cat", age: 1}

例子3：动态key

var x = 'type';
//老写法
var video = {
   src:'1.mp4',
   x:1
};
vide[x] = 2;
console.log(video);//{src:'1.mp4',x:1,type:2}
//新写法
let video2 = {
   src:'1.mp4',
   [x]:'动漫'
}
console.log(video2);//{src:'1.mp4',type:'动漫'}

标签：ES6,console,log,...,运算符,spread,let,var,写法
来源： https://www.cnblogs.com/chenhuaiyou/p/15243701.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。