javascript中this指向问题
本文参考http://www.ruanyifeng.com/blog/2010/04/using_this_keyword_in_javascript.html
this是JavaScript的一个关键字,它代表函数运行时自动生成的一个内部对象,只能在函数内部使用,比如:
function test () {
this.x = 1;
}
随着函数使用场合的不同,this的指向会发生变化。但有一个总的原则就是,this指向最后一个调用函数的那个对象。
下面分四种情况,讨论一下this的用法;
情况一:纯粹的函数调用
这是函数通常用法,属于全局性调用,this指向全局对象;
下面这段代码运行结果为1:
function test () {
this.x = 1;
alert(this.x);
}
test(); //
此处运行结果为1,我开始以为当前的this指向的是函数本身,其实指向的是全局对象
代码做下面处理:
var x = 1;
function test () {
alert(this.x)
}
test(); //
全局中定义一个x变量,在函数内部使用this.x结果是1;
再变一下:
var x = 1;
function test () {
this.x = 2;
alert(this.x)
}
test(); //
全局变量x的值在函数内部被改变。
情况二:作为对象方法的调用
函数还可以作为某个对象方法的调用,这时this指向的就是引用它的对象;
function test () {
alert(this.x)
}
var o = {};
o.x = 1;
o.m = test;
o.m(); //
情况三:作为构造函数调用
所谓构造函数,就是通过这个函数生成一个对象,这时this就是指向这个新对象;
function test () {
this.x = 1;
}
var o = new test();
console.log(o); // {x: 1}
alert(o.x); //
还是跟上面一样,我在函数内部改变一下全局变量的值,看是否能够成功:
var x = 1;
function test () {
this.x = 2;
}
var o = new test();
alert(o.x); //
alert(this.x); // 1
从上面代码可以看到构造函数中的this只指向生成的对象,无法改变全局变量。
情况四:apply调用
apply()是函数对象的一个方法,它的作用是改变函数调用的对象,它的第一个参数就是表示调用这个函数的对象,因此this指向的就是第一个参数;
var x = 1;
function test () {
alert(this.x)
}
var o = {};
o.x = 2;
o.m = test;
o.m.apply(); // 1,apply()函数参数为空时默认调用全局对象,因此,此时运行的结果为1,证明this指向全局对象
o.m.apply(o); // 2,此时this指向对象o
最后用代码解释一下为什么说this指向最后调用它的对象
var a = 666;
var o = {
a: 1,
b: {
a: 2,
fn: function () {
console.log(this.a)
}
}
}
o.b.fn(); // 2,此时调用函数的对象是a对象中的b对象,所以运行结果为2
var test = o.b.fn; // 这只是一个赋值的过程,并没有执行
test(); // 666,此时调用test()方法的是全局对象
javascript中this指向问题的更多相关文章
- 图解javascript中this指向
JavaScript 是一种脚本语言,支持函数式编程.闭包.基于原型的继承等高级功能.JavaScript一开始看起来感觉会很容易入门,但是随着使用的深入,你会发JavaScript其实很难掌握,有些 ...
- 从零开始学习前端JAVASCRIPT — JavaScript中this指向的四种情况
JavaScript中this的四种情况(非严格模式) 1.当this所在函数是事件处理函数时,this指向事件源.2.当this所在函数是构造函数时,this指向new出来的对象.3.this所在函 ...
- 关于javascript中this 指向的4种调用模式
this指向问题绝对可以排js 的top 5最难和最重点的问题,初学者常常搞不清楚this指向哪里,特别是学过java和c#的人,想当年俺也迷糊了好久,直到遇到蝴蝶书,主要是因为js和主流的面向对象语 ...
- javascript中this指向的问题
javascript中this只有函数执行时候才能确定到底指向谁,实际this最终指向是那个调用它的对象. 1,匿名函数中的this——window function foo(){ var lastN ...
- JavaScript中this指向的简单理解
首先必须要说的是,this的指向在函数定义的时候是确定不了的,只有函数执行的时候才能确定this到底指向谁,实际上this的最终指向的是那个调用它的对象(这句话有些问题,后面会解释为什么会有问题,虽然 ...
- javascript中this指向
在简单函数中,this是指向当前对象,可用来获取当前对象某个属性,但随着函数变复杂,this很多情况不指向当前对象,而是指向window. 1.在独立调用函数中,具有全局执行环境,this指向wind ...
- javascript中constructor指向问题
首先用一个例子指出来constructor存在形式. function Fruit(){ } var f=new Fruit(); console.log(f.constructor);//打印出Fr ...
- Javascript中的this指向。
一.JavaScript中的函数 在了解this指向之前,要先弄明白函数执行时它的执行环境是如何创建的,这样可以更清楚的去理解JavaScript中的this指向. function fn(x,y,n ...
- 图解avaScript中this指向(超透彻)
一个图讲清楚JavaScript中this指向: 说明: (1)严格模式下,禁止this关键字指向全局对象会报错. (2)闭包中的this对象具有全局性,因此通常指向window. (3)优先级:n ...
随机推荐
- iframe标签里面的页面元素只读
iframe标签里面的页面元素只读,可以通过设置一个只读的透明div进行遮罩实现. html代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1 ...
- deeplearning.ai 构建机器学习项目 Week 2 机器学习策略 II 听课笔记
1. 误差分析(Error analysis) 误差分析的目的是找到不同误差源的比重,从而指引我们接下来往哪个方向努力改进.NG建议手工统计随机100个错误的误差源,比如对于猫分类器,错误的照片可能是 ...
- hihoCoder #1094 : Lost in the City(枚举,微软苏州校招笔试 12月27日 )
#1094 : Lost in the City 时间限制:10000ms 单点时限:1000ms 内存限制:256MB 描述 Little Hi gets lost in the city. He ...
- You can Solve a Geometry Problem too(线段求交)
http://acm.hdu.edu.cn/showproblem.php?pid=1086 You can Solve a Geometry Problem too Time Limit: 2000 ...
- JAVA经典算法面试40题及答案
现在是3月份,也是每年开年企业公司招聘的高峰期,同时有许多的朋友也出来找工作.现在的招聘他们有时会给你出一套面试题或者智力测试题,也有的直接让你上机操作,写一段程序.算法的计算不乏出现,基于这个原因我 ...
- JS实现单选按钮回显时页面效果出现,但选中单选框的值为空
最近做了很多前端页面的工作,遇到的一个感觉很头疼的问题在这里记一下: 经常用JS回显单选框,但是明明从页面效果上来看,单选框已经被选中了,可是却不能触发单选框的change事件,取值的时候用某种方法取 ...
- Redis进阶实践之五Redis的高级特性
一.引言 上一篇文章写了Redis的特征,使用场景,同时也介绍了Redis的基本数据类型,redis的数据类型是操作redis的基础,这个必须好好的掌握.今天我们开始介绍一些Redis的高级特性 ...
- Spark算子--flatMapValues
转载请标明出处http://www.cnblogs.com/haozhengfei/p/e7a46cecc65720997392516d553d9891.html flatMapValues--Tra ...
- 【Jsp/Servlet】获取客户端使用的ip
一般使用jsp的时候大多数时间都可以使用request.getRemoteAddr() 来获取ip,但是这个前提是未经过反向代理等操作的原始地址,所以,需要在反向代理等操作之后还要获取客户端的ip变得 ...
- WdatePicker设置时间区间时,对开始时间和结束时间限制
<input id="startDate" name="startDate" type="text" readonly=" ...