时间戳

首页 > 解决方案 > 为什么这个过滤器函数用大括号未定义但不是没有

javascript - 为什么这个过滤器函数用大括号未定义但不是没有

问题描述

我在javascript中使用过滤器方法，我注意到如果我使用大括号它会返回未定义，但如果我删除它们会正确返回数组。有趣的是，Atom 扩展在使用 Array 过滤器方法时会自动添加它们。

此代码有效：

const filterTest = (nums) => 

nums.filter(test)

const test = (el) => el % 2 == 1
const rain = [1, 2, 5, 7, 101, 9, 108, 12, 15, 19];
console.log(filterTest(rain))

第一个代码在没有大括号的情况下工作，但为代码块添加大括号会产生未定义。为什么是这样？

标签： javascriptecmascript-6

解决方案

箭头函数对于小型函数和 IIFE 来说非常方便，部分原因在于这种带有大括号的细微行为。

如果没有花括号，箭头函数支持单个操作（例如函数调用、数学运算等）并将该操作的输出作为函数的返回值返回。这使简单的单行代码易于编写和理解，因为您可以删除所有不必要的绒毛，只留下函数的内容。

如果你想在你的箭头函数定义中有多个操作，你需要像普通函数定义一样添加花括号，然后包含一个 return 语句来定义你想要返回的操作。如果此处不包含返回，则与没有返回的普通函数相同。

换句话说，这：

let oneUpMe = (a) => { a + 1; }
// Braces enclose one or more statements like a normal function

实际上与

function oneUpMe(a) { let b = a + 1; b; }
// But on its own, just calling b does nothing; same with a+1 in the previous example.

因为没有 return 语句，所以里面的工作永远不会返回，但是

let oneUpMe = (a) => a + 1;

将返回正确的结果，因为没有大括号并且只有一个语句，return 语句是隐含的。

推荐阅读