一直以来,对this的讨论都是热门话题。有人说掌握了this就掌握了JavaScript的80%,说法有点夸张,但可见this的重要性。至今记录了很多关于this的零碎笔记,今天就来个小结。

  本人看过对this解释的最简单的说法:谁调用这个函数,this指向谁。 好啦,就是这么简单。下面再来具体说一下,请随时用这个说法去验证。

  先来看一道js面试题热热身:

var obj = {
foo: function(){
console.log(this)
}
} var bar = obj.foo
obj.foo() // obj
bar() // window

  obj.foo()套用“谁调用指向谁”的说法就很好理解了,但bar()为啥是window。其实,这个也是可以套用这个简单的说法。前面我们var了一个变量bar,请注意,这个bar是个全局变量,即bar===window.bar,并把函数obj.foo赋给bar,此时直接调用bar(),就等于window.bar()。这样就好理解了,这个函数就是window调用的,没毛病了。关于这道题的解释,也可以参考这篇文章:http://mp.weixin.qq.com/s/ksqtCd8ouxU-cVc_HnA4Aw

牢记这句话:“谁调用指向谁”,搞清谁调用的,解决大部分的this问题足够了。下面说几个this的特殊情况:

1、函数被具体对象调用时,指向直接调用者。如果这个函数里面嵌套有函数,里面函数的this不会指向这个调用者,可通过that=this改变指向。内部函数用that调用该对象属性。

var name="out";
var obj={
name:"in",
outFoo:function(){
var that=this;//将this赋给that,内部函数的that指向obj
function inFoo(){
this.name; // out,此时this指向window
that.name; // in,此时that指向obj
}
},
};

2、如果函数通过new调用,那么就会创建一个对象,并且this 指向新创建的对象。

function Foo(){
//var this=new Object();函数内部隐式默认创建this对象并返回this
this.name="foo";
//return this;
}
var obj=new Foo(); //将返回的this赋给obj
console.log(obj.name);// foo

3、setTimeOut、setInterval函数中的this指向window。

4、通过apply或call调用时,this会动态改变它的指向。这俩种方法都接受俩个参数,第一个都是调用这个函数的对象。用法:functionNmae.apply(调用的对象,参数2)。

5、通过bind()调用时,这个与前面两个用法差不多,只不过bind()静态绑定this,一旦绑定了就不会改变,即使用call或apply也没用,同时返回一个函数体待执行。

最后来一道js的this面试题:http://www.cnblogs.com/macq/p/6526809.html

  

附:别人面试阿里时的回答

描述一下this

  this,函数执行的上下文,可以通过apply,call,bind改变this的指向。

  对于匿名函数或者直接调用的函数来说,this指向全局上下文(浏览器为window,nodejs为global),剩下的函数调用,那就是谁调用它,this就指向谁。

  当然还有es6的箭头函数,箭头函数的指向取决于该箭头函数声明的位置,在哪里声明,this就指向哪里。

