JavaScript隐式转换和显示转换

1.1 为什么需要类型转换

JavaScript是弱数据类型: JavaScript也不知道变量到底属于那种数据类型，只有赋值了才清楚。

坑: 使用表单、prompt 获取过来的数据默认是字符串类型的，此时就不能直接简单的进行加法运算。

console.log('10000' + '2000') // 输出结果 100002000

此时需要转换变量的数据类型。

通俗来说，就是把一种数据类型的变量转换成我们需要的数据类型。

1.2 隐式转换

某些运算符被执行时，系统内部自动将数据类型进行转换，这种转换称为隐式转换。

规则：

    + 号两边只要有一个是字符串，都会把另外一个转成字符串

    除了 + 以外的算术运算符 比如 - * / 等都会把数据转成数字类型

缺点：

    转换类型不明确，靠经验才能总结

小技巧：

    + 号作为正号解析可以转换成数字型

    任何数据和字符串相加结果都是字符串

console.log(11 + 11)    // 22
console.log('11' + 11)  // 1111
console.log(11 - 11)    // 0
console.log('11' - 11)  // 0
console.log(1 * 1)      // 1
console.log('1' * 1)    // 1
console.log(typeof '123')   // string
console.log(typeof +'123')  // number
console.log(+'11' + 11) // 22

1.3 显式转换

编写程序时过度依靠系统内部的隐式转换是不严禁的，因为隐式转换规律并不清晰，大多是靠经验总结的规律。

为了避免因隐式转换带来的问题，通常根据逻辑需要对数据进行显示转换。

概念:

    自己写代码告诉系统该转成什么类型。

转换为数字型

    Number(数据)

        转成数字类型

        如果字符串内容里有非数字，转换失败时结果为 NaN (Not a Number) 即不是一个数字

        NaN 也是 number 类型的数据，代表非数字

    parselnt(数据)

        只保留整数

    parseFloat(数据)

        可以保留小数

let str = '123'
console.log(Number(str))        // 123
console.log(Number('kunkun'))   // NaN

console.log(parseInt('12px'))       // 12
console.log(parseInt('12.34px'))    // 12
console.log(parseInt('12.94px'))    // 12
console.log(parseInt('abc12.94px'))    // NaN

console.log(parseFloat('12px'))       // 12
console.log(parseFloat('12.34px'))    // 12.34
console.log(parseFloat('12.94px'))    // 12.94
console.log(parseFloat('abc12.94px'))    // NaN