JavaScript中this的使用方法总结

叁歲伎倆 2022-02-24 06:14 503阅读 0赞

### JavaScript中this的使用方法总结 ###

在JavaScript中，this的使用分为四种场景，具体请参考[阮一峰老师关于this的讲解][this]

#### 第一种情况是纯函数使用 ####

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

这里的输出是1，因为在函数中属于全局性的调用，因此this指代window，代表全局对象

#### 第二种情况是作为对象方法调用 ####

function test(){
      console.log(this.x)
    }
    var obj={}//申明一个对象
    obj.x = 1;//给对象设置一个属性x并赋值为1
    obj.m=test;//给对象设置一个方法test
    obj.m();//执行对象方法，输出的是1

以上代码相当于

var obj = {
        x : 1,
        m : function () {
            console.log(this.x)//this指代的是obj这个对象
        }
      }
      obj.m()

从上面代码可以看出，当this作为对象方法调用的时候，this指代的这个上级对象

#### 第三种情况是作为构造函数使用 ####

function test(){ //创建一个构造函数
      this.x=1 //构造函数的属性x的值为1
    }
    var obj = new test();//实例化构造函数生成一个新的对象，这个对象拥有一个属性x，且值为1
    console.log(obj.x) //1

在上面的代码示例中，this指代的就是obj这个新的对象

#### 第四种情况是apply调用 ####

apply()是函数的一个方法，作用是改变函数的调用对象。它的第一个参数就表示改变后的调用这个函数的对象，将代替function类里面的this对象。因此，这时this指的就是这第一个参数

var x = 0;
    function test() {
    　console.log(this.x);
    }
    
    var obj = {};
    obj.x = 1;
    obj.m = test;
    obj.m.apply() // 0

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

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

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

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

[this]: http://www.ruanyifeng.com/blog/2018/06/javascript-this.html

发表评论取消回复

表情：

评论列表（有 0 条评论，503人围观）

还没有评论，来说两句吧...

相关阅读

相关 JavaScript在方法中使用apply(this,arguments)

首先了解一下arguments: arguments 对象是JavaScript 函数内置的对象，包含了函数调用的参数数组。 <!DOCTYPE html>

女爷i/ 2023年01月09日 15:58/ 0 赞/ 168 阅读

相关 JavaScript中this使用总结

this是在函数执行的过程中自动创建的一个指向一个对象的内部指针。确切的说，this并不是一个对象，而是指向一个已经存在的对象的指针，也可以认为是this就是存储了某个对象

拼搏现实的明天。/ 2022年07月15日 11:19/ 0 赞/ 164 阅读

相关 javascript中的this的学习总结

this 学习的总结 1、普通的function函数里面的this指向的是函数外的全局变量 var name = "tom"; function getN

桃扇骨/ 2022年06月03日 06:55/ 0 赞/ 191 阅读

相关 JavaScript中的this

this的指向在函数定义的时候是确定不了的，只有函数执行的时候才能确定this到底指向谁，实际上this的最终指向的是那个调用它的对象 1. function fn

r囧r小猫/ 2022年05月20日 07:04/ 0 赞/ 264 阅读

相关 JavaScript中的this

this（上下文对象） \- 我们每次调用函数时，解析器都会将一个上下文对象作为隐含的参数传递进函数。使用this来引用上下文对象，根据函数的调用形式不同，this的

短命女/ 2022年05月18日 04:24/ 0 赞/ 275 阅读

相关 javascript中this的总结

this是js的一个关键字，随着函数使用场合不同，this的值会发生变化。但是总有一个原则，那就是this指的是调用函数的那个对象。 1、纯粹函数调用。 funct

柔情只为你懂/ 2022年05月16日 04:54/ 0 赞/ 249 阅读

相关 JavaScript中的this

> 小编推荐：[Fundebug][]专注于JavaScript、微信小程序、微信小游戏，Node.js和Java实时BUG监控。真的是一个很好用的bug监控费服务，众多大佬公

待我称王封你为后i/ 2022年04月10日 02:59/ 0 赞/ 298 阅读

相关 JavaScript中this的使用方法总结

JavaScript中this的使用方法总结在JavaScript中，this的使用分为四种场景，具体请参考[阮一峰老师关于this的讲解][this] 第一种情况

叁歲伎倆/ 2022年02月24日 06:14/ 0 赞/ 504 阅读

相关 JavaScript 中的 this

[为什么80%的码农都做不了架构师？>>> ][80_] ![hot3.png][] [查][Link 1][看原文][Link 2] Yehuda Katz 强调了函数调

刺骨的言语ヽ痛彻心扉/ 2022年01月17日 12:06/ 0 赞/ 295 阅读

相关总结JavaScript中this绑定方式

this在默认的绑定非严格模式下指向window，严格模式下指向undefined，比如下面的函数foo在非严格模式下

小灰灰/ 2020年04月21日 05:56/ 0 赞/ 911 阅读