微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

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

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

  1. 语法更加简洁、清晰
  2. 箭头函数没有自己的this,它会捕获自己在定义时(注意,是定义时,不是调用时)所处的外层执行环境的this,并继承这个this值。所以,箭头函数中this的指向在它被定义的时候就已经确定了,之后永远不会改变。
    • .call()/.apply()/.bind()无法改变箭头函数中this的指向
    • 对象不构成单独的作用域
  3. 箭头函数不能作为构造函数使用
    • 涉及知识点:构造函数的过程
    • 因为箭头函数没有自己的this,它的this其实是继承了外层执行环境中的this,且this指向永远不会随在哪里调用、被谁调用而改变,所以箭头函数不能作为构造函数使用,或者说构造函数不能定义成箭头函数,否则用new调用时会报错!
  4. 箭头函数没有自己的arguments
    • 箭头函数没有自己的arguments对象。在箭头函数中访问arguments实际上获得的是外层局部(函数)执行环境中的值。
  5. 箭头函数没有原型prototype
  6. 箭头函数不能用作Generator函数,不能使用yeild关键字

箭头函数的适用场景和不适用场景?

  • 箭头函数适合于无复杂逻辑或者无副作用的纯函数场景下,例如:用在 map、reduce、filter 的回调函数定义中
  • 箭头函数的亮点是简洁,但在有多层函数嵌套的情况下,箭头函数反而影响了函数的作用范围的识别度,这种情况不建议使用箭头函数
  • 箭头函数要实现类似纯函数效果,必须剔除外部状态。所以箭头函数不具备普通函数里常见的 this、arguments 等,当然也就不能用 call()、apply()、bind() 去改变 this 的指向
  • 箭头函数不适合定义对象的方法(对象字面量方法、对象原型方法、构造器方法),因为箭头函数没有自己的 this,其内部的 this 指向的是外层作用域的 this
  • 箭头函数不适合定义结合动态上下文的回调函数(事件绑定函数),因为箭头函数在声明的时候会绑定静态上下文

构造函数的new都做了些什么?

  1. JS内部首先会先生成一个对象;
  2. 再把函数中的this指向该对象;
  3. 后执行构造函数中的语句;
  4. 最终返回该对象实例。

参考

  • https://zhuanlan.zhihu.com/p/75337266

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 [email protected] 举报,一经查实,本站将立刻删除。

相关推荐