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 相关文章推荐
基于jquery1.4.2的仿flash超炫焦点图播放效果
Apr 20 Javascript
JS中typeof与instanceof之间的区别总结
Nov 14 Javascript
简单分析javascript面向对象与原型
May 21 Javascript
个人网站留言页面(前端jQuery编写、后台php读写MySQL)
May 03 Javascript
Extjs表单输入框异步校验的插件实现方法
Mar 20 Javascript
微信小程序 flex实现导航实例详解
Apr 26 Javascript
JS实现用特殊符号替换字符串的中间部分区域的实例代码
Jul 24 Javascript
react+redux仿微信聊天界面
Jun 21 Javascript
JavaScript实现秒杀时钟倒计时
Sep 29 Javascript
关于vue里页面的缓存详解
Nov 04 Javascript
微信小程序基于ColorUI构建皮皮虾短视频去水印组件
Nov 04 Javascript
Vue实现boradcast和dispatch的示例
Nov 13 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
简单易用的计数器(数据库)
2006/10/09 PHP
初级的用php写的采集程序
2007/03/16 PHP
thinkphp控制器调度使用示例
2014/02/24 PHP
thinkPHP5项目中实现QQ第三方登录功能
2017/10/20 PHP
Laravel如何使用Redis共享Session
2018/02/23 PHP
Extjs学习笔记之三 extjs form更多的表单项
2010/01/07 Javascript
javascript showModalDialog 内跳转页面的问题
2010/11/25 Javascript
js输入框邮箱自动提示功能代码实现
2013/12/10 Javascript
纯JavaScript实现获取onclick、onchange等事件的值
2014/12/29 Javascript
JS实现模拟百度搜索“2012世界末日”网页地震撕裂效果代码
2015/10/31 Javascript
功能强大的Bootstrap效果展示(二)
2016/08/03 Javascript
JS实现复制内容到剪贴板功能
2017/02/05 Javascript
几行js代码实现自适应
2017/02/24 Javascript
Vue.js中的图片引用路径的方式
2017/07/28 Javascript
vue2.0 自定义 饼状图 (Echarts)组件的方法
2018/03/02 Javascript
js+html实现点名系统功能
2019/11/05 Javascript
js 使用ajax设置和获取自定义header信息的方法小结
2020/03/12 Javascript
js利用iframe实现选项卡效果
2020/08/09 Javascript
[04:32]DOTA2著名解说配音敌法师 现场专访海涛怒切假腿
2013/12/20 DOTA
Python标准库之随机数 (math包、random包)介绍
2014/11/25 Python
Python基于socket实现简单的即时通讯功能示例
2018/01/16 Python
PyQt5 pyqt多线程操作入门
2018/05/05 Python
python elasticsearch从创建索引到写入数据的全过程
2019/08/04 Python
Django REST Framework 分页(Pagination)详解
2020/11/30 Python
深入浅析css3 border-image边框图像详解
2015/11/24 HTML / CSS
CSS3中animation实现流光按钮效果
2020/12/21 HTML / CSS
HTML5中外部浏览器唤起微信分享
2020/01/02 HTML / CSS
白兰氏健康Mall:BRAND’S
2017/11/13 全球购物
英国最专业的健身器材供应商之一:Best Gym Equipment
2017/12/22 全球购物
大学生收银员求职信分享
2014/01/02 职场文书
导游个人求职信范文
2014/03/23 职场文书
十佳党员事迹材料
2014/08/28 职场文书
合作意向书怎么写
2019/06/24 职场文书
JavaScript 语句之常用 for 循环详解
2021/03/29 Javascript
Python中的变量与常量
2021/11/11 Python
GTX1660显卡搭配显示器推荐
2022/04/19 数码科技