编程过程中,着实十分困扰this的指向性,经过查阅一番资料,终于搞清楚了,在这里总结一下,全文分为以下三个部分:

  1. 什么是this指针?
  2. this指针指向哪里?
  3. 何时使用this?

一 什么是this指针?

在JavaScript中,this指针是在创建函数时,由系统默认生成的两个隐式参数之一(另一个是arguments)。

this指针指向与该函数调用进行隐式关联的一个对象,该对象被称为“函数上下文”。

要想成功的使用this,就必须搞清楚在不同情形下,this指针指向什么“函数上下文”,下面将总结this参数在不同状况下的不同表现。

二 this指针指向哪里?

要搞清楚this指针的指向,需要根据不同的函数调用方式进行分析,有以下四种不同的调用情况:

(1)作为函数进行调用

这里作为函数进行调用是为了区分函数的其他调用方式(作为方法调用,new操作符调用和call,apply调用)。

函数通常通过()操作符进行调用,此时函数内的this指针指向的是window对象。

原因其实很好理解,默认this指针指向调用函数的对象,此时函数实际上是window对象的一个方法,因此this指针指向window对象是合情合理的。

但是,这里有一个不太好的地方需要特别注意:

var object = {
way1 : function() {
console.log(this);
function innerFunc() {
console.log(this);
}
innerFunc();
}
} object.way1(); //object
//window

innerFunc函数内的this指针在此时意外的指向了window对象,使用时应该记住这个差异。因为本质上这个函数依然作为满足“作为函数进行调用”的条件。

(2)作为方法进行调用

一个方法所属的对象在该方法体内可以以this的形式进行引用,因此,当一个函数以方法的形式被调用时,this指针指向该方法的所有者。

这是可以将JavaScript作为面向对象代码进行编写的主要手段之一。

(3)作为构造器进行调用

当函数作为“构造函数”进行调用时,this指针的指向解释起来就略微复杂一点了。

我们要从构造函数本身来说起:

在JavaScript中,构造函数被用来构造对象:

function Person(name,age) {
this.name = name;
this.age = age;
} var jenny = new Person('jenny',24); console.log(jenny.name); //jenny

构造函数的调用,返回值即为一个对象,而这个对象即为构造函数作用域内this指针的引用对象,即“函数上下文”。

(4)call(),apply()方法调用

除了上述的三种情况下造成this指针的引用对象差异外,我们还可以自定义this指针的指向,通过使用call(),apply()方法。

两个方法的使用方式为:

function getName(age,sex) {
console.log(this.name);
this.age = age;
this.sex = sex;
} var jenny = { name : jenny }; getName.call(jenny,24,female); getName.apply(jenny,[24,female]); //jenny

可见这两种调用方式的唯一区别在于,传入参数的形式,call方法依次写入参数,而apply方法则将所需传入函数的参数打包为一个数组统一传入。

而这两种方法在做的事为,将函数内部的隐式this参数指向其第一个参数,并将其后的参数传入至函数中,调用函数。

因此,在此种情况下,函数内部的this指针指向call与apply方法指定的对象。

以上是JavaScript中,this指针在四种情况下的引用对象。

三 何时使用this指针

未完待续。

