JS 里的数据类型转换

本文章为知乎搬运，非原创，原文链接地址：https://zhuanlan.zhihu.com/p/73190204

目录：
1.了解一些词语
2.数据的类型
3.类型之间的转换

1.了解一些词语

首先！

你现在处在某个空间，四周一片空白啥也没有，你特别饿，很想吃东西。突然眼前出现一行字：【需要什么东西你就 var 一下】

虽然这行提示说的并不详细，但机智的你立马就知道怎么用了。

(英语瞎组合的，两辆车的肉)

var food = 2 + ‘cars of meat’;

这里有几个词：

【值】(value)：比如数字1就是一个值，数字被称为数值（number），数值1和数值2加起来是数值3。但是如果把数字1用引号包围起来，比如这样 ‘1’，他就从数值1变成了字符串(string)‘1’，字符串‘1’和字符串’2’相加时和数值之间的相加不一样，这两个字符串相加会变成’12’，因为他们不是数字，他们相当是两个只读的文字，只能把他们的内容连接起来。

【变量】(variable)：上面绿色框中的food就是一个变量，从变量中的变字可以看出来，他是可变的，哪里可变？你可以把food当成一个桶，你可以往这个桶里装东西，你第一次往里面装了两车肉，你过了一秒觉得不好，太浪费了，把两车肉从桶里拿出来，装了一盒冰淇淋进去。里面装的东西可变就是变量，和变量相反的是常量，如果你用常量装这两车肉，那就算肉馊了也只能放桶里捂着。（food是这个变量的变量名，你还可以给这个变量取其他你喜欢的名字。）

【赋值运算符】(Assignment Operators)：它的作用是把[值]赋给[变量]，就是把那两车肉放到桶里的作用。

【语句】(statement)：JavaScript执行代码时是按照顺序一行一行往下执行（忽略变量提升函数提升等情况），一行代码就是一个语句。【语句】的作用是为了完成某种任务的操作，比如上面那行语句，它的任务就是把橙色框内的内容赋值给前面绿色框里的food变量。

【表达式】（expression）：上面那行代码中橙色框内的内容就是表达式，他的作用是为了返回一个值，比如1+1返回2这个值，而像语句就不用返回一个值，语句是为了执行某个操作，比如把表达式返回的2这个值赋值给某个变量。

【var】：var 主要用来声明一个变量，比如你所在的那个空间没有一个叫food的桶，但是你想要一个叫food的桶，于是在第一次创建这个桶的时候，需要用var来创建它，后面如果你需要更改这个food里的值的话，就不用了var了，因为我们只有在创建变量的时候才用它。

2. 数据的类型

这里数据的类型指的就是【值】(value)的类型。JavaScript在声明变量的时候，用var声明的变量，值可以是任 意 类 型，字符串，布尔值，数值，对象，数组等等都可以。

而在其他编程语言中，你想声明一个变量，可能需要根据【值】的类型的不同，用不同的方式去声明，比如值是整数，就用int，如果是浮点数，就用float。所以JavaScript在这点来说还是比较方便的。

在JavaScript中，值一共有几种类型？

答案：7种

数值 number（如【值】为整数1，小数1.3，科学计数法12e2等表现形式） 字符串 string（如’hi’） null
undefined symbol （ES6新增内容，等我了解了再补） 对象 object 对象又可以分为三个子类型：

• 狭义的对象 object

• 数组 array

• 函数 function

布尔值 boolean （布尔值分为true和false）

数值：

值就是平时用的数字，可以用来加减乘除，比如上面的变量minus右边的表达式用的是3-1这个计算式，计算结果是2，返回的数值2赋值给变量minus，输入minus，果然返回的值就是数值2.

字符串：

当你需要给变量赋值一个字符串的时候，就需要把值用双引号包围起来，双引号，单引号都可以。

变量a的值是一个数值，变量b的值是一个字符串，一个数值和一个字符串相加的结果是数值会被自动转换成字符串，最终将两个字符串的内容连接起来。

【加减乘除】四则运算中，当一个数值和一个字符串进行运算时，除了加号会把数值自动转换成字符串，其他的乘法，除法，减法，都会把字符串自动转化成数值。

