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 相关文章推荐
ajax更新数据后,jquery、jq失效问题
Mar 16 Javascript
js操作table示例(个人心得)
Nov 29 Javascript
JS判断、校验MAC地址的2个实例
May 05 Javascript
js判断当前页面用什么浏览器打开的方法
Jan 06 Javascript
ECMAScript6轮播图实践知识总结
Aug 17 Javascript
Bootstrap fileinput文件上传组件使用详解
Jun 06 Javascript
基于zTree树形菜单的使用实例
Dec 25 Javascript
vue组件name的作用小结
May 23 Javascript
vue项目中jsonp跨域获取qq音乐首页推荐问题
May 30 Javascript
jQuery实现炫丽的3d旋转星空效果
Jul 04 jQuery
Vue父子组件双向绑定传值的实现方法
Jul 31 Javascript
Vue 组件参数校验与非props特性的方法
Feb 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 array_search() 函数使用
2010/04/13 PHP
PHP 字符串正则替换函数preg_replace使用说明
2011/07/15 PHP
解析php二分法查找数组是否包含某一元素
2013/05/23 PHP
学习php过程中的一些注意点的总结
2013/10/25 PHP
php无序树实现方法
2015/07/28 PHP
php实现 master-worker 守护多进程模式的实例代码
2019/07/20 PHP
Visual Studio中的jQuery智能提示设置方法
2010/03/27 Javascript
超简单的jquery的AJAX用法
2010/05/10 Javascript
javascript中字符串拼接需注意的问题
2010/07/13 Javascript
收集的一些Array及String原型对象的扩展实现代码
2010/12/05 Javascript
javascript 10进制和62进制的相互转换
2014/07/31 Javascript
AngularJS中的过滤器使用详解
2015/06/16 Javascript
JS实现超简洁网页title标题跑动闪烁提示效果代码
2015/10/23 Javascript
js判断文本框输入的内容是否为数字
2015/12/23 Javascript
详解Angular 4.x NgTemplateOutlet
2017/05/24 Javascript
Vue.js实现的计算器功能完整示例
2018/07/11 Javascript
Vant的安装和配合引入Vue.js项目里的方法步骤
2018/12/05 Javascript
js防抖和节流的深入讲解
2018/12/06 Javascript
node.js实现微信开发之获取用户授权
2019/03/18 Javascript
JS学习笔记之数组去重实现方法小结
2019/05/29 Javascript
vue子路由跳转实现tab选项卡
2019/07/24 Javascript
详解vue 命名视图
2019/08/14 Javascript
解决layui中onchange失效以及form动态渲染失效的问题
2019/09/27 Javascript
p5.js实现故宫橘猫赏秋图动画
2019/10/23 Javascript
vant中的toast层级改变操作
2020/11/04 Javascript
tensorflow实现简单的卷积神经网络
2018/05/24 Python
Python中property函数用法实例分析
2018/06/04 Python
python实现批量注册网站用户的示例
2019/02/22 Python
基于Django统计博客文章阅读量
2019/10/29 Python
python thrift 实现 单端口多服务的过程
2020/06/08 Python
python 实现倒计时功能(gui界面)
2020/11/11 Python
关于python scrapy中添加cookie踩坑记录
2020/11/17 Python
纯CSS3实现的8种Loading动画效果
2014/07/05 HTML / CSS
荷兰演唱会和体育比赛订票网站:viagogo荷兰
2018/04/08 全球购物
环保公益策划方案
2014/08/15 职场文书
Java多条件判断场景中规则执行器的设计
2021/06/26 Java/Android