JS中的const命令你真懂它吗


Posted in Javascript onMarch 08, 2020

const 定义

const声明一个只读的常量 。一旦声明, 常量的值就不能改变。
常量 所谓的常量就是不能改变的值

const PI = 3.1415;
PI // 3.1415
PI = 3;
// TypeError: Assignment to constant variable.

上面代码表明改变常量的值会报错。

const声明的变量不得改变值,这意味着,const一旦声明变量,就必须立即初始化,不能留到以后赋值。

我们都知道const一般声明一个只读的常量,声明之后就不能修改了,并且声明时必须初始化

const message = 'hello'
message // hello
const message 
// ❌报错SyntaxError: Missing initializer in const declaration
const message = 'hello'
message ='world'
// 报错TypeError: Assignment to constant variable.

那大家有没有遇到这样的情况

const dog = {}
dog.name = 'wangcai'
dog // {name: "wangcai"}

奇怪,上面的例子明明改变了变量的值,为什么没有报错?

下面我们就探究一下const的本质

本质

其实const保证的并不是变量的值不动,而是变量指向的内存地址不得改动
可能有点抽象,我们来细细分析一下const声明的全过程

const message = 'hello'
  1. js看到变量message后,会给message分配一个空房间(内存空间)
  2. 看到等号右侧的字符串‘hello'时,会立马给它安排另一个房间,并把‘hello'放到这个房间
  3. js会拿小本本抄下这个房间的房间号(内存地址)
  4. 把这个房间号放到message这个房间里面,这时message中存储的就是hello字符串的存储地址(即指针)

当我们再次赋值时

message = 'word'

js会将存储‘word'字符串的地址赋给message,而message又是用const定义的变量,不可以改变变量里存储的内存地址,这时就会❌报错

而当遇到下面这种情况

const dog = {}
dog.name = 'wangcai'
dog // {name: "wangcai"}

则可以理解为
dog中存储的是对象的房间号(内存地址)
dog.name= 'wangcai',在给对象添加属性的过程,并没有改变这个地址,所以结果正常显示

划重点
const保证的并不是变量的值不动,而是变量指向的内存地址不得改动

到此这篇关于JS中的const命令你真懂它吗的文章就介绍到这了,更多相关JS const命令内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Javascript 相关文章推荐
Javascript实例教程(19) 使用HoTMetal(1)
Dec 23 Javascript
jQuery 研究心得 取得属性的值
Nov 30 Javascript
输入密码检测大写是否锁定js实现代码
Dec 03 Javascript
Jquery-1.9.1源码分析系列(十一)之DOM操作
Nov 25 Javascript
WEB前端开发框架Bootstrap3 VS Foundation5
May 16 Javascript
JS锚点的设置与使用方法
Sep 05 Javascript
jQuery Validate验证框架详解(推荐)
Dec 17 Javascript
angularjs 实现带查找筛选功能的select下拉框实例
Jan 11 Javascript
Javascript 两种刷新方法以及区别和适用范围
Jan 17 Javascript
基于node打包可执行文件工具_Pkg使用心得分享
Jan 24 Javascript
require.js 加载过程与使用方法介绍
Oct 30 Javascript
详解vue项目打包步骤
Mar 29 Javascript
Vue2.4+新增属性.sync、$attrs、$listeners的具体使用
Mar 08 #Javascript
Vue vm.$attrs使用场景详解
Mar 08 #Javascript
浅谈Vue2.4.0 $attrs与inheritAttrs的具体使用
Mar 08 #Javascript
vue-cli点击实现全屏功能
Mar 07 #Javascript
vue全屏事件开发详解
Jun 17 #Javascript
vue实现全屏滚动效果(非fullpage.js)
Mar 07 #Javascript
vue项目使用高德地图的定位及关键字搜索功能的实例代码(踩坑经验)
Mar 07 #Javascript
You might like
PHP访问MYSQL数据库封装类(附函数说明)
2010/12/04 PHP
PHP的加密方式及原理
2012/06/14 PHP
PHP使用NuSOAP调用Web服务的方法
2015/07/18 PHP
php中使用websocket详解
2016/09/23 PHP
php is_writable判断文件是否可写实例代码
2016/10/13 PHP
CI框架常用函数封装实例
2016/11/21 PHP
JavaScript的各种常见函数定义方法
2014/09/16 Javascript
教你用Cordova打包Vue项目的方法
2017/10/17 Javascript
JavaScript实现的反序列化json字符串操作示例
2018/07/18 Javascript
从零开始学习搭建React脚手架项目
2018/08/23 Javascript
微信小程序实现自动定位功能
2018/10/31 Javascript
详解React 服务端渲染方案完美的解决方案
2018/12/14 Javascript
微信小程序实现顶部导航特效
2019/01/28 Javascript
快速搭建Node.js(Express)用户注册、登录以及授权的方法
2019/05/09 Javascript
40行代码把Vue3的响应式集成进React做状态管理
2020/05/20 Javascript
[55:32]2018DOTA2亚洲邀请赛 4.4 淘汰赛 EG vs LGD 第二场
2018/04/05 DOTA
使用Python脚本将Bing的每日图片作为桌面的教程
2015/05/04 Python
python抓取最新博客内容并生成Rss
2015/05/17 Python
widows下安装pycurl并利用pycurl请求https地址的方法
2018/10/15 Python
python scrapy爬虫代码及填坑
2019/08/12 Python
Python气泡提示与标签的实现
2020/04/01 Python
TensorFlow固化模型的实现操作
2020/05/26 Python
Python爬虫进阶之爬取某视频并下载的实现
2020/12/08 Python
详解python3类型注释annotations实用案例
2021/01/20 Python
一款纯css3实现的圆形旋转分享按钮旋转角度可自己调整
2014/09/02 HTML / CSS
关于HTML5 Placeholder新标签低版本浏览器下不兼容的问题分析及解决办法
2016/01/27 HTML / CSS
印度购物网站:TATA CLiQ
2017/11/23 全球购物
日本最大的彩色隐形眼镜销售网站:CharmColor
2020/09/09 全球购物
中专毕业自我鉴定
2013/10/16 职场文书
好的自荐信包括什么内容
2013/11/07 职场文书
安全生产网格化管理实施方案
2014/03/01 职场文书
校本研修个人总结
2015/02/28 职场文书
亮剑精神观后感
2015/06/05 职场文书
详解Java分布式事务的 6 种解决方案
2021/06/26 Java/Android
gojs实现蚂蚁线动画效果
2022/02/18 Javascript
Linux下搭建SFTP服务器的命令详解
2022/06/25 Servers