【空字符串】和【空格字符串】：

空字符串是引号里面什么都没有

空格字符串是引号里面有一个空格

（length用来返回该变量的长度，比如一个变量的值是’hi’，这个字符串就俩字符，h 和i，所以它的length是2。

a.length返回的值是0，代表变量a里面的字符串长度是0，啥也没有；

b.length返回的值是1，是因为b是一个空格字符串，里面有一个空格，空格也能被浏览器发现的！所以空字符串和空格字符串是有区别的）

null 和 undefined：

null 和 undefined 都可以表示‘没有’，含义虽然非常相似，但实际还是有些区别。

像在其他编程语言中，只有null或者只有undefined，为什么在JavaScript中既有null又有undefined呢！真的很令人头大啊！

其实JavaScript最开始和java一样，也是只有null的。null有一个特点，会自动变成0和数字进行运算

当时已经有了null，为了想明白为什么JavaScript的设计者还要额外设置一个undefined，我们可以先用typeof这个专门用来检测值是什么类型的函数看一下null本身是什么类型（正常来说，数字1的类型是number，'1’的类型是字符串，null的类型应该也是null吧！）。

调用typeof函数，把null这个值放进括号里，返回的结果告诉了我们刚刚传入的值是什么类型。

null的类型居然不是null，而是对象（object）！最开始的时候，JavaScript设计者Brendan Eich最初并没有把null设为一个单独的类型，null是被归类为对象这个类型中的，他认为，表示‘无’的这个值最好不要是对象，所以作为对象的null被他无视掉了，于是就有了undefined这个东西。

用法：

null:

表示【空值】，就是说，这个地方的值为空。比如调用函数的时候，如果某个参数没有设置任何值，这个时候就可以传入【null】，表示这个参数为空。

或者如某个函数接受引擎传入的错误作为参数，如果运行的时候没有发生任何错误，那么这个参数就会传入【null】，表示没有发生错误。

undefined：

表示‘未定义’的原始值，当我们声明了一个变量后，可以先不用赋值给变量，这时候未赋值的变量他此刻的值就是undefined

布尔值：

只有【true】 【false】 两个值

true是真，false是假。true和false经常用于if语句，比如：

第一步蓝色框：声明一个变量，变量名是【我机智吗】，值为【机智】

第二步橙色框：用if语句做判断，两个等于号是相等运算符，判断两边值是否相等，结果会返回布尔值true 或者 false。如果这个变量的值是【机智】，返回的就是true，代表是真的，是对的，就会执行花括号里面的代码（中间console.log的作用是向控制台输出括号里的内容），如果不是，就不执行

第三步绿色框：执行了花括号里的语句，代表那句判断为true！

下列运算符会返回布尔值：

• 两元逻辑运算符： && ||

• 前置逻辑运算符： ！（Not）

• 相等运算符： === !== == !=

• 比较运算符： > >= < <=

以下六个值默认会被转为false，其他为true：

• undefined

• null

• false

• 0

• NaN

• " " 或 ’ ’ （空字符串）

例:

if 命令后面是一个布尔值，JavaScript自动将NaN转为布尔值false，导致程序不会进入代码块，也就是不会执行代码里的命令了，所以不会有任何输出。

NaN：not a number，意思是【不是数字】。7种数据类型中有null和undefined,null在和数值进行运算的时候会自动变成0进行运算，但是undefined和数字进行运算的时候会转换成NaN，导致最终返回值就是NaN，返回的不是一个数字，但是NaN却是属于number这一类，虽然它本身的意思是【不是数字】。

对象：

这个感觉要写好多= = 下次如果写关于函数，构造函数，对象之间关系的笔记的话再写吧。

（简单点）

对象是一组【键值对】（key-value）的集合，是一种无序的复合数据集合。

大括号定义了一个对象，赋值给object，这个变量object就指向一个对象，对象内部包含两个键值对，字符串 aa 是【键值】。键名和键值之间用冒号分隔，两个键值之间用逗号分隔（最后一个属性的逗号可加可不加）。

键名

