JavaScript渐进式未定义检查

假设我有以下代码：

var t = $("#objectID").html();

检查t是否定义并具有适当的值很容易

if (typeof(t) === 'undefined' || t == null || t == '')
  t = 'something else';

或

但我的问题是，如果您有以下内容，该怎么办：在继续之前，您将如何检查未定义的值

$("#object").find("element").html().replace(/ |t/g, '').trim();

如何确保对象的每个部分都是合法的，然后再继续进行，而不必进行大量检查

---

如果有很多类似的东西，比如10个左右，替换和修剪呢？如何检查每个参数？

您可以使用

.html（）

---

所以，您要做的是首先检查html是否有值，如果它没有值，则给它一些默认值。然后将replace返回的字符串分组，检查它是否有truthy值，或者也给它一个默认值，然后对其进行修剪

我会这样做，根据需要检查

var element = $("#object").find("element");
var t = element.length ? element.html() : '';
t = t.replace(/ |t/g, '').trim();

第一步是生成一个名为element的变量来保存jQuery对象。每当您多次使用同一jQuery搜索时，最好将其保存到变量中：这样可以避免重复并提高性能

下一步是调用jQuery的length方法来测试它是否真的找到了任何HTML元素。如果未找到“#object”或“element”，元素将变为长度为0的空jQuery对象，并且在JavaScript条件检查中0被视为false

如果元素的长度至少为1，则我们知道它是合法的，并对其安全地调用html（）

如果长度为0，则t只是设置为空字符串。检查长度是必要的，因为在空jQuery对象上调用html（）会返回未定义而不是字符串，并导致错误

我用的是什么？为简洁起见，使用条件运算符，但可以使用if语句执行完全相同的检查

var element = $("#object").find("element");
if (element.length) {
    var t = element.html();
} else {
    var t = '';
}
t = t.replace(/ |t/g, '').trim();

我喜欢将t默认为空字符串，以确保变量始终是字符串。这样我就可以用它调用replace（）或trim（）或任何其他字符串方法

在JavaScript条件下，空字符串的计算结果也为false，便于以后检查

if (t) {
    doSomethingWith(t);
}

---

jQuery已经为您做到了这一点。你只需要在链的末端进行检查。关于你的另一个问题（现在已删除），请使用变异观察者以获得更快的响应。但它可能会变得相当混乱，很少值得麻烦。

var element = $("#object").find("element");
if (element.length) {
    var t = element.html();
} else {
    var t = '';
}
t = t.replace(/ |t/g, '').trim();

if (t) {
    doSomethingWith(t);
}