原始值与参考值

Question

我读了一本名为“面向 Web 开发人员的专业 Javascript”的书，它说：“变量由参考值或原始值分配。参考值是存储在内存中的对象”。然后它没有说明原始值是如何存储的。所以我猜它没有存储在内存中。基于此，当我有这样的脚本时：

var foo = 123;

Javascript 如何记住foo 变量以供以后使用？

Answer 1

好的，把你的变量想象成一张纸——一张便签。

注 1：变量是便签。

现在，便签非常小。你只能在上面写一点点信息。如果你想写更多的信息，你需要更多的便签，但这不是问题。想象一下，您有无穷无尽的便签。

注意 2：您有一个无尽的便签供应，其中存储少量信息。

太好了，你可以在便签上写什么？我会写：

1. 是或否（布尔值）。
2. 我的年龄（一个数字）。
3. 我的名字（字符串）。
4. 什么都没有（undefined）。
5. 涂鸦或其他对我来说毫无意义的东西（null）。

所以我们可以在便签上写一些简单的东西（让我们居高临下，称它们为原始东西）。

注意事项 3：您可以在便签上写原始的东西。

假设我在便利贴上写了30，提醒自己为今晚在我家举办的小聚会买 30 片奶酪（我的朋友很少）。

当我去冰箱贴便利贴时，我看到我妻子在冰箱上贴了另一张便利贴，上面也写着30（提醒我她的生日是本月 30 日）。

问：两个便签是否传达相同的信息？

答：是的，他们都说30。我们不知道是 30 片奶酪还是每月的第 30 天，坦率地说，我们不在乎。对于一个不知道更好的人来说，一切都一样。

var slicesOfCheese = 30;
var wifesBirthdate = 30;

alert(slicesOfCheese === wifesBirthdate); // true

注 4： 两个写有相同内容的便签传达相同的信息，即使它们是两个不同的便签。

今晚我真的很兴奋 - 和老朋友一起出去玩，玩得很开心。然后我的一些朋友打电话给我说他们不能参加聚会了。

所以我走到冰箱前，将便签上的 30 擦掉（不是我妻子的便签 - 这会让她很生气），然后把它改成 20。

注意事项 5：您可以擦除便签上的内容并写下其他内容。

问：这一切都很好，但是如果我的妻子想在我出去买奶酪的时候写一份杂货清单让我去拿怎么办。她需要为每件物品写一个便签吗？

答：不，她会拿一长串纸，然后在纸上写下杂货清单。然后她会写一个便条告诉我在哪里可以找到杂货清单。

那么这里发生了什么？

1. 杂货清单显然不是简单（erm...原始）数据。
2. 我妻子把它写在一张更长的纸上。
3. 她在便签中写下了在哪里可以找到它。

亲爱的，杂货清单在你的键盘下。

回顾一下：

1. 实际对象（杂货清单）在我的键盘下。
2. 便签告诉我在哪里可以找到它（对象的地址）。

注意 6： 引用值是对对象的引用（可以找到它们的地址）。

问：我们如何知道两张便利贴说的是同一件事？假设我的妻子制作了另一个购物清单，以防我放错了第一个，并为它写了另一个便利贴。两个列表都说同样的事情，但便利贴说同样的事情吗？

答：不。第一个便笺告诉我们在哪里可以找到第一个列表。第二个告诉我们在哪里可以找到第二个列表。两个列表是否说同样的话并不重要。它们是两个不同的列表。

var groceryList1 = ["1 dozen apples", "2 loaves of bread", "3 bottles of milk"];
var groceryList2 = ["1 dozen apples", "2 loaves of bread", "3 bottles of milk"];

alert(groceryList1 === groceryList2); // false

注意事项 7：只有当两个便笺引用同一个对象时，它们才能传达相同的信息。

这意味着如果我的妻子做了两张便签提醒我购物清单在哪里，那么这两张便签包含相同的信息。所以这个：

亲爱的，杂货清单在你的键盘下。

包含与以下相同的信息：

不要忘记杂货清单在您的键盘下方。

在编程方面：

var groceryList1 = ["1 dozen apples", "2 loaves of bread", "3 bottles of milk"];
var groceryList2 = groceryList1;

alert(groceryList1 === groceryList2); // true

这就是您需要了解的关于 JavaScript 中的 primitives 和 references 的全部内容。无需进入 heap 和动态内存分配之类的东西。如果您使用 C/C++ 编程，这一点很重要。

编辑 1： 哦，重要的是，当您传递变量时，您实际上是在传递 原始 值 按值 和参考值参考。

这只是一种复杂的说法，即您正在将写在一张便签上的所有内容复制到另一个上（无论您是复制 primitive 值还是 参考）。

复制引用时，被引用的对象不会移动（例如，我妻子的购物清单将始终留在我的键盘下，但我可以将复制的便签带到任何我想要的地方 - 原始便签仍然会在冰箱）。

编辑 2：回应@LacViet 发表的评论：

