js中的展开运算符(扩展运算符)
⽂章⽬录
前⾔
我们现在经常接触到js的⼀个…运算符,被称为展开运算符由于我对这个不是很熟练所以,打算写下⼀篇⼩⽂章记录⼀下
提⽰:以下是本篇⽂章正⽂内容,下⾯案例可供参考
⼀、…对于数组的⽤法
let arr=[1,2,3]
// 展开⼀个数组
console.log(...arr)
console.log("-----------");
// 复制⼀个数组,也称为拷贝数组
let arr2=[...arr]
arr2.push(4);
// 并且不会对arr造成影响
console.log("arr",arr);
console.log("arr2",arr2);
console.log("-----------");
// 连接数组
let arr3=[...arr,...arr2]
console.log(arr3);
⼆、…在函数中的使⽤
//对于不确定传多少个值也可以使⽤扩展运算符
function add(...numbers){
return numbers
}
// 这样在你传值的时候可以⼀直增加,从此再也不⽤关⼼形参的多少!
console.log(add(1,2,3,4,5));
如果我们要对这个numbers操作,需要了解⼀些js对于数组的操作,reduce,filter巴拉巴拉的,有时间也会更新⼀篇的。
三、…对于对象的使⽤
⾸先强调⼀点,扩展运算符不能直接⽤于对象,也就是不⽤去想展开对象
虽然代码上并没有报错,但是控制台并不能输出
所以我们可以构造字⾯量对象时使⽤展开语法
var obj1 ={ foo:'yuan', x:42};
var obj2 ={ foo:'li', y:13};
// 克隆对象⼀定要加上{}
var clonedObj ={...obj1 };
console.log("克隆后的对象",clonedObj);
console.log("-----------");
// 同样的修改复制后的并不会影响原来的对象
clonedObj.foo="ss"
console.log("clonedObj",clonedObj);
console.log("obj1",clonedObj);
js合并两个数组console.log("-----------");
// 合并后的对象:
var mergedObj ={...obj1,...obj2}
console.log("合并后的对象",mergedObj);
console.log("-----------");
// 当然也可以在合并时添加新的属性
var mergedObj ={...obj1,...obj2,address:"上海"}
console.log("合并后的对象",mergedObj)
总结
以上就是对扩展语法的⼀些细⼩的总结.

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。