javascript 中 this指向的理解

最新推荐文章于 2025-08-21 23:36:32 发布

转载最新推荐文章于 2025-08-21 23:36:32 发布 · 52 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/zebey/p/7550753.html

文章标签：

#javascript #ViewUI

本文详细解析了JavaScript中this关键字的四种使用场景：函数调用、方法调用、构造器调用及上下文调用模式，并通过示例展示了不同场景下this指向的变化。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

this指向应用的场景有以下几个:

　　1.函数调用模式

　　　　this指向的是全局对象

　　2.方法调用模式

　　　　this指向的是调用方法的对象

　　3.构造器调用模式

　　　　this指向的是new出来的新对象

　　4.上下文调用模式即 call 和 apply 的调用

　　　　this 指向的就是call和apply方法的第一个参数.如果没有传递第一个参数,this的指向就是window对象

具体如下:

1.函数调用模式

  
    window.word = "this is global";
    
    function aa(){   
        console.log(this.word);
    }

    function bb(){
       
        var word = "this is bb";
        aa();
    }
   
     bb();

　　运算结果是 this is global。
　　可以看到当作为函数调用的时候，this指向的是window对象。

　　即 this指向的就是全局对象

2.方法调用模式

    var car = {
            name : "BMW",
            price : "2000",
            showName:function(){
                console.log(this.name);
            },
            showPrice:function(){
                console.log(this.price);
            }
        }
        car.showName();
        car.showPrice();

　　
　　运算结果是：BMW 2000。
　　可以看到当作为对象方法调用的时候 this指向的是car本身。

　　即this指向的就是调用方法的对象

3.构造器调用模式

   
     function Car(){
            this.name = "BMW";
            this.price = "2000";
            this.showPrice = function(){
                console.log(this.price);
            }
    　}
       var car = new Car();
       car.showPrice();

　　
　　运算结果是 2000。
　　由此可知，这里的this指向的是car这个对象。

　　即this指向的是new出来的新对象

4.上下文调用模式即 call 和 apply 的调用

    function Car(){
        console.log(this.name);
    }
        var bmw = {
            name:"BMW",
            showName:function(){
            Car.apply(this);
        }
    }

    bmw.showName();

　　运算后得到：BMW 。
　　这里通过apply（call也可以）强制把this指向了bmw这个对象。

　　即this 指向的就是call和apply方法的第一个参数.如果没有传递第一个参数,this的指向就是window对象

转载于:https://www.cnblogs.com/zebey/p/7550753.html