`

javascript 闭包函数中的this理解

 
阅读更多

总结:个人认为 闭包返回的匿名函数的this作用域为此函数引用者的本身。

 

看代码吧:

var name="hello";

var object={
     name:"my Object",
     getName:function (){
          return function(){
               return this.name;
           }
     }
}

var zhangsan = object.getName();
alert(zhangsan());

 这边代码中 object的getName方法返回了一个匿名函数.函数中调用了this.

alert的结果为:hello;

为什么呢?因为  var zhangsan = object.getName();的时候 zhangsan 为全局变量.代码变为

var zhangsan = function(){
   return  this.name;
}

 此时的this.表示window。所以alert为hello;

改写上边代码

var name="hello";

var object={
  name:"my Object",
     getName:function (){
          return function(){
               return this.name;
           }
     }
}

var tt={
  name:"my tt",
    getName:object.getName()
}

alert(tt.getName());

 此时.alert输出的为tt的name:my tt

因为object.getName()返回的匿名函数赋值给了tt对象上的一个属性。所以执行匿名函数时this的作用域为tt.

##或者这样可能更清晰的理解。把getName的方法引用重新赋值给object对象

 object.cc = object.getName();  
alert(object.cc()); 

 结果为my Object!

 

当然为了不让匿名函数费劲的去寻找作用域可以这么写:

var name="hello";

var object={
  name:"my Object",
     getName:function (){
          var $this = this;
          return function(){
               return $this.name;
           }
     }
}

alert(object.getName()())

 得到结果为 myObject 在return匿名函数之前,把this赋值给一个变量.所以执行时$this为object。name值自然得到保留

分享到:
评论

相关推荐

    深入理解JavaScript系列

    深入理解JavaScript系列(16):闭包(Closures) 深入理解JavaScript系列(17):面向对象编程之一般理论 深入理解JavaScript系列(18):面向对象编程之ECMAScript实现 深入理解JavaScript系列(19):求值策略...

    深入理解JavaScript系列(.chm)

    深入理解JavaScript系列(13):This Yes this 深入理解JavaScript系列(14):作用域链 Scope Chain 深入理解JavaScript系列(15):函数(Functions) 深入理解JavaScript系列(16):闭包(Closures) 深入...

    深入理解JavaScript系列.chm

    该文档是根据博客园汤姆大叔的深入理解JavaScript系列(http://www.cnblogs.com/TomXu/archive/2011/12/15/2288411.html)博文整理而成,主要内容包括: 1.编写高质量JavaScript代码的基本要点 2.揭秘命名函数...

    JavaScript详解(第2版)

    1.4 JavaScript及其在Web页面中的位置 3 1.5 Ajax是什么 5 1.6 JavaScript是什么样子的 6 1.7 JavaScript及其在Web开发中承担的角色 7 1.8 JavaScript和事件 9 1.9 标准化JavaScript和W3C 11 1.9.1 ...

    浅谈javascript中的闭包

    很长一段时间不理解闭包,后来了解了作用域,以及this相关问题才理解了闭包相关知识。 闭包(closure),也是面试题常客。简单点来说就是函数嵌套函数。 函数作为返回值: function foo () { var a = 1; return ...

    JavaScript中的this陷阱的最全收集并整理(没有之一)

    提及JavaScript的精髓,this、闭包、作用域链、函数是当之无愧的。这门语言正式因为这几个东西而变得魅力无穷。  博客的标题是《JavaScript中的this陷阱的最全收集–没有之一》,很显然这篇博客阐述的是this。相信...

    JavaScript作用域链实例详解

    对于JavaScript而言,理解作用域更加重要,因为在JavaScript中,作用域可以用来确定this的值,并且JavaScript有闭包,闭包是可以访问外部环境的作用域的。 每一个JavaScript的函数都是Function对象的一个实例,...

    [JavaScript.DOM高级程序设计](加)桑贝斯.扫描版.part1.rar

     1.3 JavaScript语法中常见的陷阱   1.3.1 区分大小写   1.3.2 单引号与双引号   1.3.3 换行   1.3.4 可选的分号和花括号   1.3.5 重载(并非真正的重载)   1.3.6 匿名函数   1.3.7 作用域...

    简单理解JavaScript中的封装与继承特性

    JavaScript中的封装 封装简单地说就是让外界只能访问对象的共有变量和函数,隐藏细节和数据。 js中有三种方法创建对象,分别为门户大开型、用命名规范区分私有变量、闭包创建真正的私有变量三种。 1.门户大开型,是...

    [JavaScript.DOM高级程序设计](加)桑贝斯.扫描版.part3.rar

     1.3 JavaScript语法中常见的陷阱   1.3.1 区分大小写   1.3.2 单引号与双引号   1.3.3 换行   1.3.4 可选的分号和花括号   1.3.5 重载(并非真正的重载)   1.3.6 匿名函数   1.3.7 作用域...

    [JavaScript.DOM高级程序设计](加)桑贝斯.扫描版.part2.rar

     1.3 JavaScript语法中常见的陷阱   1.3.1 区分大小写   1.3.2 单引号与双引号   1.3.3 换行   1.3.4 可选的分号和花括号   1.3.5 重载(并非真正的重载)   1.3.6 匿名函数   1.3.7 作用域...

    理解javascript封装

    在JavaScript中,并没有显示的声明私有成员的关键字等。所以要想实现封装/信息隐藏就需要从另外的思路出发。我们可以使用闭包的概念来创建只允许从对象内部访问的方法和属性,来达到封装的要求。 基本方式 一般来说...

    关于JavaScript作用域你想知道的一切

    这篇文章主要目的帮助理解JavaScript中的一些概念如:scope,closure, this, namespace, function scope, global scope, lexical scope and public/private scope. 希望从这篇文章中能回答如下的问题: 什么是作用域...

    通过JS运行机制的角度说说作用域

    JS中的作用域、闭包、this机制和原型往往是最难理解的概念之一。笔者将通过几篇文章和大家谈谈自己的理解,希望对大家的学习有一些帮助。如果有什么理解偏差的地方,希望大家可以评论指出,相互学习。 有过一定编程...

    LearningJS

    学习JS蓬松的鸟参照的Flappy Bird,大致的知识点类,DOM事件,计时器,画布几个知识点的加深理解 var that = this的作用(闭包,this指针)目前还有几个常量不是很理解,玩起来速度有点快JavaScript30第一天:...

    JavaScript高级教程

    3.4.3 关键字 this. 76 3.5 定义类或对象..............................................78 3.5.1 工厂方式..............................................78 3.5.2 构造函数方式...................................

    interview-question:收集一些面试题

    interview-question 题目列表 CSS JavaScript 6. 函数节流和防抖的概念以及常见的...20. this的理解 21. 实现一个new 23. 模拟实现call、apply 24. 模拟实现bind函数 25. JavaScript内存机制 26. v8引擎执行js代码的过

    freemarker总结

    这里所说的空值,实际上也包括那些并不存在的变量,对于一个Java的 null值而言,我们认为这个变量是存在的,只是它的值为null,但对于FreeMarker模板而言,它无法理解null值,null值和不存在的变 量完全相同. 为了处理缺失...

Global site tag (gtag.js) - Google Analytics