杰网资源 Design By www.escxy.com

展开运算符(spread operator)允许一个表达式在某处展开。展开运算符在多个参数(用于函数调用)或多个元素(用于数组字面量)或者多个变量(用于解构赋值)的地方可以使用。

let obj1 = {
 value1: 1,
 value2: 2
};
let obj2 = {...obj1
};
console.log(obj2); // {value1: 1, value2: 2}

上面的用法实际相当于

obj2 = {value1: 1, value2: 2}

展开运算符的写法与obj2 = obj1直接赋值的写法的区别在于如果直接赋值的话,对于引用类型来说,相当于只是赋值了obj1的内存空间地址,当obj2发生改变的时候,obj1也会随着发生改变。而是用展开运算符写法的话,由于obj1对象中的属性类型都是基本类型,相当于重新创建了一个对象,此时obj2发生改变的时候,并不会影响obj1这个对象。但是仅限于其属性都为基本类型的情况(或者说只进行了一层的深拷贝)。如果该对象中的属性还有引用类型的话,修改属性中引用类型的值,则两个对象的属性值都会被修改。

let obj1 = {
 attri1: [3, 6, 0],
 attri2: 4,
 attri4: 5
};
let obj2 = {...obj1
};

obj2.attri2 = 888;
obj2.attri1[0] = 7;

console.log('obj1:', obj1);
console.log('obj2:', obj2);

展开运算符的应用

1.在函数中使用展开运算符

function test(a, b, c){};

let arr = [1, 2, 3];
test(...arr);

2.数组字面量中使用展开运算符

let arr1 = [1, 2];
let arr2 = [...arr1, 3, 4]; // [1, 2, 3, 4]

// 使用push方法
let arr1 = [1, 2];
let arr2 = [3. 4];
arr1.push(...arr2); // [1, 2, 3, 4]

3.用于解构赋值,解构赋值中展开运算符只能用在最后,否则会报错。

// 解构赋值中展开运算符只能用在最后。
let [a, b, ...c] = [1, ,2, 3, 4]
console.log(a, b, c) // 1, 2, [3, 4]

4.类数组变成数组

let oLis = document.getElementsByTagName("li");
let liArr = [...oLis];

5.对象中使用展开运算符
ES7中的对象展开运算符符可以让我们更快捷地操作对象:

let {x,y,...z}={x:1,y:2,a:3,b:4};
x; // 1
y; // 2
z; // {a:3,b:4}

将一个对象插入另外一个对象当中:

let z={a:3,b:4};
let n={x:1,y:2,...z};
console.log(n); //{x:1,y:2,a:3,b:4}

合并两个对象:

let a={x:1,y:2};
let b={z:3};
let ab={...a,...b};
console.log(ab); // {x:1,y:2,z:3}
标签:
js展开运算符,js运算符

杰网资源 Design By www.escxy.com
广告合作:本站广告合作请联系QQ:858582 申请时备注:广告合作(否则不回)
免责声明:本站文章均来自网站采集或用户投稿,网站不提供任何软件下载或自行开发的软件! 如有用户或公司发现本站内容信息存在侵权行为,请邮件告知! 858582#qq.com
杰网资源 Design By www.escxy.com

RTX 5090要首发 性能要翻倍!三星展示GDDR7显存

三星在GTC上展示了专为下一代游戏GPU设计的GDDR7内存。

首次推出的GDDR7内存模块密度为16GB,每个模块容量为2GB。其速度预设为32 Gbps(PAM3),但也可以降至28 Gbps,以提高产量和初始阶段的整体性能和成本效益。

据三星表示,GDDR7内存的能效将提高20%,同时工作电压仅为1.1V,低于标准的1.2V。通过采用更新的封装材料和优化的电路设计,使得在高速运行时的发热量降低,GDDR7的热阻比GDDR6降低了70%。