JavaScript 类型转换

    在本教程中，您将借助示例了解 JavaScript 中的类型转换。
    在编程中，类型转换是将一种类型的数据转换为另一种类型的过程。例如：将 String 数据转换为 Number。
    JavaScript 中有两种类型的类型转换。

• 隐式转换 - 自动类型转换
• 显式转换 - 手动类型转换

JavaScript 隐式转换

    在某些情况下，JavaScript 会自动将一种数据类型转换为另一种正确的类型，这称为隐式转换。

示例 1：隐式转换为字符串

// numeric string used with + gives string type
let result;

result = '3' + 2; 
console.log(result) // "32"

result = '3' + true; 
console.log(result); // "3true"

result = '3' + undefined; 
console.log(result); // "3undefined"

result = '3' + null; 
console.log(result); // "3null"

    注意：当将数字添加到字符串时，JavaScript 会在连接之前将数字转换为字符串。

示例 2：隐式转换为数字

// numeric string used with - , / , * results number type

let result;

result = '4' - '2'; 
console.log(result); // 2

result = '4' - 2;
console.log(result); // 2

result = '4' * 2;
console.log(result); // 8

result = '4' / 2;
console.log(result); // 2

示例 3：非数字字符串结果转换为 NaN

// non-numeric string used with - , / , * results to NaN

let result;

result = 'hello' - 'world';
console.log(result); // NaN

result = '4' - 'hello';
console.log(result); // NaN

示例 4：隐式布尔转换为数字

// if boolean is used, true is 1, false is 0

let result;

result = '4' - true;
console.log(result); // 3

result = 4 + true;
console.log(result); // 5

result = 4 + false;
console.log(result); // 4

    注意： JavaScript 将 0 视为 false，所有非零数视为 true。并且，如果 true 转换为数字，则结果始终为 1。

示例 5：null 转换为数字

// null is 0 when used with number
let result;

result = 4 + null;
console.log(result);  // 4

result = 4 - null;
console.log(result);  // 4

示例 6：undefined 与 number、boolean 或 null 一起使用

// Arithmetic operation of undefined with number, boolean or null gives NaN

let result;

result = 4 + undefined;
console.log(result);  // NaN

result = 4 - undefined;
console.log(result);  // NaN

result = true + undefined;
console.log(result);  // NaN

result = null + undefined;
console.log(result);  // NaN

JavaScript 显式转换

    您还可以根据需要将一种数据类型转换为另一种数据类型。您手动执行的类型转换称为显式类型转换。
    在 JavaScript 中，显式类型转换是使用内置方法完成的。
    以下是一些常见的显式转换方法。

1. 显式转换为数字

    要将数字字符串和布尔值转换为数字，您可以使用 Number()。例如，

let result;

// string to number
result = Number('324');
console.log(result); // 324

result = Number('324e-1')  
console.log(result); // 32.4

// boolean to number
result = Number(true);
console.log(result); // 1

result = Number(false);
console.log(result); // 0

    在 JavaScript 中，空字符串和 null 值返回 0。例如，

let result;
result = Number(null);
console.log(result);  // 0

let result = Number(' ')
console.log(result);  // 0

    如果字符串是无效数字，则结果将为NaN。例如，

let result;
result = Number('hello');
console.log(result); // NaN

result = Number(undefined);
console.log(result); // NaN

result = Number(NaN);
console.log(result); // NaN

    注意：还可以使用 parseInt()、parseFloat()、一元运算符 + 和 Math.floor() 从字符串生成数字。例如，

let result;
result = parseInt('20.01');
console.log(result); // 20

result = parseFloat('20.01');
console.log(result); // 20.01

result = +'20.01';
console.log(result); // 20.01

result = Math.floor('20.01');
console.log(result); // 20

2. 显式转换为字符串

    要将其他数据类型转换为字符串，您可以使用 String() 或 toString() 。例如，

//number to string
let result;
result = String(324);
console.log(result);  // "324"

result = String(2 + 4);
console.log(result); // "6"

//other data types to string
result = String(null);
console.log(result); // "null"

result = String(undefined);
console.log(result); // "undefined"

result = String(NaN);
console.log(result); // "NaN"

result = String(true);
console.log(result); // "true"

result = String(false);
console.log(result); // "false"

// using toString()
result = (324).toString();
console.log(result); // "324"

result = true.toString();
console.log(result); // "true"

    注意：String() 接受 null 和 undefined，并将它们转换为String。但是，当传递 null 时，toString() 会给出错误。

3. 显式转换为布尔值

    要将其他数据类型转换为布尔值，您可以使用 Boolean()。
    在 JavaScript 中，undefined， null， 0， NaN， ’ ’ 转换为 false。 例如，

let result;
result = Boolean('');
console.log(result); // false

result = Boolean(0);
console.log(result); // false

result = Boolean(undefined);
console.log(result); // false

result = Boolean(null);
console.log(result); // false

result = Boolean(NaN);
console.log(result); // false

    所有其他值给出 true。 例如，

result = Boolean(324);
console.log(result); // true

result = Boolean('hello');
console.log(result); // true

result = Boolean(' ');
console.log(result); // true

JavaScript 类型转换表

    该表显示了 JavaScript 中不同值到字符串、数字和布尔值的转换。

值	String 转换	Number 转换	Boolean 转换
1	“1”	1	true
0	“0”	0	false
“1”	“1”	1	true
“0”	“0”	0	true
“ten”	“ten”	NaN	true
true	“true”	1	true
false	“false”	0	false
null	“null”	0	false
undefined	“undefined”	NaN	false
‘’	“”	0	false
’ ’	" "	0	true

    您将在后面的教程中了解对象和数组到其他数据类型的转换。
    相关示例：

• JavaScript 日期转数字
• JavaScript 日期到字符串

上一教程 ：JS Comments                                         下一教程 ：JS Comparison Operator

参考文档

[1] Parewa Labs Pvt. Ltd. (2022, January 1). Getting Started With JavaScript, from Parewa Labs Pvt. Ltd: https://www.programiz.com/javascript/type-conversion