浅谈this那些事的更多相关文章

  1. 你用对锁了吗?浅谈 Java “锁” 事

    每个时代,都不会亏待会学习的人 大家好,我是yes. 本来打算继续写消息队列的东西的,但是最近在带新同事,发现新同事对于锁这方面有一些误解,所以今天就来谈谈"锁"事和 Java 中 ...

  2. 浅谈 kubernetes service 那些事(上篇)

    一.问题 首先,我们思考这样一个问题: 访问k8s集群中的pod, 客户端需要知道pod地址,需要感知pod的状态.那如何获取各个pod的地址?若某一node上的pod故障,客户端如何感知? 二.k8 ...

  3. 浅谈 kubernetes service 那些事 (下篇)

    欢迎访问网易云社区,了解更多网易技术产品运营经验. 五.K8s 1.8 新特性--ipvs ipvs与iptables的性能差异 随着服务的数量增长,IPTables 规则则会成倍增长,这样带来的问题 ...

  4. 浅谈 Qt 布局那些事

    Qt 布局那些事是本文介绍的内容,直接进入主题.GridLayout是一个非常强大的布局管理器,它可以实现很多复杂的布局,名字中暗示它将所有控件放置在类似网格的布局中.^__^GridLayout有两 ...

  5. 《Machine Learning in Action》—— 浅谈线性回归的那些事

    <Machine Learning in Action>-- 浅谈线性回归的那些事 手撕机器学习算法系列文章已经肝了不少,自我感觉质量都挺不错的.目前已经更新了支持向量机SVM.决策树.K ...

  6. 浅谈angular2+ionic2

    浅谈angular2+ionic2   前言: 不要用angular的语法去写angular2,有人说二者就像Java和JavaScript的区别.   1. 项目所用:angular2+ionic2 ...

  7. 浅谈Hybrid技术的设计与实现第三弹——落地篇

    前言 接上文:(阅读本文前,建议阅读前两篇文章先) 浅谈Hybrid技术的设计与实现 浅谈Hybrid技术的设计与实现第二弹 根据之前的介绍,大家对前端与Native的交互应该有一些简单的认识了,很多 ...

  8. python浅谈正则的常用方法

    python浅谈正则的常用方法覆盖范围70%以上 上一次很多朋友写文字屏蔽说到要用正则表达,其实不是我不想用(我正则用得不是很多,看过我之前爬虫的都知道,我直接用BeautifulSoup的网页标签去 ...

  9. 浅谈HTML5单页面架构(一)——requirejs + angular + angular-route

    心血来潮,打算结合实际开发的经验,浅谈一下HTML5单页面App或网页的架构. 众所周知,现在移动Webapp越来越多,例如天猫.京东.国美这些都是很好的例子.而在Webapp中,又要数单页面架构体验 ...

随机推荐

  1. Angularjs快速入门(四)-css类和样式

    例子: .error{background-color:red;} .warning{background-color:yellow;} <div ng-controller='HeaderCo ...

  2. tomcat的常用配置

    1.解決get请求的中文乱码问题 解决办法: 首先找到tomcat路径下的apache-tomcat-7.0.52\conf文件夹,打开server.xml文件,编辑如下内容: <Connect ...

  3. eclipse--java工程转web工程 以及 java或java web工程转maven工程

    1.  打开工程文件夹,编辑工程的.project文件. 在<natures></natures>中加入 <nature>org.eclipse.wst.commo ...

  4. 玩转spring boot——ajax跨域

    前言  java语言在多数时,会作为一个后端语言,为前端的php,node.js等提供API接口.前端通过ajax请求去调用java的API服务.今天以node.js为例,介绍两种跨域方式:Cross ...

  5. 2.let 和 const

    Babel 是一个广泛使用的 ES6 转码器,可以将 ES6 代码转为 ES5 代码,从而在现有环境执行. Babel 提供一个REPL在线编译器,可以在线将 ES6 代码转为 ES5 代码.转换后的 ...

  6. Java学习笔记——浅谈数据结构与Java集合框架(第三篇、Map)

    桃李春风一杯酒,江湖夜雨十年灯 --寄黄几复 之前图上写错了,是Hashtable类.t是小写的,它是个很古老的类,以至于命名都没有那么规范.. HashMap HashMap就是存储key-valu ...

  7. WebSocket实战

    前言 互联网发展到现在,早已超越了原始的初衷,人类从来没有像现在这样依赖过他:也正是这种依赖,促进了互联网技术的飞速发展.而终端设备的创新与发展,更加速了互联网的进化: HTTP/1.1规范发布于19 ...

  8. python 简单验证码 random模块

    random 模块,产生随机数: chr 将数字转成字母. ascii 数字与字符对应表 链接 import randomtemp=""for i in range(0,4): r ...

  9. Day5模块-random模块

    random:随机数 >>> import random>>> print(random.random()) #生成随机小数0.6906362176182085 & ...

  10. 《Android进阶》之第四篇 ViewPagerIndicator的使用

    1.先将这个开源框架下载到本地: Administrator@QH-20141231RFQJ /d/hixin $ cd ViewPagerIndicator/ Administrator@QH-20 ...