前端八股总结JS分支-类型转换

总结一下JS的类型转换

参考【面试篇】寒冬求职季之你必须要懂的原生JS(中) · Issue #28 · YvetteLau/Blog（是真寒冬🥶🥶🥶🥶🥶🥶🥶🥶🥶🥶🥶寒死人了）

Typora字一多就卡，只能抽出来单独写了🥲JS知识点好多，背不完，根本背不完

一、强制类型转换

（1）Number()

将任意类型的参数转换为数值类型

• 布尔值：转化为0或1
• 数字：返回自身
• null：返回0
• undefined：返回NaN
• 字符串：
  • 如果只包含数字（可十六进制，可正负号），转化为十进制
  • 如果包含有效的浮点形式，转化为浮点数值
  • 如果是空字符串，转化为0
  • 如果不是以上类型，转化为NaN
• Symbol：抛出错误（Symbol唯一且不可变）
• 如果是对象，调用对象的valueof方法，再根据前面规则转换；如果转换的结果是NaN，调用对象的toString方法再依次按照前面的规则转换返回的字符串值

（2）parseInt(param,radix)

用于将字符串转化为整数。

• param：要解析的字符串
  • 会忽略掉字符串开始的空格
  • 从第一个有效字符开始解析，直到无法解析时停止（‘123abc’->123）
  • 如果不是字符串会被自动转化为字符串
• radix：进制基数
  • 2-36之间的整数，表示响应进制数
  • 如果未指定，会根据param的前缀识别，0x开头解析为十六进制，0开头会被解析为八进制或者十进制

（3）toString()

let obj = {a:1};
let sym = Symbol(100);
let date = new Date();
let fn = function() {console.log('稳住，我们能赢！')}
let str = 'hello world';
console.log([].toString()); // ''
console.log([1, 2, 3, undefined, 5, 6].toString());//1,2,3,,5,6
console.log(obj.toString()); // [object Object]
console.log(date.toString()); // Sun Apr 21 2019 16:11:39 GMT+0800 (CST)
console.log(fn.toString());// function () {console.log('稳住，我们能赢！')}
console.log(str.toString());// 'hello world'
console.log(sym.toString());// Symbol(100)
console.log(undefined.toString());// 抛错
console.log(null.toString());// 抛错

（4）String()

和上面一致，只是遇到null和undefined会转换成‘null’和‘undefined’，不会报错

（5）Boolean()

假值：null，0，undefined，NaN，false，“”转化为false，其他都是true

二、隐式转换

（1）&& || ! if/while条件判断

需要将数据转为Boolean类型，同Boolean()

（2）+，-，*，/

1、+

如果操作数是对象、数值或者布尔值，使用toString转换规则

console.log({}+10); //[object Object]10
console.log([1, 2, 3, undefined, 5, 6] + 10);//1,2,3,,5,610
console.log(undefined+10+"s");//NaNs
console.log(undefined+'s'+10);//undefineds10
console.log(String(undefined)+10);//undefined10

2、-、*、/ 操作符

针对的是运算，如果操作值之一不是数值，则被隐式调用Number()函数进行转换。如果其中有一个转换为NaN，结果为NaN.

（3）<=，>=，<，>

• 若两个操作值都是数值，进行数值比较
• 如果都是字符串，比较字符串对应的字符编码值
• 如果有一方是Symbol，报错
• 除上述情况都进行Number()强制转换再比较

（4）==

• 类型相同不需要进行类型转换
• 如果有一个操作值是null或者undefined，另一个也许必须是null/undefined才是true
• 如果其中一个是Symbol，返回false
• 如果是string/boolean类型，就转化为number再比较
• 如果一个是Object，就调用Object的valueOf或者toString方法来获取原始值再比较

（5）下列代码在什么情况下打印出1

if(a == 1 && a == 2 && a == 3) {
    console.log(1);
}

JavaScript 在遇到 == 操作符时，会尝试将操作数转换为相同类型。如果一方是对象，则会调用该对象的 valueOf 或 toString 方法以获取一个原始值。以下方法利用这一机制，每次返回不同的值来满足 == 的比较条件。

1、valueof

定义一个对象，并重写它的valueof方法，使得每次转换a为原始值时返回不同的值

const a={
   value: 1;
   valueOf(){
      return this.value++;
   }
};

2、toString

const a = {
  value: 1,
  toString() {
    return this.value++;
  }
};

JavaScript 在遇到 == 操作符时，会尝试将操作数转换为相同类型。如果一方是对象，则会调用该对象的 valueOf 或 toString 方法以获取一个原始值。以上方法利用这一机制，每次返回不同的值来满足 == 的比较条件。