数据类型转换

Mon, 04 Nov 2024 00:00:00 +0800

前言

JavaScript 是一种非常灵活的编程语言，它允许开发者在代码中进行各种类型的操作和转换。其中，显式和隐式类型转换是 JavaScript 中一个重要而又常见的概念。你是否曾经遇到过 JavaScript 中奇怪的类型转换行为？当你使用加号连接两个不同类型的值时，为什么有时候会得到意料之外的结果？为了更好地理解 JavaScript 中的这些行为，我本篇文章将带大家深入探讨显式和隐式类型转换。

数据类型

首先简单了解下有哪些数据类型。

原始数据类型：String、Number、Boolean、Symbol、Undefined、Null、BigInt（本文不讨论BigInt、Symbol）

引用数据类型: Object（引用类型指向一个对象，不是原始值，指向对象的变量是引用变量）

类型转换

数据类型之间的转换可以分为下面三种：

原始数据类型之间的转换。
原始数据类型转换为对象。
对象转换为原始数据类型。

1.1 原始数据类型转Number

console.log(Number('123')); // 123
console.log(Number(true)); // 1
console.log(Number(undefined)); // NaN
console.log(Number(null)); // 0

我们可以直接调用Number()函数来进行转换。该函数会把undefined转换为NaN，将null转换为0。

而对于字符串，如果字符串中仅仅包含数字，则将转换为数字，若包含非数字字符，则返回NaN。我们也可以使用parseInt()来转换字符串。

console.log(parseInt('123')); // 123
console.log(parseInt('12.3')); // 12
console.log(parseInt('12ds8'));// 12
console.log(parseInt('ads25')); // NaN

parseInt()只解析整数部分，忽略小数部分。parseFloat()可以将字符串转换为浮点数的函数。

1.2 原始数据类型转String

console.log(String());//''
console.log(String(123));//'123'
console.log(String(NaN));//NaN
console.log(String(undefined));//undefined
console.log(String(null));//null
console.log(String(true));//true

我们可以使用String() 构造函数将任何类型的数据转换为字符串类型。它将接收到的参数转换为对应的字符串表示形式。

1.3 原始数据类型转Boolean

console.log(Boolean());// false
console.log(Boolean('Ywis'));// tru
console.log(Boolean(123));// true
console.log(Boolean(NaN));// false
console.log(Boolean(undefined));// false
console.log(Boolean(null));// false
console.log(Boolean(true));// true

调用Boolean()函数进行转换。在将非布尔值类型转换为布尔值类型时，有一个总结：

false：布尔值 false
undefined：未定义的值
null：空值
0：数字 0
-0：负零
NaN：非数字值
''：空字符串

除了以上七个值外，其他值（包括对象、数组、函数等）在转换为布尔值时都会返回 true。这种规则使得 JS 中的大多数值被视为真值（truthy）。