1、全局作用域下的this:

2、一般函数与严格模式下的函数的this:

3、当函数的this作为对象的方法的情况下:

4、对象原型链上的this:

对象P的原型指向o, p.a与p.a创建对象p的属性,当调用p的原型上的方法的时候,this.a与this.b仍然能获取到对象p上的p.a与p.a属性;

需要注意一点,p的原型是o, 也就是说调用p.f()的时候也就是调用对象p原型链o上面的这一个函数属性f ,那么原型链O上面的这一个this仍然可以拿到p.a与p.a属性,也就是说不管这个this是原型链上的还是p对象本身的,当调用的时候,this也是可以指向P这样一个对象。

5、get/set方法下的this:

6、构造器下的this:

例子1:如果正常去调用这个this.a的话,这个this会指向全局对象,在浏览器里面,这个this就会指向window ;但是如果使用new把这个作为构造器去调用的话,那么这个this就会指向这样的一个空的对象,并且这个空对象的原型会指向MyClass.propertype属性 ; 使用new以后,this会指向原型为MyClass.propertype的属性的这样一个空对象 ,那么由于这个this.a=37是做了这样的一个赋值;所以最后的this会作为一个返回值,所以对象O会有这样的o.a的一个属性。
例子2:与例子1不同的是,c2函数里最后返回(return)了一个对象a:38 ;这个时候,打印出o.a的值就不是37了,而是38 ;原因是:当我们使用new在创建这样一个构造器去调用的时候,c2函数里的return语句返回的是一个对象的话,那么会将return的这个对象作为返回值,所以这里的o不再是this而是return里这个对象字面量的值。

7、call/apply方法下的this:

这里定义了一个变量o有两个属性:a:1,b:3 ;然后通过add对象的call()方法,把第一个参数(就是你想作为this的这个对象),后面的5与7就是我们想要去添加的参数,然后这里的5就会赋值给add对象参数里的c,这里的7就会赋值给add对象参数里的d ;最后的一个结果就是1+3+5+7=16 ;call与apply基本没有任何差别,call在传参的方式是点平传递过去的,而apply在传参的时候是作为一个数组去传递的;
注意:用到call与apply的情况有:当我们需要调用object.prototype.toString的时候,想要指定其中的某个this的时候

8、bind方法下的this:(在IE9+才可以使用)

通过bind方法 ; .bind()后面会有一个参数,参数里面的是一个对象,:这个对象就是你想要将某个对象作为this的时候,就把这样的一个对象传进去,那么就形成了一个新的对象,在后面console.log(g())调用的时候; 这个this已经指向这个bind的参数;
下面的var o ,是直接将a赋值为37,f属性直接赋值为f() ;g赋值为bind绑定的这样一个方法,那么输出f的这样一个结果可以拿到37;上面的例子可知,一般函数,我们根据调用方式来判断,o.f()是通过调用属性去调用的,那么this就会指向var o这个对象,也就是拿到了o.a也即是37;但是在使用bind的方法去绑定的时候,即使我们把新绑定的方法作为对象属性去调用,但是仍然只会按之前的bind绑定去做,于是仍然只返回test;

