JavaScript 按值传递对象

在 JavaScript 中，对象是按引用传递的，但是有时候我们希望按值传递。这篇文章将介绍如何按值传递对象，并提供一些示例。

什么是按值传递？

按值传递是指将对象复制到函数参数的新变量中，这样传递的是这个对象的副本，而不是这个对象的引用。

如何按值传递对象？

在 JavaScript 中，可以使用 Object.assign() 方法或者解构赋值来按值传递对象。

使用 Object.assign()

Object.assign() 方法可以将多个对象的属性合并到一个目标对象中，并返回这个目标对象。

示例代码如下：

function foo(obj) {
  const cloneObj = Object.assign({}, obj); // 创建对象的副本
  cloneObj.props = 'new value';
  console.log(cloneObj); // { props: 'new value' }
  console.log(obj); // { props: 'old value' }
}

const obj = { props: 'old value' };
foo(obj);

上述代码中，我们首先使用 Object.assign() 方法创建了一个新的对象 cloneObj，用于代替原始对象 obj，然后在副本对象上进行修改，保留原始对象的不变性。

使用解构赋值

解构赋值是一种从对象或数组中提取数据的方法。它允许您将对象中的值解构放到变量中。

示例代码如下：

function bar({ props }) { // 从对象中解构出所需属性
  props = 'new value';
  console.log(props); // 'new value'
}

const obj = { props: 'old value' };
bar({ ...obj }); // 创建对象的副本并传递
console.log(obj); // { props: 'old value' }

上述代码中，我们使用解构赋值将 props 属性从原始对象 obj 中提取出来，并将其修改为新的值。

小结

本文介绍了 JavaScript 中如何按值传递对象的方法，并提供了示例代码。对于需要保留原始对象不变性的情况，建议使用 Object.assign() 方法，而对于需要从对象中提取属性并修改的情况，可以使用解构赋值。