这是我参与11月更文挑战的第6天,活动详情查看:2021最后一次更文挑战
前面更文我们学习了JavaScript 中的 【JavaScript 学习-特殊符号-位运算符】、【JavaScript 学习-逻辑运算符-短路了?】 本文来学习 JavaScript 箭头函数
JavaScript 中的箭头函数
箭头函数 是函数的另一种表示方法, 这看起来和其他表示方法非常的不同. 定义一个普通函数的关键字 function 被箭头函数用 一个由等于号=和大于号> 组成的箭头=>所代替, 故称箭头函数.
而运算符 大于或等于 写作为(>=)/ 小于或等于(<=), 这样箭头函数这样的写法的和这两个运算符很容易弄混淆, 所以老道在书中写到"为了在打字上偷个小懒,不值得"
箭头函数表达式的语法比函数表达式更简洁,并且没有自己的
this,arguments,super或new.target。箭头函数表达式更适用于那些本来需要匿名函数的地方,并且它不能用作构造函数。
function 定义一个普通函数
// 关键字 function 普通方法定义一个函数
const fn = function (base = '参数', args = '可以有多个参数') {
const args = [...arguments]
console.log(args, arguments, arguments.length)
}
箭头函数 定义一个函数
箭头位于参数列表(传递的多个参数)之后, 箭头后面跟着函数体, 可以理解为: 什么条件(参数列表)产生了什么效果(函数体).
看一个简单的例子:
// 定义一个变量用于遍历
const myArticles = [
'JavaScript 学习-特殊符号-位运算符',
'JavaScript学习-逻辑运算符-短路了?',
'逻辑运算符或"||" ',
'逻辑运算符与"&&"',
]
console.log(myArticles.map((article) => article.length))
// 箭头函数一个参数可以省略括号, 自动格式化的还是给加上了.
这里的箭头函数, 传递一个参数就是遍历 myArticles 的子元素, 输出这个元素的长度 length