JS-数组之间相等操做符、布尔操做符、隐试转换

前言

问题场景:
在作一个后台返回数据是否有值的处理操做时，用if判断发现的一个有意思的问题
代码以下:
复制代码

后台返回数据即：res.data.list = []
    
    if(res.data.list == []){
        console.log('无数据返回')
    }
    else
    {
        console.log('有数据')
    }
    
    打印结果：有数据
复制代码

问题引伸

发现这个问题后就作了一些测试,测试代码以下:

console.log("Boolean([]):",Boolean([]),"Boolean(![]):",Boolean(![]))
    //Boolean([]): true Boolean(![]): false
    
    console.log("[]==[]:",[]==[],"![]==[]",![]==[])
    // []==[]: false ![]==[] true
    
    console.log("+[]==[]:",+[]==[],"!(+[])==[]",!(+[])==[])
    // +[]==[]: true !(+[])==[] false
    
    console.log("-[]==[]:",-[]==[],"!(-[])==[]",!(-[])==[])
    // -[]==[]: true !(-[])==[] false
    
    console.log("[]==true:",[]==true,"[]==false:",[]==false)
    // []==true: false []==false: true
    
    console.log("![]==true:",![]==true,"![]==false:",![]==false)
    // ![]==true: false ![]==false: true
    
复制代码

要点一

falsy（假值）、truthy（真值）

falsy（假值）: 在 JavaScript 中只有 7 个 falsy 值。

false	false 关键字

0	数值 zero	

0n	当 BigInt 做为布尔值使用时, 听从其做为数值的规则. 0n 是 falsy 值.

"", '', ``	这是一个空字符串 (字符串的长度为零). JavaScript 中的字符串可用双引号 "", 单引号 '', 或 模板字面量 `` 定义。

null	null - 缺乏值

undefined	undefined - 原始值

NaN	NaN - 非数值

复制代码

truthy（真值）:
在 JavaScript 中，truthy（真值）指的是在布尔值上下文中，转换后的值为真的值。
全部值都是真值，除非它们被定义为 假值（即除 false、0、""、null、undefined 和 NaN 之外皆为真值。

复制代码

要点二

首先：数组的原型中有(继承了)对象原型！---不知道这么说合不合适
复制代码

布尔操做符 --> ! 逻辑非

逻辑非操做符首先会将它的操做数转换为布尔值，而后再对其求反。
    若是操做数是一个对象，返回 false;
    若是操做数是一个空字符串，返回true；
    若是操做数是一个非空字符串，返回false；
    若是操做数是数值0，返回true；
    若是操做数是任意非0数值（包括Infinity），返回false；
    若是操做数是null，返回true；
    若是操做数是NaN，返回true；
    若是操做数是undefined，返回true；
列：
    alert(!false); //true
    alert(!"blue")；//false
    alert(!0); //true
    alert(!NaN); //true
    alert(!""); //true
    alert(!12345);//false
复制代码

相等操做符 --> ==

相等操做符（==），若是两个操做数相等，则返回true。
相等和不想等操做符都会先转换操做数（一般称为强制转型），而后再比较他们的相等性；
    
*.在转换不一样的数据类型时，相等和不想等操做符遵循如下规则：
    >若是一个操做数时布尔值，则在比较相等性以前先将其转换为数值---false转换为0，true转换为1；
    >若是一个操做数是字符申，另个操做数是数值， 在比较相等性以前先将字符串转换为数值；
    >若是一个撵做数是对象，另外一个操做数不是，
    则调用对象的valueOf()方法(若是没有获得基本类型-->[]，则调用对象的toString()方法-->"")，
    用获得的基本类型值按照前面的规则进行比较;
*.这两个操做符在进行比较时则要遵循下列规则:
    >与null和undef ined是相等的。
    >要比较相等性以前，不能将null和undefined转换成其余任何值。
    >若是有一个操做数是NaN,则相等操做符返回false,而不相等操做符返回true;
    重要提示:即便两个操做数都是NaN,相等操做符也返回false;
    由于按照规则，NaN不等于NaN。
    >若是两个操做数都是对象，则比较它们是否是同一个对象。
    若是两个操做数都指向同一个对象，则相等操做符返回true;不然，返回false.
复制代码

总结

let model = []
    console.log(model,model.toString())
    //[],""
    
    /**
      * []转换Boolean型时，回把[]看做一个对象，即任何对象转为Boolean型 ，返回 true
      * !在操做对象时返回false
      */
    console.log("Boolean([]):",Boolean([]),"Boolean(![]):",Boolean(![]))
    //Boolean([]): true Boolean(![]): false
    
    /**
      * []==[] 看做为两个对象之间的相等操做比较 --> 不是同一个对象--> false
      * ![]==[] 首先 左边 布尔操做符![]-->!true-->false
      * 右边分析--> []看做为对象 调用valueOf()没有获得基本类型，调用toString()方法--> "" --> 空字符串转换布尔型为 false
      * 结果 false == false --> 
      * 若是一个操做数时布尔值，则在比较相等性以前先将其转换为数值 --> 0 == 0 --> true
      */
    console.log("[]==[]:",[]==[],"![]==[]",![]==[])
    // []==[]: false ![]==[] true
    
    /**
      * 左边分析--> +[]看做为对象 调用toString()方法--> +"" --> 0
      * 右边 --> [] --> 调用valueOf()没有获得基本类型，调用toString()方法--> "" --> 空字符串转换布尔型为 false
      * 若是一个操做数时布尔值，则在比较相等性以前先将其转换为数值 --> 结果 0 == false
      * 若是一个操做数时布尔值，则在比较相等性以前先将其转换为数值 --> 0 == 0 --> true
      */
    console.log("+[]==[]:",+[]==[],"!(+[])==[]",!(+[])==[])
    // +[]==[]: true !(+[])==[] false
    
    /**
      * 左边分析--> -[]看做为对象 调用toString()方法--> -"" --> -0
      * 右边 --> [] --> 调用valueOf()没有获得基本类型，调用toString()方法--> "" --> 空字符串转换布尔型为 false
      * 若是一个操做数时布尔值，则在比较相等性以前先将其转换为数值 --> 结果 0 == false --> -0 == 0 --> true
      */
    console.log("-[]==[]:",-[]==[],"!(-[])==[]",!(-[])==[])
    // -[]==[]: true !(-[])==[] false
    
     /**
      * 左边分析--> []看做为对象 调用valueOf()没有获得基本类型，调用toString()方法--> ""
      * 即 "" == true
      * 若是一个操做数时布尔值，则在比较相等性以前先将其转换为数值 --> 0 == 1 --> false
      * "" == false --> 0 == 0 --> true
      */
    console.log("[]==true:",[]==true,"[]==false:",[]==false)
    // []==true: false []==false: true
    
    /**
      * ![] 布尔操做符![]-->!true-->false
      * 结果 false == true --> 0 == 1 --> false
      * 结果 false == false --> 0 == 0 --> true
      */
    console.log("![]==true:",![]==true,"![]==false:",![]==false)
    // ![]==true: false ![]==false: true

复制代码

结语

实际开发中要避免上述的隐试转换问题。
更有利于开发中代码的可读性。
可是又是一些比较基础的问题，面试可能会被问到。复制代码