ES6 中新增的两种数据类型及类型判断 ( 一 ）

来颗奇趣蛋
172 阅读6分钟

前言

ES6，全称ECMAScript 2015，是JavaScript语言的一次重大更新，于2015年发布。这个标准引入了许多新特性和语法，以提高JavaScript的表达能力和开发效率。今天我们来聊聊ES6 中新增的两种数据类型及类型判断。接下来我也会持续更新关于ES6的新特性和JS干货知识点，对ES6感兴趣或是想学习JS的小伙伴们可以关注一下我。

既然提到了数据类型，我们先来复习一下：

JavaScript中有七种（加上ES6新增两种）基本数据类型，分为两大类：原始数据类型（Primitive Types）和对象数据类型（Object Types）。下面是这些数据类型的列表和示例：

原始数据类型（Primitive Types）：

  1. String（字符串） :

    let myString = "Hello, World!";

  2. Number（数字） :

    let myNumber = 42;

  3. Boolean（布尔） :

    let isTrue = true;

  4. Undefined（未定义） :

    let myUndefined;

  5. Null（空值） :

    let myNull = null;

对象数据类型（Object Types）：

  1. Object（对象） :

    let myObject = { key: "value" };

  2. Array（数组） :

    let myArray = [1, 2, 3, 4, 5];

  3. Function（函数） :

    function myFunction() {
    // function code
}

  4. Date:

let date = new Date()   //Date

这些数据类型在JavaScript中用于存储和操作不同类型的数据。原始数据类型是不可变的，而对象数据类型是可变的。在使用这些数据类型时，你可以根据具体的需求选择合适的类型。

接下来我们来聊聊新增的两种原始数据类型：

在ECMAScript 2015（ES6）中，JavaScript引入了两种新的数据类型：BigInt和Symbol。

  1. BigInt: BigInt是一种用来表示任意精度整数的数据类型。它允许你表示超过JavaScript中Number类型能够表示的最大安全整数范围的整数。BigInt通过在整数后面添加"n"来创建，例如：

    const bigIntValue = 123n;

为什么要创建一个这样的数据类型呢？我来给大家举一个例子：

我们在浏览器中输入2**53,也就是2^53,意思为2的53次方,打印一下，再输入一个2**53 + 1：

屏幕截图 2023-11-14 103808.png

我们可以看到，为什么两个运算结果一样呢？我们不是加了1吗？不变的原因是对于number类型处理器的算力天花板就是2^53，当超过2^53的数据运算时，就不会得出正确结果,所以在ES6之后新增了一种数据类型BigInt

屏幕截图 2023-11-14 110618.png

我们通过在整数后面添加'n',来使用BigInt类型，这样就可以运算啦。 BigInt的使用场景通常涉及处理非常大的整数，例如在数学计算或其他领域的应用中。

  1. Symbol：在JavaScript中，Symbol 是一种基本的数据类型，引入了 ECMAScript 6（ES6）标准。Symbol 是一种原始数据类型，用于表示唯一的、不可变的标识符。每个通过 Symbol() 构造函数创建的 Symbol 都是独一无二的，即使它们有相同的描述（description）。

通过 Symbol 创建的变量是不相同的，即使它们具有相同的描述。这是 Symbol 的一个关键特性，确保每个 Symbol 都是唯一的。

const symbol1 = Symbol('mySymbol');
const symbol2 = Symbol('mySymbol');

console.log(symbol1 === symbol2);  // false
console.log(symbol1.description);  // 'mySymbol'
console.log(symbol2.description);  // 'mySymbol'

在这个例子中，symbol1 和 symbol2 被创建为两个不同的 Symbol 对象，即使它们的描述相同。因此，symbol1 === symbol2 返回 false。

这种唯一性使得 Symbol 在创建对象属性、定义常量或其他需要确保唯一性的场景中非常有用。这确保了不同部分的代码可以安全地使用 Symbol，而不必担心冲突。

这两个数据类型的引入丰富了JavaScript的功能，使其更适应各种不同的编程场景。

typeof

  1. 可以准确判断除 null 之外的原始类型
  2. 可以判断function

在JavaScript中，typeof 是一个操作符，用于获取给定变量的数据类型。它返回一个字符串，表示变量的数据类型。接下来我们来看看typeof是怎么用的，我们首先来定义一些数据类型：

let str = 'hello'   //string
let num = 123      // number
let flag = false    // boolean
let und = undefined    // undefined
let nu = null // nul
let big = 123n // big number    大整形
let s = Symbol('hello')

接下来我们一起使用typeof来判断它们是什么数据类型：

console.log(typeof str);  // typeof(str)    string
console.log(typeof num);  // number
console.log(typeof flag); // boolean
console.log(typeof und);  // undefined
console.log(typeof nu);   // object  bug
console.log(typeof big);  // bigint
console.log(typeof s);    // symbol

console.log(typeof obj);  // object
console.log(typeof arr);  // object
console.log(typeof fn);   // function
console.log(typeof date); // object

使用typeof判断原始数据类型时，我们通过输出结果可以看出，除了null类型,typeof都能正确判断出这些变量的类型。

为什么typeof会把null判断为object呢？

这是JS遗留的一个历史问题： JS中判定数据类型是靠将该变量转换为2进制数据，如果前三位是000判定其为引用数据类型，但是null很特殊，虽然它是原始数据类型，但是它二进制转换后全是0，自然也被读成了引用数据类型，所以它是唯一一个没有隐式原型的对象

当我们使用typeof判断判断引用数据类型时：

  • 对于空对象（Object）obj，输出为 "object"。

  • 对于空数组（Array）arr，输出为 "object"。同样，数组也是 JavaScript 中的一种特殊对象，所以 typeof 操作符会认为它是 "object"。

  • 对于函数（Function）fn，输出为 "function"。JavaScript 中的函数是一种特殊的对象，typeof 操作符专门将其识别为 "function"。

  • 对于日期对象（Date）date，输出为 "object"。同样，日期对象也是一种特殊对象，它被 typeof 操作符识别为 "object" 类型。

所以当使用typeof判断引用数据类型时，除了函数Function外，都会将其他的引用数据类型判断为object，所以小伙伴们以后要注意了，不要使用typeof去误判了某些数据类型。

在下篇文章中我们会介绍剩余的三种判断类型的方法，小伙伴们进主页查找哦~

总结

  1. BigInt: BigInt是一种用来表示任意精度整数的数据类型。它允许你表示超过JavaScript中Number类型能够表示的最大安全整数范围的整数。
  2. Symbol：在JavaScript中，Symbol 是一种基本的数据类型，引入了 ECMAScript 6（ES6）标准。Symbol 是一种原始数据类型，用于表示唯一的、不可变的标识符。每个通过 Symbol() 构造函数创建的 Symbol 都是独一无二的，即使它们有相同的描述（description）。

typeof

  1. 可以准确判断除 null 之外的原始类型

  2. 可以判断function

avatar
文章
阅读
粉丝