关于javascript:从头学前端04搞懂JavaScript中的基本数据类型

Hello 大家好，我是此岸繁華，一个想进大厂的大三学生，为了有一个残缺的前端常识体系，当初我要从头开始学习、梳理、总结。

编写不易转载请取得容许

写在后面

本篇文章咱们未来学习JavaScript中的根底数据类型，浏览本篇文章你能够把握如下内容

什么是数据类型

概述

在上一篇文章【从头学前端】03-这次我就搞懂了JavaScript中的变量中咱们晓得了变量是用来存储数据信息的，咱们把这些被存储的数据信息进行不同类别的划分，这些不同的数据类别就被称为数据类型 。

因为JavaScript是一个弱类型的脚本语言，也就是说在定义变量的时候不须要指定变量的存储类型，它只有在执行的时候才会确定数据类型。

数据类型的分类

在ECMAScript5之前的版本中，存在着6种数据类型，分为根底数据类型和简单类型，具体如下所示：

根底数据类型 ：

• number数字类型：整数或小数，并在 ±(2 ** 53 - 1)的范畴内。
• string字符串类型：一个字符串能够蕴含 0 个或多个字符。
• boolean布尔类型：该类型具备两个非凡的值，即true和false。
• null一个非凡的数据类型，用于未知的值。
• undefined一个非凡的数据类型，用于未定义的值。

简单的数据类型 为Object类型，一个Object类型又能够细分为三个类型：

• 广义的object类型，即对象类型
• Array类型（数组）
• Function类型（函数）

    > 这些数据类型咱们将在前面的文章中独自学习

新版的ECMAScript还新增了symbol类型以及bigint类型，咱们会在ECMAScript新个性 中学习

根本数据类型

布尔类型

布尔类型即boolean类型相比于其余数据类型而言，是JavaScript中视频频率最高的数据类型，该数据类型中只有两个值，即true和false，这两个值通常用来指代真或假、开或关、是或否等场景。

示例代码如下：

var flag = truevar lost = falseconsole.log(flag) // trueconsole.log(lost) // false

数字类型

数字类型即number类型，number类型又能够细分为负数类型和浮点数（小数）类型。JavaScript中的number类型的数据是在±(2 ** 53 - 1) 区间内的，大于这个位数前面的数组将会显示为0。示例代码：

999999999999999111111// 999999999999999100000

定义一个变量为number类型的示例代码如下：

var num = 1 // 整数var float = 1.2 // 浮点数

非凡的值

JavaScript中的数值还存在两个比拟非凡的值，别离是NaN和Infinity。

NaN

NaN是一个简写模式，全称为Not a Number，译为不是一个数字值，该值通常用来示意经计算之后的后果不是一个数字值。

NaN自身存在着两个特点，具体如下：

• 任何波及到NaN的操作都会返回NaN
• NaN与任何值都不相等，包含NaN自身

JavaScript针对NaN的个性提供了isNaN()函数，该函数用于检测一个数值为NaN，并返回一个布尔值，示例代码如下：

var notANumber = NaNvar number = 10console.log(isNaN(notANumber)) // trueconsole.log(isNaN(number)) // false

Infinity

JavaScript中的number类型的可能示意数值的范畴是2 ** 1024到2 ** - 1023，超出这个范畴则会得道两个值，别离是Infinity和-Infinity，示意无穷大和无穷小。

除了下面超出范围失去Infinity的状况，还有就是能够通过非NaN的数值/0失去Infinity，示例代码如下：

 1 /  0  //  Infinity 1 / -0  // -Infinity-1 / -0  //  Infinity

Infinity具备以下个性：

• Infinity和-Infinity两者是不相等的。
• Infinity大于所有数值（除了NaN），-Infinity小于所有数值（除了NaN）。
• NaN与Infinity是永远不相等的。

Infinity是能够进行四则运算的，其运算规定如下 ：

• Infinity与undefined，无论应用什么运算，都会失去NaN
• 0 * Infinity失去NaN；0/Infinity失去0；Infinity / 0失去Infinity
• Infinity与null进行计算时，null会被转换成0，所以Infinity与null的计算与Infinity与0的计算是雷同的。
• Infinity加或者乘一个Infinity的话，失去的是一个Infinity
• Infinity减或者除一个Infinity的话，失去的是一个NaN

字符串类型

字符串类型又称string类型，是由0个或者多个字符组成的，该字符且有单引号('')或者双引号("")进行包裹。示例代码如下：

var str1 = '' // 定义一个空字符串var str2 = "" // 应用双引号定义一个空字符串，与单引雷同var str3 = 'this is str'

如果想要在字符串中应用单引号('')或者双引号("")，示例代码如下：

var str1 = '"a"' // "a"var str2 = "'a'" // 'a'

除了下面这种办法，JavaScript还提供了转义字符，具体会在上面介绍

转义字符

示例代码如下：

var str = '\"这是一个\t字符串\"'console.log(str)  // "这是一个  字符串"

undefined

undefined类型只有一个值，就是undefined，示意未定义。个别状况下，咱们不会将一个变量赋值为undefined，然而JavaScript并不会阻止咱们将一个变量赋值为undefined，示例代码如下：

let v = undefinedconsole.log(v) // undefined

除了被动赋值，JavaScript还有以下几种状况会失去undefined，具体如下：

