前言:高程这本书真是神奇,每复习一遍,都会有新的收获。话说我看书有个习惯,要是看得似懂非懂的地方就喜欢打个“?”。这次看到高程第七章“函数表达式”关于闭包与this对象的部分,发现已经积攒了2个问号了。之前过了两遍都没有完全弄明白!

  好在如今对this的指向、函数的理解已经今非昔比,这一次终于让我打通这条堵塞的经脉,让他融入我的知识体系了!!想想真是有些小激动呢~~

目的:一句话,本文就是解释为什么如下两篇代码中this.name的指向不同。

var name = "The Window";
  var object = {
    name : "My Object",
    getNameFunc : function(){
      return function(){
        return this.name;
      };
    }
  };
alert(object.getNameFunc()()); //The Window
var name = "The Window";
  var object = {
    name : "My Object",
    getNameFunc : function(){
      var that = this;
      return function(){
        return that.name;
      };
    }
  };
alert(object.getNameFunc()()); //My Object

正文:首先,我们得知道当函数调用过程中发生了什么。

  当函数被调用时,会自动创建两个变量:this和arguments。这两个变量有个特点,他们的搜索范围仅限被调用函数的活动对象。什么意思呢?arguments对象大家一定很清楚,保存函数的传参的副本。看如下代码:

function father (a) {
var result=a;
var result2=null;
function son (a) {
result2=a;
}
return result+" and "+result2;
}
father(123); //"123 and null"

  这里创建了两个函数,father和son,其中son作为father函数内部的函数。 他们都接受传参a。在这里我们传入传参123,返回father与son获得的传参结果。

  结果显示father的传参为123,而son的传参为null,这个结果是显而易见的。在这里贴这么弱智的代码的用意是想说明son在搜索a这个变量时只搜索自己的活动变量而不会通过作用域链向上到father中去搜索。同样的道理使用于this。

var name = "The Window";
  var object = {
    name : "My Object",
    getNameFunc : function(){
      return function(){
        return this.name;
      };
    }
  };
alert(object.getNameFunc()()); //The Window

  这里最内层匿名函数this为什么指向的是window而不是他的上层函数getNameFunc。之前已经说明了this作为特殊的变量他的搜索范围同arguments一样仅限于自身的活动对象。也就是说内层匿名函数的this就算在自己这儿搜不到结果也不会再去他的上层函数getNameFunc中搜索。这个问题可以等同于——最内层匿名函数的this为什么指向的是window?

  如果我们将最后的结果赋给一个变量来说明会简单汗多。

var result=object.getNameFunc()();

  result变量是一个全局变量,他保存的指针指向getNameFunc最内层匿名函数的结果。访问这个变量其实调用的不是getNameFunc函数,而是getNameFunc内部的匿名函数。也就是说这个匿名函数是在全局作用域中调用的,那么匿名函数的this理所当然的指向window。

  有了前面的解释,第二段代码就很好解释了。

var name = "The Window";
  var object = {
    name : "My Object",
    getNameFunc : function(){
      var that = this;
      return function(){
        return that.name;
      };
    }
  };
alert(object.getNameFunc()()); //My Object

  getNameFunc函数用that变量保存了他的this的指向,并在匿名函数中调用that变量。匿名函数在自己的活动对象中搜索到了that,并向上通过作用域链找到了that的出处。结果就显而易见了。

