关于JavaScript中的堆、栈、引用和值的简单指南
让我们来看看JavaScript中的内存分配是如何工作的--包括堆、栈、引用和值。
在软件工程中,一般来说,一个常见的概念是引用与值的概念。JavaScript有一种有趣的方式来存储变量、对象和函数,误解它可能会导致进一步的混乱。开发人员需要知道这些概念是如何工作的,因为它是 JavaScript的基础。本文将介绍JavaScript是如何管理值和引用的,这在处理复杂的应用程序和网站时将会有所收获。
JavaScript中的内存存储
要理解我们说的JavaScript 存储值和引用是什么意思,我们需要了解JavaScript在哪里存储它们。有两个地方可以储存这些数据。
- 堆栈是当前Javascript线程的抓取空间。由于JavaScript通常只是单线程,所以通常有一个堆栈。栈的大小也是有限的,这就是为什么JavaScript中的数字只能这么大。
- 堆是应用层面上的动态内存存储。从堆中访问和检索数据要复杂一些,但数据存储是动态的--意味着它将在需要时扩展,而且不受限制。
当某些东西被存储在堆中时,它是按值存储的。当某些东西存储在堆中时,它是通过引用来存储的。
堆栈存储
JavaScript将常规的原始类型,如number,string,boolean,null,undefined 和bigint ,存储在栈中。当你在代码中定义变量时,它们会被添加到堆栈的顶部。
let myVar = 15;
let myName = 'Johnny';
let someOtherVar = false;
let check = null;
这意味着如果我们在JavaScript中重新定义一个变量,它将成为一个全新的值。比如说。
let myNumber = 5;
let newNumber = myNumber;
++newNumber;
// Returns 5, 6
console.log(myNumber, newNumber);
由于JavaScript为存储在堆栈中的任何东西创建了一个新的值,即使我们提到newNumber和myNumber是一样的,它们也不是指同一件事。这两个变量是相互独立的,改变一个不会改变另一个。
堆存储
如果你定义的东西不是原始类型,而是一个对象,那么它就被存储在堆中。例如,在 JavaScript中,函数和数组也属于 "对象 "的范畴。
堆的定义不是在堆中很容易被访问,而是需要多花点心思来定义。所有存储在堆中的东西都被赋予一个引用。
例子
假设我们在JavaScript中同时定义了一个对象和一个函数。
let myObject = { name: "Hello" };
let myFunction = function() {
return "Hello World";
}
如下图所示,每个myObject和myFunction都有一个新的引用,分别为#000和#001的引用。这个引用是它们在内存中被存储的地方。
与堆栈相比,堆存储的主要区别在于,如果我们再次引用一个对象,该引用保持不变。这意味着如果我们试图创建一个新版本的myObject,它反而会保持相同的引用。
let myObject = { name: "Hello" };
let newObject = myObject;
newObject.name = "Goodbye";
// Returns { name: "Goodbye" }, { name: "Goodbye" }
console.log(myObject, newObject);
当我们改变一个时,两个都会改变--这与我们在堆栈中存储数据时正好相反。
值和引用中的等价性
由于JavaScript将对象的定义存储为引用,这可能会让人有些困惑。对于值,我们可以很容易地比较两个东西是否相等。
let a = 5;
let b = 5;
// Returns true
console.log(a === b);
我们可以很容易地比较这两个东西,因为它们都是值。但是,对于引用来说,这是一个不同的故事。比较两个对象是通过引用来进行比较的。即使它们的值是一样的,它们也是不平等的,因为它们的引用是不同的。
let a = { name: "Hello" };
let b = { name: "Hello" };
// Returns false
console.log(a === b);
结论
引用和值对你的代码有真正的影响--特别是在进行比较的时候,理解两者的区别是至关重要的。不仅如此,堆栈在性能上要比堆便宜得多,如果你不知道它是如何工作的,就很容易产生太多的堆栈条目。
如果你知道JavaScript 是如何处理堆和栈存储的,你就可以开始优化你的应用程序的性能,使其在这些规则中发挥最大作用。我希望你喜欢这个关于引用和值如何在JavaScript中工作的快速指南。如果你想要更多的JavaScript内容,可以在这里找到。
JavaScript
经Johnny Simpson授权发表于DZone,DZone MVB。点击这里查看原文。