js浅拷贝的方法

JavaScript中实现浅拷贝的主要方法包括：1. 使用扩展运算符（...）进行对象和数组的浅拷贝，语法简洁但仅复制第一层；2. Object.assign()将源对象属性复制到新对象，同样只处理一级嵌套；3. 数组的slice()、concat()、map()等方法可返回新数组，实现浅拷贝，但对象元素仍为引用；4. 手动遍历赋值通过for...in或Object.keys逐个复制属性，灵活性高。所有方法均不深拷贝嵌套对象，修改深层属性会影响原对象。

JavaScript 中实现浅拷贝的方法有多种，适用于不同场景。浅拷贝指的是创建一个新对象，其属性值是原对象的引用（如果是引用类型），基本数据类型则直接复制值。

1. 使用扩展运算符（Spread Operator）

ES6 提供的扩展运算符是最常见、最简洁的浅拷贝方式，适用于数组和对象。

const obj = { a: 1, b: { c: 2 } };

const copy = { ...obj };

const arr = [1, 2, { x: 3 }];

const copyArr = [...arr];

注意：嵌套对象仍然是引用，修改 copy.b.c 会影响原对象中的 b.c。

2. Object.assign()

该方法用于将所有可枚举属性的值从一个或多个源对象复制到目标对象，返回新对象。

const original = { name: "Tom", info: { age: 25 } };

const cloned = Object.assign({}, original);

同样，只复制一层，深层属性为引用共享。

3. 数组的 slice()、concat()、filter()、map()

这些数组方法在不传参或特定使用时会返回一个新数组，实现浅拷贝。

• slice(): const newArr = arr.slice();
• concat(): const newArr = arr.concat();
• map(): const newArr = arr.map(x => x);（适合需要转换的情况）

对包含对象的数组，元素仍为引用。

闪念贝壳

闪念贝壳是一款AI 驱动的智能语音笔记，随时随地用语音记录你的每一个想法。

53

查看详情

4. 手动遍历赋值

通过 for...in 或 Object.keys 遍历属性并逐个复制，也是浅拷贝的一种实现方式。

const shallowCopy = (obj) => {

  const result = {};

  for (let key in obj) {

    if (obj.hasOwnProperty(key)) {

      result[key] = obj[key];

    }

  }

  return result;

};

这种方式更灵活，可控制是否复制原型链上的属性。

基本上就这些常用方法。选择哪种取决于你的代码环境和需求，比如是否支持 ES6、操作的是数组还是对象。关键是记住：它们都只拷贝第一层，深层引用保持不变。

以上就是js浅拷贝的方法的详细内容，更多请关注php中文网其它相关文章！