符合中小企业对网站设计、功能常规化式的企业展示型网站建设
本套餐主要针对企业品牌型网站、中高端设计、前端互动体验...
商城网站建设因基本功能的需求不同费用上面也有很大的差别...
手机微信网站开发、微信官网、微信商城网站...
这篇文章主要讲解了javascript内存模型的用法,内容清晰明了,对此有兴趣的小伙伴可以学习一下,相信大家阅读完之后会有帮助。
创新互联是专业的乌海海南网站建设公司,乌海海南接单;提供网站设计、成都做网站,网页设计,网站设计,建网站,PHP网站建设等专业做网站服务;采用PHP框架,可快速的进行乌海海南网站开发网页制作和功能扩展;专业做搜索引擎喜爱的网站,专业的做网站团队,希望更多企业前来合作!
当我们声明变量、初始化变量、更改变量值的时候,到底会发生什么?JavaScript 是如何实现这些基本的功能?最重要的是,我们如何才能理解这些基础知识?
本文将覆盖以下 4 个方面:
从一个简单的栗子开始。首先我们声明一个叫myNumber
的变量,赋值为 23。
let myNumber = 23
执行这段代码的时候,JavaScript 会...
通常我们会说:“myNumber 等于 23”,但从技术上讲,myNumber
等于一个内存地址,那儿保存着一个大小为 23 的值。理解这段话十分关键。
如果我们创建一个 newVar
的新变量,然后把 myNumber
赋值给它:
let newVar = myNumber
因为 myNumber
实际上等于“0012CCGWH80”,那么newVar
也等于“0012CCGWH80”,这个内存地址保存的值为 23。最终实现了“newVal 等于 23”的效果。
如果我们这样做又会发生什么呢?
myNumber = myNumber + 1
显然,myNumber
的值为 24,那么对于指向相同内存地址的newVar
,它是否也等于 24?
答案当然是否定的!因为 JavaScript 的基本数据类型是不可变的,myNumber + 1
的结果是 24,JavaScript 会分配一个新的内存地址来存储这个值,然后将myNumber
指向这个新地址。
图3
再举一个例子:
let myString = 'abc' myString = myString + 'd'
JS 新手可能认为,字符串abc
已经存在于内存里,所以字母d
只是追加到它的后面。从技术上讲,这是错误的。由于原始数据类型的不变性,当abc
与d
结合时,JS 会分配一个新的内存地址来保存这个值(abcd
),接着myString
指向新的地址。
图4
JS 的内存模型可以简单的理解为两个不同的区域:调用栈和堆。
图5
栈用来保存原始数据以及函数调用,可以粗略的用下图表示。
图6
上图中,我抽象的在调用栈中显示每个变量的值。但请记住,变量实际指向的是内存地址,那里保存着对应的值。这是理解let vs. cont
的关键。
关于堆内存。
堆保存着所有非原始类型的数据。它和栈最大的区别是,堆可以保存无序、能够动态增删的数据——对于对象和数组来说,这是完美的存储空间。
还是从一个简单的栗子开始。下面,我们声明一个叫myArray
的变量,并初始化一个空数组。
let myArray = []
当 JS 引擎执行上面的代码,内存会发生如下变化:
图8
现在,我们可以对数组做任何操作了。
myArray.push('first') myArray.push('second') myArray.push('third') myArray.pop()
图9
我们应该优先使用const
而不是let
,除非变量会被改变。
我们必须清楚的知道——“改变”到底是什么意思。
值发生了变化,这是对“改变”的一种错误理解。一些 JS 程序员会写下这样的代码:
let sum = 0 sum = 1 + 2 let numbers = [] numbers.push(1) numbers.push(2)
这段代码正确的使用let
声明变量sum
,因为值被改变了。然而却错误的使用let
来声明变量numbers
,因为他们认为给数组 push 一些数据后,数组的值被改变了。
“改变”的正确解释是——内存地址变了。let
允许你改变内存地址,const
则不允许。
const importantId = 489 importantId = 100 // TypeError: Assignment to constant variable
一起看看这到底发生了什么。
当声明importantId
时,JS 引擎为其分配一个内存地址,并存储一个大小为 489 的值。切记,变量importantId
等于这个内存地址。
图10
当把 100 赋值给importantId
时,因为 100 是原始类型,此时会分配一个用来存储 100 的内存地址。然后 JS 尝试将新的内存地址赋值给importantId
,此时就会发生错误。这是我们想要的结果,因为我们不想改变一个非常重要的 ID。
图11
对于新手来说,由于不清楚“改变”的真是含义,在使用 const 声明变量可能会有些困惑,所以他们默认使用 let 来避免麻烦。
然而,这并不是推荐的做法。Google 在他们的 JavaScript 风格指南中写道:“使用 const 或 let 声明所有变量。除非变量会被重新赋值,否则优先使用 const。一定不要使用 var”。
他们没有明确说明为什么要这样做,但我认为这样做有以下好处:
看完上述内容,是不是对javascript内存模型的用法有进一步的了解,如果还想学习更多内容,欢迎关注创新互联行业资讯频道。