匿名函数,箭头函数,普通函数的作用域和this

一、匿名函数 function(){}

1.1 作用域

匿名函数作用域,变量查找从定义处的上下文由内向外依次查找。

1.2 this

匿名函数的this指向global,在浏览器中就是window。

例外:
1、匿名函数作为对象的方法时,this指向方法的调用者。
2、匿名函数作为事件函数时,this指向事件绑定的对象。

二、箭头函数()=> {}

2.1 作用域

箭头函数的作用域,为定义处(也就是调用处)的上下文,变量查找遵循从内层到外层的查找原则。

2.2 this

箭头函数没有this,箭头函数的this就是环境的this,还有一点不同就是,该this一经定义则绑定,不会被call apply等函数改变。call等函数的使用有两种情况,如果改变的环境this的指向,则箭头函数的this随之变化,如果想改变箭头函数的this指向,使它脱离原环境,而指向新的this,则不会成功。例如:

var obj = {
  name:"小明",
  getName1:function(){
      return ()=>this.name
  },
  getName2: ()=>{this.name}
}
var otherObj = {
   name:"小红"
}
obj.getName1.()()  //小明
obj.getName1.call(otherObj)()  //小红 , 此处改变的是外层this指向。
obj.getName1().call(otherObj) //小明,此处试图改变箭头函数的this绑定,不成功。
obj.getName2()  //undefined ,此处this为环境this,为global,或者window

三 普通函数 fuanction a() {} 或者 var a = function(){}

3.1 作用域

普通函数作用域为定义处。

3.2 this

普通函数this指向调用者,一般不使用call等函数改变this,则为全局调用,this指向global,如果使用call,apply,bind变更调用者,则指向新的调用者。如果作为方法调用,则this指向方法的拥有者。

例外:
1、普通函数作为事件时,this指向绑定的事件对象。
2、如果使用new,则指向new出来的对象。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。