你是否遇到过这样的情况:你想在typescript中把数字解析成字符串或者把字符串解析成数字?
在开发基于angular/typescript的项目时,我遇到了很多情况,这也是写这篇博文的原因。
Number
和 是String
typescript编程语言中基本的内建原始数据类型。
每个开发人员都已经知道这些类型。
数字用于保存数值,字符串用于保存用双引号或单引号括起来的一组字符。
这些类型的变量持有不同的值。
数字类型不会自动转换为字符串类型,因此,开发者必须编写代码来进行手动转换。
数字到字符串和字符串到数字的转换是 typescript 开发者的简单任务之一。对于转换为数字,字符串必须只包含数字。
数字到字符串的转换实例。
在javascript或typescript中,我们有多种方法可以将Number转换为String:
- 用一个空字符串进行追加。
- toString()方法
- 字符串构造函数
用一个空字符串追加数字。
这是一个简单易行的方法,可以将数字解析为字符串。例如,给定的数字值是11,13,添加一个空字符串并返回一个字符串对象。
在这种情况下,typeof
方法检查值的类型并返回原始类型为字符串。
在typescript中,+
是一个用来追加字符串的操作符。
下面的例子将有效和无效的值转换为字符串
下面的例子中,数字是有效的数值,即12。
var a: number = 12
var str: string = a + '';
console.log(typeof (a)) // outpus number as output
console.log(typeof (str)) // outpus string as output
console.log(str) //outputs 12 as string value
var a: number = null
var str: string = a + '';
console.log(typeof (str)) // outpus string as output
console.log(str) //outputs null in the form of string
var a: number = undefined
var str: string = a + '';
console.log(typeof (str)) // outpus string as output
console.log(str) //outputs undefined in the form of string
toString()方法
toString()
方法是每个数据类型都有的一个内置方法。它返回一个对象的字符串版本。
在任何数据类型上调用toString()方法都会返回字符串对象。
var a: number = 17
var str: string = a .toString()
console.log(typeof (str)) // outpus string as output
console.log(a) //outputs 12 as string value
如果我们在toString()方法中使用null和undefined,编译器会通过Cannot read property 'toString' of null
错误。
字符串构造函数
字符串构造函数接受任何值并返回一个字符串。
这种方法在你创建字符串时很有用。而且它是将数字转换为字符串类型的最简单的方法。
下面是一个例子
var a: number = 12
var stringValue = String(a);
console.log(typeof(stringValue) // outpus string as output
将字符串转换为数字的例子
本节解决了以下一些问题:
- 如何将字符串转换为整数?
- 如何将字符串解析为具有小数精度的浮点数。
字符串可以通过多种方式转换为数字。
首先,字符串必须包含以单数或双数编码的数值,输入是有效的字符串数值,例如:123
,输出总是返回123的数字类型。
如果字符串不是数字值,所有这些转换方式都会返回NAN
。
有多种简单易行的方法可以将字符串解析为数字值
- parseInt方法
- parseFloat方法
- Number()构造函数
- 加法运算
parseInt()本地方法
这将用于将字符串解析为小数位的数字。
parseInt
是一个内置的方法,它以字符串的形式接收输入的数字并返回数字。
语法
parseInt(string, radix)
字符串是一个用单引号或双引号括起来的数字字符串。弧度是一个可选的参数,可能的值是
- 16 -
hexa number
。 - 8 -
Octa number
- 2-
Binary number
- 10 -
Decimal number ie default
可能的输出是
- 有效数字 - 如果字符串是有效的数字,用单引号或双引号括起来。
- NAN - 输入的字符串不是有效的数字,就是空的或未定义的。
console.log(parseInt('32', 10)) // outpus 32 as output
console.log(parseInt('45')) // outpus 45 as output
console.log(parseInt('45abc')) // outpus 45 as output
console.log(parseInt('null')) // outpus NaN as output
console.log(parseInt('45')) // outpus 45 as output
parseFloat()方法
parseFloat
这是一个内置的方法,接受一个字符串格式的数字,并转换为浮点数格式的数字。
可能的输出是
- 有效的浮动数 - 如果字符串是用单引号或双引号括起来的有效数字值
- NAN - 输入的字符串不是有效的数值,或为空或未定义。
语法是
parseFloat(string, radix)
console.log(parseFloat('32.32')) // outpus 32.32 as output
这个方法对于转换含有小数位的浮动数字非常有用。
Number()方法
Number() 构造函数接受一个字符串作为参数,并返回数字作为输出。
console.log(Number('12')) // outpus 12 as output
console.log(Number('null')) // outpus NaN as output
console.log(Number('undefined')) // outpus NaN as output
加号单项运算符
这是一个单项运算符,只接受一个操作数。它接受字符串、布尔值和所有类型的数字并转换为数字。
语法
+string/boolean/number
输入是
- 字符串
- 布尔值
- 所有数字类型 - Hexa, octal, floating numbers
可能的输出是
- 有效数字 - 如果字符串是有效的数字值,用单引号或双引号括起来
- NAN - 输入的字符串不是有效的数字值或空或未定义。
console.log(+'44') // outputs 44
console.log(+'44.23') // outputs 44.23
console.log(+true) // outputs 1
console.log(+false) // outputs 0
console.log(+undefined) // outputs 0
console.log(+null) // outputs 0
总结
学习用原始类型进行类型转换的可能方法是非常重要的。上面的大多数例子在javascript中都可以使用,因为typescript是javascript的一个超集。
我希望你学到了许多在typescript中从字符串到/到数字的方法。此外,请确保你发送的是带有数字的有效字符串,这样一来,解析到数字的方法就非常简单了。