Arrow functions

Arrow functions表达式相比函数表达式有更短的语法,没有自己的this、argument、super或者new.target。

1.语法规则:

基础语法:

  (param1, param2, …, paramN) => { statements }

  (param1, param2, …, paramN) => expression

  // equivalent to: => { return expression; }

  // Parentheses are optional when there's only one parameter name:

  (singleParam) => { statements }

  singleParam => { statements }

  // The parameter list for a function with no parameters should be written with a pair of parentheses.

  () => { statements }

高级语法:

  // Parenthesize the body of function to return an object literal expression:

  params => ({foo: bar})

  // Rest parameters and default parameters are supported

  (param1, param2, ...rest) => { statements }

  (param1 = defaultValue1, param2, …, paramN = defaultValueN) => {

  statements }

  // Destructuring within the parameter list is also supported

  var f = ([a, b] = [1, 2], {x: c} = {x: a + b}) => a + b + c;

  f(); // 6

2.箭头函数用作方法

箭头函数表达式最适合非方法函数

Eg:

  'use strict';

  var obj = {

  i: 10,

  b: () => console.log(this.i, this),

  c: function() {

     console.log(this.i, this);

  }

  }

  obj.b(); // prints undefined, Window {...} (or the global object)

  obj.c(); // prints 10, Object {...}

3.功能体

箭头功能可以具有“简洁的身体”或通常的“块体”。

在简洁的主体中,只指定了一个表达式,该表达式成为显式返回值。在块体中,您必须使用显式return语句。

Eg:

  var func = x => x * x;

  // concise body syntax, implied "return"

  var func = (x, y) => { return x + y; };

  // with block body, explicit "return" needed

虽然箭头函数中的箭头不是运算符,但箭头函数具有特殊的解析规则,与常规函数相比,它们与运算符优先级的交互方式不同。

  let callback;

  

  callback = callback || function() {}; // ok

  callback = callback || () => {};

  // SyntaxError: invalid arrow-function arguments

  callback = callback || (() => {});    // ok

----Arrow functions----的更多相关文章

  1. 《理解 ES6》阅读整理:函数(Functions)(四)Arrow Functions

    箭头函数(Arrow Functions) 就像名字所说那样,箭头函数使用箭头(=>)来定义函数.与传统函数相比,箭头函数在多个地方表现不一样. 箭头函数语法(Arrow Function Sy ...

  2. JavaScript ES6 Arrow Functions(箭头函数)

    1. 介绍 第一眼看到ES6新增加的 arrow function 时,感觉非常像 lambda 表达式. 那么arrow function是干什么的呢?可以看作为匿名函数的简写方式. 如: var ...

  3. ES6 In Depth: Arrow functions

    Arrows <script language="javascript"> <!-- document.bgColor = "brown"; ...

  4. ES6学习笔记<二>arrow functions 箭头函数、template string、destructuring

    接着上一篇的说. arrow functions 箭头函数 => 更便捷的函数声明 document.getElementById("click_1").onclick = ...

  5. Arrow functions and the ‘this’ keyword

    原文:https://medium.freecodecamp.org/learn-es6-the-dope-way-part-ii-arrow-functions-and-the-this-keywo ...

  6. ES6 箭头函数(Arrow Functions)

    ES6 箭头函数(Arrow Functions) ES6 可以使用 "箭头"(=>)定义函数,注意是函数,不要使用这种方式定义类(构造器). 一.语法 具有一个参数的简单函 ...

  7. arrow functions 箭头函数

    ES6里新增加的,与普通方法不同的地方 1.this 的对象在定义函数的时候确定了,而不是在使用的时候才决定 2.不可以使用 new  ,也就不能当构造函数 3.this 的值一旦确定无法修改     ...

  8. 箭头函数 Arrow Functions/////////////////////zzz

    箭头符号在JavaScript诞生时就已经存在,当初第一个JavaScript教程曾建议在HTML注释内包裹行内脚本,这样可以避免不支持JS的浏览器误将JS代码显示为文本.你会写这样的代码: < ...

  9. ES6箭头函数(Arrow Functions)

    ES6可以使用“箭头”(=>)定义函数,注意是函数,不要使用这种方式定义类(构造器). 一.语法 1. 具有一个参数的简单函数 var single = a => a single('he ...

  10. 深入浅出ES6(七):箭头函数 Arrow Functions

    作者 Jason Orendorff  github主页  https://github.com/jorendorff 箭头符号在JavaScript诞生时就已经存在,当初第一个JavaScript教 ...

随机推荐

  1. 将eclipse dynamic web project部署到指定的tomcat软件下的webapps文件夹中

  2. Activiti 框架学习

    1:工作流的概念 说明: 1)      假设:这两张图就是华谊兄弟的请假流程图 2)      图的组成部分: 人物:范冰冰 冯小刚 王中军 事件(动作):请假.批准.不批准 工作流(Workflo ...

  3. random模块的学习

    import random # ret = random.random() #随机取0-1中间的浮点数 # ret = random.randint(1,3) #随机取1-3中间的整数 # ret = ...

  4. node-服务器

    原生: const http=require('http'); http.createServer((request,response)=>{ response.writeHead(200,{& ...

  5. 关于VMware虚拟机安装镜像时黑屏的解决办法

    新下载的VMware14,设置了新的虚拟机,镜像放的是ubuntu系统,然后开机要安装系统的时候黑屏,并没有进入到安装系统的界面 解决办法:在管理员权限下打开cmd,然后运行netsh winsock ...

  6. mongodb安装使用简单命令

    .window+x,A,管理员进入cmd.cd C:\Program Files\MongoDB\Server\3.4\bin.安装:mongod --dbpath "D:\work\DB\ ...

  7. 【CPU微架构设计】利用Verilog设计基于饱和计数器和BTB的分支预测器

    在基于流水线(pipeline)的微处理器中,分支预测单元(Branch Predictor Unit)是一个重要的功能部件,它负责收集和分析分支/跳转指令的执行结果,当处理后续分支/跳转指令时,BP ...

  8. springboot+maven多模块工程dependency not found

    参见:https://blog.csdn.net/m0_37943753/article/details/81031319. 重点是<dependencyManagement>标签的作用, ...

  9. hibernate多生成一个外键以及映射文件中含有<list-index>标签

    (原文地址: http://blog.csdn.net/xiaoxian8023/article/details/15380529) 一.Inverse是hibernate双向关系中的基本概念.inv ...

  10. SpringCloud Hystrix熔断之线程池

    服务熔断 雪崩效应:是一种因服务提供者的不可用导致服务调用者的不可用,并导致服务雪崩的过程. 服务熔断:当服务提供者无法调用时,会通过断路器向调用方直接返回一个错误响应,而不是长时间的等待,避免服务雪 ...