写点什么

JavaScript 里三个点 ...,可不是省略号啊···

  • 2022 年 8 月 08 日
  • 本文字数:1056 字

    阅读完需:约 3 分钟

JavaScript 里三个点 ...,可不是省略号啊···

本文分享自华为云社区《JavaScript 里三个点 ...的用法》,作者: Jerry Wang 。

静止参数


使用 rest 参数,我们可以将任意数量的参数收集到一个数组中,然后用它们做我们想做的事情。引入了其余参数以减少由参数引起的样板代码。


function myFunc(a, b, ...args) {
console.log(a); // 22
console.log(b); // 98
console.log(args); // [43, 3, 26]
};
myFunc(22, 98, 43, 3, 26);
复制代码


在 myFunc 的最后一个以 ...为前缀的参数中,这将导致所有剩余的参数都放在 javascript 数组中。


rest 参数收集所有剩余的参数,因此在最后一个参数之前添加 rest 参数是没有意义的。其余参数必须是最后一个形参。


rest 参数可以解构(仅限数组),这意味着它们的数据可以解包为不同的变量。


function myFunc(...[x, y, z]) {
return x * y* z;
}
myFunc(1) // NaN
myFunc(1, 2, 3) // 6
myFunc(1, 2, 3, 4) // 6 (fourth parameter is not destructured)
复制代码

点差运算符


展开运算符用于将可迭代对象(如数组)的元素扩展到可以容纳多个元素的位置。


function myFunc(x, y, ...params) { // used rest operator here
console.log(x);
console.log(y);
console.log(params);
}
var inputs = ["a", "b", "c", "d", "e", "f"];
myFunc(...inputs); // used spread operator here
// "a"
// "b"
// ["c", "d", "e", "f"]
复制代码


一直有多种组合数组的方法,但是扩展运算符提供了一种用于组合数组的新方法:


const featured = ['Deep Dish', 'Pepperoni', 'Hawaiian'];
const specialty = ['Meatzza', 'Spicy Mama', 'Margherita'];
const pizzas = [...featured, 'veg pizza', ...specialty];
console.log(pizzas); // 'Deep Dish', 'Pepperoni', 'Hawaiian', 'veg pizza', 'Meatzza', 'Spicy Mama', 'Margherita'
复制代码


使用扩展运算符,现在可以使用比 Object.assign() 更短的语法进行浅克隆(不包括原型)或合并对象。


var obj1 = { foo: 'bar', x: 42 };
var obj2 = { foo: 'baz', y: 13 };
var clonedObj = { ...obj1 };
// Object { foo: "bar", x: 42 }
var mergedObj = { ...obj1, ...obj2 };
// Object { foo: "baz", x: 42, y: 13 }
复制代码

总结


当我们在代码中看到三个点 (...) 时,它要么是 rest 参数,要么是展开运算符。


有一个简单的方法来区分它们:


  • 当三个点 (...) 位于函数参数的末尾时,它是“rest 参数”并将参数列表的其余部分收集到一个数组中。

  • 当三个点 (...) 出现在函数调用或类似函数中时,它被称为“扩展运算符”并将数组扩展为 list.


点击关注,第一时间了解华为云新鲜技术~

发布于: 刚刚阅读数: 3
用户头像

提供全面深入的云计算技术干货 2020.07.14 加入

华为云开发者社区,提供全面深入的云计算前景分析、丰富的技术干货、程序样例,分享华为云前沿资讯动态,方便开发者快速成长与发展,欢迎提问、互动,多方位了解云计算! 传送门:https://bbs.huaweicloud.com/

评论

发布
暂无评论
JavaScript 里三个点 ...,可不是省略号啊···_JavaScript_华为云开发者联盟_InfoQ写作社区