在JavaScript的大千世界中,this对象就像一个行踪不定、居无定所的浪子一般,它的生活仿佛可以随处而安,而内心却又似有着笃定的坚守,它就是这么有趣!

初学JavaScript时的我们,多多少少都拜访过this,却又总是找不准时机,屡屡与其擦肩而过。其实this一直就在那里,不离不弃。

我们要记住一句话:this永远指向函数运行时所在的对象!而不是函数被创建时所在的对象。切记…

本文将分三种情况来分析this对象到底身处何方。

普通函数中的this

无论this身处何处,第一要务就是要找到函数运行时的位置。

var name="全局";
function getName(){
var name="局部";
return this.name;
};
alert(getName());

当this出现在全局环境的函数getName中时,此时函数getName运行时的位置在

alert(getName());

显然,函数getName所在的对象是全局对象,即window,因此this的安身之处定然在window。此时的this指向window对象,则getName返回的this.name其实是window.name,因此alert出来的是“全局”!

那么,当this不是出现在全局环境的函数中,而是出现在局部环境的函数中时,又会身陷何方呢?

var name="全局";
var twobin={
name:"局部",
getName:function(){
return this.name;
}
};
alert(twobin.getName());

其中this身处的函数getName不是在全局环境中,而是处在twobin环境中。无论this身处何处,一定要找到函数运行时的位置。此时函数getName运行时的位置

alert(twobin.getName());

显然,函数getName所在的对象是twobin,因此this的安身之处定然在twobin,即指向twobin对象,则getName返回的this.name其实是twobin.name,因此alert出来的是“局部”!

闭包中的this

闭包也是个不安分子,本文暂且不对其过于赘述,简而言之:所谓闭包就是在一个函数内部创建另一个函数,且内部函数访问了外部的变量。

浪子this与痞子闭包混在一起,可见将永无宁日啊!

var name="全局";
var twobin={
name:"局部",
getName:function(){
return function(){
return this.name;
};
}
};
alert(twobin.getName()());

此时的this明显身处困境,竟然处在getName函数中的匿名函数里面,而该匿名函数又调用了变量name,因此构成了闭包,即this身处闭包中。

无论this身处何处,一定要找到函数运行时的位置。此时不能根据函数getName运行时的位置来判断,而是根据匿名函数的运行时位置来判断。

function (){

return this.name;

};

显然,匿名函数所在的对象是window,因此this的安身之处定然在window,则匿名函数返回的this.name其实是window.name,因此alert出来的就是“全局”!

那么,如何在闭包中使得this身处在twobin中呢?

var name="全局";
var twobin={
name:"局部",
getName:function(){
var that=this;
return function(){
return that.name;
};
}
};
alert(twobin.getName()());

在getName函数中定义that=this,此时getName函数运行时位置在

alert(twobin.getName());

则this指向twobin对象,因此that也指向twobin对象。在闭包的匿名函数中返回that.name,则此时返回的that.name其实是twobin.name,因此就可以alert出来 “局部”!

call与apply中的this

在JavaScript中能管的住this的估计也就非call与apply莫属了。

call与apply就像this的父母一般,让this住哪它就得住哪,不得不听话!

var name="全局";
var twobin={
name:"局部",
};
function getName(){
alert(this.name);
}
getName(twobin);
getName.call(twobin);

其中this身处函数getName中。无论this身处何处,一定要找到函数运行时的位置。此时函数getName运行时的位置

getName(twobin);

显然,函数getName所在的对象是window,因此this的安身之处定然在window,即指向window对象,则getName返回的this.name其实是window.name,因此alert出来的是“全局”!

那么,该call与apply登场了,因为this必须听他们的指挥!

getName.call(twobin);

其中,call指定this的安身之处就是在twobin对象,因为this被迫只能在twobin那安家,则此时this指向twobin对象, this.name其实是twobin.name,因此alert出来的是“局部”!

一点总结

浪子this:永远指向函数运行时所在的对象,而不是函数被创建时所在的对象;如果处在匿名函数中或不处于任何对象中,则this指向window对象;如果是call或apply,它指定哪个对象,则this就指向哪个对象!

