TypeScript字符串转数字：5种简便转换方式

javascript旨在编写嵌入网页的几行短代码片段。没人能预料到javascript现在会变得如此流行，或者说会被用来编写拥有数千行代码的应用程序。

尽管javascript发展迅速，现在广泛用于构建应用程序，但它并不是一种完美的语言。它的起步和最初的用途意味着javascript有一些怪异之处，这可能使构建大型应用程序成为一场噩梦。

例如，当你引用对象中不存在的元素或将null与数值相乘时，javascript不会抛出错误。

对于javascript来说，当使用等号(==)比较空字符串(“”)和0（零）时，它们是相等的。更糟糕的是，javascript不会在开发中显示这些错误。只有在执行程序后才会看到这些错误。

typescript是建立在javascript之上的，因此它被开发出来以缓解使用javascript构建应用程序时出现的挑战。为了实现这一目标，typescript在编写代码时进行了静态类型检查。

静态检查意味着在运行代码之前，就可以检测到代码中的错误。因此，静态类型检查是根据代码中操作的值类型在开发过程中检查错误。

typescript是javascript的超集。作为javascript的超集意味着任何有效的javascript代码也是有效的typescript代码。作为有类型的语言，typescript添加了关于如何使用不同数据类型的规则。typescript也是强类型的，你不能绕过类型系统强制执行的限制。

typescript是web开发的一个重要里程碑和重大发展。typescript允许您编写更易于维护的可读代码。它还强制执行良好的编码实践，并帮助开发人员在编写代码时捕获和避免错误。

与javascript相比，typescript更可靠且易于重构，这使其在构建大型应用程序时非常理想。由于typescript是强类型的，让我们来看一下类型转换、其重要性以及typescript如何处理类型转换。

typescript中的类型转换及其重要性

类型转换是将一个值从一种数据类型转换为另一种数据类型的过程，例如将字符串值转换为数字。类型转换可以是隐式的，编译器在编译过程中自动将兼容的数据类型进行转换。

类型转换也可以是显式的，在源代码中明确需要进行类型转换。这通常称为类型转换。

类型转换的重要性在于它允许开发人员在与typescript中的预期数据类型一致的情况下使用不同的数据格式。它还有助于确保源代码的可预测结果。

作为开发人员，自己进行类型转换可以确保你的代码仍满足typescript的类型要求。它使你的代码更可读和可理解，并有助于防止与类型相关的错误。

类型转换还有助于支持数据验证，并帮助typescript通过提供与特定类型相关联的所有内置工具（例如自动完成）来帮助开发。

类型转换的一个常见用例是在字符串和数字之间进行转换。在typescript中将字符串转换为数字时，为了避免代码中的错误，只转换数字字符串为数字。也就是说，可以将字符串“1”，“235”，“5234.5”等转换为数字。但是，不要将字符串“hello”转换为数字。

让我们来看一下在typescript中将字符串转换为数字的不同方法：

使用“as”进行类型断言

在typescript代码中使用不同数据类型时，有时您对typescript无法了解的值的类型有更多的信息。在这种情况下，您可以告诉typescript一个变量的类型，并且不让编译器推断类型。这就是所谓的类型断言。

使用关键字as进行类型断言。要使用类型断言将字符串转换为数字，首先将字符串的类型设置为unknown。这是因为，默认情况下，typescript认为将string类型转换为number类型可能是一个错误。这是因为字符串和数字都不足以与另一个类型完全重叠。要使用as进行字符串转换为数字，请按照下面的示例进行操作：

/**
 * 将numstring的类型设置为unkown，否则，
 * typescript将推断numstring为字符串值
 */
let numstring: unknown = "23452";

// 使用as进行类型转换 - 将numstring转换为数字
// 并将其赋值给变量score
let score = numstring as number;
console.log(score);
console.log(score * 35);

输出：

23452
820820

从输出结果可以看到，变量numstring被转换为数字并赋值给了score。然后，我们可以对score进行数值计算，因为它的值是一个数字。

使用<>进行类型断言

使用<>进行类型断言也可以将字符串转换为数字。它的使用方式与使用as关键字完全相同。唯一的区别在于实现的语法，如下所示：

