ES12 中的 Rest/Spread properties 是 ECMAScript 2021 标准中新增的一项功能，它允许我们在对象字面量中使用 ... 来引用对象的所有属性。Rest 和 Spread 属性都可以用于对象的操作，其中 Rest 属性用于从对象中提取一组属性，并将其合并为一个新的对象。而 Spread 属性则用于将一个对象的属性分解，拆成独立的属性，再将它们复制到一个新的对象中。
那么我们该如何使用这些新的语法特性呢？下面将详细介绍 ES12 中 Rest/Spread properties 的使用方法和示例代码。
Rest 属性
Rest 属性用来获取对象中剩余的属性，通常用于函数参数或对象的解构赋值中。使用 ... 后跟一个空对象 {}，可以获取对象的所有属性，将它们打包成一个新的对象。
函数参数的 Rest 应用
在 ES6 中，使用 Rest 参数可以传递任意数量的参数并被解析为一个数组。在 ES12 中，我们可以使用 Rest 属性实现类似的功能，但是可以将参数以对象的形式进行传递。
function testRestProperties(param1, param2, ...params) {
console.log(`param1: ${param1}`);
console.log(`param2: ${param2}`);
console.log(`params: ${params}`);
}
const obj = { name: 'Jacob', age: 25, address: 'Beijing', balance: 1000 };
testRestProperties(obj.name, obj.age, { ...obj, sum: obj.balance + 500 });上面的例子中，我们使用 Rest 属性在函数的最后一个参数上添加 ...params，获取函数调用过程中传递的所有额外参数。而在函数的调用过程中，我们使用了 Spread 属性，将 obj 对象中的所有属性打散传递给了 testRestProperties 函数。
对象解构的 Rest 应用
在对象字面量的解构赋值过程中，我们想要获取其中一些属性，但又希望将余下的属性集中起来生成一个新的对象。这时候就需要使用 Rest 属性。
const { name, age, ...infos } = obj;
console.log(`Name: ${name}`);
console.log(`Age: ${age}`);
console.log(`Infos: ${JSON.stringify(infos)}`);在上面的代码中，我们使用了 Rest 属性来解构 obj 对象，获取其中 name 和 age 两个属性，剩下的属性则被组成了一个新的对象 infos。这样，我们就可以非常方便地操作对象，并对不需要的属性进行过滤。
Spread 属性
Spread 属性允许我们在对象字面量中使用 ... 操作符，将一个对象的属性分解，解成独立的属性，并通过它们生成一个新的对象。
对象合并
我们可以用 Spread 属性将两个对象合并成一个新的对象。具体地，使用三个点 ... 将一个对象的所有属性打散，再通过 {} 将这些打散的属性组成一个新对象。
const obj1 = { name: 'Jacob', age: 25 };
const obj2 = { address: 'Beijing', balance: 1000 };
const mergedObj = { ...obj1, ...obj2 };
console.log(`Object 1: ${JSON.stringify(obj1)}`);
console.log(`Object 2: ${JSON.stringify(obj2)}`);
console.log(`Merged Object: ${JSON.stringify(mergedObj)}`);上面的代码中，我们定义了两个对象 obj1 和 obj2，然后使用 Spread 属性将它们合并成一个新的对象 mergedObj。这里使用 Spread 属性将已有的对象打散，生成了一个新的包含多个对象属性的对象。
复制对象
使用 Spread 属性还可以复制一个对象，并赋值给一个新的变量，而不是仅仅引用同一个对象。
const obj1 = { name: 'Jacob', age: 25, address: 'Beijing', balance: 1000 };
const obj2 = { ...obj1 };
console.log(`Object 1: ${JSON.stringify(obj1)}`);
console.log(`Object 2: ${JSON.stringify(obj2)}`);在上面的代码中，我们使用了 Spread 属性将 obj1 对象中的所有属性打散，实现了对 obj1 的复制，然后将它赋值给了 obj2 变量，并使用 console.log 输出了它们两个的值，观察输出结果可以发现，它们的值虽然相同，但是却是两个不同的对象。
总结
ES12 中的 Rest/Spread properties 提供了一种新的对象操作方式，能够方便地提取对象的部分属性或复制一个对象，并快速在对象字面量中操作属性。我们可以在代码中灵活使用它们，提高我们的代码效率和可读性。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/65927975eb4cecbf2d7424f9