当前位置:首页 > 日记 > 正文

Javascript的this用法

Javascript的this用法

this是Javascript语言的一个关键字。

它代表函数运行时,自动生成的一个内部对象,只能在函数内部使用。比如,

  function test(){    this.x = 1;  }

随着函数使用场合的不同,this的值会发生变化。但是有一个总的原则,那就是this指的是,调用函数的那个对象。

下面分四种情况,详细讨论this的用法。

情况一:纯粹的函数调用

这是函数的最通常用法,属于全局性调用,因此this就代表全局对象Global。

请看下面这段代码,它的运行结果是1。

  function test(){    this.x = 1;    alert(this.x);  }  test(); // 1

为了证明this就是全局对象,我对代码做一些改变:

  var x = 1;  function test(){    alert(this.x);  }  test(); // 1

运行结果还是1。再变一下:

  var x = 1;  function test(){    this.x = 0;  }  test();  alert(x); //0

情况二:作为对象方法的调用

函数还可以作为某个对象的方法调用,这时this就指这个上级对象。

  function test(){    alert(this.x);  }  var o = {};  o.x = 1;  o.m = test;  o.m(); // 1

情况三 作为构造函数调用

所谓构造函数,就是通过这个函数生成一个新对象(object)。这时,this就指这个新对象。

  function test(){    this.x = 1;  }  var o = new test();  alert(o.x); // 1

运行结果为1。为了表明这时this不是全局对象,我对代码做一些改变:

  var x = 2;  function test(){    this.x = 1;  }  var o = new test();  alert(x); //2

运行结果为2,表明全局变量x的值根本没变。

情况四 apply调用

apply()是函数对象的一个方法,它的作用是改变函数的调用对象,它的第一个参数就表示改变后的调用这个函数的对象。因此,this指的就是这第一个参数。

  var x = 0;  function test(){    alert(this.x);  }  var o={};  o.x = 1;  o.m = test;  o.m.apply(); //0

apply()的参数为空时,默认调用全局对象。因此,这时的运行结果为0,证明this指的是全局对象。

如果把最后一行代码修改为

  o.m.apply(o); //1

运行结果就变成了1,证明了这时this代表的是对象o。

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持!

相关文章

荐书|您有一份JavaScript书单待签

荐书|您有一份JavaScript书单待签

书单,荐书,电脑软件,JavaScript,前言凡是能够用JavaScript来写的应用,最终都必将用JavaScript来写,Jeff Atwood如是说,此定律大概意味着未来将会成为JavaScript的天下?不管JavaScript最终能否征服世界,我们都不可忽视它在前端开发中的重要作用,因…

JS请求servlet功能示例

JS请求servlet功能示例

请求,示例,功能,电脑软件,JS,本文实例讲述了JS请求servlet的方法。分享给大家供大家参考,具体如下:前端js代码://创建ajax请求对象var xmlHttp;function createXMLHttpRequest(){ if(window.ActiveXObject){ xmlHttp = new ActiveXObje…

ps怎么制作百度钱包放光彩效果?

ps怎么制作百度钱包放光彩效果?

百度,光彩,效果,电脑软件,ps,ps怎么制作百度钱包放光彩效果?下面我们就来看看详细的教程。软件名称:Adobe Photoshop 8.0 中文完整绿色破解版软件大小:150.1MB更新时间:2015-11-041、打开photoshop——新建800*800像素2、打开渐变颜…

如何制作简易而不俗气的PPT演示

如何制作简易而不俗气的PPT演示

而不,俗气,简易,演示,电脑软件,  PPT制作中,最常见的错误不是做的太简单,而是做得过于复杂,比如使用看很精美的模板,或者套用华丽的3D图表,驾驭多彩的配色方案,或者同时使用很多字体。 以下是小编为您带来的关于制作简易而不俗气的PPT,希望对您…

Ai基础教程:如何绘制绚丽夜景图标

Ai基础教程:如何绘制绚丽夜景图标

图标,绘制,夜景,绚丽,基础教程,版权申明:本文原创作者“格律设计”,感谢“格律设计”的原创经验分享!这篇教程教的AI学习者们使用AI简单绘制夜景图标,教程绘制难度一般,绘制出来的图标还挺漂亮的。推荐一下和的朋友们一起分…

ps中怎么绘制一幅黑猫玩毛线球的图

ps中怎么绘制一幅黑猫玩毛线球的图

绘制,一幅,黑猫,毛线,电脑软件,ps怎么绘制一个可爱的小猫玩毛线球的图形,该怎么绘制呢?下面我们就来看看详细的教程,很简单。软件名称:Adobe Photoshop 8.0 中文完整绿色破解版软件大小:150.1MB更新时间:2015-11-041、用两个圆来描绘出这个线球猫…

underscore之Chaining_动力节点Jav

underscore之Chaining_动力节点Jav

学院,节点,动力,电脑软件,underscore,还记得jQuery支持链式调用吗?$('a').attr('target', '_blank') .append(' <i class="uk-icon-external-link"></i>') .click(function () {});如果我们有一组操作,用underscore提供的函数,…

解决html input验证只能输入数字,

解决html input验证只能输入数字,

输入,验证,数字,其他的,电脑软件,此方法为借鉴别人的,在此只做记录。希望对大家也有用。<input type="text" onkeyup="if(!/^\d+$/.test(this.value)) tip.innerHTML='必须输入数字,且不能有空格。'; else tip.innerHTML='';" /><sp…

JavaScript基本类型值-Number类型

JavaScript基本类型值-Number类型

类型,基本类型,电脑软件,JavaScript,Number,大致介绍在JavaScript的内部采用IEEE754格式来表示数字,所以不区分整数和浮点数,都是用64位浮点数的形式储存。就是说,在JavaScript内部,就根本没有小数。但是有些运算必须得需要整数完成,所以JavaScr…

关于js中的鼠标事件总结

关于js中的鼠标事件总结

鼠标事件,电脑软件,js,js中鼠标事件主要有onclick,onmousedown,onmouseup,oncontextmenu,ondblclick,所有的这些事件都包含有一个事件对象event,当然在IE低版本下,event对象是挂在window底下的。这个我们另行讨论。1.通过html添加事件 <input ty…

js实现加载页面就自动触发超链接的

js实现加载页面就自动触发超链接的

超链接,加载,示例,页面,电脑软件,如下所示:以上这篇js实现加载页面就自动触发超链接的示例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持。…

关于使用js算总价的问题

关于使用js算总价的问题

总价,电脑软件,js,昨天对接数据,发现有个商品总价需要计算,商品数量不定,商品价格不定,商品种类不定,有点蒙,想来想去想找到点简单的写法也没想到,最后提供一种简单的思路吧。商品数量,商品价格先建立两个数组; let pro_num=[]; let pro_price=[];…