深入浅出ES6之let和const命令


Posted in Javascript onAugust 25, 2016

let和const声明的变量只在代码块内有效

{
let a = 10;
var b = 1;
}
a // ReferenceError: a is not defined.
b // 1

不存在变量提升

变量一定要在声明后使用,否则报错

var tmp = 123;
if (true) {
tmp = 'abc'; // ReferenceError
let tmp;
}

不允许重复声明

// 报错
function () {
let a = 10;
var a = 1;
}

块级作用域

function f() { console.log('I am outside!'); }
(function () {
if(false) {
// 重复声明一次函数f
function f() { console.log('I am inside!'); }
}
f();
}());
//I am inside! ES5 函数提升
//I am outside! ES6 块级作用域

const命令

声明一个只读的常量,一旦声明,常量的值就不能改变

一旦声明变量,就必须立即初始化,不能留到以后赋值

let命令、const命令、class命令声明的全局变量,不属于全局对象的属性

var a = 1;
// 如果在Node的REPL环境,可以写成global.a
// 或者采用通用方法,写成this.a
window.a // 1
let b = 1;
window.b // undefined

下面再单独给大家介绍ES6之const命令

一直以来以ecma为核心的js始终没有常量的概念,es6则弥补了这一个缺陷;

const foo='foo';
foo='bar';//TypeError: Assignment to constant variable.

上例声明了一个基本类型的常量,如过试图修改初始值则会报错;如果是引用类型的值同样适用,但是有一点需要注意,举例说明:

const foo=[];
foo=[1];//Assignment to constant variable.

正常报错,没毛病,再看:

const foo=[1,2,3];
foo[1]=4;
console.log(foo)//[1, 4, 3]

这怎么没报错?而且还能修改成功? 这两个例子不一样的地方在于前者是修改了指针(需熟悉js 引用类型)对应的内容改变了,后者则不是指向依然没变 但是指向对象的内容发生改变了,对于foo而言我只是一个指针负责指向对应的对象 至于对象内容是什么就不管我的事了所以可以修改;如果不想让内容也改变也行使用另一个方法;

const foo=Object.freeze([1,2,3]);
foo[1]=4;
console.log(foo)//[1, 2, 3]

这样就不用担心被修改了;

Javascript 相关文章推荐
js单向链表的具体实现实例
Jun 21 Javascript
JS自动倒计时30秒后按钮才可用(两种场景)
Aug 31 Javascript
jquery validate表单验证的基本用法入门
Jan 18 Javascript
基于JS模仿windows文件按名称排序效果
Jun 29 Javascript
js创建数组的简单方法
Jul 27 Javascript
微信小程序的动画效果详解
Jan 18 Javascript
Bootstrap中glyphicons-halflings-regular.woff字体报404错notfound的解决方法
Jan 19 Javascript
js+canvas实现验证码功能
Sep 21 Javascript
开发一个Parcel-vue脚手架工具(详细步骤)
Sep 22 Javascript
使用electron实现百度网盘悬浮窗口功能的示例代码
Oct 24 Javascript
vue router 组件的高级应用实例代码
Apr 08 Javascript
详解小程序之简单登录注册表单验证
May 13 Javascript
PhotoSwipe异步动态加载图片方法
Aug 25 #Javascript
相册展示PhotoSwipe.js插件实现
Aug 25 #Javascript
移动端点击图片放大特效PhotoSwipe.js插件实现
Aug 25 #Javascript
手机端图片缩放旋转全屏查看PhotoSwipe.js插件实现
Aug 25 #Javascript
手机端 HTML5使用photoswipe.js仿微信朋友圈图片放大效果
Aug 25 #Javascript
手机图片预览插件photoswipe.js使用总结
Aug 25 #Javascript
jQuery操作dom实现弹出页面遮罩层(web端和移动端阻止遮罩层的滑动)
Aug 25 #Javascript
You might like
PHP 修复未正常关闭的HTML标签实现代码(支持嵌套和就近闭合)
2012/06/07 PHP
hadoop常见错误以及处理方法详解
2013/06/19 PHP
PHP生成随机密码类分享
2014/06/25 PHP
laravel学习教程之关联模型
2016/07/30 PHP
php flush无效,IIS7下php实时输出的方法
2016/08/25 PHP
php中html_entity_decode实现HTML实体转义
2018/06/13 PHP
PHP array_reduce()函数的应用解析
2018/10/28 PHP
javascript 写类方式之七
2009/07/05 Javascript
javascript document.compatMode兼容性
2010/02/23 Javascript
jQuery操作CheckBox的方法介绍(选中,取消,取值)
2014/02/04 Javascript
javascript实现3D切换焦点图
2015/10/16 Javascript
微信jssdk用法汇总
2016/07/16 Javascript
浅谈jQuery双事件多重加载的问题
2016/10/05 Javascript
详解获取jq ul第一个li定位的四种解决方案
2016/11/23 Javascript
jQuery解析返回的xml和json方法详解
2017/01/05 Javascript
利用n工具轻松管理Node.js的版本
2017/04/21 Javascript
Angular 2父子组件之间共享服务通信的实现
2017/07/04 Javascript
Vue中组件之间数据的传递的示例代码
2017/09/08 Javascript
详解JavaScript 中 if / if...else...替换方式
2018/07/15 Javascript
小程序清理本地缓存的方法
2018/08/17 Javascript
vue 本地环境跨域请求proxyTable的方法
2018/09/19 Javascript
在JS循环中使用async/await的方法
2018/10/12 Javascript
浅谈Angular 观察者模式理解
2018/11/01 Javascript
使用vue中的混入mixin优化表单验证插件问题
2019/07/02 Javascript
iview form清除校验状态的实现
2019/09/19 Javascript
vue自定义指令限制输入框输入值的步骤与完整代码
2020/08/30 Javascript
如何使用Python进行OCR识别图片中的文字
2019/04/01 Python
python实现在线翻译
2020/06/18 Python
前端水印的简单实现代码示例
2020/12/02 HTML / CSS
Foot Locker澳洲官网:美国运动服和鞋类零售商
2019/10/11 全球购物
会计专业自荐信范文
2013/12/02 职场文书
1亿有多大教学反思
2014/05/01 职场文书
电气工程师岗位职责
2015/02/12 职场文书
运动会新闻稿
2015/07/17 职场文书
根德5570型九灯四波段立体声收音机是电子管收音机的楷模 ? 再论5570
2022/04/05 无线电
vue报错function () { [native code] },无法出现我们想要的内容 Unknown custom element
2022/04/11 Vue.js