箭头函数中的this指向

    // 箭头函数中的this指向
        //     如果是箭头函数,this指向是,父级程序的,this的指向
        //       如果父级程序是一个函数,函数也是有this的,那么箭头函数的this,就是父级函数的this
        //       如果父级程序不是函数,例如对象,数组等,没有this指向,箭头函数的this指向是window顶级对象

        // function声明的,对象中的函数
        // this执行应该是,obj对象本身

        // const obj = {
        //     name:'张三',
        //     age:18,
        //     fun:function(){
        //         console.log(this);
        //     }
        // }

        // 对象中的函数,但是是使用 箭头函数声明的
        // 这个对象中的箭头函数,this指向是 window
        const obj = {
            name:'张三',
            age:18,
            fun:function(){
                // 当前函数 fun this 指向 是 obj 对象

                // 在 函数fun 中定义的 子级函数f
                // 使用的是箭头函数语法
                // 箭头函数f 也应该有this指向
                // 所有箭头函数的this指向,都是父级程序的this指向
                // 箭头函数f 的父级程序 是 函数 fun
                // 箭头函数f 的this指向,应该就是 父级程序函数fun的this指向
                // 就是 对象 obj
                var f = ()=> {
                    console.log(this);
                }

                f();
            }
        }

        // obj.fun();


        // obj,中,定义了子级箭头函数fun2
        // 箭头函数fun2,this指向应该是父级程序的this指向
        // 箭头函数fun2,父级程序是,obj
        // obj是个对象,没有this指向的
        // fun2的this指向,是window
        // const obj2 = {
        //     fun2:()=>{console.log(this)}
        // }
        
        // 数组中子级箭头函数,this指向是父级程序数组的this指向
        // 数组是没有this指向的,指向的是window
        // const arr = [()=>{console.log(this)}];

        // arr[0]();

        // 如果匿名函数都写成箭头函数语法,this指向是什么

        // function fun(){}   声明式定义函数,不是匿名函数,不能写成箭头函数形式

        // 匿名函数本身this指向已经是 window,写成箭头函数,this指向仍然你是window
        // var fun = ()=>{console.log(this)} 

        // 定时器,延时器,函数写成箭头函数,this指向仍然是 window
        // setInterval( ()=>{console.log(this)} ,1000 );
        // setTimeout( ()=>{console.log(this)} ,1000 );

        // 事件绑定,匿名函数,this指向,也是window
        // document.addEventListener( 'click' , ()=>{console.log(this)} );
        
        // 总结:
        //    箭头函数的this指向,是 父级程序的 this指向
        //    如果父级没有this指向,结果是 window
        //    如果之前this指向就是window,箭头函数父级没有程序,this指向是window
        //    如果原本this指向是window的箭头函数,如果被父级程序嵌套,也会改变this指向的


        const obj1 = {
            name:'zhangsan',
            fun : function(){
                // 原本事件处理函数,箭头函数,this指向是window
                // 当前有父级程序,函数fun
                // this指向,就是父级程序 函数fun 的this指向
                // 就是 obj 对象
                document.addEventListener('click' , ()=>{
                    console.log(this);
                })
            }
        }
        obj1.fun();
右侧打赏一下 代码改变世界一块二块也是爱
原文地址:https://www.cnblogs.com/ht955/p/14092140.html