this的安身之处的更多相关文章

  1. 详解js和jquery里的this关键字

    详解js和jquery里的this关键字 js中的this 我们要记住:this永远指向函数运行时所在的对象!而不是函数被创建时所在的对象.this对象是在运行时基于函数的执行环境绑定的,在全局环境中 ...

  2. 不安分的this

    不安分的this 前言:关于javascript中的this,上网一搜一大片的文章.惊! 而我个人认为要想分清this,就有必要先搞清楚“对象”. 目录: 一.函数对象的认识 二.this 一.函数对 ...

  3. 你不知道的JavaScript--Item21 漂移的this

    而在 JavaScript 中,this 是动态绑定,或称为运行期绑定的,这就导致 JavaScript 中的 this 关键字有能力具备多重含义,带来灵活性的同时,也为初学者带来不少困惑.本文仅就这 ...

  4. javascript的this关键字

    this永远指向函数运行时所在的对象!而不是函数被创建时所在的对象.也即:谁调用,指向谁.切记… 1.普通函数中的this 无论this身处何处,第一要务就是要找到函数运行时的位置. var name ...

  5. keywords in my life

    在脑子里出现的灵光一现的话语总是美好的: 1.当你试图站在人的发展,历史的发展的角度上看待问题,会发现我们身上所发生的任何事情都是必然的. 2.永远不要以好人的身份去看待和分析一件事情. 3.历史悲剧 ...

  6. Pattern recognition and machine learning 疑难处汇总

    不断更新ing......... p141 para 1. 当一个x对应的t值不止一个时,Gaussian nosie assumption就不合适了.因为Gaussian 是unimodal的,这意 ...

  7. CSS预处器的对比——Sass、Less和Stylus

    预处器的对比--Sass.LESS和Stylus 转载: 英文原文:http://net.tutsplus.com/tutorials/html-css-techniques/sass-vs-less ...

  8. 数据库(SQL Server)管理数据库表~新奇之处

    说到“数据库”,我总有一种莫名的感觉,在刚刚接触到的数据库中就让我似懂非懂渡过着,于是思考着.于是在冷静的时空中让我回想到了很多的知识,不知你们是怎样过来的,真心希望我的这篇数据库总结能够让我们都有一 ...

  9. Autocad 2012 win7(64位)启动时一直卡在acmgd.dll处的解决方案

    安装Autocad 2012后,激活成功后,无法正常启动,一直卡在加载acmgd.dll 通过Procmon监控后发现加载C:\Windows\fonts\AdobeFnt11.lst处出错, 通过命 ...

随机推荐

  1. 查看Linux系统版本与位数

    查看系统发行版信息 查看LSB (Linux Standard Base)本身的版本信息. .el5   .el5 .el5 -bit LSB executable, Intel 80386, ver ...

  2. FragmentActivity_左右滑动的碎片

    test1.xml <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:an ...

  3. css定位学习经验记录

    之前了解到css的定位position属性,常用的三种: position:absolute 1.当父元素定位为relative时,以父元素为起始坐标定位. 2.当父元素没有定位时,以body为起始坐 ...

  4. Ubuntu14.04下安装docker

    http://www.cnblogs.com/xiaoluosun/p/5520510.html

  5. Holographic Remoting

    看到微软官方的 Holographic Remoting Player https://developer.microsoft.com/en-us/windows/holographic/hologr ...

  6. 历年NOIP水题泛做

    快noip了就乱做一下历年的noip题目咯.. noip2014 飞扬的小鸟 其实这道题并不是很难,但是就有点难搞 听说男神错了一个小时.. 就是$f_{i,j}$表示在第$i$个位置高度为$j$的时 ...

  7. Java Servlet规范

    截自网址:http://blog.csdn.net/u010391029/article/details/46521051 JavaServlet Specification  Version 2.3 ...

  8. Winform中创建超链接,点击跳转网页

    代码如下: System.Diagnostics.Process ie = new System.Diagnostics.Process();ie.StartInfo.FileName = " ...

  9. EF CodeFirst 使用T4模板 生成文件

    小编是个实用主义者,并没有深入的去理解T4的原理.只是根据自己的需求,在博客园里的前辈哪里找的资料,结合自己的理解,在项目中使用了T4模板. 最近的项目用了他,很方便,节省了不少代码量. 想利用T4做 ...

  10. js学习笔记

    javacript笔记根据EC5.0一共有六种数据类型:number,string,bool undefine,nullobject(广义的) --->object(狭义的),array,fun ...