Es6

简介: 再来看一个更常见的例子,了解下如果不用ES6,而用闭包如何解决这个问题。 var clickBoxs = document.querySelectorAll('.clickBox') for (var i = 0; i < clickBoxs.length; i++){ clickBoxs[i].onclick = function(){ console.log(i) } } 我们本来希望的是点击不同的clickBox,显示不同的i,但事实是无论我们点击哪个clickBox,输出的都是5。

再来看一个更常见的例子,了解下如果不用ES6,而用闭包如何解决这个问题。

var clickBoxs = document.querySelectorAll('.clickBox')
for (var i = 0; i < clickBoxs.length; i++){

clickBoxs[i].onclick = function(){
    console.log(i)
}

}
我们本来希望的是点击不同的clickBox,显示不同的i,但事实是无论我们点击哪个clickBox,输出的都是5。下面我们来看下,如何用闭包搞定它。

function iteratorFactory(i){

var onclick = function(e){
    console.log(i)
}
return onclick;

}
var clickBoxs = document.querySelectorAll('.clickBox')
for (var i = 0; i < clickBoxs.length; i++){

clickBoxs[i].onclick = iteratorFactory(i)

}
数组去重 es6 数组去重 (更加简单)
const o = Array.from(new Set(x));
异步加载 async await 程序按顺序执行

学习ES6的基本语法网址
ttps://segmentfault.com/a/1190000004365693u

相关文章
|
7天前
|
前端开发 JavaScript 网络架构
|
3月前
ES6常用知识小结
ES6常用知识小结
14 0
|
6月前
|
前端开发 JavaScript API
|
6月前
es_详解
es_详解
24 0
|
7月前
|
JavaScript 前端开发 索引
ES9,ES10
ES9,ES10
45 0
|
7月前
|
前端开发 索引
ES7,ES8
ES7,ES8
33 0
|
8月前
|
前端开发 JavaScript API
ES6-day03
ES6-day03
40 0
|
8月前
ES6 Day02
ES6 Day02
36 0
|
8月前
|
JSON 资源调度 JavaScript
ES6 Day01
ES6 Day01
45 0