JavaScript的this指针到底指向哪?
编程过程中,着实十分困扰this的指向性,经过查阅一番资料,终于搞清楚了,在这里总结一下,全文分为以下三个部分:
- 什么是this指针?
- this指针指向哪里?
- 何时使用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指针到底指向哪?的更多相关文章
- javaScript中this到底指向谁
1.前言 在JavaScript中,this的指向一直是大多数初学者的易错点,总是搞不清楚this到底指向谁,而在求职面试中,this的指向问题往往又是高频考点.本篇博文就来总结一下在JavaScri ...
- JavaScript中this指针指向的彻底理解
this的指向在函数定义的时候是确定不了的,只有函数执行的时候才能确定this到底指向谁,实际上this的最终指向的是那个调用它的对象 这一点与函数中自由变量Action-varibal不同 var ...
- 图说js中的this——深入理解javascript中this指针
没搞错吧!js写了那么多年,this还是会搞错!没搞错,javascript就是回搞错! ………… 文章来源自——周陆军的个人网站:http://zhoulujun.cn/zhoulujun/html ...
- javascript中this指针
看完此片文章豁然开朗,非常感谢.javascript技术难点(三)之this.new.apply和call详解 下面说一说自己的理解: this指针总是指向调用他的对象,其实我更愿意理解为:this指 ...
- javascript 误用this指针 的情况
理解了this指针后,我们再来看看一些很容易误用this指针的情况. 示例1——内联式绑定Dom元素的事件处理函数 <script type="text/javascript" ...
- const指针和指向常量的指针
先看下面六种写法: . const int p; . const int *p; . int const* p; . int * const p; . const int * const p; . i ...
- C语言-指针到底是什么?
1.指针到底是什么?(1).指针变量与普通变量的区别 指针的实质就是一个变量,他跟普通变量没有任何本质区别.指针完整的名字应该叫做指针变量,简称为指针.2.为什么需要指针?(1).指针的出现是为了实现 ...
- 不可或缺 Windows Native (18) - C++: this 指针, 对象数组, 对象和指针, const 对象, const 指针和指向 const 对象的指针, const 对象的引用
[源码下载] 不可或缺 Windows Native (18) - C++: this 指针, 对象数组, 对象和指针, const 对象, const 指针和指向 const 对象的指针, con ...
- cocos2dx中CC_CALLBACK_1等宏中this指针实际指向
首先看代码,我在Helloworld中添加两个函数. void HelloWorld::addTarget(){ Size visibleSize = Director::getInstance()- ...
随机推荐
- [Jenkins] 解决 Gradle 编译包含 SVG Drawable 出现异常
异常信息 java.awt.AWTError: Can't connect to X11 window server using 'localhost:10.0' as the value of th ...
- 160520、MyBatis的几种批量操作
MyBatis中批量插入 方法一: <insert id="insertbatch" parameterType="Java.util.List"> ...
- Android ImageView 获取图片信息后进行比较
ImageView a=(ImageView)findViewById(R.id.imageView2); //获取当前图片ConstantState类对象 Drawable.ConstantStat ...
- 微软构建高效DevOps团队培训总结
9.21和9.22这两天参加了微软DevOps的培训,主要是围绕TFS2015的不少新功能来讲的,相比较之前我们一直使用TFS2013来管理团队,确实强大了不少,也更加实用了. 首先,什么是DevOp ...
- Oracle Java Mission Control MBean 服务器 飞行记录器
Oracle Java Mission ControlMBean 服务器飞行记录器
- webpack4学习笔记(一)
webpack4 1,安装webpack npm insatll webpack --save-dev //安装最新版本 npm insatll webpack@<version> --s ...
- jquery插件网址
各种分布图的插件:http://echarts.baidu.com/demo.html
- golang官方实现如何对httpserver做频率限制(最大连接数限制)
一般海量处理服务,都会对服务做个最大连接数限制,超过该限制之后,拒绝服务,避免发生雪崩,压坏服务. 使用golang来编写httpserver时,如何进行呢?官方已经有实现好的包. 使用示例: imp ...
- 前端 javascript 变量
变量: python: name = 'alex' JavaScript: name = 'alex' # 全局变量 声明var var name = 'eric' # 局部变量 写全局变量基本好少J ...
- robotium原理之获取WebElement元素
版权声明:本文为博主原创文章,未经博主同意不得转载. https://blog.csdn.net/hunterno4/article/details/35569665 robotium ...