JavaScript - 数据类型转换的核心方法

JavaScript中最常见的就是把数据类型转换为number， string， Boolean这三类，其他情况相对很少见。

• 隐式转换：浏览器操作转换的，不需要用户操作的转换方式。
• 显式转换：需要开发者手动通过特定方法进行转换的方式。

转换为Number

1. Number

• 特定需要转换为Number的(手动转换)
• 语法：Number([val]) :只要出现非有效数字字符，结果都是NaN 。
• 一般用于浏览器的隐式转换中：
  • isNaN([val])
  • 数学运算：+ 、-、*、/ 、%（特殊情况：+在出现字符串的情况下不是数学运算，而是字符串拼接）
  • 在 == 比较的时候，有些值需要转换为数字再进行比较
  • …
• 规则：
  • 字符串转为数字：空字符串=>0, 如果出现任何非有效字符串 => NaN。
  • 布尔值转为数字：false=> 0; rtrue =>1 。
  • null => 0; undefined => NaN。
  • Symbol转为数字会报错：Uncaught TypeError: Cannot convert a Symbol value to a number。
  • bigInt 转为数字，去除"n"（超出安全数字，会按照科学计数法处理）。
  • 对象变为数字
    • 先调用对象的 Symbol.toPrimitive 方法， 如果方法不存在；
    • 再调用 valueOf获取原始值，如果获取的不是原始值；
    • 再调用对象的 toString 把其变为字符串；
    • 最后再把字符串基于 Number 方法转换为数字。
    • 案例及分析步骤
    • 特殊情况 time

parseInt/parseFloat([val])

• 机制：从字符串左侧第一个字符，开始查找有效字符，遇到非有效数字字符停止查找，不论后面是否还有数字字符，都不再找了，把找到的有效数字字符转为数字，如果一个都没有找到，结果就是NaN(parseFloat比他多识别一个小数点)。
• parseInt语法：parseInt([val],[radix])
  • 在parseInt本身处理规则的基础上，还可以设置[radix]进制：在[val] 字符串中，从左到右查找符合 [radix]进制的内容（遇到一个不符合规则的结束查找），把找到的内容当作[radix]进制值最后转换为10进
    • 把其他进制值转为10进制 按权展开求和
    • [radix] 不设置或者设置为0，则默认值是10；“0x”开头是16进制；0开头默认是8进制。
    • [radix]范围是 2~36 ,不在范围内，最后处理结果都是NaN。
• parseFloa 语法 ：parseFloat([val])
• 一般用于手动转换。
• 规则：
  • [val] 必须是一个字符串，如果不是字符串则先转为字符串；
  • 然后从字符串串左侧第一个字符开始找，把找到的有效数字字符最后转为一个数字[一个都没有找到返回NaN];
  • 遇到一个非有效字符，不论后面是否还有有效字符，都不在查找了；parseFloat可以多识别一个小数点。

💥思考题：

let arr = [27.7, 0, '0013', '14px',123 ];
arr = arr.map(parseInt);
/*
arr.map(function(item, index){
	parseInt(27.7, 0);=>27
	parseInt(0,1);=>NaN
	parseInt('0013', 2);=>1
	parseInt('14px', 3);=>1
	parseInt(123, 4); => 1*4^2+2*4^1+3*4^0 => 16+8+3=> 27	
})
return [27,NaN,1,1,27];
*/

2、转换为字符串

toString

• 语法：[value].toString() 常用于显示。

String

• 语法：String([value]) 常用于隐式转换。
• 常见的隐式转换为字符串的情况：
  • “+”：除了数学运算，也有字符串拼接的意思。
    • +[value] 一定是把value 转换为数字。
    • 两边有一边是字符串，则是字符串拼接。
    • 两边有一边是对象，可能会是字符串拼接，因为其要把对象转为数字，转换过程中遇到转换为字符串，则直接变为字符串拼接；如果遇不到还是数学运算。
• 把对象转为数字，需要先toString()转为字符串，再去转换为数字。
• parseInt([val]) 如果[val] 不是字符串也要先转换为字符串。
• 基于alert / confirm / prompt / document.write…这些方式输出的，都是把内容转换为字符串然后在输出的。
• …
  

String VS toString

• Object.toString() 直接调取所属类原型上的toString方法进行处理。
• String（obj）首先调取对象 [Symbol.toPrimitive] 这个属性
  • 存在则对象 [Symbol.toPrimitive]('string');
  • 不存在，则继续调用 对象.valueOf(), 如果获取的是原始值则结束即可；如果不是，才会调用toString方法进行处理 。
• 标准对象调用 toString 是 Object.prototype.toString,不是转换字符串，而是检测数据类型的，返回的结果是"[object Object]"。

i++/++i / i += 1 / i = i + 1

• i++/++i ：肯定是数学运算
  • i++：先参与运算 ，再自身 +1。
  • ++i ：先自身 +1 ，再参与运算。
• i += 1 / i = i + 1：有字符串拼接的情况

3、转换为布尔

1. 基于以下方式可以把其他数据类型转换为布尔
   • ！：转换为布尔值后取反
   • ！！：转换为布尔类型
   • 条件判断
   • Boolean([val])
2. 隐式转换
   • 在循环或者条件判断中，条件处理的结果就是布尔类型
   • …
3. 规则：只有“ 0 、NaN、空字符串、null ，undefined”五个值会变为布尔类型的FALSE，其余都是TRUE
4. 在 == 比较的过程中，需要先转换为相同的数据类型数据，然后再进行比较。
   • 类型一样的几个特点
     {}=={}; => false 、 [] ==[] ;//=> false、NaN == NaN; //=> false 对象比较的是堆内存的地址。
   • 类型不一样的转换规则
   1. null == undefined ; //=>true,但是换成 ===结果是false（因为类型不一致），剩下null和undefined和其他任何类型值都不相等。
   2. 字符串 == 对象，要把对象转换为字符串。
   3. 剩下如果 ==两边数据类型不一致，都是需要转换为数字在进行比较。
      
      思考题

var a = ?;
if( a==1 && a==2 && a==3){
	console.log("OK");
}