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 ...
随机推荐
- IdentityServer Topics(5)- 使用第三方登录
ASP.NET Core有一个灵活的方式来处理外部认证. 这包括几个步骤. 如果您使用的是ASP.NET Identity,则许多底层技术细节对您而言都是隐藏的. 建议您还阅读Microsoft文档并 ...
- 数据挖掘概念与技术15--为快速高维OLAP预计算壳片段
1. 论数据立方体预计算的多种策略的优弊 (1)计算完全立方体:需要耗费大量的存储空间和不切实际的计算时间. (2)计算冰山立方体:优于计算完全立方体,但在某种情况下,依然需要大量的存储空间和计算时间 ...
- (亲测)躺着破解IDM下载权限,治疗不用破解补丁的强迫症们
首先.如果触犯了某些规则权限,请原谅. 很早以前就做过这个的破解,挺实用的,我今天就把之前写的经验贴出来大家一起学习学习~~~ 今天利用这个方法破解了最新版,最终的效果如下所示:我不是来刷存在感的.只 ...
- BZOJ2565: 最长双回文串(回文树)
题目:http://www.lydsy.com/JudgeOnline/problem.php?id=2565 记录一下每个点往前最长延伸位置,正反两遍,枚举分割点. #include<cstr ...
- 史上最全最强Charles截取手机https协议数据包教程(附上利用此技术制作最近微信比较火的头脑王者辅助外挂)!
纯原创,思路也是本人花了半个小时整理出来的,整个完成花费了本人半天时间,由于不才刚大学毕业,所以有的编码方面可能不入大牛们的眼,敬请原谅!如有转载请附上本地址,谢谢! 最近微信朋友圈刚刚被跳一跳血洗, ...
- 重新学习一次javascript;
每次有项目的时候,总觉得自己什么都不会做,然后做的时候又很简单,一会就做完了,啪啪打脸: 每次别人问的时候,我知道怎么做,但是不知道具体原理,觉得瞬间low了: 想要好好的吧基础掌握一下: 这几天空闲 ...
- 对SVD奇异值分解的理解
首先推荐一篇博客,奇异值分解(SVD)原理详解及推导 - CSDN博客,讲解的很清楚.这里我谈谈自己的理解,方便以后回顾. 如果把向量理解为空间中的一个元素,那么矩阵可以理解为两个空间上的映射 ...
- destoon框架二次开发【整理】
=========================================================== destoon使用中的一些心得 ====================== ...
- 【开发技术】Get请求和Post请求区别
a.Get请求是通过URL请求来提交表单数据的:Post是通过HTTP中的POST机制将表单中的数据提交到Action所定制的程序,如果有附件需要用Post方式. b.Get适用于传输数据量小于1K数 ...
- 【Java框架型项目从入门到装逼】第九节 - 数据库建表和CRUD操作
1.新建学生表 这节课我们来把和数据库以及jdbc相关的内容完成,首先,进行数据库建表.数据库呢,我们采用MySQL数据库,我们可以通过navcat之类的管理工具来轻松建表. 首先,我们得建一个数据库 ...