javascript - 深度 Javascript 检查是否在没有 TypeError 的情况下未定义

Question

我厌倦了写类似的东西

if (
  typeof Foo != 'undefined' &&
  typeof Foo.bar != 'undefined' &&
  typeof Foo.bar.baz != 'undefined' &&
  Foo.bar.baz == 'qux'
) {...}

在 PHP 中它稍微好一点：

if (!empty($foo['bar']['baz']) && $foo['bar']['baz'] == 'qux') {...}

理想情况下应该是：

function u(value) {
    return (typeof value != 'undefined') ? value:null;
}
if (u(Foo.bar.baz) == 'qux') {...}

但是当我尝试这样做时，浏览器会显示“TypeError”。有什么办法可以使“u”功能？

score 7 · Accepted Answer

2020 年 4 月更新

从 Node.JS 版本 14 开始，您现在可以将以下语法用于“可选链接”

if(foo?.bar?.obj?.prop1)

如果任何链接属性不存在，则该值将键入“未定义”。

原回复：

您不必明确声明未定义。检查可以是这样的：

if(foo && foo.bar && foo.bar.obj && foo.bar.obj.prop1)

或者，如果有任何错误，您可以使用 try catch 块来捕获：

try
{
  if(foo && foo.bar && foo.bar.obj && foo.bar.obj.prop1)
    {}
}
catch(e)
{
 alert(e);
}

但是，是的，我可以看到问题所在。我建议尽量避免像你一样的深度嵌套。

score 3 · Accepted Answer

为了解决这个问题，我使用Lodash _.get。

if(_.get(Foo, ['bar','baz'] === 'qux') doThings()

如果Foo.barorFoo.bar.baz未定义，您将不会收到类型错误，并且它更易于阅读和调试。

score 2 · Accepted Answer

JavaScript 中有一个新的可选链运算符。截至 2020 年，它仅适用于流行浏览器的最新版本。所以我建议只将它与转译器一起使用。

if (Foo && Foo?.bar?.baz == 'qux') {...}

score -1 · Accepted Answer

当您假设链中的每个步骤都是一个对象而不是 0、"" 或布尔值 false 时，您可以编写：

if (
 Foo  &&
 Foo.bar &&
 Foo.bar.baz &&
 Foo.bar.baz == 'qux'
) {...}

但毕竟最好不要有这么深的嵌套对象

4 回答 4