资讯专栏INFORMATION COLUMN

上云采购季！| 2核2G4M爆款云服务器低至59元/年，更有多台、长期优惠，快来选购！

立即前往
首页/文章专栏/[面试专题]ES6之箭头函数详解

[面试专题]ES6之箭头函数详解

chenjiang3 / 1808人阅读

摘要：使用或调用由于已经在词法层面完成了绑定，通过或方法调用一个函数时，只是传入了参数而已，对并没有什么影响箭头函数不会在其内部暴露出参数等等，都不会指向箭头函数的，而是指向了箭头函数所在作用域的一个名为的值如果有的话，否则，就是。

ES6之箭头函数

标签（空格分隔）： 未分类

返回值

单行函数体默认返回改行计算结果, 多行需要指定返回值

</>复制代码 
  1. let c = (a,b)=>a+b;
  2. console.log(c(1,12));
  3. ES5
  4. "use strict";
  5. var c = function c(a, b) {
  6.   return a + b;
  7. };
  8. console.log(c(1, 12));
</>复制代码 
  1. let c = (a,b)=>{a = a+b;a--}
  2. console.log(c(1,12));//undefined
  3. let c = (a,b)=>{a = a+b;return a--};

返回对象时写法(否则报错)

</>复制代码 
  1. let c = (a,b)=>({a:a});
  2. or
  3. let d = (a,b)=>{return {a:a}}
this指向

绑定外层函数this(简化一个常见用法,_this = this)

</>复制代码 
  1. 在箭头函数出现之前，每个新定义的函数都有其自己的 this 值（例如，构造函数的 this 指向了一个新的对象；严格模式下的函数的 this 值为 undefined；如果函数是作为对象的方法被调用的，则其 this 指向了那个调用它的对象）。//MDN

ES5

</>复制代码 
  1. function Person(age) {
  2.     var _this = this;
  3.     this.age = age;
  4.     setTimeout(function growUp() {
  5.         console.log(this);
  6.         _this.age++;
  7.     }, 1000);
  8. }
  9. var p = new Person(26);

ES6

</>复制代码 
  1. function Person(age) {
  2.     this.age = age;
  3.     setTimeout(()=> {
  4.         console.log(this);
  5.         this.age++;
  6.     }, 1000);
  7.     console.log(this.age);
  8. }
  9. var p = new Person(26);

使用 call 或 apply 调用

</>复制代码 
  1. 由于 this 已经在词法层面完成了绑定，通过 call() 或 apply() 方法调用一个函数时，只是传入了参数而已，对 this 并没有什么影响.
arguments 
</>复制代码 
  1. 箭头函数不会在其内部暴露出参数（arguments )： arguments.length, arguments[0], 等等，都不会指向箭头函数的 arguments，而是指向了箭头函数所在作用域的一个名为 arguments 的值（如果有的话，否则，就是 undefined。——译者注）。

这种情况下,ES6 rest参数可以替代

</>复制代码 
  1. function foo(n) { 
  2.   var f = (...args) =>  args[0]+args.length; 
  3.   return f(n); 
  4. }
  5. foo(1); // 1
GPU云服务器 云服务器 箭头函数 java面试之io 时间函数详解 hash函数详解

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/112479.html

相关文章

  • [面试专题]ES6之箭头函数详解

    摘要：使用或调用由于已经在词法层面完成了绑定，通过或方法调用一个函数时，只是传入了参数而已，对并没有什么影响箭头函数不会在其内部暴露出参数等等，都不会指向箭头函数的，而是指向了箭头函数所在作用域的一个名为的值如果有的话，否则，就是。 ES6之箭头函数 标签（空格分隔）： 未分类 返回值 单行函数体默认返回改行计算结果, 多行需要指定返回值 let c = (a,b)=>a+b; conso...

    Caicloud 评论0 收藏0

  • [面试专题]ES6之箭头函数详解

    摘要：使用或调用由于已经在词法层面完成了绑定，通过或方法调用一个函数时，只是传入了参数而已，对并没有什么影响箭头函数不会在其内部暴露出参数等等，都不会指向箭头函数的，而是指向了箭头函数所在作用域的一个名为的值如果有的话，否则，就是。 ES6之箭头函数 标签（空格分隔）： 未分类 返回值 单行函数体默认返回改行计算结果, 多行需要指定返回值 let c = (a,b)=>a+b; conso...

    sevi_stuo 评论0 收藏0

  • H5学习

    摘要：为此决定自研一个富文本编辑器。本文，主要介绍如何实现富文本编辑器，和解决一些不同浏览器和设备之间的。 对ES6Generator函数的理解 Generator 函数是 ES6 提供的一种异步编程解决方案，语法行为与传统函数完全不同。 JavaScript 设计模式 ② 巧用工厂模式和创建者模式 我为什么把他们两个放在一起讲？我觉得这两个设计模式有相似之处，有时候会一个设计模式不能满...

    aristark 评论0 收藏0

发表评论

登陆后可评论

0条评论

chenjiang3

男|高级讲师
我要私信

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<