JavaScript的this指针到底指向哪?的更多相关文章

  1. javaScript中this到底指向谁

    1.前言 在JavaScript中,this的指向一直是大多数初学者的易错点,总是搞不清楚this到底指向谁,而在求职面试中,this的指向问题往往又是高频考点.本篇博文就来总结一下在JavaScri ...

  2. JavaScript中this指针指向的彻底理解

    this的指向在函数定义的时候是确定不了的,只有函数执行的时候才能确定this到底指向谁,实际上this的最终指向的是那个调用它的对象 这一点与函数中自由变量Action-varibal不同 var ...

  3. 图说js中的this——深入理解javascript中this指针

    没搞错吧!js写了那么多年,this还是会搞错!没搞错,javascript就是回搞错! ………… 文章来源自——周陆军的个人网站:http://zhoulujun.cn/zhoulujun/html ...

  4. javascript中this指针

    看完此片文章豁然开朗,非常感谢.javascript技术难点(三)之this.new.apply和call详解 下面说一说自己的理解: this指针总是指向调用他的对象,其实我更愿意理解为:this指 ...

  5. javascript 误用this指针 的情况

    理解了this指针后,我们再来看看一些很容易误用this指针的情况. 示例1——内联式绑定Dom元素的事件处理函数 <script type="text/javascript" ...

  6. const指针和指向常量的指针

    先看下面六种写法: . const int p; . const int *p; . int const* p; . int * const p; . const int * const p; . i ...

  7. C语言-指针到底是什么?

    1.指针到底是什么?(1).指针变量与普通变量的区别 指针的实质就是一个变量,他跟普通变量没有任何本质区别.指针完整的名字应该叫做指针变量,简称为指针.2.为什么需要指针?(1).指针的出现是为了实现 ...

  8. 不可或缺 Windows Native (18) - C++: this 指针, 对象数组, 对象和指针, const 对象, const 指针和指向 const 对象的指针, const 对象的引用

    [源码下载] 不可或缺 Windows Native (18) - C++: this 指针, 对象数组, 对象和指针, const 对象,  const 指针和指向 const 对象的指针, con ...

  9. cocos2dx中CC_CALLBACK_1等宏中this指针实际指向

    首先看代码,我在Helloworld中添加两个函数. void HelloWorld::addTarget(){ Size visibleSize = Director::getInstance()- ...

随机推荐

  1. JAVAWEB的Listener

    学习监听器 1监听器是什么 :监听对象的变化或者监听事件的触发 2有什么作用:当被监听的对象状态改变时,触发对应的方法 3怎么用: ①声明监听器,(继承对应的监听器) ②重写监听方法,并实现自己需要的 ...

  2. append和innerHTML的区别以及使用方法

    1.append jquery中的append的使用方式:$("#id").append("<a href='#'>test</a>") ...

  3. python学习笔记(五)— 内置函数

    我们常用的‘’int,str,dict,input,print,type,len‘’都属于内置函数 print(all([1,2,3,4]))#判断可迭代的对象里面的值是否都为真 print(any( ...

  4. 前端开发 - CSS - 上

    CSS: 1.css的引入方式 2.基础选择器 3.高级选择器 4.选择器的优先级 5.伪类选择器 6.字体样式 7.文本样式 8.背景 9.盒模型border 10.margin 11.paddin ...

  5. QT in VS 多语言实现(中英文切换,每个步骤都有截图,只有UTF8才能让Qt语言家正确读取。先qApp->removeTranslator,然后installTranslator,每个类都要写上槽函数RetranslateUI)

    最近项目需要软件具有中英文双语切换功能,而QT又自带此功能,现将实现方式记录下来. 说到中英文切换,少不了要了解QT的内部编码方式.在此就不详述QT编码方式了,具体可参考 彻底弄懂Qt的编码.只需要记 ...

  6. 【keras框架】

    更高级别的封装.更简单的api,以tensorflow.theano为后端,支持更多的平台 读取网络模型后生成网络结构图 读取 from keras.models import load_model ...

  7. 常用的自定义Python函数

    常用的自定义Python函数 1.时间戳转为日期字串,精确到ms.单位s def timestamp2datems(timestamp): ''' 时间戳转为日期字串,精确到ms.单位s :param ...

  8. 判断是否关注了微信公众号 subscribe 0=未关注 1=已关注

    $appid=''; $secret=''; //微信网页授权获取openid $web_url='http://www.xxxx.com/shouquan.php'; if (!isset($_GE ...

  9. selinux-网络服务安全

    一.显示和设置selinux [root@localhost ~]# vim /etc/sysconfig/selinux //强制模式 许可模式 禁用模式 [root@localhost ~]# g ...

  10. 爱用bootstrap系列一:Sublime上写H5及运行

    sublime上使用插件快速生成模板文件 第一,你要先下载package control的插件,这是一款用来管理插件的插件 . 可能会由于你所在的网络通过代理访问而导致安装失败,你可以通过下面的步骤来 ...