关于箭头函数

2022/7/25 6:52:45

本文主要是介绍关于箭头函数,对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!

参考:https://www.runoob.com/js/js-function-definition.html   

         https://blog.csdn.net/xiaoxiaodechongzi/article/details/114402981

 

ES6 中新增了箭头函数。

箭头函数表达式的语法比普通函数表达式更简洁。

 

1-为什么叫Arrow Function?因为它的定义用的就是一个箭头:

x => x * x

  上面的箭头函数相当于ES5中:

function (x) {
    return x * x;
}
  2-箭头函数的格式:
(参数1, 参数2, …, 参数N) => { 函数声明 }

(参数1, 参数2, …, 参数N) => 表达式(单一)
// 相当于:(参数1, 参数2, …, 参数N) =>{ return 表达式; }

3-根据参数数量不同,格式有所不同:

3.1没有参数的函数应该写成一对圆括号:

() => {函数声明}
实例: ()=>3.14

3.2当只有一个参数时,圆括号是可选的:

(单一参数) => {函数声明}
单一参数 => {函数声明}
 实例:x=>x*2;

3.3参数不止一个,就需要用括号()括起来:

(参数1, 参数2, …, 参数N) => { 函数声明 }
实例:const x = (x, y) => { return x * y };
4-根据表达式数量不同,格式有所不同: 4.1只包含一个表达式,连{ … }和return都省略掉了。      实例:     在ES5中,函数的格式是
function (x) {
    return x * x;
}

而在ES6中,用箭头函数可以写成
x => x * x

4.2包含多条语句,这时候就不能省略{ … }和return.
实例:
在ES5中,函数的格式是
function (x) {
    if(x>0){
       return *x;
}
else{
      return -x*x;
}

而在ES6中,用箭头函数则写成
x => {
    if (x > 0) {
        return x * x;
    }
    else {
        return - x * x;
    }
}
此时不能省略{ … }和return。



 




这篇关于关于箭头函数的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!


扫一扫关注最新编程教程