如何在 JavaScript 中将数字转换为字符串

264 阅读4分钟

持续创作,加速成长!这是我参与「掘金日新计划 · 10 月更文挑战」的第19天,点击查看活动详情

JavaScript 非常灵活,并提供了许多不同的数据类型之间的转换方式。在这个简短的教程中,我们将了解如何在 JavaScript 中将数字转换为字符串。

本教程探讨了四种在 JavaScript 中将数字转换为字符串的方法。我们根据您的具体需求和用例推荐不同的方法:

字符串插值:在字符串中插入数字值时。例如,在网页上显示文本,如“您已使用24**个 学分中的 7 个学分”。您也可以使用串联,但要小心。或toString() 将数字值的类型更改为 String 时。例如,使用数字作为需要字符串的函数或 API 的输入。String并且toString()大多相同,但对待undefinednull变量不同。

使用插值将数字转换为字符串

插值可能是在字符串中使用数字的最易读的方式。您可以使用此方法将其插入到字符串中,而不是手动将数字转换为字符串。

要使用插值,请使用反引号 ( `) 而非引号 ("') 包裹字符串。然后,在字符串中,您可以插入任何`${}`用作占位符的变量。这被称为模板字面量,并具有许多其他巨大的好处。

例如:

const number = 99;
console.log(`${number}%的人喜欢JavaScrip`); // "99%的人喜欢JavaScrip"

使用字符串连接将数字转换为字符串

第二种方法是字符串连接。您可以使用运算符将​​数字转换为字符串+

例如:

console.log(10 + "086"); //"1086"
console.log(10 + ""); //"10"

尽管这种方法很有效(因为它需要最少的代码),但它会使代码的可读性降低。

字符串连接警告

当对多个数字使用此方法时,可能会发生意外结果。

例如:

const a = 2000;
const b = 468;
console.log(a + b + " 元"); // "2468元"

由于a + b在到达字符串之前首先进行评估,因此该操作是数字加法而不是字符串连接。一旦达到字符串变量或文字,操作就变成了字符串连接。所以,结果是2468元

但是,请尝试将代码更改为以下内容:

const a = 10;
const b = 6;
console.log("湖南" + a + b + "国道"); // "湖南106国道"

因为"湖南" + a首先被评估,所以该+运算符用于表达式其余部分的字符串连接。a因此,它不再像前面的示例那样在and之间进行加法运算b,而是变成了两者之间的字符串连接操作。

这可以使用括号来解决:

const a = 103;
const b = 3;
console.log("湖南" + (a + b) + "国道"); // "湖南106国道"

a和之间的加法b首先执行,这导致两个变量之间的加法运算。然后,字符串连接用于表达式的其余部分,因为第一个操作数是"湖南"

使用 toString 将数字转换为字符串

第三种方法是使用toString()方法。此方法适用于所有JavaScript 数据类型包括数字。它转换它所使用的数字的值并返回它。

例如:

const number = 10;
console.log(number); // 10
console.log(typeof number); // "number"

const numberStr = number.toString();
console.log(numberStr); // "10"
console.log(typeof numberStr); // "string"

使用字符串将数字转换为字符串

第四种方法是使用String()构造函数。此函数接受要转换的变量作为第一个参数。它将参数转换为字符串并返回。

例如:

const number = 10;
console.log(number); // 10
console.log(typeof number); // "number"

const numberStr = String(number);
console.log(numberStr); // "10"
console.log(typeof numberStr); // "string"

在控制台中记录 的值number及其类型时,结果分别为10number。转换后,结果分别10为字符串和string

结论

本教程向您展示了四种可用于在 JavaScript 中将数字转换为字符串的方法。尽管这些方法在与数字一起使用时可以产生相同的结果,但在某些情况下,一种方法会比其他方法更好。

String()使用and之间的主要区别在于toString()String()适用于undefinednull值,而toString()没有。因此,如果您的值应该包含一个数字,但您希望在将其转换为字符串时安全,则可以使用String()

至于字符串插值和字符串连接,它们最适合在字符串中使用数字时使用。否则,使用这些方法会降低代码的可读性。