类型转换 #
一、转换概述 #
在Deno/TypeScript中，类型转换分为显式转换（手动转换）和隐式转换（自动转换）。理解类型转换对于编写正确的代码至关重要。
二、转换为字符串 #
2.1 String()函数 #
typescript
console.log(String(123)); // "123"
console.log(String(3.14)); // "3.14"
console.log(String(true)); // "true"
console.log(String(false)); // "false"
console.log(String(null)); // "null"
console.log(String(undefined)); // "undefined"
console.log(String([1, 2, 3])); // "1,2,3"
console.log(String({})); // "[object Object]"
2.2 toString()方法 #
typescript
const num = 123;
console.log(num.toString()); // "123"
console.log(num.toString(2)); // "1111011" (二进制)
console.log(num.toString(16)); // "7b" (十六进制)
const bool = true;
console.log(bool.toString()); // "true"
const arr = [1, 2, 3];
console.log(arr.toString()); // "1,2,3"
// null和undefined没有toString方法
// null.toString(); // 错误
// undefined.toString(); // 错误
2.3 模板字符串 #
typescript
const num = 123;
const bool = true;
const arr = [1, 2, 3];
console.log(`${num}`); // "123"
console.log(`${bool}`); // "true"
console.log(`${arr}`); // "1,2,3"
2.4 拼接空字符串 #
typescript
const num = 123;
console.log(num + ""); // "123"
const bool = true;
console.log(bool + ""); // "true"
2.5 JSON.stringify() #
typescript
const obj = { name: "Alice", age: 25 };
console.log(JSON.stringify(obj)); // '{"name":"Alice","age":25}'
const arr = [1, 2, 3];
console.log(JSON.stringify(arr)); // '[1,2,3]'
// 格式化输出
console.log(JSON.stringify(obj, null, 2));
// {
// "name": "Alice",
// "age": 25
// }
三、转换为数字 #
3.1 Number()函数 #
typescript
console.log(Number("123")); // 123
console.log(Number("3.14")); // 3.14
console.log(Number("123abc")); // NaN
console.log(Number("")); // 0
console.log(Number(" ")); // 0
console.log(Number(true)); // 1
console.log(Number(false)); // 0
console.log(Number(null)); // 0
console.log(Number(undefined)); // NaN
console.log(Number([1])); // 1
console.log(Number([1, 2])); // NaN
console.log(Number({})); // NaN
3.2 parseInt()函数 #
typescript
console.log(parseInt("123")); // 123
console.log(parseInt("123.99")); // 123
console.log(parseInt("123abc")); // 123
console.log(parseInt("abc123")); // NaN
console.log(parseInt("10", 10)); // 10 (十进制)
console.log(parseInt("10", 2)); // 2 (二进制)
console.log(parseInt("ff", 16)); // 255 (十六进制)
console.log(parseInt("0xff")); // 255 (自动识别十六进制)
3.3 parseFloat()函数 #
typescript
console.log(parseFloat("3.14")); // 3.14
console.log(parseFloat("3.14abc")); // 3.14
console.log(parseFloat("3.14.15")); // 3.14
console.log(parseFloat("abc3.14")); // NaN
console.log(parseFloat("123")); // 123
3.4 一元加号运算符 #
typescript
console.log(+"123"); // 123
console.log(+"3.14"); // 3.14
console.log(+"123abc"); // NaN
console.log(+true); // 1
console.log(+false); // 0
console.log(+null); // 0
console.log(+undefined); // NaN
3.5 算术运算 #
typescript
console.log("123" - 0); // 123
console.log("123" * 1); // 123
console.log("123" / 1); // 123
四、转换为布尔值 #
4.1 Boolean()函数 #
typescript
// 假值（Falsy）
console.log(Boolean(false)); // false
console.log(Boolean(0)); // false
console.log(Boolean(-0)); // false
console.log(Boolean(0n)); // false
console.log(Boolean("")); // false
console.log(Boolean(null)); // false
console.log(Boolean(undefined)); // false
console.log(Boolean(NaN)); // false
// 真值（Truthy）
console.log(Boolean(true)); // true
console.log(Boolean(1)); // true
console.log(Boolean(-1)); // true
console.log(Boolean("hello")); // true
console.log(Boolean([])); // true
console.log(Boolean({})); // true
console.log(Boolean(() => {})); // true
4.2 双感叹号 #
typescript
console.log(!!1); // true
console.log(!!0); // false
console.log(!!"hello"); // true
console.log(!!""); // false
console.log(!!{}); // true
console.log(!!null); // false
4.3 逻辑上下文 #
typescript
const value = 0;
if (value) {
console.log("真值");
} else {
console.log("假值"); // 输出这个
}
// 短路求值
const name = "";
console.log(name || "默认名称"); // 默认名称
const count = 0;
console.log(count ?? 10); // 0 (空值合并只检查null/undefined)
五、转换为对象 #
5.1 Object()函数 #
typescript
const str = Object("hello");
console.log(str); // String {"hello"}
console.log(typeof str); // "object"
const num = Object(123);
console.log(num); // Number {123}
console.log(typeof num); // "object"
const bool = Object(true);
console.log(bool); // Boolean {true}
console.log(typeof bool); // "object"
5.2 从JSON解析 #
typescript
const jsonStr = '{"name":"Alice","age":25}';
const obj = JSON.parse(jsonStr);
console.log(obj.name); // Alice
console.log(obj.age); // 25
const jsonArr = '[1,2,3]';
const arr = JSON.parse(jsonArr);
console.log(arr); // [1, 2, 3]
六、数组与对象转换 #
6.1 字符串转数组 #
typescript
const str = "hello";
console.log(str.split("")); // ["h", "e", "l", "l", "o"]
const csv = "a,b,c";
console.log(csv.split(",")); // ["a", "b", "c"]
// Array.from
console.log(Array.from("hello")); // ["h", "e", "l", "l", "o"]
6.2 数组转字符串 #
typescript
const arr = [1, 2, 3];
console.log(arr.toString()); // "1,2,3"
console.log(arr.join("")); // "123"
console.log(arr.join("-")); // "1-2-3"
console.log(arr.join(", ")); // "1, 2, 3"
6.3 对象转数组 #
typescript
const obj = { a: 1, b: 2, c: 3 };
// 键数组
console.log(Object.keys(obj)); // ["a", "b", "c"]
// 值数组
console.log(Object.values(obj)); // [1, 2, 3]
// 键值对数组
console.log(Object.entries(obj)); // [["a", 1], ["b", 2], ["c", 3]]
6.4 数组转对象 #
typescript
const entries = [["a", 1], ["b", 2], ["c", 3]];
const obj = Object.fromEntries(entries);
console.log(obj); // { a: 1, b: 2, c: 3 }
const keys = ["a", "b", "c"];
const values = [1, 2, 3];
const obj2 = Object.fromEntries(keys.map((k, i) => [k, values[i]]));
console.log(obj2); // { a: 1, b: 2, c: 3 }
七、隐式类型转换 #
7.1 算术运算 #
typescript
// 字符串 + 任何类型 = 字符串拼接
console.log("1" + 2); // "12"
console.log("1" + true); // "1true"
console.log("1" + null); // "1null"
console.log("1" + undefined); // "1undefined"
console.log("1" + [1, 2]); // "11,2"
console.log("1" + {}); // "1[object Object]"
// 其他运算符会转换为数字
console.log("10" - 5); // 5
console.log("10" * 2); // 20
console.log("10" / 2); // 5
console.log("10" % 3); // 1
7.2 比较运算 #
typescript
// 宽松相等（==）会进行类型转换
console.log(1 == "1"); // true
console.log(0 == false); // true
console.log(0 == ""); // true
console.log(null == undefined); // true
console.log(null == 0); // false
console.log(undefined == 0); // false
// 严格相等（===）不进行类型转换
console.log(1 === "1"); // false
console.log(0 === false); // false
console.log(0 === ""); // false
console.log(null === undefined); // false
7.3 关系运算 #
typescript
// 数字比较
console.log(10 > "5"); // true
console.log("10" > 5); // true
// 字符串比较（按字典序）
console.log("b" > "a"); // true
console.log("10" > "9"); // false (字符串比较)
// 与NaN比较
console.log("hello" > 5); // false (NaN与任何数比较都是false)
7.4 逻辑运算 #
typescript
// 短路求值
console.log(0 || "default"); // "default"
console.log(1 || "default"); // 1
console.log("" && "value"); // ""
console.log("hello" && "value"); // "value"
// 空值合并
console.log(null ?? "default"); // "default"
console.log(undefined ?? "default"); // "default"
console.log(0 ?? "default"); // 0
console.log("" ?? "default"); // ""
八、类型转换表 #
8.1 转换为字符串 #
| 原始值 | String() | toString() | 模板字符串 |
|---|---|---|---|
| 123 | “123” | “123” | “123” |
| true | “true” | “true” | “true” |
| null | “null” | 错误 | “null” |
| undefined | “undefined” | 错误 | “undefined” |
| [1,2] | “1,2” | “1,2” | “1,2” |
| {} | “[object Object]” | “[object Object]” | “[object Object]” |
8.2 转换为数字 #
| 原始值 | Number() | parseInt() | parseFloat() | + |
|---|---|---|---|---|
| “123” | 123 | 123 | 123 | 123 |
| “3.14” | 3.14 | 3 | 3.14 | 3.14 |
| “123abc” | NaN | 123 | 123 | NaN |
| “” | 0 | NaN | NaN | 0 |
| true | 1 | NaN | NaN | 1 |
| false | 0 | NaN | NaN | 0 |
| null | 0 | NaN | NaN | 0 |
| undefined | NaN | NaN | NaN | NaN |
8.3 转换为布尔值 #
| 原始值 | Boolean() | !! |
|---|---|---|
| 0 | false | false |
| 1 | true | true |
| “” | false | false |
| “hello” | true | true |
| null | false | false |
| undefined | false | false |
| NaN | false | false |
| [] | true | true |
| {} | true | true |
九、TypeScript类型断言 #
9.1 尖括号语法 #
typescript
const value: unknown = "hello";
const length: number = (<string>value).length;
console.log(length); // 5
9.2 as语法 #
typescript
const value: unknown = "hello";
const length: number = (value as string).length;
console.log(length); // 5
// 联合类型断言
function getLength(value: string | number): number {
if (typeof value === "string") {
return (value as string).length;
}
return String(value as number).length;
}
9.3 非空断言 #
typescript
function greet(name: string | null) {
console.log(name!.toUpperCase()); // 确定name不为null
}
greet("Alice"); // ALICE
// greet(null); // 运行时错误
9.4 双重断言 #
typescript
const value = "hello" as unknown as number;
// 危险：可能导致运行时错误
十、最佳实践 #
10.1 使用严格相等 #
typescript
// 推荐
if (value === null) { }
if (value === undefined) { }
if (value === 0) { }
// 不推荐
if (value == null) { }
if (value == undefined) { }
if (value == 0) { }
10.2 显式转换 #
typescript
// 推荐：显式转换
const num = Number(str);
const str = String(num);
const bool = Boolean(value);
// 不推荐：依赖隐式转换
const num = +str;
const str = num + "";
10.3 检查类型 #
typescript
function process(value: unknown) {
if (typeof value === "string") {
console.log(value.toUpperCase());
} else if (typeof value === "number") {
console.log(value.toFixed(2));
} else if (Array.isArray(value)) {
console.log(value.join(", "));
}
}
十一、总结 #
本章学习了：
- 转换为字符串的方法
- 转换为数字的方法
- 转换为布尔值的方法
- 数组与对象的相互转换
- 隐式类型转换规则
- TypeScript类型断言
- 最佳实践
下一章，我们将学习TypeScript类型系统。
最后更新：2026-03-28