欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

ES6新特性-函数的简写(箭头函数)

程序员文章站 2023-12-22 08:32:04
...

作者:just4you
来源:CSDN
原文:https://blog.csdn.net/just4you/article/details/79258799 (感谢分享)

通常函数的定义方法

var fn = function(...){
    ......    
}
//例如:
var add = function(a,b){
    return a+b;
}

//或者:
function fn(...){
    ......
}
//例如:
function add(a,b){
    return a+b;
}
简写方法速记

将原函数的“function”关键字和函数名都删掉,并使用“=>”连接参数列表和函数体。

function add(a,b){
    return a+b;
}
//简写为:
(a,b)=>{//删掉了function和函数名
    return a+b;
}

var add = function(a,b){
    return a+b;
}
//简写为:
var add = (a,b)=>{ //删掉了function
    return a+b;
}
附加规则

当函数参数只有一个时,括号可以省略;但是没有参数时,括号不可以省略。
函数体(中括号)中有且只有一行return语句时,中括号及return 关键字可以省略。
新旧函数定义的对比
无参数函数

let fn = function(){
    return 'helloWorld';
}

//简写为:
let fn = ()=>{//但是没有参数时,括号不可以省略
    return 'helloWorld';
}
//根据规则二,简写为:
let fn = ()=>'helloWorld';

一个参数的函数

let fn = function(a){
    return a;
}

//简写为:
let fn = (a)=>{
    return a;
}
//根据规则一,还可以简写为:
let fn = a=>{
    return a;
}
//根据规则二,还可以简写为:
let fn = a=>a;

多个参数的函数

let fn = function(a,b){
    return a+b;
}
//简写为:
let fn = (a,b)=>{//多于一个参数,圆括号不可省略
    return a+b;
}
//根据规则二,还可以简写为:
let fn = (a,b)=>a+b;

函数体代码多于一行

let fn = function(){
    console.log('hello');
    console.log('world');
    return 'helloWorld';
}
//简写为:
let fn = ()=>{
    console.log('hello');
    console.log('world');
    return 'helloWorld';
}

函数返回json对象时

let fn = function(){
    return {"a":5};
}

//简写为:
//let fn = ()=>{"a":5};这是错误的
//应简写为:
let fn = ()=>({"a":5});//注意{}外的圆括号。

实例

//排序方法1
let arr = [3,6,2,1];
let arr2 = arr.sort(function(a,b){
    return a-b;
});
alert(arr2);

//排序方法2
let arr3 = [939,23,0,-1,94];
let arr4 = arr3.sort((a,b)=>a-b);
alert(arr4);

上一篇:

下一篇: