【深入浅出】js中的隐式转换

探索了一下隐式转换的问题

先要知道js那些值在判断中是错误

  1. 0是false,1是true
  2. false
  3. undefined
  4. null
  5. ""或者’’,就是空字符串
  6. NaN

那么在什么情况下会发生隐式转换呢?

一般常出现在==、+、-、>、<这些涉及到两个数据的比较or运算(还有其他的,麻烦评论告诉我哟,不吝赐教)

自认为隐形转换是指:开发者没有对数据进行强制转换类型,数据的类型却发生了转换

原始数据类型的隐式转换,例如:

console.log(""==0);//true -> Number("")==0 -> 0===0
console.log("0"==0);//true -> Number("0")==0 ->0===0
console.log(""=="0");//false ->类型相同执行===比较值
console.log(false=="0");//true -> Number(false)== Number("0") -> 0===0
console.log(0=="false");//false ->0==NaN
基本数据类型判断相等都是值于值
相比较的两个值如果值的类型相同就会进行===比较,但是两个值类型不相同,string会转成number布尔类型也会转换成number,最后会转成相同数据类型后进行===比较(这些本来是我通过表现猜测出来的,后来看了ECMA规范证实了)

console.log("3"+1);//31,类型是string
console.log("3"-1);//2,类型是number
console.log("3"-"1");//2,类型是number
在js中+也是值的连接符号,所以在两个值连接时,有一个值是string类型那么就是连接符。如果要进行加法运算要确保两个数值都是number类型
-*/都会把string类型转为number,都是作用在number类型上所以number为主,往好了想你不用特意转数据类型了。

对象数据类型的隐式转换,如:

let obja={name:"lisi"};
let objb={name:"lisi"};
console.log({}=="[object Object]");//true,面对不同类型,{}.toString转型后就是"[object Object]"根据原始类型的例子还是可以理解
console.log({}=={});//false 诶很纳闷,继续往下走
console.log(obja==objb);//false 值都一样啊
console.log(obja===objb);//false 也不行,继续试
console.log(obja.name==objb.name);//true 值与值是可以的
let a=obja;//接着实验呢
console.log(a==obja);//true 这样一下就明白了
ECMA规范也只说了有对象类型比较时,两边数据类型不相同会转型,默认情况下是先valueOf然后toString。并没有看到说两个属性相等的对象比较。
所以上面为什么a==obja是true呢,通过它的表现去想他们哪里相同,属性相同外还有其他的嘛???
对,调用的地址相同,内存地址相同。每一个对象都是new出来的,之后一直存在与内存中,当{}=={}时,它们所指向的应该是自己的内存地址。a就是从obja的内存地址调用的所以相同。
不知道对不对,但只有这个能说服自己了。。

如果不能说服你,就再来一个时间对象:
let timea=new Date(2019,1,1);
let timeb=new Date(2019,1,1);
console.log(timea==timeb);//false
let timec=timea;
console.log(timea==timec);//true 不知道还有什么理由可以解释这种表现
console.log(timea=="Fri Feb 01 2019 00:00:00 GMT+0800 (中国标准时间)");//true 这是timea.toString然后进行比较

再来看看数组的:
console.log([]==[]);//false
let arya=[1,2];
let aryb=[1,2];
let aryc=arya;
console.log(arya==aryb);//false
console.log(arya==aryc);//true 举了三个同样的例子只是为了更能说服自己
console.log([]==false);//true,隐形转换后相当于""==false -> 0===0
console.log([]==![]);//true,!可将变量转换成boolean类型,null、undefined、NaN以及空字符串('')取反都为true,其余都为false。!优先级是大于==的所以先!运算为false,相当于false==false,false=0 => 0==0
console.log([1]=="1");//true,"1"=="1" -> "1"==="1"
console.log([1]==1);//true,"1"==1 -> 1===1

复杂数据类型,使用==判断时,JavaScript会试图把两个不同类型的数值,转为相同类型然后进行===比较,> or < or <= or >=也是会把两个比较值转换成相同类型,博文写太长不好,就不举例子了。

下面这个例子,是我忘记改判断条件出现的隐式转换,也是我为什么要想深入了解隐式转换

let ary=[1,2,3];
			let num=$.inArray(1,ary);//查找第一个参数是否存在于指定数组里,没有返回-1,有返回他所在的下标
			if(num!=""){//
				console.log("进来了");
			}

这个判断从表面上来讲不可能等于空,就算找不到也会返回-1,也就是说num是有值的。
按理来讲是会输出"进来了",可是并没有,因为1的下标为0。隐式转换后是0===0,所以才有了上面那些试验。

说一下个人对JavaScript的看法
有挺多人说JavaScript不严谨,很糟糕,它的表现难以理解,要避开这些令人糟糕的东西。但是我觉得这相反是js最潇洒的地方,了解了它的特性,开发也会更为快捷,就比如:

<span>8</span>
<script>
let num=document.getElementsByTagName("span")[0].innerText;
num--;
console.log(num);
</script>

这是平常没注意到的一个操作,如果是其他语言是一定要转number或者说int类型才可以进行减法运算吧。js直接一个string带上个-就会自动转换为number类型,何乐而不为。了解了,也就可以避免出错了。既然每个人都不一样,语言也不用恪守成规吧。

发布了31 篇原创文章 · 获赞 45 · 访问量 5911

猜你喜欢

转载自blog.csdn.net/weixin_43623808/article/details/102588066