JavaScript 如何处理原始类型和对象的值传递和引用传递？-js教程-PHP中文网

JavaScript 如何处理原始类型和对象的值传递和引用传递？

Patricia Arquette

发布： 2024-12-18 12:54:11

原创

953 人浏览过

How Does JavaScript Handle Pass-by-Value and Pass-by-Reference with Primitive Types and Objects?

JavaScript 值传递与引用传递

在 JavaScript 中，所有变量都是按值传递，这意味着原始值的副本被创建并传递给函数。但是，当值是对象（例如数组或对象字面量）时，副本是对原始对象的引用。

对函数参数的影响

原语： 当原语（例如数字、字符串）传递给函数时，对函数所做的任何更改函数内的值仅限于函数的局部范围，不会影响函数外部的原始变量。
对象引用：当对象引用传递给函数时，函数内对对象属性所做的更改会反映在原始对象中，甚至在函数外部也是如此。

对外部变量的影响函数

按引用传递：对象引用通过引用传递，这意味着在函数内对对象属性所做的更改将影响原始对象的属性，但函数内对引用本身所做的任何更改（例如重新分配）不会影响原始引用变量。
按值传递：按值传递的原始值和对象引用不会影响函数外部的原始变量。

示例

function f(a, b, c) {
  a = 3; // Reassignment changes the local variable only.
  b.push("foo"); // Property change affects the original object.
  c.first = false; // Property change affects the original object.
}

const x = 4;
let y = ["eeny", "miny", "mo"];
let z = { first: true };
f(x, y, z);

console.log(x, y, z.first); // Output: 4, ["eeny", "miny", "mo", "foo"], false

登录后复制

在上面的示例中，b 和 c 对象的更改反映在

深入示例：

function f() {
  const a = ["1", "2", { foo: "bar" }];
  const b = a[1]; // Copy the reference to the original array element
  a[1] = "4"; // Change the value in the original array
  console.log(b); // Output: "2" (Original value of the copied reference)
}

登录后复制

在第一个示例中，即使 a 已被修改, b 仍然保留原始值，因为它是引用的副本。

function f() {
  const a = [{ yellow: "blue" }, { red: "cyan" }, { green: "magenta" }];
  const b = a[1]; // Copy the reference to the original object
  a[1].red = "tan"; // Change the property in the original object
  console.log(b.red); // Output: "tan" (Property change is reflected in both variables)
  b.red = "black"; // Change the property through the reference
  console.log(a[1].red); // Output: "black" (Property change is reflected in both variables)
}

登录后复制

在第二个示例中，更改为a[1].red 会影响 a 和 b，因为它们共享相同的对象引用。

创建独立副本

要创建对象的完全独立副本，您可以使用 JSON.parse() 和 JSON.stringify() 方法分别反序列化和序列化对象。例如：

const originalObject = { foo: "bar" };
const independentCopy = JSON.parse(JSON.stringify(originalObject));

登录后复制

以上是JavaScript 如何处理原始类型和对象的值传递和引用传递？的详细内容。更多信息请关注PHP中文网其他相关文章！