JavaScript 数据类型

JavaScript 中的数据类型指的是我们存储或处理的值的类型。编程语言所支持的一组数据类型是其最基本的特点之一。这些是可以在编程语言中表示和操作的值类型。

JavaScript 数据类型可以分为原始类型（primitive）和非原始类型（对象）。JavaScript（ES6 及以上版本）允许你使用以下七种原始数据类型工作 −

文本字符串，例如 "This text string" 等。数值，例如 123，120.50 等。布尔值，例如 true 或 false。 null undefined BigInt Symbol BigInt 和 Symbol 是在 ES6 中引入的。在 ES5 中，只有五种原始数据类型。

除了这些原始数据类型，JavaScript 支持一种复合数据类型称为对象。我们将在单独的章节中详细介绍对象。

Object 数据类型包含 3 种子数据类型 −

Object Array Date

为什么数据类型很重要？

在任何编程语言中，数据类型对于操作的处理都是重要的。

例如，下面的代码会产生 “1010” 输出。

let sum = "10" + 10;

这里，JavaScript 引擎将第二个操作数转换为字符串，并使用 '+' 操作符组合它们，而不是相加。

因此，你需要确保操作数的类型正确。

现在，让我们通过例子来了解每种数据类型。

JavaScript 字符串

在 JavaScript 中，字符串是一系列字符，并且可以使用以下三种不同方式创建 −

使用单引号使用双引号使用反引号

示例

在下面的示例中，我们使用单引号、双引号和反引号创建了字符串。在输出中，对于所有三个字符串，它打印了相同的结果。

<html>
<head>
   <title> JavaScript 字符串 </title>
</head>
<body>
   <script>
      let str1 = "Hello World!"; // 使用双引号
      let str2 = 'Hello World!'; // 使用单引号
      let str3 = `Hello World!`; // 使用反引号
      document.write(str1 + "<br>");
      document.write(str2 + "<br>");
      document.write(str3 + "<br>");
   </script>
</body>
</html>

JavaScript 数值

JavaScript 数值总是以浮点值（带小数点的数字）形式存储。

JavaScript 不区分整数值和浮点值。

JavaScript 使用由 IEEE 754 标准定义的 64 位浮点格式来表示数字。

示例

在下面的示例中，我们演示了带有和不带小数点的 JavaScript 数字。

<html>
<head>
   <title> JavaScript 数值 </title>
</head>
<body>
   <script>
      let num1 = 10; // 整数
      let num2 = 10.22; // 浮点数
      document.write("num1 的值是 " + num1 + "<br/>");
      document.write("num2 的值是 " + num2);
   </script>
</body>
</html>

示例 (指数记数法)

JavaScript 还支持数字的指数记数法。我们在下面的示例代码中解释了这一点 −

<html>
<head>
   <title> JavaScript 数值 指数记数法 </title>
</head>
<body>
   <script>
      let num1 = 98e4;    // 980000
      let num2 = 98e-4;   // 0.0098
      document.write("num1 的值是: " + num1 + "<br/>");
      document.write("num2 的值是: " + num2);
   </script>
</body>
</html>

JavaScript 布尔值

在 JavaScript 中，布尔数据类型只有两个值：true 或 false。

<html>
<head>
   <title> JavaScript 布尔值 </title>
</head>
<body>
   <script>
      let bool1 = true;
      let bool2 = false;
      document.write("bool1 的值是 " + bool1 + "<br/>");
      document.write("bool2 的值是 " + bool2 + "<br/>");
   </script>
</body>
</html>

JavaScript Undefined

当你声明一个变量但没有初始化它时，它包含 undefined 值。然而，你也可以手动给变量分配 undefined 值。

<html>
<head>
   <title> JavaScript Undefined </title>
</head>
<body>
   <script>
      let houseNo; // 包含 undefined 值
      let apartment = "Ajay";
      apartment = undefined; // 分配 undefined 值
      document.write("houseNo 的值是: " + houseNo + "<br/>");
      document.write("apartment 的值是: " + apartment + "<br/>");
   </script>
</body>
</html>

JavaScript Null

当某个变量的值未知时，你可以使用 null。通常来说，对于空或未知的值，最好使用 null 而不是 undefined。

<html>
<head>
   <title> JavaScript Null </title>
</head>
<body>
   <script>
      let houseNo = null; // 未知的门牌号
      let apartment = "B-2";
      apartment = null; // 更新值为 null
      document.write("houseNo 的值是: " + houseNo + "<br/>");
      document.write("apartment 的值是: " + apartment + "<br/>");
   </script>
