当前位置:首页 » 《随便一记》 » 正文

js的this指向哪里_霜叶的博客

8 人参与  2021年11月07日 08:23  分类 : 《随便一记》  评论

点击全文阅读


js的this指向哪里

  • 为什么需要this
  • this的绑定形式
    • 默认绑定
    • 隐式绑定
    • 显式绑定
    • new绑定
    • 箭头函数的this

为什么需要this

js中

    var a = 'window'
    var obj = {
        a:'obj',
        func: function(){
            console.log(this.a)
        }
    }
    obj.func()  //  obj
    var func = obj.func
    func()      //  window

js中执行上面的代码会有这样结果,虽然obj.func和func指向的是同一个函数,但是因为它们所处的运行环境不一致,所以打印结果也不同,而this就是用来指明当前函数的运行环境的

this的绑定形式

this绑定可以分为五种形式,分别是默认绑定、显式绑定、隐式绑定、new绑定、箭头函数的this绑定

默认绑定

当函数调用无任何调用前缀时,this默认执行全局对象(非严格模式)

    var a = 'window'
    function func1(){
        console.log(this.a)   // window
        var a = 1
        function func(){
            console.log(this.a,a)   //  window  1
        }
        func()
    }
    func1()

隐式绑定

函数调用时,this指向调用自己最近的对象

    var obj2 = {
        a:'obj2',
        func:function(){
            console.log(this.a)
        }
    }
    var obj = {
        a:'obj',
        b:obj2,
    }
    obj.b.func()  //  obj2 

显式绑定

显式绑定指我们通过call,apply和bind方法改变this的指向,在这个过程中this指向的变化可以被清晰感知

    var a = 'window'
    var obj = {
        a:'obj'
    }
    function func(){
        console.log(this.a)
    }
   func.call(obj)     //  obj
   func.apply(obj)    //  obj
   func.bind(obj)()   //  obj

new绑定

new操作符会将this指向新生成的实例

   function func(){
        this.a = 'a'
   }
   var newFunc = new func()
   console.log(newFunc.a,newFunc)      //  a   func {a:'a'}

箭头函数的this

箭头函数的this指向它定义时外层环境的this指向,也就是说它自身没有this,指向谁靠的是外层环境的this,并且一旦指定无法变更

    function func(){
        this.name = 'func'
        var obj ={
            name:'obj'
        }
        var a = ()=>{
            console.log(this.name)
        }
        a()            //  func
        a.call(obj)    //  func
    }
    func()

在这个示例中,使用call依旧不能改变this的指向


点击全文阅读


本文链接:http://zhangshiyu.com/post/30576.html

绑定  指向  函数  
<< 上一篇 下一篇 >>

  • 评论(0)
  • 赞助本站

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。

关于我们 | 我要投稿 | 免责申明

Copyright © 2020-2022 ZhangShiYu.com Rights Reserved.豫ICP备2022013469号-1