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

简介: ES6 中新增的两种数据类型及类型判断 ( 一 )

前言

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引入了两种新的数据类型:BigIntSymbol

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

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

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

image.png

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

image.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'

在这个例子中,symbol1symbol2 被创建为两个不同的 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
相关文章
|
4月前
|
设计模式
ES6中新增Array.from()函数的用法详解
ES6中新增Array.from()函数的用法详解
54 1
|
4月前
|
存储 JavaScript 安全
TypeScript 中的 Number 类型,Number 类型的特性、常见操作和注意事项
TypeScript 中的 Number 类型,Number 类型的特性、常见操作和注意事项
404 1
|
4月前
|
编解码 JavaScript 前端开发
ES6 字符串的新增方法
ES6 字符串的新增方法
|
1月前
|
JavaScript 前端开发
ES6 中新增的两种数据类型及类型判断 ( 二 )
ES6 中新增的两种数据类型及类型判断 ( 二 )
ES6新增操作字符串的七种方法
ES6新增操作字符串的七种方法
|
4月前
|
JavaScript 前端开发 索引
es6 数组新增哪些方法以及使用场景
es6 数组新增哪些方法以及使用场景
46 0
|
9月前
|
JavaScript 前端开发
ES6学习(四)—字符串的新增方法
ES6学习(四)—字符串的新增方法
|
网络架构 索引
ES6新增扩展:字符串-数值-数组-函数-对象
ES6新增扩展:字符串-数值-数组-函数-对象
77 0
|
编译器
【TS】联合类型--类型断言--类型推断
【TS】联合类型--类型断言--类型推断
83 0
|
SQL 关系型数据库 MySQL
MySql 使用 NOT IN 返回值包含null值,返回数据不全
MySql 使用 NOT IN 返回值包含null值,返回数据不全
247 0
MySql 使用 NOT IN 返回值包含null值,返回数据不全