</body>
</html>

JavaScript Bigint

JavaScript 只存储 64 位长的浮点数。如果你想存储一个非常大的数字，你应该使用 Bigint。你可以通过在数字末尾加上 n 来创建 Bigint。

<html>
<head>
   <title> JavaScript Bigint </title>
</head>
<body>
   <script>
      let largeNum = 1245646564515635412348923448234842842343546576876789n;
      document.write("largeNum 的值是 " + largeNum + "<br/>");
   </script>
</body>
</html>

JavaScript Symbol

Symbol 数据类型是在 JavaScript 的 ES6 版本中引入的。它用于创建独特的原始且不可变的值。

可以使用 Symbol() 构造函数来创建唯一的符号，并且你可以将字符串作为 Symbol() 构造函数的参数传递。

示例

在下面的示例中，我们为相同的字符串创建了 sym1 和 sym2 符号。之后，我们比较了 sym1 和 sym2 的值，并得到了 false 的结果。这意味着两个符号是唯一的。

<html>
<head>
   <title> JavaScript Symbol </title>
</head>
<body>
   <script>
      let sym1 = Symbol("123");
      let sym2 = Symbol("123");
      let res = sym1 === sym2;
      document.write("sym1 和 sym2 相同吗？ " + res + "<br/>");
   </script>
</body>
</html>

JavaScript Object

在 JavaScript 中，对象数据类型允许我们以键值对的形式存储一系列数据。定义对象有多种方式，我们将在对象章节中看到。

这里，我们将使用对象文字来创建一个对象。

示例

在下面的示例中，我们使用 '{}'（对象文字）创建了一个 obj 对象。对象包含一个带有字符串值的 'animal' 属性，一个带有数值的 'legs' 属性，以及 'color' 变量的值被赋给了 'hourseColor' 属性。

JSON.stringify() 方法将对象转换为字符串并在输出中显示。

<html>
<head>
   <title> JavaScript Object </title>
</head>
<body>
   <script>
      let color = "Brown";
      const obj = {
         animal: "Hourse",
         legs: 4,
         hourseColor: color
      }
      document.write("给定的对象是: " + JSON.stringify(obj) + "<br/>");
   </script>
</body>
</html>

JavaScript Array

在 JavaScript 中，数组是一个不同数据类型的元素列表。你可以使用两个方括号 '[]' 创建数组，并在数组中插入多个逗号分隔的值。

<html>
<head>
   <title> JavaScript Array </title>
</head>
<body>
   <script>
      const colors = ["Brown", "red", "pink", "Yellow", "Blue"];
      document.write("给定的数组是: " + colors + "<br/>");
   </script>
</body>
</html>

JavaScript Date

你可以使用 JavaScript Date 对象来操作日期。

示例

在下面的示例中，我们使用 Date() 构造函数创建了一个日期。在输出中，你可以看到根据你的时区显示的当前日期和时间。

<html>
<head>
   <title> JavaScript Date </title>
</head>
<body>
   <script>
      let date = new Date();
      document.write("今天的日期和时间是: " + date + "<br/>");
   </script>
</body>
</html>

动态类型

JavaScript 是一种动态类型的语言，类似于 Python 和 Ruby。因此，它在运行时决定变量的数据类型，而不是在编译时。我们可以给 JavaScript 变量初始化或重新分配任何数据类型的值。

示例

在下面的示例中，我们首先用字符串值初始化了第一个变量。之后，我们将它的值更新为数字和布尔值。

<html>
<head>
   <title> JavaScript 动态数据类型 </title>
</head>
<body>
   <script>
      let first = "One"; // 它是字符串
      first = 1; // 现在它是数字
      document.write("first 变量的值是 " + first + "<br/>");
      first = true; // 现在它是布尔值
      document.write("first 变量的值是 " + first + "<br/>");
   </script>
</body>
</html>

使用 typeof 操作符检查数据类型

typeof 操作符允许你检查变量的类型。

示例

在下面的示例中，我们使用 typeof 操作符检查了各种变量的数据类型。

<html>
<head>
   <title> typeof 操作符 </title>
</head>
<body>
   <script>
      let num = 30;
      let str = "Hello";
      let bool = true;
      document.write("num 的数据类型是: " + typeof num + "<br/>");
      document.write("str 的数据类型是: " + typeof str + "<br/>");
      document.write("bool 的数据类型是: " + typeof bool + "<br/>");
   </script>
</body>
</html>