JavaScript中的作用域和闭包
首先强烈安利《你不知道的JavaScript》,JS初学者进阶必读。
对于从C++、Java等静态语言转向JavaScript的初学者(比如我)来说,JS一些与众不同而又十分要紧的特性使得它显得十分诡异而难以捉摸,为此必须下一番大力气,一边啃书一边实践将这些概念彻底搞懂,然后才谈得上进一步学习前端姿势。(注:本文里的JS以ECMAScript 5(ES5)为准,ES6的新特性我也是刚刚接触,希望今后能与大家一起学习探讨。)
熟悉Java的童鞋在初学JS时,必须要牢记一点:
JS中没有块级作用域!
{
var test=10;
}
console.log(test); // 控制台输出:10
纳尼?是不是看着很别扭?还有更坑爹的:
var obj={
test:10,
myFunc:function(){
console.log(test);
}
};
obj.myfunc(); // 出错,或者IDE直接报警了
同一个对象,自己的函数都不认自己的属性了?
还真是。
对于初学者而言,可以这样认为:除了全局作用域之外,JS只有一种作用域,即函数作用域。(try catch{}语句也可以定义作用域,不过目前为止我还没实际用过)
也就是说,写在函数体内的变量,只要不是嵌套在更深层的函数里,就是处在同一作用域的,“互相可见”;而其他的花括号,不管是for后跟的,if后跟的,还是对象字面量的,一概“不作数”,起不到定义作用域的效果,变量声明写在那些花括号的里面或外面都一样。
那位于嵌套的函数里的作用域呢?它们享有“单向透明”的特权,即:在较内层次的作用域内可以访问较外层次作用域里的变量,反之则不行。
function outerFunc(){
for(var i=0;i<10;i++){doSomething;}
console.log(i); // 控制台输出10,因为i位于outerFunc的作用域
var outer = 10;
function innerFunc(){
var inner = outer; // 内层作用域可以访问外层作用域里的变量
}
console.log(inner); // 报错,外层作用域访问不到内层作用域里的变量
}
再来分析上一个例子。我们试图在myFunc的作用域内部访问test,然而test并不是一个“与myFunc位于同一个对象作用域”的变量,事实上根本不存在“对象作用域”这回事,test是obj的一个属性,不是一个“独立”的变量,要访问test只能通过点运算符obj.test或obj["test"],哪怕是在myFunc内部。当然,myFunc内部可以访问到obj这个位于外层作用域的变量,没有问题。于是将代码改写如下:
var obj={
test:10,
myFunc:function(){
console.log(obj.test);
}
};
obj.myfunc(); //
既然在内层作用域里可以访问外层作用域,那么就产生了一个有趣的现象,叫做“闭包”。制造一个闭包只需要两步:
1.在内层函数里引用外层函数的变量
2.将内层函数作为外层函数的返回值返回出去
function outer(){
var test = 10;
var inner = function(){
console.log(test++);
};
return inner;
} var myFunc = outer(); // 将outer的返回值(inner函数)赋给myFunc
myFunc(); //
myFunc(); //
myFunc(); //
这个被返回的inner函数就是一个闭包。虽然outer函数运行结束了,但它的内部变量test因为被闭包引用,所以并没有被销毁,而是被保存了起来,并且可以通过闭包继续操作。当然,外界永远无法访问test这个变量,它成了inner(以及myFunc)所指向的函数的“私有变量”。
JavaScript中的作用域和闭包的更多相关文章
- Javascript中关于作用域和闭包和域解释的面试题
<script type="text/javascript"> function fn() { var i = 10; return function (n) { co ...
- 认识javascript中的作用域和上下文
javascript中的作用域(scope)和上下文(context)是这门语言的独到之处,这部分归功于他们带来的灵活性.每个函数有不同的变量上下文和作用域.这些概念是javascript中一些强大的 ...
- 深入理解JavaScript中的作用域和上下文
介绍 JavaScript中有一个被称为作用域(Scope)的特性.虽然对于许多新手开发者来说,作用域的概念并不是很容易理解,我会尽我所能用最简单的方式来解释作用域.理解作用域将使你的代码脱颖而出,减 ...
- JavaScript中的作用域
很多(JavaScript)开发者都在讨论"作用域",但它是什么?它们在JavaScript中的任何地方!我发现很多年轻的开发者不知道作用域是什么.他们中大多数人可以用jQuery ...
- 前端学习 第六弹: javascript中的函数与闭包
前端学习 第六弹: javascript中的函数与闭包 当function里嵌套function时,内部的function可以访问外部function里的变量 function foo(x) { ...
- 【翻译】JavaScript中的作用域和声明提前
原文:http://www.adequatelygood.com/JavaScript-Scoping-and-Hoisting.html ===翻译开始=== 你知道下面的JavaScript脚本执 ...
- JavaScript中的作用域和声明提前
[翻译]JavaScript中的作用域和声明提前 原文:http://www.adequatelygood.com/JavaScript-Scoping-and-Hoisting.html ===翻译 ...
- javascript(面向对象,作用域,闭包,设计模式等)
javascript(面向对象,作用域,闭包,设计模式等) 1. 常用js类定义的方法有哪些? 参考答案:主要有构造函数原型和对象创建两种方法.原型法是通用老方法,对象创建是ES5推荐使用的方法.目前 ...
- 漫谈JavaScript中的作用域(scope)
什么是作用域 程序的执行,离不开作用域,也必须在作用域中才能将代码正确的执行. 所以作用域到底是什么,通俗的说,可以这样理解:作用域就是定义变量的位置,是变量和函数的可访问范围,控制着变量和函数的可见 ...
随机推荐
- NopCommerce架构分析(转载)
原文 一,NopCommerce架构分析之开篇 NopCommerce是.net开源项目中比较成熟的一款业务应用框架,也是电子商务系统中的典范.所以很想多学习一下里面的设计和实现方式. 二,NopCo ...
- Android项目开发全程(三)-- 项目的前期搭建、网络请求封装是怎样实现的
在前两篇博文中已经做了铺垫,下面咱们就可以用前面介绍过的内容开始做一个小项目了(项目中会用到Afinal框架,不会用Afinal的童鞋可以先看一下上一篇博文),正所谓麻雀虽小,五脏俱全,这在里我会尽量 ...
- linux vi快捷键大全
h或^h 向左移一个字符 j或^j或^n 向下移一行 k或^p 向上移一行 l或空格 向右移一个字符 G 移到文件的最后一行 nG 移到文件的第n行 w 移到下一个字的开头 W 移到下一个字的开头,忽 ...
- poj 2828 Buy Tickets【线段树单点更新】【逆序输入】
Buy Tickets Time Limit: 4000MS Memory Limit: 65536K Total Submissions: 16273 Accepted: 8098 Desc ...
- hdoj 1896 Stones【优先队列】
Stones Time Limit: 5000/3000 MS (Java/Others) Memory Limit: 65535/32768 K (Java/Others)Total Subm ...
- linux下avr单片机开发:中断服务程序
不管是什么单片机程序,中断总是非常重要的一部分 ,linux 下的avr开发,主要是依靠avr-gcc,以及avr-libc,它们对中断程序的格式要求,与window下的icc-avr以及win-av ...
- Junit 断言 assertThat Hamcrest匹配器
junit断言总结本文参考了http://blog.csdn.net/wangpeng047/article/details/9628449一 junit断言1.JUnit框架用一组assert方法封 ...
- java利用commons-email发送邮件并进行封装
本例中利用commons-email发送邮件并进行封装,支持html内容和附件:Commons Email是Apache的Commons子项目下的一个邮件客户端组件,它是基于JavaMail的,大大简 ...
- 加速数组操作(Array)
Measure-Command { $ar = @() for ($x=0; $x -lt 10000; $x++) { $ar += $x } }执行结果:3.301s Measure-Comman ...
- C# richTextBox编辑器
附件:http://files.cnblogs.com/xe2011/CSHARP_RichTextBoxEditor.rar 完整的转到这里 http://www.cnblogs.com/xe201 ...