let numstring: unknown = "23452";
// 使用进行类型断言将字符串转换为数字
let score = numstring;

console.log(score);
console.log(score * 35);

输出：

23452
820820

输出与使用as关键字相同。再次提醒，不要使用类型断言将不包含数字值的字符串转换为数字。

使用number构造函数

使用number构造函数将字符串转换为数字，只需将要转换的字符串传递给number构造函数，如下面的代码片段所示：

let numstring = "23452"; // 类型推断为字符串
let lives: string = "20"; // 类型注解为字符串

// 将字符串传递给number构造函数以转换为数字
let score = number(numstring)
console.log(score / 17)

// 将字符串传递给number构造函数以转换为数字
let remaininglives = number(lives);
console.log(remaininglives - 4)

输出：

1379.5294117647059
16

当使用number构造函数时，您不必将字符串的类型设置为未知类型。它适用于已注释或推断为字符串的字符串值。但是，请记住传递数字字符串，例如“514”。如果传递无法转换为数字的字符串，将返回nan（非数字）。

使用一元加（+）运算符

一元加（+）运算符在其单个操作数之前，返回其之前的操作数。例如，+2返回数字2，+542返回数字542，依此类推。但是，如果操作数不是数字，则一元加（+）运算符会尝试将其转换为数字。

例如，+“98”将结果为98，+“0”将结果为数字0。因此，我们可以使用一元加（+）运算符将字符串转换为数字。如果传递无法转换为数字的字符串，则将返回nan，如下所示：

let numstring1 = "23452";
let numstring2 = "973.82"
let word = "hello"

// 使用一元加（+）将字符串转换为数字
let num1 = +numstring1;
let num2 = +numstring2;
let notnumber = +word;

console.log(`${num1}是一个${typeof num1}`);
console.log(`${num2}是一个${typeof num2}`);
console.log(notnumber);

输出：

23452是一个number
973.82是一个number
nan

使用一元加（+）运算符是将字符串转换为数字的一种好方法，因为它快速且不对其操作数进行任何其他操作。

使用parseint()和parsefloat()

与javascript一样，typescript不区分整数和小数也称为浮点数。它们都被认为是number类型。也就是说，parseint()和parsefloat()的行为略有不同。

parseint()接受一个字符串参数，解析并返回与指定基数相对应的整数。parsefloat()接受一个字符串参数，解析并返回一个浮点数。

例如，如果将“897”传递给parseint()和parsefloat()，您将得到数字897。但是，如果将897.75传递给parseint()和parsefloat()，parseint()将返回897，而parsefloat()将返回897.75。

因此，当转换不带小数点的数字字符串时，请使用parseint()，但如果数字字符串具有小数位数，请使用parsefloat()，如下所示：

let numstring1 = "897.75";
let numstring2 = "724";
let word = "hello";

console.log("解析具有小数的数字字符串")
console.log(`使用parseint -> ${parseint(numstring1)}`);
console.log(`使用parsefloat -> ${parsefloat(numstring1)}`);

console.log("解析整数的数字字符串")
console.log(`使用parseint -> ${parseint(numstring2)}`);
console.log(`使用parsefloat -> ${parsefloat(numstring2)}`);

console.log("解析无法转换为数字的字符串")
console.log(parseint(word));
console.log(parsefloat(word));

输出：

解析具有小数的数字字符串
使用parseint -> 897
使用parsefloat -> 897.75
解析整数的数字字符串
使用parseint -> 724
使用parsefloat -> 724
解析无法转换为数字的字符串
nan
nan

结论

当使用字符串值（例如api调用的结果）时，您可能希望将它们转换为数字，以便可以对其进行数值计算。当出现这种需求时，请考虑本文中介绍的将字符串转换为数字的方法。

然而，无论何时将字符串转换为数字，请注意小心，因为当您尝试将字符串转换为数字时，可能会得到nan。

为了避免此类错误，请确保您要转换为数字的所有字符串都是数值字符串。您还可以使用if语句来检查nan，以避免代码中的错误。

您还可以探索顶级typescript库和运行时，以作为开发人员了解。