博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
ES6 箭头函数易出错细节
阅读量:5893 次
发布时间:2019-06-19

本文共 891 字,大约阅读时间需要 2 分钟。

箭头函数表达式的语法比函数表达式更短,并且没有自己的this,arguments,super或 new.target。

箭头函数基本语法

(参数1, 参数2, …, 参数N) => { 函数声明 }(参数1, 参数2, …, 参数N) => 表达式(单一)//相当于:(参数1, 参数2, …, 参数N) =>{ return 表达式; }// 当只有一个参数时,圆括号是可选的:(单一参数) => {函数声明}单一参数 => {函数声明}// 没有参数的函数应该写成一对圆括号。() => {函数声明}

写法对比

let fun1 = (a, b) => a + b    // 正确写法let fun2 = (a, b) => { a + b }  // 错误写法let fun3 = (a, b) => { return a + b }    // 正确写法console.log(fun1(1,2), fun2(1,2), fun3(1,2)) // 3 undefined 3
  • 当箭头函数后面的函数声明部分只有一行时,可以不加大括号,并且默认return
  • 当箭头函数后面的函数声明部分加大括号时,必须添加return

注意


在ES6中,由于大括号被解释为代码块,所以如果箭头函数直接返回一个对象,必须在对象外面加上括号,否则会报错。

let fun1 = id => { id: id, name: "jack" };console.log(fun1(111)); // 报错
let fun2 = id => ({ id: id, name: "jim" });console.log(fun2(222));    // 不报错,   {id: 222, name: "jim"}
let fun3 = id => {  return { id: id, name: "jack" };}fun3(333); // 不报错,  {id: 333, name: "jim"}

转载于:https://www.cnblogs.com/cckui/p/9915655.html

你可能感兴趣的文章
[LeetCode136]Single Number寻找一个数组里只出现一次的数
查看>>
webpack多页应用架构系列(七):开发环境、生产环境傻傻分不清楚?
查看>>
bootstrap - image
查看>>
spring-boot 和 webpack-dev-server联合开发
查看>>
从TimSort说起
查看>>
构建 iOS 界面:子类化 Views
查看>>
笨办法学C 练习1:启用编译器
查看>>
用Golang写一个搜索引擎(0x01)--- 基本概念
查看>>
【算法之美】logn 时间复杂度求解两个有序数组的中位数
查看>>
树的总结--树的性质(树的深度) leetcode
查看>>
docker环境搭建ELK
查看>>
webpack sourcemap 选项多种模式的一些解释
查看>>
document.createElement()的用法
查看>>
MySQL 数据库怎样把一个表的数据插入到另一个表
查看>>
HTTP协议及其POST与GET操作差异 & C#中如何使用POST、GET等
查看>>
nginx正则笔记
查看>>
delphi实现数字的倒计时
查看>>
在 IIS 下添加 FLV 类型文件的支持
查看>>
java线程学习3——线程的停止
查看>>
穿过任意防火墙NAT的远程控制软件TeamViewer
查看>>