ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

【ES6】箭头函数、剩余参数、函数参数的默认值

2022-04-30 22:02:18  阅读:143  来源: 互联网

标签:ES6 简写 const 函数 函数参数 箭头 参数 return 默认值


箭头函数

MDN:箭头函数表达式的语法比函数表达式更简洁,并且没有自己的this,arguments,super或new.target。箭头函数表达式更适用于那些本来需要匿名函数的地方,并且它不能用作构造函数。

箭头函数的注意事项

  1. 箭头函数没有自己的this,只能沿着作用链的上一层继承this,最终都指向windows。严格模式下,this为undefined。
  2. 同理箭头函数无法使用当前函数的arguments,会向函数外找。但是箭头函数可以使用剩余参数...rest
  3. 箭头函数没有prototype,所以也不能new实例。

★箭头函数的简写形式

普通函数写法:
function(){};

箭头函数写法:
()=>{};

箭头函数只带一个参数时,去除形参外的括号():

const requests = (a) => {}; 简写为 const requests = a => {};

箭头函数,不确定参数个数时,只能使用剩余参数,不能使用arguments:

(a,b, ...rest) => ...rest.forEach(item => console.log(item))

箭头函数内的函数体只有一行代码,去除{return }:

(a,b) => {return a+b} 简写为 (a,b) => a+b

箭头函数内的函数体返回的是一个对象,不能直接去除{return},要在对象外加(),否则对象外的{}被视为函数外的花括号报错:

(a,b) => {return {name:a, gender:b}} 简写为 const requests = a => ({name:a, gender:b})

箭头函数与解构配合

const fullName = (user) => { return user.firstnName + '' + user.lastName} 简写为 const fullName = ({firstName,lastName}) => firstName + '' + lastName

箭头函数三目运算符
(a,b) => a>b ? a : b

函数参数的默认值

函数默认参数允许在没有值或undefined被传入时使用默认形参。

解决了缺省参数报错undefined

没什么好讲的,这是定义里已经说明了。也可以用作实际应用场景中初次加载中,因为用户点击而没有拿到参数值的时候,使用默认值渲染。
(a,b=1) => a+b

默认参数可用于后面的默认参数

const welcome = (name,gender, greetings = name + '' + gender) => {}

有默认值的解构参数

( [x, y] = [1, 2], {z: z} = {z: 3} )=> x + y + z;

标签:ES6,简写,const,函数,函数参数,箭头,参数,return,默认值
来源: https://www.cnblogs.com/wanglei1900/p/16211506.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有