请见如下一个闭包示例:

color = "red";
var obj = {
color: "blue",
getColor: function () {
function displayColor() {
return this.color;
}
return displayColor();
}
}
console.log(obj.getColor());

在getColor函数内部再定义了一个displayColor,再又定义了一个displayColor函数,从而形成闭包,最后将地上displayColor函数返回,这里发现这样定义其实作用不大,可以使用匿名函数替代直接返回:

color = "red";
var obj = {
color:"blue",
getColor: function () {
return function() {
return this.color;
}
}
}
console.log(obj.getColor()()); //输出 red

闭包中匿名函数和this对象

在javascript 中this 对象是基于函数的执行环境绑定的:在全局函数中, this等于全局环境即 window (浏览器环境)或者globle(node中),而当函数作为某个对象的方法调用时this等于该对象。不过匿名函数的执行环境具有全局性,其this 通常指向window(浏览器)或者globle(node环境),因此上面例子中,输出的是全局对象的 color定义。

为什么没有获得闭包外面定义的blue呢?

如前文所述,函数被调用时,其活动对象会取得两个特殊的变量,arguments和this,因此在搜索的时候在作用域链的最前端即当前活动对象中就查找到了,不会进一步向上层查找。不过我们可以把外部作用域的this对象保存在一个闭包能够访问到的变量里,这样就能够访问外层对象了:

color = "red";
var obj = {
color:"blue",
getColor: function () {
var self=this;
return function() {
return self.color;
}
}
}
console.log(obj.getColor()()); //输出 blue

最后,看一道百度2015年 前端开发南京站笔试题:

var myObject = {
foo: "bar",
func: function() {
var self = this;
console.log("outer func: this.foo = " + this.foo); //输出 bar
console.log("outer func: self.foo = " + self.foo); //输出 bar
(function() {
console.log("inner func: this.foo = " + this.foo); //输出 undefined
console.log("inner func: self.foo = " + self.foo); //输出 bar
}());
}
};
myObject.func();

问,输出结果是什么? 相信现在应该比较好理解了。

Javascript 匿名函数与闭包的更多相关文章

  1. 第一百一十节,JavaScript匿名函数和闭包

    JavaScript匿名函数和闭包 学习要点: 1.匿名函数 2.闭包 匿名函数就是没有名字的函数,闭包是可访问一个函数作用域里变量的函数.声明:本节内容需要有面向对象和少量设计模式基础,否则无法听懂 ...

  2. [从jQuery看JavaScript]-匿名函数与闭包(Anonymous Function and Closure)【转】

    (function(){ //这里忽略jQuery所有实现 })(); 半年前初次接触jQuery的时候,我也像其他人一样很兴奋地想看看源码是什么样的.然而,在看到源码的第一眼,我就迷糊了.为什么只有 ...

  3. 浅谈JavaScript匿名函数与闭包

    一. 匿名函数   //普通函数定义: //单独的匿名函数是无法运行的.就算运行了,也无法调用,因为没有名称. 如: function(){             alert('123');    ...

  4. 深入理解javascript 匿名函数和闭包

    代码如下: (function(){ //这里忽略jQuery所有实现 })(); (function(){ //这里忽略jQuery所有实现 })();  半年前初次接触jQuery的时候,我也像其 ...

  5. [从jQuery看JavaScript]-匿名函数与闭包

    jQuery片段: (function(){ //这里忽略jQuery所有实现 })(); 半年前初次接触jQuery的时候,我也像其他人一样很兴奋地想看看源码是什么样的.然而,在看到源码的第一眼,我 ...

  6. 详谈JavaScript 匿名函数及闭包

    1.匿名函数函数是JavaScript中最灵活的一种对象,这里只是讲解其匿名函数的用途.匿名函数:就是没有函数名的函数. 1.1 函数的定义,首先简单介绍一下函数的定义,大致可分为三种方式 第一种:这 ...

  7. javascript 匿名函数及闭包----转载

    网上很多解释,我无法理解,我想知道原理...这篇文章应该可以透彻一点Query片段:view plaincopy to clipboardprint? (function(){      //这里忽略 ...

  8. [从jQuery看JavaScript]-匿名函数与闭包(Anonymous Function and Closure)

    http://blog.csdn.net/natineprince/article/details/4759533   jQuery片段: (function(){ //这里忽略jQuery所有实现 ...

  9. javascript匿名函数及闭包深入理解及应用

    1.匿名函数 函数是JavaScript中最灵活的一种对象,这里只是讲解其匿名函数的用途.匿名函数:就是没有函数名的函数. 1.1 函数的定义,首先简单介绍一下函数的定义,大致可分为三种方式 第一种: ...

随机推荐

  1. VBA操作word生成sql语句

    项目开始一般都是用word保存下数据库的文档 但是从表单一个一个的建表实在是很困难乏味,查查资料 1.可以生成一个html或者xml,检索结构生成sql.但是这个方式也蛮麻烦 2.查到vba可以操作w ...

  2. ASP.NETCore学习记录(二) —— ASP.NET Core 中间件

    ASP.NET Core 中间件 目录: 什么是中间件 ? IApplicationBuilder 使用 IApplicationBuilder 创建中间件 Run.Map 与 Use 方法 实战中间 ...

  3. iframe 自适应高度和宽度

    <iframe src="pay/index.aspx" marginheight="0" marginwidth="0" frame ...

  4. 10-04 Java 权限修饰符,类及其组成常见的修饰符

    四种权限修饰符的测试 /* 权限修饰符: 本类 同一个包下(子类和无关类) 不同包下(子类) 不同包下(无关类) private Y 默认 Y Y protected Y Y Y public Y Y ...

  5. [umbraco] 数据结构

    我想此图就能说明一切了,不需要再废话了

  6. (转)IBM AppScan 安全漏洞问题修复(.net)

    原文:https://www.cnblogs.com/anngeiBKY/p/4952269.html 按问题类型分类的问题 使用 SQL 注入的认证旁路2 已解密的登录请求3 登录错误消息凭证枚举1 ...

  7. 全网最详细的Windows系统里PLSQL Developer 64bit的下载与安装过程(图文详解)

    不多说,直接上干货! ORACLE是数据库,有客户端和服务器: 其,具体下载,可见http://www.oracle.com/technetwork/database/enterprise-editi ...

  8. [Python 从入门到放弃] 6. 文件与异常(二)

    本章所用test.txt文件可以在( [Python 从入门到放弃] 6. 文件与异常(一))找到并自行创建 现在有个需求,对test.txt中的文本内容进行修改: (1)将期间的‘:’改为‘ sai ...

  9. rabbitmq 生产环境配置

    目录 一 rabbitmq 生产部署 1.1 rabbitmq.conf 1.2 advanced.config 1.3 rabbitmq-env.conf 1.4 在生产环境中不适用的策略. 一 r ...

  10. 插入排序:直接插入排序&希尔排序

    一.直接插入排序 1. 思想 直接排序法, 可以分为两个部分, 一部分是有序的, 一部分是无序的. 从这个图上, 应该是能看清楚直接插入排序的思想了. 将无序部分的第一个与有序部分进行比较. 从有序部 ...