• 申明变量但未初始化值时，该变量的值为undefined
• 申明变量并初始化值为 undefined 时，该变量的值为undefined
• 函数中的return语句的默认返回值为undefined
• 函数中的return语句的返回值设置为undefined
• 拜访某一个对象中不存在的属性时，失去的后果为undefined

在JavaScript中有这么多种状况会失去undefined，有一下两种办法能够判断以后值是否为undefined，具体如下：

• 应用全等号(===)来判断以后变量的值是否为undefined。

    > 对于运算符将在下一篇文章进行介绍

• 能够应用typeof运算符来判断变量的值是否为undefined。

typeof运算符

JavaScript中提供的typeof运算符能够判断以后变量是什么数据类型的，它会返回一个字符串。

typeof运算符能够判断的类型次要有以下几种：

• number类型，将会返回一个'number'的字符串。
• string类型，将会返回一个'`string`'的字符串。
• boolean类型，将会返回一个'`boolean`'的字符串。
• undefined类型，将会返回一个'`undefined`'的字符串。
• 其余数据类型将会返回一个'object'的字符串。

示例代码如下：

var str = '',    num = 0,    bool = true,    u = undefinedconsole.log(typeof str) // string console.log(typeof num) // numberconsole.log(typeof bool) // booleanconsole.log(typeof u) // undefined

null

null类型在JavaScript中也仅有一个值，即null，示意一个空指针。这就导致应用typeof运算符去判断null的类型失去的构造是undefined。

console.log(typeof null) // object

null值在理论开发中次要实现的工作内容如下：

• 当申明一个变量但不进行初始化的话，能够将该变量的值赋值为null。这样做的益处是该变量不会占用内存空间 。
• 当一个变量不再应用时，须要将该变量的值赋值为null。这样做示意将该变量从内存空间进行释放出来 。

类型转换

因为JavaScript是弱类型脚本语言，只有在执行时才会确定其数据类型，从而运行时会依据应用状况来进行类型的转换。

JavaScript中的类型转换次要分为两种，别离是隐式类型转换和显式类型转换。

隐式类型转换

所谓的隐式类型转换就是通过特定的表达式来实现从一个类型转换为另一个类型的。

转换为boolean类型

将要将其余的数据类型转换为布尔类型的话，只须要在最后面减少两个感叹号(!!)即可。示例代码如下：

var str = 'this is string'console.log(!!str) // true

其余类型转换布尔值的转换规则如下：

转换为number类型

如果其余数据类型想要转换为number类型，只须要在后面减少一个加号(+)即可，示例代码如下：

/** * 如果将字符串转换为数字的话，如果转换失败的话会失去NaN */console.log(+'10') // 10console.log(+'str') // NaN /** * 布尔类型转换为数字的话，true = 1， false = 0 */console.log(+true) // 1console.log(+false) // 0

转换为string类型

如果其余数据类型想要转换为string类型的话，在后面或者前面拼接一个空字符即可，拼接字符串应用的是加号(+)，示例代码如下：

var str1 = '' + trueconsole.log(typeof str1) // stringvar str2 = '' + 100console.log(typeof str2) // string

除了以上的那几种状况，在调用函数时，如果函数接管的是一个字符串类型，你传递的一个数字类型，也会进行类型转换；还有就是if前面的小括号中的内容也会进行类型转换。(对于函数和if语句，咱们会在当前学习)

显式类型转换

所谓显式类型转换，就是JavaScript对应的函数或者办法来实现数据类型之间的转换。

转换为boolean类型

显式的将其余数据类型转换为boolean类型，应用的是JavaScript提供的Boolean()函数，示例代码如下：

var str = '123'var num = 1var bool1 = Boolean(str)var bool2 = Boolean(num)console.log(typeof bool1) // boolean console.log(typeof bool2) // boolean

转换为number类型

JavaScript提供的将其余类型转换为number类型有三种，具体如下：

• Number()函数，如果转换的变量无奈转换为数字类型，后果则为NaN。
• parseInt()函数，该函数能够将string类型的值转换为一个整数或者NaN。
• parseFloat()函数，该函数能够将string类型的值转换为一个浮点数或者NaN（如果转换的是一个整数的话则会返回一个整数）。

示例代码如下：

var str1 = '10'var str2 = 'str'// 应用 Numberconsole.log(Number(str1)) // 10console.log(Number(str2)) // NaN// 应用parseIntconsole.log(parseInt(str1)) // 10console.log(parseInt(str2)) // NaN// 如果转换的是一个浮点数，最终不会保留小数点console.log(parseInt(10.5)) // 10// 应用parseFloatconsole.log(parseFloat(str1)) // 10console.log(parseFloat(str2)) // NaN console.log(parseFloat(10.5)) // 10.5

转换为string类型

JavaScript提供的将其余类型转换为string类型有两种，具体如下：

• String()函数
• Object对象提供的toString()办法

    > 对于对象与办法这里仅做理解，前面解说

示例代码如下：

var bool = truevar num = 123// 应用String()函数var str1 = String(bool)var str2 = String(num)console.log(typeof str1) // stringconsole.log(typeof str2) // string// 应用 Object.toString()办法var str3 = Object.toString(bool)var str4 = Object.toString(num)console.log(typeof str3) // stringconsole.log(typeof str4) // string

总结

预报：下一篇文章咱们未来学习JavaScript中的运算符

精彩文章

【从头学前端】03-这次我就搞懂了JavaScript中的变量

【从头学前端】02-JavaScript词法构造

【从头学前端】01-什么是JavaScript