首页技术文章正文

JavaScript字符串变量类型转为数值类型有哪些方式?

更新时间:2021-09-27 来源:黑马程序员 浏览量:

IT培训班

JavaScript变量字符串类型转为数值类型有一下方法4中法方法,下面我们一个介绍。

1. Number()

使用Number()方法实现转换,语法:

变量 = Number(变量);


案例:

<script>
    var a = 1;
    var b = '100';
    var c = 'abcd';
    var d = '100abcd';
    var e = false;
    var f = undefined;
    var g = null;
    console.log(Number(a));   // 输出为数字1
    console.log(Number(b));   // 输出为数字100
    console.log(Number(c));   // 输出为NaN (not a number 不是一个数字)
    console.log(Number(d));   // 输出为NaN
    console.log(Number(e));   // 输出为数字0(0代表false)
    console.log(Number(f));   // 输出为NAN 
    console.log(Number(g));   // 输出为数字0(Null代表0)
</script>

注意:如果变量无法转为正常的数字类型,就会被转为NaN,NaN是数字类型,代表不是一个数字。


2. parseInt()

使用parseInt()方法取整数,语法如下:

变量 = parseInt(变量);


案例:

<script>
    var a;
    var b = null;
    var b = false;
    console.log(parseInt('100'));// 输出数字 100
    console.log(parseInt('100.23'));// 输出数字 100
    console.log(parseInt('abdc'));// 输出数字 NaN
    console.log(parseInt('100.34'));// 输出数字 100
    console.log(parseInt('abc100.34'));// 输出 NaN
    console.log(parseInt(a));           // 输出 NaN
    console.log(parseInt(b));           // 输出 NaN
    console.log(parseInt(c));           // 输出 NaN
</script>

注意parseInt() 方法会从左往右开始匹配,保留字串中以数字开始的部分,并且取整数;如果开头字符串不是数字则转为NaN,null、false、undefined等特殊值也输出NaN。


3. parseFloat()

使用parseFloat()转为浮点型数字,语法:

变量 = parseFloat(变量);


案例:

<script>
    console.log(parseFloat('100.33'));    // 输出数字 100.33
    console.log(parseFloat(100.33));    // 输出数字 100.33
    console.log(parseFloat(90));    // 输出数字 90
    console.log(parseFloat('2cdef'));   // 输出数字 2
    console.log(parseFloat('cd5f'));    // 输出 NaN
    console.log(parseFloat('cdef'));    // 输出 NaN
    console.log(parseFloat(undefined));   // 输出 NaN
    console.log(parseFloat(null));    // 输出 NaN
</script>

parseFloat()和parseInt()类似,区别是会保留下小数部分。



4. 使用算数运算符转化

通过案例展示:

<script>
    var number1 = '90';
    console.log(+number1);      // 取正数输出数字 90
    console.log(-number1);      // 取负数输出数字 -90
    console.log(number1 * 0);   // 输出数字0
    console.log(number1 - 0);   // 输出数字90
    console.log(number1 + 0);   // 注意number1 + 0 输出字符串900,不是数字
</script>

以上是我们介绍的4中变量类型转为数值类型的方法,你学会了吗?如果想学习更多前端技术,加QQ:435946716获取免费HTML+CSS+JavaScript视频教程+笔记



猜你喜欢:

margin塌陷与合并问题怎么解决?

如何使一个盒子水平垂直居中?

css3画三角形的方法

CSS中px、em、rem有什么区别和不同?

黑马程序员HTML&JS+前端高手班

分享到:
在线咨询 我要报名
和我们在线交谈!