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 相关文章推荐
PNGHandler-借助JS让PNG图在IE下实现透明(包括背景图)
Aug 31 Javascript
javascript prototype,executing,context,closure
Dec 24 Javascript
javascript下数值型比较难点说明
Jun 07 Javascript
JavaScript取得鼠标绝对位置程序代码介绍
Sep 16 Javascript
jquery获得页面元素的坐标值实现思路及代码
Apr 15 Javascript
js采用map取到id集合组并且实现点击一行选中一行
Dec 16 Javascript
JavaScript fontcolor方法入门实例(按照指定的颜色来显示字符串)
Oct 17 Javascript
js实现完全自定义可带多级目录的网页鼠标右键菜单方法
Feb 28 Javascript
JavaScript中全选、全不选、反选、无刷新删除、批量删除、即点即改入库(在yii框架中操作)的代码分享
Nov 01 Javascript
JavaScript 事件流、事件处理程序及事件对象总结
Apr 01 Javascript
ES6新特性四:变量的解构赋值实例
Apr 21 Javascript
Vue实现左右菜单联动实现代码
Aug 12 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防攻击代码升级版
2010/12/29 PHP
php日历制作代码分享
2014/01/20 PHP
PHP实现的链式队列结构示例
2017/09/15 PHP
js兼容标准的表格变色效果
2008/06/28 Javascript
几个比较经典常用的jQuery小技巧
2010/03/01 Javascript
JS文本获得焦点清除文本文字的示例代码
2014/01/13 Javascript
使用纯javascript实现放大镜效果
2015/03/18 Javascript
Javascript中的方法和匿名方法实例详解
2015/06/13 Javascript
JS未跨域操作iframe里的DOM
2016/06/01 Javascript
json定义及jquery操作json的方法
2016/09/29 Javascript
BootStrap实现轮播图效果(收藏)
2016/12/30 Javascript
Jqprint实现页面打印
2017/01/06 Javascript
js获取地址栏中传递的参数(两种方法)
2017/02/08 Javascript
jquery插件canvaspercent.js实现百分比圆饼效果
2017/07/18 jQuery
用js实现before和after伪类的样式修改的示例代码
2017/09/07 Javascript
vue router+vuex实现首页登录验证判断逻辑
2018/05/17 Javascript
Vue2.0 实现移动端图片上传功能
2018/05/30 Javascript
详解puppeteer使用代理
2018/12/27 Javascript
js实现飞机大战小游戏
2020/08/26 Javascript
解决vue中使用less/sass及使用中遇到无效的问题
2020/10/24 Javascript
python实现在IDLE中输入多行的方法
2018/04/19 Python
python在每个字符后添加空格的实例
2018/05/07 Python
python消费kafka数据批量插入到es的方法
2018/12/27 Python
python数据持久存储 pickle模块的基本使用方法解析
2019/08/30 Python
Keras load_model 导入错误的解决方式
2020/06/09 Python
python日志通过不同的等级打印不同的颜色(示例代码)
2021/01/13 Python
巴西最大的珠宝连锁店:Vivara
2019/04/18 全球购物
英国最大的汽车配件在线商店:Euro Car Parts
2019/09/30 全球购物
老师自我鉴定范文
2013/12/25 职场文书
服务之星获奖感言
2014/01/21 职场文书
感恩寄语大全
2014/04/11 职场文书
公司爱心捐款倡议书
2014/05/14 职场文书
房产协议书范本
2014/10/18 职场文书
2015年评职称工作总结范文
2015/04/20 职场文书
2016年猴年新春致辞
2015/08/01 职场文书
宾馆客房管理制度
2015/08/06 职场文书