js如何将数字转为字符串

月夜之吻

发布时间：2025-08-12 11:09:02

1098人浏览过

来源于php中文网

原创

最常用的方法是tostring()，因为它语义清晰且适用于明确的数字类型；2. string()能安全处理null和undefined，适合不确定类型时使用；3. 空字符串拼接（+ ''）简洁但隐式，可读性较差；4. 模板字面量（${}）在构建复杂字符串时最优雅且自然完成转换；5. tostring()支持进制转换，是唯一能转为二进制、十六进制等字符串的方法；6. 所有方法对nan、infinity、-infinity的转换结果一致，分别为"nan"、"infinity"、"-infinity"；7. 选择应基于可读性、健壮性和场景需求，性能差异可忽略。

js如何将数字转为字符串

在JavaScript中，将数字转换为字符串有多种直接且常用的方法，核心在于利用内置的功能或语言特性来实现类型转换，这通常取决于你对代码的简洁性、可读性以及对特殊值处理的需求。

解决方案

将数字转换为字符串，我常用的方法有这么几种，它们各自有自己的应用场景和一点点微妙的区别。

首先是利用

String()

全局函数。这方法非常直观，你把任何值放进去，它都会尝试给你一个字符串形式。我个人觉得它很“安全”，因为它能处理

null

和

undefined

，不像某些方法会直接报错。

let num1 = 123;
let str1 = String(num1); // "123"

let num2 = 0;
let str2 = String(num2); // "0"

let num3 = -45.67;
let str3 = String(num3); // "-45.67"

let num4 = null;
let str4 = String(num4); // "null"

let num5 = undefined;
let str5 = String(num5); // "undefined"

接着是数字原型上的

toString()

方法。这是我最常用的一种，因为对于明确是数字的变量，它显得特别自然。你直接在数字后面点一下

.toString()

就行了。它还可以接受一个基数（radix）参数，比如你想把数字转成二进制、八进制或十六进制的字符串，这功能就派上用场了，虽然日常使用不多，但知道有这个能力很重要。

let numA = 789;
let strA = numA.toString(); // "789"

let numB = 255;
let strB_hex = numB.toString(16); // "ff" (转换为十六进制字符串)
let strB_bin = numB.toString(2);  // "11111111" (转换为二进制字符串)

// 注意：不能直接对 null 或 undefined 调用 .toString()，会报错
// let strC = null.toString(); // TypeError

再来是空字符串拼接法，也就是

+ ''

。这招特别简洁，利用了JavaScript的隐式类型转换机制。当一个数字和一个空字符串相加时，数字会被强制转换为字符串。我有时候为了追求极致的简洁会用它，但它有时候也显得不够“明确”，新手可能会有点困惑。

let numX = 99;
let strX = numX + ''; // "99"

let numY = 1.23;
let strY = numY + ''; // "1.23"

最后是ES6引入的模板字面量（Template Literals）。如果你已经在使用它们来构建字符串，那么把数字嵌入进去自然而然就完成了转换。它提供了一种非常现代且可读性高的方式来组合字符串和变量。

let numP = 100;
let strP = `${numP}`; // "100"

let numQ = 3.14159;
let strQ = `The value is ${numQ}.`; // "The value is 3.14159."

每种方法都有其存在的理由，选择哪一种，更多时候是个人习惯和项目规范的考量。

哪种方法最常用？它们有什么区别？

在我日常的编码实践中，

toString()

方法无疑是最常用的，尤其是在我明确知道操作对象是一个数字类型时。它语义清晰，直接表达了“我要把这个数字变成字符串”的意图。紧随其后的可能是模板字面量

${variable}

，因为它在构建复杂字符串时非常方便，顺带也就完成了数字到字符串的转换。至于

String()

全局函数和空字符串拼接

+ ''

，我用得相对少一些，但它们各有各的特点。

它们之间的主要区别体现在以下几个方面：

Perl学习手札 chm版

Perl学习手札是台湾perl高手写的一篇文章，特打包为chm版，方便大家阅读。关于本书 1. 关于Perl 1.1 Perl的历史 1.2 Perl的概念 1.3 特色 1.4 使用Perl的环境 1.5 开始使用 Perl 1.6 你的第一个Perl程序 2. 标量变量(Scalar) 2.1 关于标量 2.1.1 数值 2.1.2 字符串 2.1.3 数字与字符串转换 2.2 使用你自己的变量 2.3 赋值 2.3.1 直接设定 2.3.2 还可以这样 2.4 运算 2.5 变量的输出/输入 2.

下载

对
```
null
```
和
undefined
的处理：
- ```
String(null)
```
  会得到
```
"null"
```
  ，
```
String(undefined)
```
  会得到
```
"undefined"
```
  。这是
```
String()
```
  函数的一大优势，它能“安全”地处理这些特殊值，不会抛出错误。
- ```
null.toString()
```
  和
```
undefined.toString()
```
  都会抛出
```
TypeError
```
  ，因为
```
null
```
  和
```
undefined
```
  没有
```
toString
```
  方法。
- ```
null + ''
```
  会得到
```
"null"
```
  ，
```
undefined + ''
```
  会得到
```
"undefined"
```
  。这和
```
String()
```
  的行为一致，也是隐式转换的体现。
- ```
${null}
```
  会得到
```
"null"
```
  ，
```
${undefined}
```
  会得到
```
"undefined"
```
  。模板字面量也表现出类似的“宽容”性。
