深入研究const(es6特性)
const 申明常量
var str = 'es6'
console.log(window.str) // es6 属于顶层对象window
const不属于顶层对象window
const str = 'es6' console.log(window.str) //undefined 不属于顶层对象window
var 存在变量提升 console.log(str)
var str = 'es6' 相当于===>> var str
console.log(str) //undefined
str = 'es6'
const 不存在变量提升
console.log(str) //报错
const str = 'es6'
if(true){
var str = 'es6'
}
console.log(str) // es6 const申明常量 有 块级作用域
if(true){
const str = 'es6'
}
console.log(str) // 报错
划重点,要考的!!
const 申明的常量是不可改变的! ( 除 数组 对象 之外 )
严格说 const声明的 常量地址 是不可变的, 地址里面的值 可以变的!!!
const aaObj = {
name: '大熊',
age: 18
}
aaObj.age = 19;
console.log(aaObj)
看到没, const申明的对象里面的 age变成了 19
const bbObj = ['大熊111','大熊222','大熊333']
bbObj[0] = '哈哈哈';
console.log(bbObj)
看到没, const申明的数组里面的第一项 变成了 哈哈哈
除了 数组 对象之外, 如下申明:
const aaa = 'xxxx'
const aaa = 'ssss'
console.log(aaa)
---------------------------------------------------------------------------------------------------------------------------------------------------------------------------
哥几个, 到这里 看明白了吧, 对于 const 申明的 数组 和 对象 ,里面的 值 是可以被改变的!!!!
那么有人就会问, 怎么才能做到不改变呢, 有个方法 Obiect.freeze()可以锁住 const申明的 对象 和 数组的 第一层!!!! 这里只能锁住 第一层, 如果里面嵌套了 数组对象, 那需要 遍历 然后 在 锁住freeze
1. Object.freeze 锁住 第一层 没问题
const arr = ['大熊111','大熊222','大熊333']
Object.freeze(arr);
arr[0] = 'xxxx';
console.log(arr); const ccObj = {
name: '大熊',
age: 18
}
Object.freeze(ccObj);
ccObj.age = 66;
console.log(ccObj);
2. Object.freeze 锁不住 第2层 以上
const ddObj = {
name: '大熊',
age: 18,
arr2: [1,2,4,5]
}
Object.freeze(ddObj);
ddObj.arr2[0] = '大熊';
console.log(ddObj);
3. 怎么把 const申明的 多层嵌套的 数组 对象 锁住 (遍历!)
const jjObj = {
name: '大熊',
age: 18,
arr2: [1,2,4,5]
}
function myFreeze(obj){
Object.freeze(obj); // 属性对应的值 是对象 那就 递归 再次调用 该函数
Object.keys(obj).forEach(key=>{
if(typeof obj[key] === 'object') return myFreeze(obj[key]);
})
} myFreeze(jjObj);
jjObj.arr2[0] = '大熊';
console.log(jjObj);
有问题直接 评论, 本文有些素材采取 于 慕课网 , 如有版侵权问题,请联系在下,谢谢!
深入研究const(es6特性)的更多相关文章
- 最常用的ES6特性(转)
最常用的ES6特性 let, const, class, extends, super, arrow functions, template string, destructuring, defaul ...
- 最常用的ES6特性
遇到了要写出es6新特性的题目,所以查阅了资料来总结一下,点击查看原文. 进入正题,最常用的ES6特性有:let, const, class, extends, super, arrow functi ...
- ES6特性
一.ES6特性: let, const, class, extends, super, arrow functions, template string, destructuring, default ...
- 第四节:教你如何快速让浏览器兼容ES6特性
写在正文前,本来这一节的内容应该放在第二节更合适,因为当时就有同学问ES6的兼容性如何,如何在浏览器兼容ES6的特性,这节前端君会介绍一个抱砖引玉的操作案例. 为什么ES6会有兼容性问题? 由于广大用 ...
- 解决浏览器兼容ES6特性
为什么ES6会有兼容性问题? 由于广大用户使用的浏览器版本在发布的时候也许早于ES6的定稿和发布,而到了今天,我们在编程中如果使用了ES6的新特性,浏览器若没有更新版本,或者新版本中没有对ES6的特性 ...
- 现在就可以使用的5个 ES6 特性
小编推荐:掘金是一个高质量的技术社区,从 ECMAScript 6 到 Vue.js,性能优化到开源类库,让你不错过前端开发的每一个技术干货.各大应用市场搜索「掘金」即可下载APP,技术干货尽在掌握. ...
- 解决让浏览器兼容ES6特性
为什么ES6会有兼容性问题? 由于广大用户使用的浏览器版本在发布的时候也许早于ES6的定稿和发布,而到了今天,我们在编程中如果使用了ES6的新特性,浏览器若没有更新版本,或者新版本中没有对ES6的特性 ...
- 9个常用ES6特性归纳(一般用这些就够了)
ECMAScript 6.0(以下简称 ES6)是 JavaScript 语言的下一代标准,已经在 2015 年 6 月正式发布了.它的目标,是使得 JavaScript 语言可以用来编写复杂的大型应 ...
- ES6特性的两点分析
块级作用域声明let.constES6中const 和let的功能,转换为ES5之后,我们会发现实质就是在块级作用改变一下变量名,使之与外层不同.ES6转换前: let a1 = 1; let a2 ...
随机推荐
- Redis原理再学习05:数据结构-整数集合intset
intset介绍 intset 整数集合,当一个集合只有整数元素,且元素数量不多时,Redis 就会用整数集合作为集合键的底层实现. redis> SADD numbers 1 3 5 7 9 ...
- 初识——HTTP3
目录 初识--HTTP3 HTTP HTTP1.0和HTTP1.1的主要区别 HTTP2 HTTP3 相关链接 初识--HTTP3 想了解HTTP3??那我们就得先知道为啥会出现HTTP3,因此我们需 ...
- 【转载】深入浅出SQL Server中的死锁
essay from:http://www.cnblogs.com/CareySon/archive/2012/09/19/2693555.html 简介 死锁的本质是一种僵持状态,是多个主体对于资源 ...
- php 23种设计模型 - 装饰模式
装饰器模式(Decorator) 装饰器模式(Decorator Pattern)允许向一个现有的对象添加新的功能,同时又不改变其结构.这种类型的设计模式属于结构型模式,它是作为现有的类的一个包装. ...
- vue-cli项目创建步骤
vue-cli项目创建步骤: 1.cmd打开命令行窗口 2.输入cnpm install vue-cli -g,然后回车等待(想在哪个目录建立vue项目就要在进入到对应目录再输入命令) 3.安装结束后 ...
- 4月8日 python学习总结 模块与包
一.包 #官网解释 Packages are a way of structuring Python's module namespace by using "dotted module n ...
- kafka如何保证不重复消费又不丢失数据_Kafka写入的数据如何保证不丢失?
我们暂且不考虑写磁盘的具体过程,先大致看看下面的图,这代表了 Kafka 的核心架构原理. Kafka 分布式存储架构 那么现在问题来了,如果每天产生几十 TB 的数据,难道都写一台机器的磁盘上吗?这 ...
- Jenkins+Docker+Git 自动化部署
Jenkins+Docker+Git 自动化部署图文教程 https://blog.csdn.net/qq_38252039/article/details/89791247 前言: 通过几天的学习和 ...
- Http请求的Get和Post的区别?
1. get从地址栏以明文的方式提交请求信息内容?username=admin&password=123,用户可见, 而post从请求正文提交请求信息内容,用户不可见. 2. get提交因为是 ...
- nginx使用与配置
一.nginx操作命令 nginx常用命令: 验证配置是否正确: nginx -t 查看Nginx的版本号:nginx -V 启动Nginx:start nginx 重新加载nginx:nginx.e ...