如何在 JavaScript 中检查 null、undefined 或空变量？

在本教程中，我们将学习如何在 JavaScript 中检查 null、undefined 或空变量。没有特定的内置库函数来检查变量是否为undefined 或null。但是，我们可以使用一些运算符，例如typeof 运算符和等号运算符来检查变量。

在继续本教程之前，让我们先澄清一下 null、undefined 或空变量之间的区别。

Null 与 Undefined

我们可以说 Null 和 undefined 变量几乎相同，但并不完全相同。

  • Undefined 变量 - 它是在程序中未声明的变量，编译器对该变量一无所知。

  • Null 变量 - 它是一个已声明的变量，但我们尚未为其赋值。

Null 变量的类型是对象，当我们不为 Null 变量赋值时，它会自动赋值为'undefined' 值。此外，我们可以有意地将 null 值赋给变量以使其为空，也称为 null 变量。下面，用户可以看到 null 和 undefined 的值相同，但数据类型不同。

let result = null == undefined // returns true
let result = null === undefined // returns false

空变量与Null变量相同，它不包含任何值。

使用严格相等运算符 (===) 检查 null 变量

在这种方法中，我们将使用严格相等运算符来检查变量是否为 null、空或 undefined。如果我们在声明时不为变量赋值，JavaScript 编译器会将其赋值为 'undefined' 值。因此，我们可以检查如果变量包含 null 值或 undefined 值，则表示我们有一个 null 变量。

语法

if (variable == null || variable === 'undefined') {
   
   // variable is undefined or null
}

示例

在下面的示例中，我们声明了两个变量。在第一个变量中，我们分配了 null 值，在另一个变量中，我们没有分配值。我们正在使用上述方法检查它是否为 null，用户可以在输出中看到结果。

<html>
<body>
   <h2>Check for variable is undefined or null using <i>strict equality operator</i></h2>
   <h4>output for let var1 = null;</h4>
   <div id = "output1"></div>
   <h4>output for let var1;</h4>
   <div id = "output2"> </div>
   <script>
      let output1 = document.getElementById("output1");
      let output2 = document.getElementById("output2");
      function checkVar( variable ) {
         if (variable == null || variable === 'undefined') {
            return " varaible is undefined or null; "
         } else {
            return " variable is properly defined and its value is " + variable;
         }
      }
      let var1 = null;
      let var2;
      output1.innerHTML = checkVar(var1);
      output2.innerHTML = checkVar(var2);
   </script>
</body>
</html>

使用 typeof 运算符

当变量为 undefined 时，表示该变量未声明。用户不能像上述方法那样在 'if-else' 条件语句中使用它。要检查未声明变量的类型，我们可以使用typeof 运算符。typeof 运算符将变量作为操作数并返回变量类型。作为typeof 的操作数，我们也可以使用未声明的变量。

语法

let type = typeof ( variable ) // returns ‘undefined’ for undeclare variable.

示例

在下面的示例中，我们创建了一个变量并为其分配了一个 null 值。我们使用带有 null 值变量的typeof 运算符，它返回'object'。此外，我们使用 typeof 运算符与第二个变量一起使用，该变量未声明；它返回 'undefined'。

<html>
<head>
   <title>Check for variable is undefined or null in JavaScript.</title>
</head>
<body>
   <h2>Check for variable is undefined or using <i> typeof operator</i>.
   </h2>
   <h4>output for let var1 = null;</h4>
   <div id = "output1"> </div>
   <h4>output for undeclared variable;</h4>
   <div id = "output2"></div>
   <script>
      let output1 = document.getElementById("output1");
      let output2 = document.getElementById("output2");
      let var1 = null;
      output1.innerHTML = typeof ( var1 );
      output2.innerHTML = typeof ( var2 ); // checking the type of undeclared variable
   </script>
</body>
</html>

在上面的输出中，用户可以看到 typeof 运算符为 null 变量返回对象数据类型。

我们已经学习了如何检查变量是否为 undefined 或 null。null 和 undefined 变量之间的区别在于这两个变量的数据类型；null 变量为对象类型，undefined 为 undefined 数据类型。

如果用户正在检查 null 变量，则可以使用第一种方法使用 if-else 条件语句。要检查未声明的变量，用户必须使用第二种方法。否则，当我们使用未声明的变量时，JavaScript 代码会报错。

更新于: 2022年8月8日

16K+ 浏览量

开启你的 职业生涯

通过完成课程获得认证

开始
广告

© . All rights reserved.