所以，如果你不确定变量是否为纯数字，或者可能包含
```
null
```
/
```
undefined
```
，那么
```
String()
```
或模板字面量，乃至空字符串拼接，都是更“健壮”的选择。
显式与隐式转换：
- ```
String()
```
  和
```
toString()
```
  都是非常显式的转换，一眼就能看出类型转换的目的。
- ```
+ ''
```
  是典型的隐式转换，它依赖于JavaScript的类型强制转换规则。虽然简洁，但对于不熟悉的人来说，可能会稍微增加一点点理解成本。
- 模板字面量
```
${}
```
  则是一种“半显式”的方式，它明确表示了变量的嵌入，而变量在嵌入时会自然地被转换为字符串。
性能： 在绝大多数现代JavaScript引擎中，这几种方法在性能上的差异微乎其微，几乎可以忽略不计。除非你正在处理数百万甚至数十亿次的循环转换，否则真的没必要为了那一点点理论上的性能差异去纠结。我更倾向于选择代码可读性最高、最符合当前语境的方法。
基数转换： 只有
```
toString()
```
方法提供了可选的
```
radix
```
参数，允许你将数字转换为特定进制（如二进制、十六进制）的字符串表示。这是它独有的能力，在需要进行进制转换时不可替代。

总的来说，

toString()

是数字类型最直接、最匹配的方法；

String()

则更通用，对非数字类型（如

null

）也友好；

+ ''

是简洁的隐式转换；而模板字面量则在现代代码中提供了一种优雅的字符串构建方式，顺带完成了转换。

处理特殊数字（如NaN、Infinity）时，转换结果如何？

在JavaScript中，有一些特殊的数字值，比如

NaN

（Not-a-Number，非数字）和

Infinity

（无限大）。它们在转换为字符串时的行为是统一且可预测的，这对于调试和数据展示来说非常重要。

NaN

(Not-a-Number): 无论你使用哪种方法，

NaN

都会被转换为字符串

"NaN"

。这很合理，因为它明确表示了“这不是一个常规的数字”。

let valNaN = NaN;
console.log(String(valNaN));      // "NaN"
console.log(valNaN.toString());   // "NaN"
console.log(valNaN + '');         // "NaN"
console.log(`${valNaN}`);         // "NaN"

Infinity

(正无穷大): 正无穷大

Infinity

在转换为字符串时，会变成

"Infinity"

。

let valInfinity = Infinity;
console.log(String(valInfinity));      // "Infinity"
console.log(valInfinity.toString());   // "Infinity"
console.log(valInfinity + '');         // "Infinity"
console.log(`${valInfinity}`);         // "Infinity"

-Infinity

(负无穷大): 负无穷大

-Infinity

则会转换为字符串

"-Infinity"

。

let valNegInfinity = -Infinity;
console.log(String(valNegInfinity));      // "-Infinity"
console.log(valNegInfinity.toString());   // "-Infinity"
console.log(valNegInfinity + '');         // "-Infinity"
console.log(`${valNegInfinity}`);         // "-Infinity"

这些特殊数字的转换行为保持了一致性，这意味着你在处理可能包含这些值的计算结果时，不必担心它们在转换为字符串后会变得不可识别或产生意外。这为我们在日志记录、错误信息展示或用户界面呈现时提供了很大的便利，因为它们能够以人类可读的字符串形式清晰地表达其特殊含义。

在不同场景下，选择哪种转换方式更合适？

选择哪种数字转字符串的方法，其实很大程度上取决于你当前的代码上下文、团队的编码规范以及你对代码可读性和健壮性的偏好。

通用场景与可读性优先： 对于大多数情况，当我有一个明确的数字，并且我只是想把它变成字符串以供显示或拼接时，我倾向于使用
```
toString()
```
方法。它非常直观，直接在数字对象上调用，清晰地表达了意图。
```
let userId = 12345;
let welcomeMessage = "User ID: " + userId.toString(); // 意图明确
```
如果我正在构建一个复杂的字符串，其中包含多个变量（包括数字），那么模板字面量
```
${}
```
是我的首选。它让字符串的构建变得非常流畅和易读，数字的转换也自然而然地完成了。
```
let productId = 5001;
let price = 99.99;
let productInfo = `Product ID: ${productId}, Price: $${price}.`; // 组合复杂字符串时非常优雅
```
处理不确定类型输入（可能包含
```
null
```
或
undefined
）：如果我的函数可能接收到数字、但也有可能是
```
null
```
或
```
undefined
```
作为输入，并且我希望这些非数字值也能被“安全”地转换为字符串而不抛出错误，那么String()
全局函数是最佳选择。它对所有基本类型都适用，提供了一种统一且容错的转换方式。
```
function safeStringify(value) {
    return String(value); // 无论 value 是数字、null、undefined 都能正常工作
}
console.log(safeStringify(123));     // "123"
console.log(safeStringify(null));    // "null"
console.log(safeStringify(undefined)); // "undefined"
```
追求极致简洁（但需谨慎）： 在一些非常简单的场景，或者当团队成员都熟悉这种“技巧”时，空字符串拼接
```
+ ''
```
有时也会被使用。它确实非常简洁，但正如我之前提到的，它的隐式性可能让代码对新手不那么友好。我个人在生产代码中会尽量避免这种方式，除非是为了解决特定、已知的兼容性问题（比如某些非常老的JS环境）。
```
let count = 10;
let countStr = count + ''; // 简洁，但不够显式
```
进制转换： 当需要将数字转换为特定进制（如二进制、十六进制）的字符串表示时，
```
toString(radix)
```
是唯一选择。
```
let decimalNum = 255;
let hexString = decimalNum.toString(16); // "ff"
```