js 最全this指向 ,代码版

        // 通常意义上,this指向最后调用它的对象

        //1.函数形式调用 (window.myName   指向window)
        var name = 'zhangsan'//window.name
        function myName() {
            console.log(this.name)//调用函数 this指向window
        }
        myName()

        //2.以方法的形式调用,this就是调用方法的那个对象   (person.fun 指向 person)
        function fun() {
            console.log(this.name)
        }
        const person = {
            name: '猪八戒',
            callme: fun
        }
        person.callme()

        // 3、以构造函数的形式调用时,this 是新创建的那个对象
        // this.name 就变成 person2.name
        function Persons(name) {
            this.name = name
        }
        let person2 = new Persons('王什么梅')
        console.log('person2', person2)

        //4、使用 call 和 apply 调用时,this 是指定的那个对象
        //    myAge.apply(myname)  相当于 myname.myAge()  ,或者说不是简单的替换,只是指向替换
        function myAge() {
            console.log('this.Age', this.Age)
        }
        let myname = {
            Age: 18
        }

        myAge.apply(myname)

        // 5箭头函数,
        // 情况1,如果外层没有函数,那么this指向window
        var myAge22 = 180
        let myAge2 = (() => {
            console.log('myAge2', myAge22)
        })
        myAge2()

        // 情况2,如果外层有函数,this指向外层函数指向的函数

        function fun2() {
            console.log('myAge3', this.myAge22)
            let myAge2244 = (() => {
                console.log('myAge4', this.myAge22)
            })
            myAge2244()
        }

        const person6 = {
            name: '猪八戒',
            myAge22: 99,
            callme: fun2,
        }
        person6.callme()

        // 情况3,如果外层有函数,并且里面不是箭头函数,那么this指向window,也就是window调用的函数,也就是指向window
        // function fun2() {
        //     console.log('myAge3', this.myAge22)
        //     let myAge2244 = function () {
        //         console.log('myAge4', this.myAge22)
        //     }
        //     myAge2244()
        // }

        // const person6 = {
        //     name: '猪八戒',
        //     myAge22: 99,
        //     callme: fun2,
        // }
        // person6.callme()


        // 6 如果有return
        // 情况1 构造函数的情况
        // 如果返回值是一个对象,那么 this 指向的就是那个返回的对象,
        // 如果返回值不是一个对象那么 this还是指向函数的实例

        function user() {
            this.a = 1;
            this.b = 2;
            return { x: 12 };
        }
        var a = new user();
        console.log('333',a);//{x:12}

        function user2() {
            this.a = 1;
            this.b = 2;
            return '3333';
        }
        var a2 = new user2();
        console.log('333',a2);//{a:1,b:2}

        // 情况2 均与之前其他情况相同 return不改变

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值