深入浅出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 相关文章推荐
FormValid0.5版本发布,带ajax自定义验证例子
Aug 17 Javascript
jQuery下通过replace字符串替换实现大小图片切换
May 22 Javascript
Javascript模块化编程(一)模块的写法最佳实践
Jan 17 Javascript
上传的js验证(图片/文件的扩展名)
Apr 25 Javascript
JavaScript常用全局属性与方法记录积累
Jul 03 Javascript
js中如何复制一个对象并获取其所有属性和属性对应的值
Oct 24 Javascript
动态加载dtree.js树treeview(示例代码)
Dec 17 Javascript
基于Jquery插件Uploadify实现实时显示进度条上传图片
Mar 26 Javascript
Vuejs第十一篇组件之slot内容分发实例详解
Sep 09 Javascript
jQuery的ready方法实现原理分析
Oct 26 Javascript
vue-router重定向不刷新问题的解决
Jun 25 Javascript
Vue项目报错:Uncaught SyntaxError: Unexpected token
Nov 10 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文件上传你必须知道的几点
2015/10/20 PHP
PHP结合Jquery和ajax实现瀑布流特效
2016/01/07 PHP
php制作基于xml的RSS订阅源功能示例
2017/02/08 PHP
Yii2使用$this->context获取当前的Module、Controller(控制器)、Action等
2017/03/29 PHP
PHP实现的下载远程文件类定义与用法示例
2017/07/05 PHP
用示例说明filter()与find()的用法以及children()与find()的区别分析
2013/04/26 Javascript
JQuery的自定义事件代码,触发,绑定简单实例
2013/08/01 Javascript
点击进行复制的JS代码实例
2013/08/23 Javascript
asm.js使用示例代码
2013/11/28 Javascript
$(document).ready(function() {})不执行初始化脚本
2014/06/19 Javascript
纯JS前端实现分页代码
2016/06/21 Javascript
AngularJs expression详解及简单示例
2016/09/01 Javascript
深入浅析JS是按值传递还是按引用传递(推荐)
2016/09/18 Javascript
three.js实现3D模型展示的示例代码
2017/12/31 Javascript
layer.js之回调销毁对话框的例子
2019/09/11 Javascript
[01:00:30]完美世界DOTA2联赛循环赛 Inki vs Matador BO2第二场 10.31
2020/11/02 DOTA
简单介绍Python中的decode()方法的使用
2015/05/18 Python
python flask实现分页效果
2017/06/27 Python
python3+PyQt5实现支持多线程的页面索引器应用程序
2018/04/20 Python
python交换两个变量的值方法
2019/01/12 Python
Python基于plotly模块实现的画图操作示例
2019/01/23 Python
python多线程并发实例及其优化
2019/06/27 Python
无需JS和jQuery代码实现CSS3鼠标浮动放大图片
2016/11/21 HTML / CSS
压铸汽车模型收藏家:Diecastmodelswholesale.com
2016/12/21 全球购物
如何强制垃圾回收
2015/10/06 面试题
和平主题的演讲稿
2014/01/12 职场文书
廉洁校园实施方案
2014/05/25 职场文书
公路局群众路线教育实践活动第一阶段工作汇报
2014/10/25 职场文书
大学生个人年度总结范文
2015/02/15 职场文书
职称评定个人总结
2015/03/05 职场文书
2016幼儿园新学期寄语
2015/12/03 职场文书
干部理论学习心得体会
2016/01/21 职场文书
创业计划书之美容店
2019/09/16 职场文书
MongoDB连接数据库并创建数据等使用方法
2021/11/27 MongoDB
css实现左上角飘带效果的完整代码
2022/03/18 HTML / CSS
vue router 动态路由清除方式
2022/05/25 Vue.js