没有 CoffeeScript 的 CoffeeScript 中的问号语法答案

【问题标题】：Question mark syntax from CoffeeScript without CoffeeScript没有 CoffeeScript 的 CoffeeScript 中的问号语法
【发布时间】：2014-11-05 05:17:24
【问题描述】：

CoffeeScript 有这样的语法糖：

item.getFoo?().fooParam?.bar

这转化为与getFoo==null 和fooParam==null 检查等效的长javascript。问题是：有没有办法在 vanilla javascript 中使用除了 CoffeeScript 之外的库/翻译器/编译器的这种语法？我们在我们的项目中使用 Traceur，但它没有这样的语法，因为它不符合 ES6（尽管我希望它）。也许有什么方法可以在 Traceur fork 中实现它？

【问题讨论】：

你尝试过 fork 吗？问题出在哪里？
我似乎太难学习内部 Traceur 的工作原理来实现这个小功能。
此外，您可能与在咖啡脚本中重新定义为 if … then … else… 的三元运算符 (…?…:…) 发生冲突
也许可以使用 sweet.js 之类的东西？
@phenomnomnominal Brototype 看起来完全像我在生产环境中使用的扩展。

标签： javascript coffeescript

【解决方案1】：

如果你不想要确切的 CoffeeScript 语义，你可以作弊：

return item.getFoo ? (item.getFoo().fooParam || {}).bar : undefined;

这里有一些技巧。

三元运算符用于检验item.getFoo的真实性
如果fooParam 缺失、错误或不存在，我们将其替换为空对象。 CoffeeScript 会在这里得到救助。
无论bar是否存在，我们都会返回它的值。如果它确实存在，你会得到你想要的值。如果它不存在但设置了fooParam，你会得到undefined。如果它不存在是因为 fooParam 未定义而我们退回到 {}，您仍然会得到 undefined。

如果三元运算符碍事，你可以写一些助手：

function defaultObject(input) { // A helper to put somewhere
    return input || {};
}

return defaultObject((item.getFoo || defaultObject)().fooParam).bar;

这更棘手：defaultObject 在使用getFoo 调用时将返回{}，因此您不需要在函数调用周围使用三元运算符。如果fooParam 不真实，defaultObject 将返回另一个空对象，从而不再需要另一个||。如果fooParam 为真，defaultObject 的行为类似于身份函数并返回它。

我确信这可以进一步降低，但我建议避免这种模式。任何阅读您的代码的人都会感到相当困惑，并责怪您在代码库中弄得一团糟。

【讨论】：

【解决方案2】：

我最近也有同样的问题，我来到这里希望得到比我目前更好的解决方案。如果您经常这样做，则可以更轻松地为您创建一个函数：

var qm = function(arg) {
  if (arg instanceof Object) return arg;
  return function(){};
};

然后要使用它，您将对象包装在其中以确保不会引发错误。如果一行中有很多q问题m方舟

，它开始看起来很难看

qm(qm(item.getFoo)().fooParam).bar

【讨论】：

刚刚意识到，当上下文 (this) 发挥作用时，这完全崩溃了。

【解决方案3】：

optional chaining operator?. 是在 ES2020 中引入的。

obj.val?.prop
obj.val?.[expr]
obj.arr?.[index]
obj.func?.(args)

根据https://caniuse.com/mdn-javascript_operators_optional_chaining，截至 2021 年 11 月 29 日，91.81% 的互联网用户的浏览器都支持它。

【讨论】：