FED实验室 - 专注WEB端开发和用户体验

Javascript中模拟块级作用域

点滴Javascript 煦涵 2327℃ 0评论

Javascript不像面向对象的编程语言一样,存在块级作用域,但是我们可以模拟。本文主要讲述如何在javascript中模拟块级作用域。先来看一个例子:

	var avatar = "Ang";
	var element = "Air";

	var elements = [
	    "Air",
	    "Earth",
	    "Fire",
	    "Water"
	];

	for (var i = 0; i < elements.length; i++) {
	    var element = elements[i];
	    console.log(avatar + " has mastered " + element);
	}

	// Outputs: "Ang's primary element is Water"
	console.log(avatar + "'s primary element is " + element);

上例输出了 “Ang’s primary element is Water”,原意我们可能想输出”Ang’s primary element is Air”,那如何解决这个问题呢,思考之余联想到闭包:

	var avatar = "Ang";
	var element = "Air";

	var elements = [
	    "Air",
	    "Earth",
	    "Fire",
	    "Water"
	];

	for (var i = 0; i < elements.length; i++) {
		(function() {
		    var element = elements[i];
		    console.log(avatar + " has mastered " + element);
		})();
	}

	// Outputs: Ang's primary element is Air 
	console.log(avatar + "'s primary element is " + element);

修改后达到我们原想输出的结果。

另:ES5的下一个版本ES6已经增加了块级作用域变量let,到时我们可以更方法的使用块级作用域。如果你想进一步了解let及浏览器支持情况,可以戳这里

 

下面是「FED实验室」的微信公众号二维码,欢迎扫描关注:

FED实验室

行文不易,如有帮助,欢迎打赏!

赞赏支持 喜欢 (0)
捐赠共勉
发表我的评论
取消评论

表情

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址
(1)个小伙伴在吐槽