登录
首页 >  文章 >  前端

展开运算符是什么?JS中怎么用

时间:2025-12-26 23:16:06 408浏览 收藏

小伙伴们有没有觉得学习文章很有意思?有意思就对了!今天就给大家带来《展开运算符是什么?JS中怎么用》,以下内容将会涉及到,若是在学习中对其中部分知识点有疑问,或许看了本文就能帮到你!

展开运算符(...)用于将可迭代对象或对象打散为独立元素,支持数组复制合并、函数调用传参、对象浅拷贝与属性合并,但仅限一层浅拷贝,不支持null、undefined及非可迭代对象。

什么是展开运算符_Javascript中它有什么用

展开运算符(Spread Operator)是 JavaScript 中的三个点 ...,它能把可迭代对象(如数组、字符串、类数组)或对象“打散”成独立的元素,常用于复制、合并、函数调用等场景。

数组的展开:快速复制与拼接

展开运算符能将数组“铺开”,避免使用 slice()concat() 等传统方法。

  • 复制数组:const newArr = [...oldArr]; —— 创建浅拷贝,不修改原数组
  • 合并数组:const combined = [...arr1, ...arr2, 4, 5]; —— 比 concat() 更直观,还能插入单个值
  • 解构时展开剩余项:const [first, ...rest] = [1, 2, 3, 4]; —— rest 得到 [2, 3, 4]

函数调用:替代 apply()

以前需用 func.apply(null, arr) 把数组作为参数传入,现在直接用展开更简洁:

  • Math.max(...[3, 7, 2]);7Math.max() 不接受数组)
  • console.log(...['a', 'b']); → 输出 a b,而非 ['a', 'b']

对象展开:浅拷贝与合并属性

对象展开在 ES2018 中正式支持,常用于配置合并或默认值设置:

  • 浅拷贝对象:const newObj = { ...oldObj };
  • 合并对象:const merged = { ...defaults, ...userInput }; —— 后面的属性覆盖前面的
  • 添加/覆盖属性:const updated = { ...obj, id: 100, name: 'new' };

注意:它不是万能的,也有局限

展开运算符只做一层浅拷贝,嵌套对象仍共享引用;不能直接展开 nullundefined;也不能用于非可迭代对象(如普通对象在数组展开中会报错,但对象展开语法本身支持对象)。

不复杂但容易忽略。

到这里,我们也就讲完了《展开运算符是什么?JS中怎么用》的内容了。个人认为,基础知识的学习和巩固,是为了更好的将其运用到项目中,欢迎关注golang学习网公众号,带你了解更多关于的知识点!

相关阅读
更多>
最新阅读
更多>
课程推荐
更多>