es6块级作用域

提示： ES5中的var是没有块级作用域的(if/for) ES6中的let是由块级作用的(if/for)

---

文章目录

es6块级作用域前言块级作用域

---

前言

ES5之前因为if和for都没有块级作用域的概念, 所以在很多时候, 我们都必须借助于function的作用域来解决应用外面变量的问题. ES6中,加入了let, let它是有if和for的块级作用域.

---

提示：以下是本篇文章正文内容，下面案例可供参考

块级作用域

1.变量作用域: 变量在什么范围内是可用.

{ var name = 'lll'; console.log(name); } console.log(name);

2.没有块级作用域引起的问题: if的块级

var func; if (true) { var name = 'lll'; func = function () { console.log(name); } // func() } name = 'kobe' func() // console.log(name);

3.没有块级作用域引起的问题: for的块级 为什么闭包可以解决问题: 函数是一个作用域.

var btns = document.getElementsByTagName('button'); for (var i=0; i<btns.length; i++) { (function (num) { // 0 btns[i].addEventListener('click', function () { console.log('第' + num + '个按钮被点击'); }) })(i) }

ES5

var i = 5 { btns[i].addEventListener('click', function () { console.log('第' + i + '个按钮被点击'); }) } { btns[i].addEventListener('click', function () { console.log('第' + i + '个按钮被点击'); }) } { btns[i].addEventListener('click', function () { console.log('第' + i + '个按钮被点击'); }) } { btns[i].addEventListener('click', function () { console.log('第' + i + '个按钮被点击'); }) } { btns[i].addEventListener('click', function () { console.log('第' + i + '个按钮被点击'); }) }

ES6

{ i = 0 btns[i].addEventListener('click', function () { console.log('第' + i + '个按钮被点击'); }) } { i = 1 btns[i].addEventListener('click', function () { console.log('第' + i + '个按钮被点击'); }) } { i = 2 btns[i].addEventListener('click', function () { console.log('第' + i + '个按钮被点击'); }) } { i = 3 btns[i].addEventListener('click', function () { console.log('第' + i + '个按钮被点击'); }) } { i = 4 btns[i].addEventListener('click', function () { console.log('第' + i + '个按钮被点击'); }) }