一、函数的this指向

        this是每一个函数都 一定有的关键词

        this本质上是一个对象数据结构 用于指向数据

        通过this关键词,可以调用操作这个 数据

        1、this指向window    声明式函数 匿名函数 定时器 延时器 forEach循环

        2、this指向事件源     事件绑定中,事件处理函数 this指向默认是事件源,也就是绑定事件的标签对象

        3、this指向数组/对象 数组/对象 中存储的函数this指向是这个数组/对象

二、箭头函数的this指向

        箭头函数的this指向 是 父级程序的this指向

        如果没有父级程序 或者 父级程序没有指向 箭头函数的this指向是window

(1)匿名函数绑定的事件处理函数 this指向默认是事件源 也就是div标签对象

oDiv.addEventListener('click' , function(){
         console.log(this);
  })

 (2)箭头函数的this指向,是父级程序的this指向,下面的箭头函数没有父级程序,所以this指向是window

oDiv.addEventListener('click' , ()=>{
            console.log(this);
 })

(3)对象中定义的函数 和箭头函数

const obj = {
            name:'张三',
            age:18,
            sex:'男',
        //    对象中定义的函数 this指向是这个对象本身
             fun1:function(){
                console.log(this)
            },

        //     箭头函数,this指向是父级程序
        //     当前箭头函数,父级程序是对象
        //     对象是没有this的,箭头函数this指向是window
            fun2:()=>{
                 console.log(this)
            },

            fun3:function(){
        //         定义在对象中的函数fun3,this指向是对象本身
        //         函数fun4是一个箭头函数
        //         存储在 函数fun3 中 父级程序就是函数fun3
        //         函数fun3的this指向是存储fun3的对象obj
        //         箭头函数fun4 的this指向 和 父级程序fun3的this指向相同
        //         也就是 obj对象本身
               const fun4 = ()=>{
                    console.log(this);
                }
                fun4();
             }  
        };

三、改变this指向 ==>通过JavaScript提供的函数方法

       1、调用执行函数时 改变this指向

       call

                函数调用.call(参数1,参数2,参数3......)

                参数1:要改变的指向

                之后的参数2,参数3......是原始函数需要的数据

             apply

                函数调用.apply(参数1,[参数2,参数3....])

                参数1:要改变的this指向

                之后的所有参数以数组的形式赋值 原始函数需要的数据

        call和apply执行程序的原理、结果都完全一致,只是给原始函数赋值参数的语法形式不同  

        2、【生成新的函数】时 改变this指向

        bind

                函数.bind(参数1,参数2,参数3....)

                参数1:新的this指向

                之后所有的参数 参数2,参数3......都是原始函数需要的参数数据