JavaScript lambda 表达式介绍

旧城等待， 2023-09-28 10:10 25阅读 0赞

一些初学者在工作中遇到 lambda 表达式时会感到困惑，说：“好吧，这是什么写法？”

和那些新手一样，这篇文章是为那些第一次遇到 lambda 表达式时感到困惑的人写的`() => console.log`。这次我将使用 JavaScript 解释 lambda 表达式，但同样的想法也可以应用于其他语言。

**目录**

1.  [阅读这篇文章你可以做什么][Link 1]
2.  [什么是“Lambda 表达式”？][Lambda]
3.  [lambda 表达式的基础知识][lambda]
4.  [允许您编写更短的 lambda 表达式的条件][lambda 1]
    
    1.  [案例1：函数只有一个参数][1]
    2.  [案例2：当有一个进程时][2]
    3.  [Case3：当处理只是一个return语句时][Case3_return]
5.  [重新确认允许您使用示例编写更短的 lambda 表达式的条件][lambda 2]
6.  [结论][Link 2]

### 阅读这篇文章你可以做什么 ###

**您将能够读写 lambda 表达式！**

### 什么是“Lambda 表达式”？ ###

在 JavaScript 中，您可以将函数放入变量中或将其作为参数传递。

例如，像这样。

// Example1: Assign a function to a variable and execute
    // Message "Hello world!" is displayed on the console
    let showMessage = function (msg) {
      console.log(msg)
    }
    showMessage('Hello world!')
    
    // Example2: Pass a function as an argument
    // After 1 second, the console will display "1 second has passed!"
    setTimeout(function () {
        console.log('1 second has passed!')
    }, 1000)

**`setTimeout`Example2 中出现的是一个函数，它在 X 毫秒后执行第一个参数接收到的函数**（X 是第二个参数接收到的数字）。当您想要延迟函数调用时使用它。

在上面的示例中，我们创建了一个未命名的函数 like`function (argument) {/ * some processing * /}`并将其放入变量中或将其作为参数传递。**这样的未命名函数称为匿名函数。**

**而“Lambda 表达式”是编写这个匿名函数的一种简洁方式。**

### lambda 表达式的基础知识 ###

然后，我们将通过将其与如何编写匿名函数进行比较来了解如何编写 lambda 表达式。

让我们编写一个函数，它接受一个数字并以两种不同的方式返回该数字的两倍。

// anonymous function
    function (num) {
      return num * 2
    }
    
    // lambda expression
    (num) => {
      return num * 2
    }

如果你并排看，很容易看出他们有什么样的对应关系！

匿名函数写为`function (argument) {/ * some processing * /}`，而 lambda 表达式写为`(argument) => {/ * some processing * /}`。

Lambda 表达式有时被称为**箭头函数**，因为它们是使用箭头编写的。

**由于使用了 lambda 表达式，8 个字符的“ `function`”现在变成了 2 个字符`=>`。**

工程师是一个不喜欢重复需要时间的事情的种族。“每次都写8字好麻烦！`function`它太长了！手累了！” 这样的想法可能催生了 Lambda 表达式。

好吧，对于那些认为“减少 6 个字符没什么大不了的”的人来说，这是个好消息。**从现在开始，lambda 表达式的伟大之处就在于此。如果条件满足，可以改写得更短更简洁。**

### 允许您编写更短的 lambda 表达式的条件 ###

#### 案例1：函数只有一个参数 ####

`()`仅当 from lambda 表达式只有一个参数时，您才能省略它。

// before
    (num) => {
      return num * 2
    }
    
    // after
    num => {
      return num * 2
    }

哦，又减少了两个字符。

请注意，**如果没有参数或者有两个或多个参数，则不能省略括号。**

// 0 arguments
    () => {
      console.log('cannot omit parentheses！')
    }
    
    // 2 or more arguments
    (a, b, c) => {
      return a + b + c
    }

#### 案例2：当有一个进程时 ####

**如果您的函数只有一个操作，您可以省略lambda 表达式中的花括号。**

// before
    () => {
      console.log('Hello world!')
    }
    
    // after
    () => console.log('Hello world!')

哦，缩短了！

顺便提一下，当有两行或多行时，大括号不能省略。这是一个示例供您参考。

// cannot omit curly braces because there are 2 lines
    (a, b) => {
      let result = a + b
      console.log(result)
    }

#### Case3：当处理只是一个return语句时 ####

**如果唯一的处理是返回语句，则`return`除了大括号之外，您还可以省略该字母。**

// before
    (a, b) => {
      return a + b
    }
    
    // after
    (a, b) => a + b

用 lambda 表达式编写要容易得多。

### 重新确认允许您使用示例编写更短的 lambda 表达式的条件 ###

现在，作为到目前为止的回顾，让我们将接收一个数字并将其加倍的函数按顺序转换为 lambda 表达式。

// anonymous function
    function (num) {
      return num * 2
    }
    
    // lambda expression (no omit)
    (num) => {
      return num * 2
    }
    
    // omit () because there is only one argument
    num => {
      return num * 2
    }
    
    // omit {} because there is only one processing
    num => return num * 2
    
    // omit letter 'return' because processing is only a return statement
    num => num * 2

如何？你可以写得很短，不是吗？

**最终形式`num => num * 2`是实现您想要实现的目标的直观表达，“将作为参数接收的值加倍”。**

### 结论 ###

在本文中，我尝试解释如何编写 lambda 表达式。希望读过的人能够自己读写lambda表达式。

但是，很多人可能只是看了这篇文章还没有意识到 lambda 表达式的便利性。

为这些人推荐以下文章。

[正在上传…重新上传取消][Link 3]

[联系][Link 3]

**[JavaScript中如何过滤数组元素【初学者易懂教程】][Link 3]**

这些教程将允许您使用 lambda 表达式轻松操作数组的元素。

在本教程结束时，您将能够使用 lambda 表达式在一行中编写很酷的数组操作！

[Link 1]: https://midolog.net/en/javascript-lambda-expression-tutorial/#i-0
[Lambda]: https://midolog.net/en/javascript-lambda-expression-tutorial/#i-1
[lambda]: https://midolog.net/en/javascript-lambda-expression-tutorial/#i-2
[lambda 1]: https://midolog.net/en/javascript-lambda-expression-tutorial/#i-3
[1]: https://midolog.net/en/javascript-lambda-expression-tutorial/#i-4
[2]: https://midolog.net/en/javascript-lambda-expression-tutorial/#i-5
[Case3_return]: https://midolog.net/en/javascript-lambda-expression-tutorial/#i-6
[lambda 2]: https://midolog.net/en/javascript-lambda-expression-tutorial/#i-7
[Link 2]: https://midolog.net/en/javascript-lambda-expression-tutorial/#%E3%81%8A%E3%82%8F%E3%82%8A%E3%81%AB
[Link 3]: https://midolog.net/en/javascript-array-filter-function-tutorial/