【面试题】ES6语法五之箭头函数_es6 箭头函数 面试题，深度好文

常用的JavaScript设计模式

• 单体模式

• 工厂模式

• 例模式

  

函数

• 函数的定义

• 局部变量和全局变量

• 返回值

• 匿名函数

• 自运行函数

• 闭包

  

开源分享：docs.qq.com/doc/DSmRnRG…

箭头函数总是函数表达式，并不存在箭头函数声明，它还是匿名的函数表达式。它们没有用于递归或者事件绑定/解绑定的命名引用。

箭头函数支持普通函数参数所有功能：默认值，解构，rest参数等。如果这个函数越长, => 带来的好处越小，反之越大。

this指向 在普通函数中，this指向是动态的，而在箭头函数中，是可以预测的。this在箭头函数中，和词法作用域有关。

var ctrl = {
    makeRequest: function(){
        var self = this;
        btn.addEventListener('click', function (){
            self.makeRequest()
        }, false)
    }
}

上述代码修改成箭头函数的话，是这样的：

var ctrl = {
    makeRequest: function(){
        btn.addEventListener('click',  ()=>{
            this.makeRequest()
        }, false)
    }
}

这样，省略了var self = this关键字function。

但如果全部改为箭头函数的话，this就会乱套。此时指向全局对象。

// 不推荐， 改变了函数原有的本意
var ctrl = {
    makeRequest: ()=>{
        btn.addEventListener('click',  ()=>{
            this.makeRequest()
        }, false)
    }
}

如果要还原函数原来的意思，我们需要把var self = this这样的hack，或者通过var arg=Array.prototype.slice.call(..)词法复制。这样就达到了安全的全部替换成箭头函数的目的了。

结语：虽然箭头函数给我带来了便利，但是我们在使用的过程中还是要注意一些隐秘的坑。this的指向问题，是否需要递归？是否需要硬绑定或者是解绑... 判断函数体的长度是否适用箭头函数，可读性如何？

 

   总结给大家推荐一个实用面试题库

**1、前端面试题库 （**面试必备） 推荐：★★★★★

地址：前端面试题库

2、前端技术导航大全      推荐：★★★★★

地址：前端技术导航大全

后话

---

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

对于面试，说几句个人观点。

面试，说到底是一种考试。正如我们一直批判应试教育脱离教育的本质，为了面试学习技术也脱离了技术的初心。但考试对于人才选拔的有效性是毋庸置疑的，几千年来一直如此。除非你有实力向公司证明你足够优秀，否则，还是得乖乖准备面试。这也并不妨碍你在通过面试之后按自己的方式学习。 其实在面试准备阶段，个人的收获是很大的，我也认为这是一种不错的学习方式。首先，面试问题大部分基础而且深入，这些是平时工作的基础。就好像我们之前一直不明白学习语文的意义，但它的意义就在每天的谈话间。

所谓面试造火箭，工作拧螺丝。面试往往有更高的要求，也迫使我们更专心更深入地去学习一些知识，也何尝不是一种好事。