在 TypeScript 中将字符串转换为数字

在 TypeScript 中使用 Number() 对象将字符串转换为数字,例如 const num1 = Number(str)。 当用作函数时,Number(value) 将字符串或其他值转换为数字。 如果该值无法转换,则返回 NaN(不是数字)。

const str = '1234';

// 👇️ const num1: number
const num1 = Number(str);
console.log(num1); // 👉️ 1234

// 👇️ const num2: number
const num2 = +str;
console.log(num2); // 👉️ 1234

我们使用 Number 函数将字符串转换为数字。

我们可能还会看到开发人员使用一元加号 (+) 运算符将字符串转换为数字。

const str = '1234';

const num2 = +str;
console.log(num2); // 👉️ 1234

它实现了与 Number 函数相同的目标,但可能会使不熟悉一元加号 (+) 运算符的代码读者感到困惑。

添加数字时应避免使用一元加号 (+) 运算符,因为它会使我们的代码看起来很奇怪。

const str = '1234';

const num2 = 6 + +str;
console.log(num2); // 👉️ 1240

第一个加号是加法运算符,第二个加号用于将字符串转换为数字。

即使我们将不存储有效数字的字符串传递给 Number 函数,我们也会得到 NaN(不是数字)值,它也是数字类型。

console.log(typeof NaN); // 👉️ "number"

如果我们尝试使用 Number 函数或一元加号 (+) 运算符将不是有效数字的字符串转换为数字,我们将返回一个 NaN(不是数字)值。

const str = '1234test';

const num1 = Number(str);
console.log(num1); // 👉️ NaN

const num2 = +str;
console.log(num2); // 👉️ NaN

在这种情况下,我们应该使用 parseInt() 或 parseFloat() 函数。

就像函数名称所暗示的那样,parseInt 将字符串转换为整数,而 parseFloat 转换为浮点数。

使用 parseInt 或 parseFloat 将字符串转换为数字

使用 parseInt() 函数将字符串转换为数字,例如 const num1 = parseInt(str)。 parseInt 函数将要解析的值作为参数,并返回从提供的字符串解析的整数。

const str = '1234.5test';

// 👇️ const num1: number
const num1 = parseInt(str);
console.log(num1); // 👉️ 1234

// 👇️ const num2: number
const num2 = parseFloat(str);
console.log(num2); // 👉️ 1234.5

我们传递给 parseInt 函数的唯一参数是我们想要转换为整数的字符串。

第二个示例使用 parseFloat 函数将字符串转换为浮点数。

TypeScript 能够将变量的类型推断为数字,因为即使 NaN 的类型也是数字。

需要注意的是,如果字符串的第一个非空白字符不能转换为数字,则 parseInt() 和 parseFloat() 函数将返回 NaN(不是数字)。

const str = 'test1234.5test';

const num1 = parseInt(str);
console.log(num1); // 👉️ NaN

const num2 = parseFloat(str);
console.log(num2); // 👉️ NaN

parseInt() 和 parseFloat() 函数能够解析字符串中的数字,如果字符串以有效数字开头,但是如果字符串的第一个非空白字符不能转换为数字,则方法短路返回 NaN。

如果我们遇到这种情况,需要使用 replace() 方法从字符串中提取一个数字。


从 TypeScript 中的字符串中提取数字

要在 TypeScript 中从字符串中提取数字,请调用 replace() 方法,例如 str.replace(/\D/g, ”) 并将结果传递给 Number() 函数。 replace() 方法会将所有非数字字符替换为空字符串并返回结果。

const str = 'hello 1234 world';

// 👇️ const replaced: string
const replaced = str.replace(/\D/g, '');
console.log(replaced); // 👉️ "1234"

let num: number | undefined;

if (replaced !== '') {
  num = Number(replaced);
}

// 👇️ let num: number | undefined
console.log(num); // 👉️ 1234

该示例使用 String.replace 方法将字符串中的所有非数字字符替换为空字符串。

这有效地从字符串中删除了所有非数字字符。

将空字符串转换为数字会返回 0,这可能不是我们想要的。

// 👇️ 0
console.log(Number(''));

这就是为什么我们将 num 变量的类型设置为 number | undefined 并且如果被替换的变量不存储空字符串,我们只会将变量设置为数字。

如果我们确定应用程序中的字符串将包含至少一个数字,或者wine 吧的用例可以将空字符串转换为 0,则可以稍微简化一下。

const str = 'hello 1234 world';

// 👇️ const replaced: string
const replaced = str.replace(/\D/g, '');
console.log(replaced); // 👉️ "1234"

// 👇️ const num: number
const num = Number(replaced);

console.log(num); // 👉️ 1234

我们传递给 replace() 方法的第一个参数是我们要在字符串中匹配的正则表达式,第二个参数是每个匹配项的替换(空字符串)。

\D 字符匹配不是数字的字符。

我们添加了 g(全局)标志来匹配所有非数字字符并将它们替换为空字符串。

仅当 parseInt() 和 parseFloat() 函数不足时才应使用此方法,因为尽可能利用内置函数总是更好。