对象的所有键名都是【字符串】，所以加不加引号都可以，上面没加引号的键名也可以这样写

但是用双引号的好处是，键名你可以想怎么取就怎么取，因为JavaScript实际上取名字有时候会有限制的，不能为所欲为，比如你的键名不用引号，想取一个全部都是数字的键名是不允许的，开头用数字会报错，但是你加上引号的话，键名开头用数字就没问题。加双引号是更标准的，功能更强大，不加双引号就是取名稍有限制，但是更为偷懒的方法。

数值，字符串，null，undefined，symbol，布尔值，对象这七个类型，我们按照他们的特性让他们分成两个组合吧。

【基本类型】：数值，字符串，null，undefined，symbol，布尔值

【复合类型】：对象 （之所以对象是复合类型，是因为一个对象往往由多个基本类型的值组合在一起的）

3.类型之间的转换

数据类型的转换分为【强制转换】 和 【自动转换】

强制转换：

自己用一些函数等方法把任意值转换成另一个类型的数据。（比如用 函数String() 把数值 1 转换成字符串 ‘1’ ）

一般转换类型会转成下面三种：

1.数值

2.字符串

3.布尔值

1 数值

可以使用 Number（）函数

作用： 将任意类型的值转为数值

下面分两种情况，一种参数为【基本类型】，一种为【对象】

（参数：在声明/调用也就是使用函数的时候，括号里的值就叫参数，只不过声明的时候，函数里的参数叫形参，调用的时候，参数叫实参）

（1）基本类型

其他方法：

1. 【转整数】parseInt（）

语法: parseInt(string, radix) （字符串,基数(2~36))

第二个参数意思是需要转成几进制，比如下面例子中的 10 是转成 10进制

如果parseInt的参数不是字符串，则会先转为字符串再转换。这个很重要

parseInt(10) // 10

2. 【转浮点数】parseFloat() （不用写第二个参数是几进制，因为只能转成10进制）

3. 【浮点数 + 整数】 - 0

• 0 有效是因为只有加法运算符遇到字符串会自动转换成字符串，其他减法，乘法，除法都会把字符串变成数字

4. 【浮点数 + 整数】 + （数值运算符，和Number作用一样）

Number() 和parseInt() 函数区别：

Number更加严格，只要一个值无法转成数值，整个字符串就会转为【NaN】，告诉我们这不能转为数值。

Number转成浮点数/整数都可以，parseInt只能整数

（2）对象

Number() 参数是对象时，返回【NaN】，除非时包含单个数值的数组

2 字符串

可以使用String（）函数

作用： 将任意值转为字符串

下面（1）写基本类型转换规则，（2）写对象转换规则

（1）基本类型

• 数值： 转为相应的字符串

• 字符串： 还是原来的值

• 布尔值： true转为‘true’， false转为‘false’

• undefined： 转为’undefined’

• null ： 转为’null’

其他方法：

加号 + 和 空字符串 ‘’/ “”

（2）对象

参数为对象时，返回值是以字符串的形式显示该参数的类型；

参数为数组时，返回该数组的字符串形式

>String(['a','cd'])
<"a,cd"
>String({'a':1,'b':2})
<"[object Object]"

3 布尔值

可用函数 Boolean()

作用： 将任意类型转为布尔值

除了以下五个值的转换结果是false，其他值全为true

• undefined

• null

• -0 / +0

• NaN

• ‘’ （空字符串）

• false

【背诵方法： 除了symbol和对象外的其他数据类型，共5个数据类型，每个数据类型至少有一个值是false。

number类型有两个值是false，分别是0 和 NaN；

string类型的空字符串’'是false；

null,undefined这两个本身是false；

布尔值中的false肯定是false】

【或者更方便的方法是用两个感叹号】

一个感叹号作用是以布尔值的方式取自己的相反值，两个感叹号就是相反值的相反值，也就是以本身布尔值的方式表示出来

自动转换

下面三种情况JavaScript会自动转换数据类型

① 不同类型的数据互相运算 （加法运算符）

② 对非布尔值类型的数据求布尔值

③ 对非数值类型的值使用一元运算符（+ 和 -）