隐形深坑-数据类型隐式转换

89 阅读3分钟

javascript数据类型

  • 基本类型:String、Number、Boolean、Null、Undefined、Symbol;
  • 引用数据类型:Object、Array、Function

数据类型之间的转换

显示转换:

转字符串:

String()可以将任何类型的值转换为字符串,包括 null 和 undefined

toString()适用于数字、布尔值等基本数据类型。null 和 undefined 没有 toString() 方法;

转数字:

Number()可以将字符串、布尔值等转换为数字;

parseInt(),parseFloat()将字符串转为数字,遇到非数字停止转换;

转布尔:

Boolean()可以将任何类型的值转换为布尔值。在 JavaScript 中,false0''nullundefined 和 NaN 转换为布尔值时为 false,其他值转换为布尔值时为 true

隐式转换

算术运算符(+、—、*、/、%)

加号运算符:如果一侧是字符串,会将另一侧隐式转为字符串;其他基础类型转数字 其他与算符:基础类型转数字

隐式转换时,字符串可以解析为有效数字时,则转为数字,否则为NAN; 布尔值,true 转换为 1,false 转换为 0; null 转为0; undefined 转为NAN;

逻辑运算符(与&&、或||、非!)

将操作数隐式转换为布尔值

0、+0、-0、空字符串、null、undefined、NaN都会转为false,其他值转为true

比较运算符(关系运算符)
  • 布尔值与其他类型比较:将布尔值转为数字,true转为1,false转为0;
  • 字符串与数字比较:字符串可以解析为数字则转为数字比较,不能就转为NaN比较,结果是false
  • 字符串与字符串比较:通过字符的 Unicode 编码值逐位比较
  • 数字与其他类型比较:其他类型转为数字再比较;
  • 对象与对象比较:比较的是对象的引用地址是否相同

对象类型转基本类型

引用类型转换为基本类型会先尝试调用对象的 valueOf() 方法,如果该方法返回的不是基本类型,再调用 toString() 方法;

[]转为字符串是空字符串"",转为数字是0 {}转为字符串是"[object Object]",转为数字是NaN

Symbol数据类型的比较

  • 每个 Symbol 是唯一的,即使它们有相同的描述,比较时也不会相等。
  • Symbol 与其他类型比较时,总是返回 false,无论是与 stringnumber 还是 boolean 比较。
  • 使用 Symbol.for() 可以创建共享的 Symbol,而 Symbol() 创建的 Symbol 每次都是唯一的,不会与其他值相等。

例题

[] == ![]
[] == ![] // true

解析如下:

  1. 首先执行右边 ![],[]是一个对象,逻辑运算符会隐式转为true,!取非运算后,结果为false;
  2. 经过第一步后,表达式转为 [] == false;布尔类型与其他类型比较,先将布尔类型转为数字,false转为0;;
  3. 经过第二步后,表达式转为 [] == 0;数字与其他类型比较,将其他类型转为数字,[]转为0;
  4. 最后,表达式转为0 == 0,所以结果为true;
if(a == 1 && a == 2 && a == 3){ console.log(a) // 4}
const a = {
  val: 1,
  valueOf: function () {
    return this.val++;
  },
};

if (a == 1 && a == 2 && a == 3) {
  console.log(a) //{ val: 4, valueOf: [Function: valueOf] }
}