前言:
作者简介:我是Morning,计算机的打工人,想要翻身做主人
个人主页: Morning的主页
系列专栏:前端面试备战 https://blog.csdn.net/m0_72154565/category_12458506.html?spm=1001.2014.3001.5482
如果小编的内容有欠缺或者有改进,请指正拙著。期待与大家的交流
如果感觉博主的文章还不错的话,点赞 + 关注 + 收藏
原先我以为类型转换并没有多少知识点,题什么的应该也是手拿把掐,但是在做过一道大厂笔试题后,就是此篇中的5关系运算符的例子。很有意思,大家可以好好看看
目录
1.转Boolean
2.对象转原始类型
3.四则运算符
4.比较运算符
5.关系运算符
首先要知道在JS中的类型转换只存在三种,转换成Boolean、数字、字符串
在条件判断时,undefined、null、0、-0、false、NaN、' ' 这7中数据类型都会转为false。
其余的所有值都转为true,包括对象(空数组、函数等等)
在对象转换原始类型时会调用内置函数toPrimitive(input, PreferredType)
- 参数input是要被转换的对象,
- 参数PreferredType期望返回的结果类型(可选,默认为number 弱指定,不会影响原本的结果)
如果转换的类型是number,ToPrimitive函数会执行以下步骤:
1. 如果input是原始值,直接返回这个值;
2. 否则,如果input是对象,调用input.valueOf(),如果结果是原始值,返回结果;
3. 否则,调用input.toString()。如果结果是原始值,返回结果;
4. 否则,抛出错误。
如果转换的类型是String,2和3会交换执行,即先执行toString()方法。
读起来真的很晦涩难懂,我就按照自己理解(在没有指定PreferredType的情况下我是不是就可以理解为,都是默认想要先转为number类型。)总结了这个toPrimitive算法逻辑:
- 如果是原始数据类型,就不需要转换了
- 调用x.valueOf(),如果转换为基础类型,就返回转换的值
- 调用x.toString(),如果转换为基础类型,就返回转换的值
- 没有返回原始数据类型,报错
而且可以重写Symbol.toPrimitive,该方法在转换原始类型时优先级最高
let a={
valueOf(){
return 0
},
toString(){
return '1'
},
[Symbol.toPrimitive](){
return 2
}
}
console.log(1+a);//1+2=3
- 运算中其中一方为字符串,那么另外一方也会转换成字符串
- 如果有一方不是字符串也不是数字,那么会将它转换为数字或者字符串
- 对于除了加法的运算符来说,只要其中一方是数字,另外一方就会变成数字
console.log(1+'1');//'11' 特点一
console.log(true+true);//2 特点二
console.log(4+[1,2,3]);//'41,2,3' 特点二 数组通过toString转换成字符串'1,2,3'
console.log([1,2,3]+4);//'1,2,34' 与上同理
console.log(1+'true');//'1true' 特点一
console.log(1+true);//2 特点二 true变成数字为1
console.log(1+undefined);//NaN 特点一 undefined为未定义,强转数值的话返回NaN,在+1还是NaN
console.log(1+null);//1 特点一 null会转为数字0
console.log('a'+ +'b');//'aNaN'
最后一例,+'b' 等于NaN,再结合特点一,所以结果为'aNaN'
- 如果是对象,就通过toPrimitive转换对象
- 如果有一边是字符串,将数据类型转换为数字
- 如果两边都是字符串,就通过字符串的unicode编码来比较(可以通过charCodeAt()来查看)
- 如果是数字型的字符串,直接比较unicode编码
- 如果是字母型的字符串,会从左到右进行比较
补充:unicode编码 A~Z :65~90 a~z:97~122
console.log('2'>10);//false Number('2')=2
console.log('2'>'10');//true '2'.charCodeAt()=50 '10'.charCodeAt()=49
console.log('abc'>'b');//false 'a'.charCodeAt()=97 'b'.charCodeAt()=98
console.log('abc'>'aad');//true 比较第二位97 = 97 比较第二位 98>97
//还有这些特殊的undefined和null 要记清楚
console.log(undefined==undefined);//true
console.log(null==null);//true
console.log(undefined==null);//true
console.log(NaN==NaN);//false
关系运算符:将其他数据类型转换成数字 如果是复杂数据类型,对其转换成基本类型,再使用Number
逻辑非:将其他数据类型用Boolean转换
console.log([]==0);//true Number([].valueOf().toString())=Number('')=0 0=0
console.log(![]==0);//true !Boolean([])=false Number(false)=0 0=0
console.log([]==![]);//true Number('')=0 Number(false)=0 0=0
console.log([]==[]);//false 两个不同的空间,不会相等
console.log({}=={});//false 两个不同的空间,不会相等
console.log({}==!{});//false
//{}.valueOf().toString()=[object Object] [object Object]肯定不等于false
注意:
[ ].valueOf().toString() =‘ ’
{ }.valueOf().toString()=[object Object]
valueOf()与toString()方法我决定在之后的作品中再进行解释,就不增加此篇的压力了