iis服务器助手广告广告
返回顶部
首页 > 资讯 > 前端开发 > VUE >Javascript如何使用this
  • 677
分享到

Javascript如何使用this

2024-04-02 19:04:59 677人浏览 安东尼
摘要

这篇文章给大家分享的是有关javascript如何使用this的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。this是Javascript语言的一个关键字。它代表函数运行时,自动

这篇文章给大家分享的是有关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如何使用this”这篇文章就分享到这里了,希望以上内容可以对大家有一定的帮助,让大家可以学到更多知识,如果觉得文章不错,可以把它分享出去让更多的人看到吧!

--结束END--

本文标题: Javascript如何使用this

本文链接: https://www.lsjlt.com/news/69706.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

本篇文章演示代码以及资料文档资料下载

下载Word文档到电脑,方便收藏和打印~

下载Word文档
猜你喜欢
  • Javascript如何使用this
    这篇文章给大家分享的是有关Javascript如何使用this的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。this是Javascript语言的一个关键字。它代表函数运行时,自动...
    99+
    2022-10-19
  • JavaScript中如何使用this
    这篇文章主要介绍JavaScript中如何使用this,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!本文我们介绍下js中this的用法。由上图可得,默认this指向window,而在...
    99+
    2022-10-19
  • JavaScript中this对象如何使用
    这篇文章给大家介绍JavaScript中this对象如何使用,内容非常详细,感兴趣的小伙伴们可以参考借鉴,希望对大家能有所帮助。this对象是在函数运行时,基于函数的执行环境绑定的。其实这句话的本质就是,谁...
    99+
    2022-10-19
  • JavaScript的this关键词如何使用
    本篇内容主要讲解“JavaScript的this关键词如何使用”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“JavaScript的this关键词如何使用”吧! ...
    99+
    2022-10-19
  • 怎么使用JavaScript中的this
    本篇内容介绍了“怎么使用JavaScript中的this”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!隐式...
    99+
    2022-10-19
  • 如何理解JavaScript中的this
    今天就跟大家聊聊有关如何理解JavaScript中的this,可能很多人都不太了解,为了让大家更加了解,小编给大家总结了以下内容,希望大家根据这篇文章可以有所收获。 JavaSc...
    99+
    2022-10-19
  • JavaScript this绑定与this指向问题如何解决
    本篇内容主要讲解“JavaScript this绑定与this指向问题如何解决”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“JavaScript this绑定与this指向问...
    99+
    2023-07-05
  • JavaScript中this怎么用
    这篇文章主要介绍JavaScript中this怎么用,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!this是面向对象语言中一个重要的关键字,理解并掌握该关键字的使用对于我们代码的健壮...
    99+
    2022-10-19
  • JavaScript中this的用法
    本篇内容介绍了“JavaScript中this的用法”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!Java...
    99+
    2022-10-19
  • this方法怎么在javascript中使用
    本篇文章为大家展示了this方法怎么在javascript中使用,内容简明扼要并且容易理解,绝对能使你眼前一亮,通过这篇文章的详细介绍希望你能有所收获。javascript的this使用方法:1) 函数有所属对象时:指向所属对象函数有所属对...
    99+
    2023-06-14
  • JavaScript中如何深入理解this
    JavaScript中如何深入理解this,相信很多没有经验的人对此束手无策,为此本文总结了问题出现的原因和解决方法,通过这篇文章希望你能解决这个问题。定义this是函数运行时自动生成的内部对象,即调用函数...
    99+
    2022-10-19
  • java中的this如何使用
    这篇文章主要介绍“java中的this如何使用”,在日常操作中,相信很多人在java中的this如何使用问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”java中的this如何使用”的疑惑有所帮助!接下来,请跟...
    99+
    2023-07-02
  • JavaScript中this的使用场景有哪些
    本篇文章给大家分享的是有关JavaScript中this的使用场景有哪些,小编觉得挺实用的,因此分享给大家学习,希望大家阅读完这篇文章后可以有所收获,话不多说,跟着小编一起来看看吧。JavaScript是什么JavaScript是一种直译式...
    99+
    2023-06-14
  • JavaScript箭头函数的this怎么使用
    这篇文章主要介绍“JavaScript箭头函数的this怎么使用”的相关知识,小编通过实际案例向大家展示操作过程,操作方法简单快捷,实用性强,希望这篇“JavaScript箭头函数的this怎么使用”文章能...
    99+
    2022-10-19
  • JavaScript解析函数中怎么使用this
    这篇“JavaScript解析函数中怎么使用this”文章的知识点大部分人都不太理解,所以小编给大家总结了以下内容,内容详细,步骤清晰,具有一定的借鉴价值,希望大家阅读完这篇文章能有所收获,下面我们一起来看...
    99+
    2022-10-19
  • Javascript的this有什么用
    小编给大家分享一下Javascript的this有什么用,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!在理解javascript...
    99+
    2022-10-19
  • JavaScript类、函数和this指向怎么使用
    这篇文章主要介绍了JavaScript类、函数和this指向怎么使用的相关知识,内容详细易懂,操作简单快捷,具有一定借鉴价值,相信大家阅读完这篇JavaScript类、函数和this指向怎么使用文章都会有所收获,下面我们一起来看看吧。1.c...
    99+
    2023-07-04
  • javascript中有哪些this用法
    本篇内容介绍了“javascript中有哪些this用法”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!javascript中this用法:1...
    99+
    2023-06-14
  • JavaScript this关键词怎么用
    这篇“JavaScript this关键词怎么用”文章的知识点大部分人都不太理解,所以小编给大家总结了以下内容,内容详细,步骤清晰,具有一定的借鉴价值,希望大家阅读完这篇文章能有所收获,下面我们一起来看看这...
    99+
    2022-10-19
  • JavaScript中this指向怎么用
    这篇文章主要介绍JavaScript中this指向怎么用,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!JavaScript中this也是一件很神奇 事情,在面向对象(比如java)中表示一个当前的对象引用,但是在Ja...
    99+
    2023-06-25
软考高级职称资格查询
推荐阅读
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作