this指向

97 阅读1分钟

使用 JavaScript 开发的时候,很多开发者多多少少会对 this 的指向不了解,但是实际上,关于 this 的指向,记住最核心的一句话:哪个对象调用函数,函数里面的this指向哪个对象。
1.普通函数调用
指向全局对象window
例:

let a=9;
        function f(){
            alert(this.a);/*undefined*/
        }
        f()

2.对象函数调用
哪个函数调用,this指向哪里
例:

let obj={
            name:"蒋丞",
            f:function(){
                alert(this.name);/*蒋丞*/
            }
        }
        obj.f();

3.构造函数调用
例:

let G=function(){
            this.name="顾飞"
        }
        let W=new G();
        W.name="魏婴";
        console.log(W.name);/*魏婴*/
        let W1=new G();
        console.log(W1.name);/*顾飞*/

此外,有个问题需要提醒,虽然很少出现,但有必要说一下,如果在构造函数里返回一个对象,会直接返回这个对象,而不是执行构造函数后创建的对象。

4.apply和call调用
会改变传入函数的this
例:

let obj1={
            name:"程博衍"
        };
        let obj2={
            name:"项西",
            f:function(){
                alert(this.name);
            }
        };
        obj2.f.call(obj1);/*程博衍*/

5.箭头函数的调用
箭头函数内部没有this指向,内部的this是指向箭头函数外部的函数

let obj={
            name:"蓝湛",
            f:function(){
                setTimeout(()=>{
                   console.log(this.name) 
                });
            }
        }
        obj.f();/*蓝湛*/