JavaScript 将数字字符串(String)转换成数值类型的数字(Number)

JavaScript 中将字符串转换成数字有 Number()、parseInt()、parseFloat()、* ( / )  这几个方法，都可以将数字格式的字符串转换成数字。

1、Number()    --    强制数字转化的方法

使用强制类型转换可以访问特定的值，即让它是另一种类型的数据。

ECMAScript 中可用的 3 种强制类型转换： Boolean( value )；String( value )；Number( value )。

<script>
    var str1 = 'hxh';   // 字母 字符串
    var str2 = '112233';   // 整数 字符串
    var str3 = '1122.33';   // 浮点数 字符串
    var str4 = 'hxh666';     // 字母 + 整数 字符串
    var str5 = 'hxh66.6';     // 字母 + 浮点数 字符串
    var str6 = '666hxh';     // 整数 + 字母 字符串
    var str7 = '6.66hxh';     // 浮点数 + 字母 字符串
    var str8 = 'hxh~~##**23333';    // 字母 + 符号 + 整数 字符串
    var str9 = 'hxh~~##**233.33';    // 字母 + 符号 + 浮点数 字符串
    var str10 = '23333hxh~~##**';    // 整数 + 字母 + 符号 字符串
    var str11 = '23.333hxh~~##**';    // 浮点数 + 字母 + 符号 字符串
    var boolOne = false;   // 布尔型 false
    var boolTwo = true;    // 布尔型 true
    var arr1 = [];   // var arr = new Array(); 创建一个数组
    var obj1 = {};   // var obj = new Object(); 创建一个对象
    var arr2 = [11,22,99];
    var arr3 = [11.45,22.72,99.36];
    var obj2 = {age:20,sex:'男'};
    var obj3 = {height:174.5,sex:'男'};
    
    console.log( Number(str1) );         // NaN
    console.log( Number(str2) );         // 112233
    console.log( Number(str3) );         // 1122.33
    console.log( Number(str4) );         // NaN
    console.log( Number(str5) );         // NaN
    console.log( Number(str6) );         // NaN
    console.log( Number(str7) );         // NaN
    console.log( Number(str8) );         // NaN
    console.log( Number(str9) );         // NaN
    console.log( Number(str10) );        // NaN
    console.log( Number(str11) );        // NaN
    console.log( Number(boolOne) );      // 0
    console.log( Number(boolTwo) );      // 1
    console.log( Number(null) );         // 0
    console.log( Number(undefined) );    // NaN
    console.log( Number(arr1) );         // 0
    console.log( Number(obj1) );         // NaN
    console.log( Number(arr2) );         // NaN
    console.log( Number(arr3) );         // NaN
    console.log( Number(obj2) );         // NaN
    console.log( Number(obj3) );         // NaN
</script>

Number()是强制转换，可以用于任何数据类型，能将纯数字字符串转换成数字，同时也能用于布尔型( boolean )和空值( null )，以及空数组( [ ] )，

但是如果用于错误格式的数字（不能转换为一个数字，如字母字符串、混合字符串、非空数组、对象）则返回 NaN（非数字值）。

2、parseInt() 和 parseFloat()    --    JavaScript自带的数字转化方法 

<script>
    console.log( parseInt('hxh') );                          // NaN
    console.log( parseInt('112233') );                       // 112233
    console.log( parseInt('1122.33') );                      // 1122
    console.log( parseInt('hxh666') );                       // NaN
    console.log( parseInt('hxh66.6') );                      // NaN
    console.log( parseInt('666hxh') );                       // 666
    console.log( parseInt('6.66hxh') );                      // 6
    console.log( parseInt('hxh~~##**23333') );               // NaN
    console.log( parseInt('hxh~~##**233.33') );              // NaN
    console.log( parseInt('23333hxh~~##**') );               // 23333
    console.log( parseInt('23.333hxh~~##**') );              // 23
    console.log( parseInt(false) );                          // NaN
    console.log( parseInt(true) );                           // NaN
    console.log( parseInt(null) );                           // NaN
    console.log( parseInt(undefined) );                      // NaN
    console.log( parseInt([]) );                             // NaN
    console.log( parseInt({}) );                             // NaN
    console.log( parseInt([11,22,99]) );                     // 11
    console.log( parseInt([11.45,22.72,99.36]) );            // 11
    console.log( parseInt(['11.45','22.72','99.36']) );      // 11 
    console.log( parseInt(['aa11.1','bb22.2','cc33.3']) );   // NaN
    console.log( parseInt(['11.1aa','22.2bb','33.3cc']) );   // 11
    console.log( parseInt({age:20,sex:'男'}) );              // NaN
    console.log( parseInt({height:174.5,sex:'男'}) );        // NaN
</script>

可以看出，parseInt() 用于字符串和非空数组，会取出其中整数部分 ( 数组的话是取第 1 个元素来处理 ) ，返回一个新的整数。

如果第一个字符就是非数字，则返回NaN。如果是有带有小数的，小数部分会被去除。

<script>    
    console.log( parseFloat('hxh') );                          // NaN
    console.log( parseFloat('112233') );                       // 112233
    console.log( parseFloat('1122.33') );                      // 1122.33
    console.log( parseFloat('hxh666') );                       // NaN
    console.log( parseFloat('hxh66.6') );                      // NaN
    console.log( parseFloat('666hxh') );                       // 666
    console.log( parseFloat('6.66hxh') );                      // 6.66
    console.log( parseFloat('hxh~~##**23333') );               // NaN
    console.log( parseFloat('hxh~~##**233.33') );              // NaN
    console.log( parseFloat('23333hxh~~##**') );               // 23333
    console.log( parseFloat('23.333hxh~~##**') );              // 23.333
    console.log( parseFloat(false) );                          // NaN
    console.log( parseFloat(true) );                           // NaN
    console.log( parseFloat(null) );                           // NaN
    console.log( parseFloat(undefined) );                      // NaN
    console.log( parseFloat([]) );                             // NaN
    console.log( parseFloat({}) );                             // NaN
    console.log( parseFloat([11,22,99]) );                     // 11
    console.log( parseFloat([11.45,22.72,99.36]) );            // 11.45
    console.log( parseFloat(['11.45','22.72','99.36']) );      // 11.45
    console.log( parseFloat(['aa11.1','bb22.2','cc33.3']) );   // NaN
    console.log( parseFloat(['11.1aa','22.2bb','33.3cc']) );   // 11.1
    console.log( parseFloat({age:20,sex:'男'}) );              // NaN
    console.log( parseFloat({height:174.5,sex:'男'}) );        // NaN
</script>

可以看出，parseFloat() 和 parseInt() 用法相同，parseInt() 和 parseFloat() 会对第一个无效字符前的数值进行类型转换，如果是有带有小数的，小数部分会被保留。

3、 * 或者 /    --    弱转化的方法