扩展运算符的作用及使用场景

类别：js / 日期：2022-12-12 / 浏览：297 / 评论：0

（1）对象扩展运算符 

对象的扩展运算符(...)用于取出参数对象中的所有可遍历属性，拷 贝到当前对象之中。

上述方法实际上等价于:

Object.assign 方法用于对象的合并，将源对象（source）的所有可 枚举属性，复制到目标对象（target）。Object.assign 方法的第一 个参数是目标对象，后面的参数都是源对象。(如果目标对象与源对 象有同名属性，或多个源对象有同名属性，则后面的属性会覆盖前面 的属性)。-运算符

同样，如果用户自定义的属性，放在扩展运算符后面，则扩展运算符 内部的同名属性会被覆盖掉。

利用上述特性就可以很方便的修改对象的部分属性。在 redux 中的 reducer 函数规定必须是一个纯函数，reducer 中的 state 对象要求 不能直接修改，可以通过扩展运算符把修改路径的对象都复制一遍， 然后产生一个新的对象返回。-扩展运算符

需要注意：扩展运算符对对象实例的拷贝属于浅拷贝。

（2）数组扩展运算符

数组的扩展运算符可以将一个数组转为用逗号分隔的参数序列，且每 次只能展开一层数组。

下面是数组的扩展运算符的应用：

将数组转换为参数序列

复制数组

要记住：扩展运算符(…)用于取出参数对象中的所有可遍历属性，拷 贝到当前对象之中，这里参数对象是个数组，数组里面的所有对象都 是基础数据类型，将所有基础数据类型重新拷贝到新的数组中。

合并数组

如果想在数组内合并数组，可以这样：

扩展运算符与解构赋值结合起来，用于生成数组

需要注意：如果将扩展运算符用于数组赋值，只能放在参数的最后一 位，否则会报错。

将字符串转为真正的数组

任何 Iterator 接口的对象，都可以用扩展运算符转为真正的数组

比较常见的应用是可以将某些数据结构转为数组：

用于替换 es5 中的 Array.prototype.slice.call(arguments)写法。

使用 Math 函数获取数组中特定的值