您好,欢迎访问一九零五行业门户网

JavaScript中比较运算符隐式类型转换的介绍(附示例)

本篇文章给大家带来的内容是关于javascript中比较运算符隐式类型转换的介绍(附示例),有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。
相信大家在代码中经常看见 '==' 和 '===',但大家真的弄懂了比较运算符和其中的隐式转换嘛? 今天就重新认识下比较运算符。
全等运算符 ===
说明: 严格匹配,不会类型转换,必须要数据类型和值完全一致
先判断类型,如果类型不是同一类型的话直接为false;1 对于基本数据类型(值类型): number,string,boolean,null和undefined:两边的值要一致,才相等      console.log(null === null)   // true      console.log(undefined === undefined)  // true   注意: nan: 不会等于任何数,包括它自己   console.log(nan === nan)  // false 2 对于复杂数据类型(引用类型): object,array,function等:两边的引用地址如果一致的话,是相等的     arr1 = [1,2,3];     arr2 = arr1;     console.log(arr1 === arr2)   // true
相等运算符 ==
非严格匹配: 会类型转换,但是有前提条件一共有五种情况
(接下来的代码以 x == y 为示例)
x和y都是null或undefined:
规则: 没有隐式类型转换,无条件返回true
console.log ( null == undefined );//trueconsole.log ( null == null );//trueconsole.log ( undefined == undefined );//true
x或y是nan : nan与任何数字都不等
规则:没有隐式类型转换,无条件返回false
console.log ( nan == nan );//false
x和y都是string,boolean,number
规则:有隐式类型转换,会将不是number类型的数据转成number
console.log ( 1 == true );//true    (1) 1 == number(true)console.log ( 1 == true );//false   (1) 1 == number('true')console.log ( 1 == ! true );//false  (1) 1 == !boolean('true')  (2) 1 == !true  (3) 1 == false  (4)1 == number(false)console.log ( 0 == ! true );//trueconsole.log(true == 'true') // false
x或y是复杂数据类型 : 会先获取复杂数据类型的原始值之后再左比较
复杂数据类型的原始值: 先调用valueof方法,然后调用tostring方法
valueof:一般默认返回自身
数组的tostring:默认会调用join方法拼接每个元素并且返回拼接后的字符串
console.log ( [].tostring () );//空字符串console.log ( {}.tostring () );//[object object]注意:  空数组的tostring()方法会得到空字符串,      而空对象的tostring()方法会得到字符串[object object] (注意第一个小写o,第二个大写o哟)console.log ( [ 1, 2, 3 ].valueof().tostring());//‘1,2,3’console.log ( [ 1, 2, 3 ] == 1,2,3 );//true  (1)[1,2,3].tostring() == '1,2,3'  (2)'1,2,3' == '1,2,3'console.log({} == '[object object]');//true
x和y都是复杂数据类型 :
规则只比较地址,如果地址一致则返回true,否则返回false
var arr1 = [10,20,30];var arr2 = [10,20,30];var arr3 = arr1;//将arr1的地址拷贝给arr3       console.log ( arr1 == arr2 );//虽然arr1与arr2中的数据是一样,但是它们两个不同的地址console.log ( arr3 == arr1 );//true  两者地址是一样       console.log ( [] == [] );//falseconsole.log ( {} == {} );//false
经典面试题
注意:八种情况转boolean得到false: 0 -0 nan undefined null '' false document.all()console.log([] == 0); //true   // 分析:(1) [].valueof().tostring() == 0  (2) number('') == 0  (3) false == 0  (4) 0 == 0console.log(![] == 0); //true  // 分析: 逻辑非优先级高于关系运算符 ![] = false (空数组转布尔值得到true)        console.log([] == []); //false// [] 与右边逻辑非表达式结果比较//(1) [] == !boolean([])   (2) [] == !true  (3)[] == false  (4) [].tostring() == false  (5)'' == false   (6)number('0') == number(false)console.log([] == ![]); //trueonsole.log({} == {}); //false// {} 与右边逻辑非表达式结果比较//(1){} == !{} (2){} == !true  (3){} == false  (4){}.tostring() == false  (5)'[object object]' == false  (6)number('[object object]') == falseconsole.log({} == !{}); //false
变态面试题
var  a = ?  if(a == 1 && a == 2 && a == 3 ){      console.log(1)  }//如何完善a,使其正确打印1//答案var a = {  i : 0,    //声明一个属性i    valueof:function ( ) {     return ++a.i;    //每调用一次,让对象a的i属性自增一次并且返回    } } if (a == 1 && a == 2 && a == 3){  //每一次运算时都会调用一次a的valueof()方法  console.log ( 1 ); }
本篇文章到这里就已经全部结束了,更多其他精彩内容可以关注的javascript视频教程栏目!
以上就是javascript中比较运算符隐式类型转换的介绍(附示例)的详细内容。
其它类似信息

推荐信息