ES6 let和const命令(2)
为什么要使用块级作用域
在ES5中只有全局作用域和函数作用域,没有块级作用域,因此带来了这些麻烦
- 内层变量可能会覆盖外层变量
var tmp = new Date();
console.log(tmp);//Thu Jan 12 2017 15:47:08 GMT+0800 (中国标准时间)
function f() {
console.log(tmp);//undefined
if (false) {
var tmp = "hello world";
console.log(tmp);
}
else {
tmp = "ff";
console.log(tmp);//ff
}
}
f();
//结果:Thu Jan 12 2017 15:47:08 GMT+0800
//undefined
//ff
上面代码中,输出undefined是因为变量提升导致了内部的tmp变量覆盖了外层的tmp变量。
2. 用来计数的循环变量泄露为全局变量
var s = 'hello';
for(var i = 0;i<s.length;i++) {
console.log(s[i]);
}
console.log(i);//5
上面代码中,变量i只用来控制循环。但是循环结束后,它并没有消失,而是泄露成成了全局变量
ES6的块级作用域
- let实际上为js新增的块级作用域
function f1() {
let n = 5;
if(true) {
let n = 10;
}
console.log(n);
}
f1();//5
结果输出5,代表外层代码块不受内层代码块的影响
2. ES6允许块级作用域任意嵌套
- 外层作用域无法读取内层作用域的变量
function f1() {
{{
let a = 10;
}
console.log(a);//报错
}
}
f1();
- 内层作用域可以定义外层作用域的同名变量
- 块级作用域的出现,实际上使得广泛应用的立即执行匿名函数(IIFE)不再必要了。
(function() {
var tmp = ...;
...
}());
//块级作用域写法
{
let tmp = ...;
...
}
- ES6规定,函数本身的作用域在其所在的块级作用域之内。
function f1() {console.log('I am out');}
(function () {
if(false) {
//重复声明一次函数f
function f() {
console.log('I am in');
}
f();
}
}())
上面的代码在es5中运行会得到“I am in”,但在ES6中会得到“I am out”.这是因为ES5存在变量提升,不管会不会进入到if代码块,函数都会提升到当前作用域的顶部而得到执行;而ES6支持块级作用域,不管会不会进入if代码块,其内部声明的函数都不会影响到作用域的外部。
{
let a = 's';
function f() {
return a;
}
}
f();//报错
上面代码中,块级作用域外部无法调用块级作用域内部定义的函数。如果确实需要调用,可以用下面方法
let f;
{
let a = 's';
f = function () {
return a;
}
}
f()//'s'
需要注意的是,如果在严格模式下,函数只能在顶层作用域和函数内声明,其他情况(比如if代码块,循环代码块)中调用都会出错。
ES6 let和const命令(2)的更多相关文章
- ES6 let和const命令(3)
const 用来声明常量.一旦声明,就不能改变. const在声明必须初始化,只声明不赋值会出错 const的作用域与let一样,只在声明的块级作用域有效. const命令声明的常量也不提升,同样存在 ...
- es6 let和const命令(1)
基本用法 ES新增了let命令,用于声明变量.其用法类似于var,但是所声明的变量只在let命令所在的代码块中有效. for(let i = 0;i<5;i++) {} console.log( ...
- ES6之新增const命令使用方法
hi,我又回来了,今天学习一下const命令. 声明一个常量 const声明一个只读常量,一旦声明,常量的值便不可改变. 例子如下: const food = 12; food = 23; // Un ...
- ES6 let和const命令(4)
const声明的常量只在当前代码块有效.如果想设置跨模块的常量,可以采用下面的写法. //constants.js模块 export const A = 1; export const B = 3; ...
- ES6中的const命令【转】
1.const声明一个只读常量,一旦声明,常量的值就不能改变 1 const PI=3.1415; 2 console.log(PI);//3.1415 3 4 PI=3;//Uncaught Typ ...
- ES6中的const命令
1.const声明一个只读常量,一旦声明,常量的值就不能改变 1 const PI=3.1415; 2 console.log(PI);//3.1415 3 4 PI=3;//Uncaught T ...
- ES6 let和const命令
一.let定义变量 { let a = 1;} console.log(a);只在let所在的代码块有效,console的结果是a is not defined,报错. 不存在var的变量提升,即使用 ...
- es6学习笔记(1) let和const命令详解
let和const命令: Es6新增了let命令,声明变量,但与var不一样的,只在let命令所在的代码块内有效(如for循环之外let声明的变量就不再有效).并且let不像var那样会发生" ...
- ES6之let(理解闭包)和const命令
ES6之let(理解闭包)和const命令 最近做项目的过程中,使用到了ES6,因为之前很少接触,所以使用起来还不够熟悉.因此购买了阮一峰老师的ES6标准入门,在此感谢阮一峰老师的著作. 我们知道,E ...
随机推荐
- 边框(Border) 和 轮廓(Outline) 属性
border 复合属性.设置对象边框的特性. 标签定义及使用说明 如果上述值缺少一个没有关系,例如border:#FF0000;是允许的. 默认值: not specified 继承: no Java ...
- 【转】Visual Studio Code 使用Git进行版本控制
原文链接:https://www.cnblogs.com/xuanhun/p/6019038.html?utm_source=tuicool&utm_medium=referral 本来认为此 ...
- bootstrap fileinput上传返回400,404,500 等错误替换
$(".uploadfile").on('filebatchuploaderror', function(event, data, msg) { $(".file-err ...
- bundles.Add( )下无法绑定后缀为min.css的文件
1.问题描述: 在绑定css的时候,除了后缀名为.min.css的文件,在render.style()不显示外,其他的css都正常加载, 2.解决办法: 这个是我在调试了几遍之后发现的规律,然后解决办 ...
- Elasticsearch中Head插件的使用
在学习Elasticsearch的过程中,必不可少需要通过一些工具查看es的运行状态以及数据.如果都是通过rest请求,未免太过麻烦,而且也不够人性化.此时,head可以完美的帮助你快速学习和使用El ...
- cookie和session有什么区别,请你谈谈cookie的缺点
1.区别: cookie机制采用的是在客户端保持状态的方案 session机制采用的是在服务端保持状态的方案 2.cookie: 优点: 1> 极高的扩展性和可用性 2> 通过编程方式,控 ...
- pku 2488 A Knight's Journey (搜索 DFS)
A Knight's Journey Time Limit: 1000MS Memory Limit: 65536K Total Submissions: 28697 Accepted: 98 ...
- java.lang.RuntimeException: Canvas: trying to use a recycled bitmap android.graphics.Bitmap@412d7230
近期遇到了如标题这种错误,再次记录解决方法.本文參考帖子: http://bbs.csdn.net/topics/390196217 出现此bug的原因是在内存回收上.里面用Bitamp的代码为: t ...
- linux 开机批量启动程序
每天早上到公司第一件事打开电脑,打开我的qq.我的开发工具idea.在看看邮件,日复一日,变懒了.也变聪明了,写了以下一段脚本 文件名称:mystart.sh #!bin/bash #检验我的开发工具 ...
- Java序列化框架性能比較
博客: http://colobu.com jvm-serializers提供了一个非常好的比較各种Java序列化的的測试套件. 它罗列了各种序列化框架. 能够自己主动生成測试报告. 我在AWS c3 ...