首先，我们谈论的是 JavaScript，而 JavaScript 没有 stack 或 heap。它是一种动态语言，JavaScript 中的所有变量都是动态的。为了解释差异，我将其与 C 进行比较。

考虑以下 C 程序：

#include <stdio.h>

int main() {
    int a = 10;
    int b = 20;
    int c = a + b;
    printf("%d", c);
    return 0;
}

当我们编译这个程序时，我们会得到一个可执行文件。可执行文件分为多个段（或节）。这些段包括堆栈段、代码段、数据段、额外段等。

1. 堆栈段用于在调用函数或中断处理程序时存储程序的状态。例如，当函数f 调用函数g 时，函数f 的状态（当时寄存器中的所有值）将保存在堆栈中。当g 将控制权返回给f 时，这些值就会恢复。
2. 代码段包含要由处理器执行的实际代码。它包含一系列处理器必须执行的指令，例如add eax, ebx（其中add 是操作码，eax 和ebx 是参数）。该指令将寄存器eax和ebx的内容相加，并将结果存储在寄存器eax中。
3. 数据段用于为变量保留空间。例如，在上面的程序中，我们需要为整数a、b和c预留空间。另外，我们还需要为字符串常量"%d"预留空间。因此，保留的变量在内存中具有固定地址（在链接和加载之后）。
4. 除了所有这些之外，操作系统还为您提供了一点额外空间。这称为堆。您需要的任何额外内存都是从该空间分配的。以这种方式分配的内存称为动态内存。

我们来看一个动态内存的程序：

#include <stdio.h>
#include <malloc.h>

int main() {
    int * a = malloc(3 * sizeof(int));

    a[0] = 3;
    a[1] = 5;
    a[2] = 7;

    printf("a: %d\nb: %d\nc: %d\n", a[0], a[1], a[2]);

    return 0;
}

因为我们想要动态分配内存，我们需要使用指针。这是因为我们要使用同一个变量来指向任意内存位置（不一定每次都同一个内存位置）。

因此我们创建了一个名为 a 的 int 指针 (int *)。 a 的空间是从数据段分配的（即它不是动态的）。然后我们调用malloc 为堆中的 3 个整数分配连续空间。返回第一个int的内存地址，存放在指针a中。

问：我们学到了什么？

答：为所有变量分配固定数量的空间。每个变量都有一个固定地址。我们还可以从堆中分配额外的内存，并将这些额外内存的地址存储在一个指针中。这称为动态内存方案。

从概念上讲，这类似于我解释的关于变量是便签的内容。所有变量（包括指针都是便签）。然而，指针是特殊的，因为它们引用一个内存位置（这就像在 JavaScript 中引用一个对象）。

但是，相似之处就到此为止了。以下是区别：

1. 在 C 中，所有内容都按值传递（包括指针中的地址）。要传递引用，您需要通过指针使用间接。 JavaScript 仅按值传递原语。传递引用由引擎透明地处理，就像传递任何其他变量一样。
2. 在 C 语言中，您可以创建指向原始数据类型的指针，例如 int。在 JavaScript 中，您不能创建对像 number 这样的原始值的引用。所有基元始终按值存储。
3. 在 C 语言中，您可以对指针执行各种操作。这称为指针算术。 JavaScript 没有指针。它只有参考。因此，您无法执行任何指针运算。

除了这三个之外，C 和 JavaScript 最大的区别在于 JavaScript 中的所有变量实际上都是指针。由于 JavaScript 是一种动态语言，因此可以使用相同的变量在不同的时间点存储 number 和 string。

JavaScript 是一种解释型语言，解释器通常是用 C++ 编写的。因此，JavaScript 中的所有变量都映射到宿主语言中的对象（甚至是原语）。

当我们在 JavaScript 中声明一个变量时，解释器会为它创建一个新的通用变量。然后，当我们为它分配一个值（无论是原始值还是引用）时，解释器只需为其分配一个新对象。在内部，它知道哪些对象是原始对象，哪些是实际对象。

从概念上讲，这就像做这样的事情：

JSGenericObject ten = new JSNumber(10); // var ten = 10;

问：这是什么意思？

答：这意味着JavaScript中的所有值（基元和对象）都是从堆中分配的。甚至变量本身也是从堆中分配的。说原语是从堆栈中分配的，而只有对象是从堆中分配的，这是错误的。这是 C 和 JavaScript 最大的区别。

Answer 2

variable 可以保存以下两种值类型之一：primitive values 或 reference values。

• Primitive values 是存储在堆栈上的数据。
• Primitive value 直接存储在变量访问的位置。
• Reference values 是存储在堆中的对象。
• 变量 location 中存储的Reference value 是指向内存中存储对象的位置的指针。
• 原始类型包括Undefined、Null、Boolean、Number 或String。

基础知识：

对象是属性的集合。属性可以引用object 或primitive。 Primitives are values，它们没有属性。

更新：

