箭头函数与普通函数有何区别？

本文共计1018个文字，预计阅读时间需要5分钟。

本篇文章向读者介绍ES6中新增的箭头函数。它具有特定的参考价值，并建议有需要的朋友参考以下内容，希望能对大家有所帮助。

箭头函数 + ES6 新增了使用箭头语法定义函数和表达式的功能。这使得代码更加简洁，提高了可读性。以下是箭头函数的一些特点：

1. 简洁的语法：箭头函数使用箭头（=>）来定义，无需使用function关键字。

2.无绑定this：箭头函数不绑定自己的this，它会捕获其所在上下文的this值。

3.无arguments对象：箭头函数没有arguments对象，可以使用剩余参数（...）语法来获取参数。

示例代码：

javascript

// 传统函数function sum(a, b) { return a + b;}

// 箭头函数const sum=(a, b)=> a + b;

箭头函数在以下场景中非常有用：

1. 简单的回调函数：例如，在数组方法中作为回调函数。

2.事件处理：例如，为按钮点击事件绑定箭头函数。

3.高阶函数：例如，在map、filter、reduce等高阶函数中使用箭头函数。

总之，箭头函数是ES6中一个非常有用的特性，它使得代码更加简洁、易读。希望本文能对大家有所帮助。

本篇文章给大家介绍一下es6的箭头函数。有一定的参考价值，有需要的朋友可以参考一下，希望对大家有所帮助。

箭头函数

ES6新增了使用箭头语法定义语法函数表达式的能力。很大程度上，箭头函数实例化的函数对象与正式的函数表达式创建的函数对象行为是相同的。任何时候使用函数表达式的地方，都可以使用箭头函数

let fn = (a, b) => { return a + b } let fun = function (a, b) { return a + b } console.log(fn(1, 2)) // 3 console.log(fun(1, 2)) // 3

箭头函数适合嵌入函数

let arr = [1, 2, 3, 4]; console.log( arr.map(function (item) { return item + 1 }) ) // [2,3,4,5] console.log( arr.map((item) => { return item + 1 }) ) // [2,3,4,5]

箭头函数如果只有一个参数，可以省略括号

let a = (i) => { console.log(i) } // 当前箭头函数只有一个参数，所以可以省略括号变成以下写法， let a = i => { console.log(i) }

箭头函数如果有多个参数，中间用，逗号隔开

// 如果有多个参数，中间用逗号隔开 let a = (i, j, k) => { console.log(i, j, k) }

如果没有参数，则圆括号必须加

// 如果没有参数，则圆括号必须加 let a = () => { console.log("箭头函数没有参数") }

箭头函数也可以省略掉花括号，但这样会改变函数的行为，使用花括号就跟常规函数一样，可以在函数体内写入多条语句，如果不带花括号，那么就说明箭头后面只有一条语句，且隐式的返回这条语句的值

let a = () => { console.log("我是带花括号的箭头函数") console.log("我是带花括号的箭头函数") console.log("我是带花括号的箭头函数") } let a = () => console.log("我是不带花括号的箭头函数") let b = i => i + 1 console.log(b(1)) // 这个时候箭头函数隐式的返回了i+1的值，所以打印结果为2

虽然箭头函数的语法简洁，但是还是有很多场景不适合用，箭头函数不能用arguments、super和target，也不能用作构造函数，箭头函数也没有prototype属性。

推荐学习：Javascript视频教程

以上就是箭头函数是什么的详细内容，更多请关注自由互联其它相关文章！