我们相信:世界是美好的,你是我也是。平行空间的世界里面,不同版本的生活也在继续...

说到根本上,是js的函数定义的方式太多了。这些函数定义的方式再组合一下,大家就蒙圈了。本文所说的双箭头函数就是这种情况,其实就是简写方式的不断组合罢了。

苏南大叔:JavaScript,双箭头函数()=>()=>{},返回匿名函数的函数 - js-双箭头函数
JavaScript,双箭头函数()=>()=>{},返回匿名函数的函数(图1-1)

苏南大叔的“程序如此灵动”博客,记录苏南大叔的编程经验文章。测试环境:chrome@131.0.6778.70nodejs@20.18.0

函数定义方式

下面的是一些比较常见的函数定义方式。

function s1(n1) {
  return n1 + 1;
}
let s2 = (n2) => {
  return n2 + 1;
};
let s3 = (n3) => n3 + 1;
let s4 = n4 => n4 + 1;

console.log(s1(1));  // 2
console.log(s2(1));  // 2
console.log(s3(1));  // 2
console.log(s4(1));  // 2

这里着重说的就是:

()=>{return "苏南大叔"}

当函数体非常简单,甚至就仅有一个return,没有其它逻辑的时候,这种定义方式就生效了。它不需要{},也不需要return关键字,甚至单独一个参数的情况下,()都可以省略。上下这两种代码表述,是等效的。

()=>"苏南大叔"

双箭头函数

()=>()=>{}

实际上第一个()=>就是一个省略了{}return关键字,它return的是后面的这个箭头函数()=>{}

()=>{return()=>{}}

下面的代码里面,几个函数是等效的。看懂就可以完全理解双箭头函数了。

let s4 = (n4) => (d4) => {
  return n4 + d4;
};
let s5 = (n5) => {
  return (d5) => {
    return n5 + d5;
  };
};
function s6(n6) {
  return function (d6) {
    return n6 + d6;
  };
}
console.log(s4(1)(5));  // 6
console.log(s5(1)(5));  // 6
console.log(s6(1)(5));  // 6

结语

不想写结语,本文太水了。哈哈哈。

如果本文对您有帮助,或者节约了您的时间,欢迎打赏瓶饮料,建立下友谊关系。
本博客不欢迎:各种镜像采集行为。请尊重原创文章内容,转载请保留作者链接。

 【福利】 腾讯云最新爆款活动!1核2G云服务器首年50元!

 【源码】本文代码片段及相关软件,请点此获取更多信息

 【绝密】秘籍文章入口,仅传授于有缘之人   js    node