JavaScript的this详解的更多相关文章

  1. 从mixin到new和prototype:Javascript原型机制详解

    从mixin到new和prototype:Javascript原型机制详解   这是一篇markdown格式的文章,更好的阅读体验请访问我的github,移动端请访问我的博客 继承是为了实现方法的复用 ...

  2. JavaScript严格模式详解

    转载自阮一峰的博客 Javascript 严格模式详解   作者: 阮一峰 一.概述 除了正常运行模式,ECMAscript 5添加了第二种运行模式:"严格模式"(strict m ...

  3. [转]javascript console 函数详解 js开发调试的利器

    javascript console 函数详解 js开发调试的利器   分步阅读 Console 是用于显示 JS和 DOM 对象信息的单独窗口.并且向 JS 中注入1个 console 对象,使用该 ...

  4. javascript 节点属性详解

    javascript 节点属性详解 根据 DOM,html 文档中的每个成分都是一个节点 DOM 是这样规定的:整个文档是一个文档节点每个 html 标签是一个元素节点包含在于 html 元素中的文本 ...

  5. (" use strict")Javascript 严格模式详解

    Javascript 严格模式详解 转载别人的博客内容,浏览了一遍,没有全部吸收,先保存一下链接 http://www.ruanyifeng.com/blog/2013/01/javascript_s ...

  6. 【HANA系列】SAP HANA XS使用JavaScript数据交互详解

    公众号:SAP Technical 本文作者:matinal 原文出处:http://www.cnblogs.com/SAPmatinal/ 原文链接:[HANA系列]SAP HANA XS使用Jav ...

  7. JavaScript运行机制详解

    JavaScript运行机制详解   var test = function(){ alert("test"); } var test2 = function(){ alert(& ...

  8. [转]JavaScript异步机制详解

    原文: https://www.jianshu.com/p/4ea4ee713ead --------------------------------------------------------- ...

  9. js课程 1-3 Javascript变量类型详解

    js课程 1-3  Javascript变量类型详解 一.总结 一句话总结:js对象点(属性方法),json对象冒号(属性方法).属性和方法区别只有一个括号. 1.json对象中的函数的使用? 函数名 ...

  10. JavaScript数组方法详解

    JavaScript数组方法详解 JavaScript中数组的方法种类众多,在ES3-ES7不同版本时期都有新方法:并且数组的方法还有原型方法和从object继承的方法,这里我们只介绍数组在每个版本中 ...

随机推荐

  1. 推荐一个比较好的VBS编辑器

    QTP 本身的IDE环境, 有诸多缺陷.所以,一般中级以上的自动化测试工程师都会采用外部其他编辑器来编辑VBS脚本.通常情况下,一般都 notepad++. 但是,notepad++也是有很多不足之处 ...

  2. Javascript多线程引擎(八)

    Javascript多线程引擎(八)    Javascript 多线程项目, 做到现在已经快3个月了(加上前期准备编译原理和必要的文档), 该项目(js-engine)已经快进入尾声了, 现在该引擎 ...

  3. Bootstrap 图像

    一般的样式 在我们讨论 Bootstrap 3 提供的定义图像样式的特殊的 class 之前,我们将看到 Bootstrap 3 提供的定义图像的一般的样式. img { border: 0; } 这 ...

  4. IIS7.5下的httpModules设置

    部署到IIS7.5上httpModule不起作用了,原来是iis7里面的网站应用程序池使用了默认的“集成模式”,所以所有的http请求处理都托管给了 IIS,web.config里面的配置就不起效了. ...

  5. NET系列文章

    NET系列文章 由于博主今后一段时间可能会很忙(准备出书:<.NET框架设计—模式.配置.工具>,外加换了新工作),所以博客会很少更新: 在最近一年左右时间里,博主各种.NET技术类型的文 ...

  6. JavaScript原生数组函数

    有趣的JavaScript原生数组函数 在JavaScript中,可以通过两种方式创建数组,构造函数和数组直接量, 其中后者为首选方法.数组对象继承自Object.prototype,对数组执行typ ...

  7. Java泛型学习笔记--Java泛型和C#泛型比较学习(一)

    总结Java的泛型前,先简单的介绍下C#的泛型,通过对比,比较学习Java泛型的目的和设计意图.C#泛型是C#语言2.0和通用语言运行时(CLR)同时支持的一个特性(这一点是导致C#泛型和Java泛型 ...

  8. hdu4414(DFS 找十字架数量)

    Problem Description The Nazca Lines are a series of ancient geoglyphs located in the Nazca Desert in ...

  9. (转)poj1182食物链

    这题主要是看了http://blog.csdn.net/c0de4fun/article/details/7318642这篇解题报告,所以内容基本是转的!感谢大牛这么详细的把过程写的很清楚! 这道题目 ...

  10. 苹果icloud邮箱抓取

    1 icloud登录,与其他网站登录区别  1.1 支持pop抓取的邮箱:pop提供统一接口,抓取简单:  1.2 没有前端js加密的邮箱(139,126,163):只要代码正确模拟登录流程,参数正确 ...