如果值存在，请执行此操作。未定义与空？答案

【问题标题】：If value exists, do this. undefined vs null?如果值存在，请执行此操作。未定义与空？
【发布时间】：2020-03-21 00:56:59
【问题描述】：

我想在按钮单击时呈现某些动作。

条件是：（如果输入字段中存在值，则写“值存在”。如果值不存在，则警告）。

我尝试将 undefined 替换为 null。我也尝试替换运算符 === 和 ==。没有工作！请帮忙。

<html>
<head>

</head>
<body>

<input id='typer' type='text'></input>
<button onclick='hey()'>click</button>

<p id='pw'></p>

<script>

var pw
pw = document.querySelector('#pw');

function hey() {
    if (document.getElementById('typer').value !== undefined) {
        pw.innerHTML = 'value exists';
    } else {
        alert('value does not exists');
    }
}

</script>
</body>
</html>

【问题讨论】：

检查空字符串而不是""
.value 总是返回一个字符串，而不是 undefined 或 null。如果没有输入任何内容，它将是一个空字符串。
那我该如何解决呢？
ohh "" 工作谢谢。但是有没有其他方法可以解决它？
您可以将值转换为布尔值(!!document.getElementById('typer').value)，这意味着如果""、null、undefined 或0（数字）不是0 作为字符串false跨度>

标签： javascript html if-statement null undefined

【解决方案1】：

null、undefined 和空字符串 ("") 在 JavaScript 中都是“假”值；这意味着如果将它们传递给! 运算符，结果将是true。您可以在控制台中通过运行!("")、!(null) 或（对于undefined）通过定义var x; 然后调用!x 进行测试。

更重要的是，if 语句实际上并不检查其条件是否等于 true，它会检查条件是否“真实”（即，当通过 ! 时计算为 false）。

因此，您需要做的就是将 if 语句的条件设置为 document.getElementById('typer').value，因为只要元素的值不是 null、未定义或空字符串（或 false，这也是假的），条件为真。

【讨论】：

"undefined 有点难" -> var x; !x
好点！我没想过那样做。编辑响应。

【解决方案2】：

对于<input type="text">，documentation 声明其.value 属性的类型是DOMString。

DOMString 是一个 UTF-16 字符串。由于 JavaScript 已经使用此类字符串，DOMString 直接映射到 String。

这意味着.value 永远不会是null 或undefined；有了这些知识，当你想知道一个值是否存在时，你可以做两件事：

使用value.length判断字符串是否为空
在if 语句中分别使用value 或!value 本身来确定它是存在还是空（空字符串的计算结果为false，而非空字符串的计算结果为true）

【讨论】：