口水话 闭包中this的指向的更多相关文章

  1. JS中关于闭包和this的指向

    闭包个人理解   函数内部还有一个函数,其作用就是可以访问上一层函数中的变量 下面的案例中函数内部有函数,this的指向就变为window了 结果闭包中this指向的两种方法 1.call对象冒充可以 ...

  2. js闭包中的this(匿名函数中的this指向的是windows)

    js闭包中的this(匿名函数中的this指向的是windows) 一.总结 1.普通函数中的this指向的是对象,匿名函数中的this指向的是windows,和全局变量一样 2.让匿名函数中的thi ...

  3. 箭头函数,闭包函数中的this指向

    在javscript中,this 是在函数运行时自动生成的一个内部指针,它指向函数的调用者. 箭头函数有些不同,它的this是继承而来, 默认指向在定义它时所处的对象(宿主对象),而不是执行时的对象. ...

  4. 关于javascript闭包中的this对象

    我们知道, this对象是运行时基于函数的执行环境绑定的:在全局函数中,this等于window,而当函数被作为某个对象的方法调用时,this等于那个对象.<Javascript高级程序设计&g ...

  5. JavaScript 中的this指向问题

    全局执行     首先,我们在全局环境中看看它的 this 是什么:     浏览器:     console.log(this);     // Window {speechSynthesis: S ...

  6. 理解js中this的指向

         学习自原文  http://www.cnblogs.com/pssp/p/5216085.html后的一点小结(原文作者总结的很棒^_^)! 关于js中this的指向,在函数定义的时候还无法 ...

  7. javascript中的this指向问题

    在深入学习JavaScript之后,我们越来越多的会遇到函数或者在对象内部中,对于this的指向问题的疑惑,其实基本上每一个编程语言中都有一个this,这个this的指向都是大同小异,你也可以汉化它的 ...

  8. 关于setInterval和setTImeout中的this指向问题

    前些天在练习写一个小例子的时候用到了定时器,发现在setInterval和setTimeout中传入函数时,函数中的this会指向window对象,如下例: var num = 0; function ...

  9. 闭包中的 this 对象

    关于this对象 在闭包中使用this对象也可能会导致一些问题.this对象是在运行时基于函数的执行环境绑定的:在全局函数中,this等于window, function createFunction ...

随机推荐

  1. jQuery与Ajax的应用——《锋利的jQuery》(第2版)读书笔记3

    第6章 jQuery与Ajax的应用 jQuery对Ajax操作进行了封装,在jQuery中$.ajax()方法属于最底层的方法,第2层是load().$.get()和$.post()方法,第3层是$ ...

  2. OO基本原则

    1. 单一职责原则(SRP)     一个类应该最多只能有一个因素能够给导致其变化,类中的方法应该都是相关性很高的,即"高内聚"   2. 开放-封闭原则(OC)      - 扩 ...

  3. C# 闭包

    1. 首先要说明的是, delegate 被编译器 编译成一个class, 所以才能传来传去(具体参考 <CLR via C#>第四版), 所以 Action.Func也是如此 2. 在C ...

  4. JAVA面向对象初步知识总结:封装、继承、多态

    1.封装 把数据和方法包装进类中,以及具体实现的隐藏,常共同被称作是是封装.其结果是一个同时带有特征和行为的数据类型.所谓具体实现的隐藏是通过访问权限控制实现的.JAVA 子类重写继承的方法时,不可以 ...

  5. redirect和forward

    1.重定向 <mvc:view-controller path="/" view-name="redirect:/admin/index"/>即如果 ...

  6. geoServer 发布geoTiff格式的DEM数据

    1/数据下载(首先感谢earthexplorer提供了免费的全球DEM数据) 下载地址  https://lta.cr.usgs.gov/GTOPO30  ,首先要注册才可以下载,登陆网站后点击get ...

  7. 第一章 jQuery基础方法回顾

    jQuery即JavaScript,它是一个.js文件(官网下载).使用时须将jQuery库的声明写在HTML文档的head标签里. 章节内容: 1.选择DOM节点 2.延迟的JavaScript的执 ...

  8. [Note] changing building platform from vs 2013 to vs community 2015

    The error turned out as "undefined linkage"(The same as you haven't use some function that ...

  9. 调用 WebService 浏览器提示 500 (Internal Server Error) 的原因及解决办法

    在 ASP.NET 开发中,WebService部署成站点之后,如果在本地测试WebService可以运行,在远程却显示“测试窗体只能用于来自本地计算机的请求”或 者"The test fo ...

  10. 学习Java,还需要学好哪些知识

    很多人认为学好一门程序语言就需要学好逻辑,其实这对于很多人而言是对的,但是真的对于需要写程序的学员来说,只有逻辑好其实是不够的,如果你能具备以下几项能够为你在程序编译中大大提高工作效率.现在昆明jav ...