JavaScript 有 6 种原始数据类型：String、Number、Boolean、Null、Undefined 、符号（ES6 中的新功能）。除了 null 和 undefined 之外，所有原始值都有对象等价物，它们环绕原始值，例如String 对象环绕一个字符串原语。所有原语都是不可变的。

Answer 3

在 javascript 中，Primitive values 是存储在stack 上的数据。

Primitive value 直接存储在变量访问的位置。

而Reference values 是存储在heap 中的对象。

存储在变量 location 中的参考值是指向内存中存储对象的位置的指针。

JavaScript 支持五种原始数据类型：number, string, Boolean, undefined, and null。

这些类型被称为原始类型，因为它们是可以构建更复杂类型的基本构建块。

在这五个中，只有number, string, and Boolean 是实际存储数据意义上的真实数据类型。

Undefined and null 是在特殊情况下出现的类型。 primitive type 在内存中具有固定大小。 比如一个数字占用8个字节的内存，一个布尔值只能用一位来表示。

并且引用类型可以是任意长度——它们没有固定的大小。

Answer 4

原始类型在内存中具有固定大小。例如，一个数字占用 8 个字节的内存，一个布尔值可以只用一位来表示。数字类型是最大的原始类型。如果每个 JavaScript 变量保留 8 个字节的内存，则该变量可以直接保存任何原始值。

这是一种过度简化，并不打算作为对实际 JavaScript 实现的描述。

但是，引用类型是另一回事。例如，对象可以是任意长度——它们没有固定的大小。数组也是如此：数组可以有任意数量的元素。同样，一个函数可以包含任意数量的 JavaScript 代码。由于这些类型没有固定的大小，因此它们的值不能直接存储在与每个变量关联的八字节内存中。相反，该变量存储对该值的引用。通常，此引用是某种形式的指针或内存地址。它不是数据值本身，而是告诉变量在哪里寻找值。

原始类型和引用类型之间的区别很重要，因为它们的行为不同。考虑以下使用数字（原始类型）的代码：

var a = 3.14;  // Declare and initialize a variable
var b = a;     // Copy the variable's value to a new variable
a = 4;         // Modify the value of the original variable
alert(b)       // Displays 3.14; the copy has not changed

这段代码没有什么奇怪的。现在考虑如果我们稍微改变一下代码，让它使用数组（一种引用类型）而不是数字会发生什么：

var a = [1,2,3];  // Initialize a variable to refer to an array
var b = a;        // Copy that reference into a new variable
a[0] = 99;        // Modify the array using the original reference
alert(b);         // Display the changed array [99,2,3] using the new reference

如果您对这个结果并不感到惊讶，那么您已经非常熟悉原始类型和引用类型之间的区别了。如果它看起来确实令人惊讶，请仔细查看第二行。请注意，在此语句中分配的是对数组值的引用，而不是数组本身。在第二行代码之后，我们仍然只有一个数组对象；我们只是碰巧有两个引用它。

Answer 5

正如在接受的答案和投票最高的答案中已经提到的，原始值是存储在堆栈中的数据，参考值是存储在堆中的对象。

但这实际上意味着什么？它们在您的代码中的表现有何不同？

原始值是按值访问的。因此，当您将具有原始值的变量 (var a) 分配给另一个变量 (var b) 时，变量 (a) 的值将被复制到新变量 (b) 中。而当你改变新变量（b）的值时，原变量的值保持不变。

当您将具有引用值的变量 (var x) 分配给另一个变量 (var y) 时，存储在变量 (x) 中的值也会被复制到新变量 (y) 中。不同之处在于存储在两个变量中的值现在是存储在堆中的实际对象的引用。这意味着 x 和 y 都指向同一个对象。所以当你改变新变量（y）的值时，原来有价值的（x）的值也会改变（因为堆中的实际对象改变了）。

Answer 6

原始值是在语言实现的最低级别表示的数据，在 JavaScript 中是以下类型之一：数字、字符串、布尔值、未定义和空值。

Answer 7

原始与参考：

变量是 javascript 引擎保留用于保存数据的内存 (RAM) 段。在这些变量中可以存储 2 种值：

• 实际数据：例如字符串或数字。这意味着实际内存（即内存中的字节）保存数据本身。
• 对对象的引用： 例如 Array 对象或 Function 对象。这意味着该变量只是持有对该对象所在内存中另一个位置的引用。

原始值和参考值的区别：

当一个原始值被分配给一个变量时，数据（位的值）刚刚被复制。例如：

原始值：

let num1 = 10;

// What happens here is that the bits which are stored in the memory container 
// (i.e. variable num1) are literally copied into memory container num2
let num2 = num1;

参考值：

let objRef1 = {prop1: 1}

// we are storing the reference of the object which is stored in objRef1
// into objRef2. Now they are pointing to the same object
let objRef2 = objRef1;

// We are manipulating the object prop1 property via the refernce which
// is stored in the variable objRef2
objRef2.prop1 = 2;

// The object which objRef1 was pointing to was mutated in the previous action
console.log(objRef1);