我想知道如何避免这些大量的空检查,或者至少了解重点是什么,因为它似乎适得其反。
如果我省略空检查,Flowtype 会给我一个错误:
var myEl = new MyElement()
if (document.body != null) { // error on next line if omitted
document.body.appendChild(myEl)
}
我也必须在每个回调中对文档主体进行空检查,因为谁知道,也许主体在这里是空的,对吧?!
我认为这完全是矫枉过正。不仅如此,这么简单的空检查有什么意义呢?它只会默默地跳过程序的重要部分,并在其他地方表现出未定义的行为,并使调试应用程序变得更加困难。
如果这里发生错误,我真的更喜欢在此时出现一个空异常,因为要真正确定我在 javascript 中编写的这个微小的 2 行代码段在 flowtype 中必须像这样:
var myEl = new MyElement()
if (document.body != null) {
document.body.appendChild(myEl)
} else {
console.error("null error")
}
因此,4 个额外的代码行和一些嵌套只是为了跟踪如果我让应用程序遇到错误我可以免费得到的东西。我在每个查询选择器上都需要这 4 行。在每个 document.body 上。在每个 getElementByTagName 上。仅此一项就可能使我的整个代码库增加 10%。
如此严格执行有何意义?
在其他语言中,我还可以根据需要逐渐尝试捕获这些热点,但 Flow 也不让我这样做。无论我是否添加 try-catch,它都会显示错误。
通过使用类型检查器,您就选择了它强制执行的规则。访问可为 null 类型的属性是这些限制之一。因此,如果您希望出现空值异常,则需要显式抛出异常,以向 Flow 证明这就是您想要的。例如,您可以制作一个类似的模块
if (!document.body) throw new Error("Unexpectedly missing <body>.");
export const body: HTMLElement = document.body;
export function querySelector(el: HTMLElement, selector: string): HTMLElement {
const result = el.querySelector(selector);
if (!result) throw new Error(`Failed to match: ${selector}`);
return result;
}
通过抛出,这些函数在所有情况下都明确表示“我将返回一个元素”,并且在null
情况下,他们会抛出异常。
然后在您的正常代码中,保证您可以使用这些
import {body, querySelector} from "./utils";
body.appendChild(document.createElement('div'));
querySelector(body, 'div').setAttribute('thing', 'value');
它会检查属性。
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)