详解JavaScript的数据类型

前言

数据类型的作用就是定义变量所能存储值的类型。

JavaScript为我们提供了8种数组类型，其中7种为原始类型和1种引用类型。

typeof运算符

在说数据类型之前，我们先来介绍JavaScript的typeof，typeof用于检测一个变量的数据类型，typeof有两种用法：

1. 运算符

typeof x 

2. 函数式

typeof(x)

示例

let a = 1;
let b = "test";
typeof(a);//number
typeof b;//string

动态类型

JavaScript是一门弱类型的编程语言，即在声明变量时，不强制要求声明变量的类型，因此在JavaScript中声明的变量的数据类型是动态的，要在运行过程才能确定，所以下面代码是正常可运行的：

let a = 1;//number类型
a = "123"//此时为string

数据类型

Number

number类型代表整数和浮点数，对于number类型，可以进行加减乘除等运运算，如：

let a = 10;
console.lg(a * 20);//输出200

let b = 1.2;

除了常规数字外，Infinity、-Infinity 和 NaN这几个特殊数值也属于number类型。

typeof NaN;//输出number

在 JavaScript中做数学运算是安全的。我们可以做任何事：除以0(在其他编程语言中是致命错误),将非数字字符串视为数字等等。JavaScript脚本永远不会因为一个致命的错误而停止运行，其最坏情况也只是得到NaN的结果。

Bigint

在 JavaScript中，number类型无法表示大于 (253-1)（即 9007199254740991），或小于 -(253-1) 的整数，因此当我们想表达比上面范围更大或更小的数值时，可以使用BigInt类型。

BigInt是一种特殊的数字类型，用于表示任意长度的整数，有两种创建BigInt类型

通过将 n 附加到整数字段的末尾来创建BigInt值，如：

let n = 123n;
typeof n//输出bigint

也可以使用BigInt()函数创建一个BigInt类型，如：

let n = BigInt(123);//与123n一样

Boolean

布尔型只包含两个值：true与false，而逻辑运算符计算后得到值就是布尔型。

let a = true;

console.log(1>2);//输出false

String

字符串是最常用的数据类型之一，在JavaScript中，一个字符串有三种表达方式：

单引号

let s = 'test'

双引号

let s = "test"

反引号

let s = `test`

使用反引号表达一个字符串，可以使用${…}在字符串嵌入变量和表达式,如：

let a = 1;
let s = `test ${1+1+a}`

“

在JavaScript中没有表示单字符的char类型。

”

null

在JavaScript中，null一种特殊的类型，这一点与其他编程语言有较大的差异，在其他编程语言中，null通常用于表示一个空的引用，而在JavaScript中，则表示一个变量是空或值未知而已。

let a = null;

typeof null// `typeof null` 会返回 `"object"` —— 这是 `JavaScript` 编程语言的一个错误，实际上它并不是一个 `object`。

undefined

与null一样，是一种特殊的数据类型，表示未被赋值的意思，当一个变量未定义时，其值为undefined，表示该变量未被赋值

let a;
typeof a;//定义了，但未赋值，输出undefind
typeof b //b未定义，输出undefined

symbol

Symbol值表示唯一的标识符,可以使用Symbol()来创建这种类型的值：

let id = Symbol();
let id = Symbol("id");

Symbol保证是唯一的。即使我们创建了许多具有相同描述的 Symbol，它们的值也是不同，如：

let id_1 = Symbol("id");
let id_2 = Symbol("id");

alert(id1 == id2); //输出false

Object

与其他数据类型相比，对象类型是一种更复杂的数据类型，可用于存储复杂的键值，在JavaScript中，这是用得最多的类型。

两种方式创建一个空对象：

let u = {};//花括号{},这种方式称为字面量
let u = new Object();//使用`Object`构造函数

如果想在创建对象时初始一些对象属性，必须使用字面量的方式：

let u = {
    name:"test",
    age:18
}

访问属性

console.log(u.agge);//点操作访问属性
console.log(u['age']);//方括号访问属性

属性名称限制

属性的键必须是字符串或者symbol，比较常用的是字符串。

可以用保留字，如for,return等作为对象属性名。

如果使用其他类型，会被转换为字符串。

属性简写

如果我们把一个变量作为属性的值，并且属性名与变量名一样的话，这样的话，可以使用对象属性值的简写形式,如：

没有简写的写法

function makeUser(name, age) {
  return {
    name: name,
    age: age
  };
}

简写

function makeUser(name, age) {
  return {
    name,
    age,
  };
}

删除对象属性

使用delete操作符可以移除对象的属性，如：

delete u.age

检测对象是否存在给定的键

let obj = {a:1}
if("a" in obj){
    console.log("键值a是存在的")
}

遍历对象

使用for..in循环语句可以遍历对象的key,如：

let u = {
    name:"test",
    age:18,
    gender:"男"
};

for(key in u){
    console.log(key);//name,age,gender
    console.log(u[key]);//test,18,男
}

Array

当我们想存储复杂的数据结构时，我们可以使用object数据类型，但object中的数据是无序的，如果我们想有序顺序地存储复杂数据结构时，数组便是一种更好的选择。

初始化数组

有两种初始化数组的方法，一种是通过字面量，一种是使用Array()构造函数。

let a = new Array(1,2,3,4);//构造函数,很少使用
let b = [1,2,3,4];//字面量

访问数组元素

console.log(a[0]);

数组的本质

其实，在JavaScript中，数组本质上还是一个对象，上面使用a[0]访问数组元素的方法，与对象调用属性的方法是一样的。

我们通过typeof运算符，也可以看到，数组就是一种特殊的对象。

let arr = [1,2,3,4];
typeof arr//输出object

数组的长度

通过数组的lenght属性，可以获取数组的长度，如：

console.log(arr.length)

不过实际上，lenght并不是数组的长度，length属性的值为数组最大索引值加1，如：

let a = [1,2,3,4];
console.log(a.length);//输出4
a[100] = 1;
console.log(a.length);//输出101

对数组的各种操作

数组内部封装了许多操作数组的方法，在定义一个数组之后，可以调用不同的方法，对数组进行不一样的操作，如：

let a = [1,2,3,4];

a.push(5);//在数组末端添加元素

a.pop();//取出并返回数组的最后一个元素

a.shift();//取出并返回数组的第一个元素

a.unshift(0);//在数组的首端添加元素

当然，除了上面示例的几个方法，数组还很多的其他的方法。

遍历数组

遍历数组最简单原始的的方式是使用for循环，如：

for (let i = 0; i < a.length; i++) {
  console.log(a[i]);
}

对象可以使用for..in来遍历，而数组本质也是对象，因此也可以用for..in来遍历数组，如：

for (let key in a) {
  console.log(a[key])
}

小结

在项目的开发中，总是要处理与存储各式种样的数据，不同的数据必须使用不同的数据来存储，这就要求我们要了解每一种编程语言提供的数据类型，这样才能更好地使用和存储我们想要的数据。