箭头函数和普通函数的区别

面试时被问到箭头函数和普通函数的区别。。。

-_-||

举个例子:

[javascript] view plain copy
  1. function make () {  
  2.   return ()=>{  
  3.     console.log(this);  
  4.   }  
  5. }  
  6. var testFunc = make.call({ name:'foo' });  
  7. testFunc();   
  8. testFunc.call({ name:'bar' });   
[javascript] view plain copy
  1. Object {name: "foo"}  
  2. Object {name: "foo"}  
可以看到箭头函数在定义之后,this 就不会发生改变了,无论用什么样的方式调用它,this 都不会改变;

原因:箭头函数不会自动绑定局部变量,如this,arguments,super(ES6),new.target(ES6)等

所以箭头函数没有它自己的this值,箭头函数内的this值继承自外围作用域。在箭头函数中调用 this 时,仅仅是简单的沿着作用域链向上寻找,找到最近的一个 this 拿来使用

[javascript] view plain copy
  1. {  
  2.       ...  
  3.       addAll: function addAll(pieces) {  
  4.         var self = this;  
  5.         _.each(pieces, function (piece) {  
  6.           self.add(piece);  
  7.         });  
  8.       },  
  9.       ...  
  10.     }  
在这里,你希望在内层函数里写的是this.add(piece),不幸的是,内层函数并未从外层函数继承this的值。在内层函数里,this会是window或undefined,临时变量self用来将外部的this值导入内部函数。(另一种方式是在内部函数上执行.bind(this),两种方法都不甚美观。)这时候就可以使用箭头函数来达到要求.

阅读更多
个人分类: React-Native
上一篇论接口与抽象类的真正区别 抽象类跟接口的本质区别在于,抽象类是为了重用,接口是为了解耦
下一篇Android知识架构 · 电话面试 · Java的编程思想
想对作者说点什么? 我来说一句

没有更多推荐了,返回首页

关闭
关闭
关闭