Home > Web Front-end > JS Tutorial > Matching rules of JS equality comparison operators and judgment of if() conditions

Matching rules of JS equality comparison operators and judgment of if() conditions

青灯夜游
Release: 2022-10-26 19:10:58
forward
1721 people have browsed it

This article will introduce to you the matching rules of JavaScript comparison operators ("Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions" and "Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions"), as well as the judgment results of Matching rules of JS equality comparison operators and judgment of if() conditions conditions. I hope it will be helpful to you!

Matching rules of JS equality comparison operators and judgment of if() conditions

1. Conclusion first

We all know that in JS, try to use the congruence operator ("Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions"), because the equality operator does not perform type conversion during comparison, and is relatively faster. So when to use the equality operator ("Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions")? The following two situations are for reference:

  • is used to determine whether the attributes of the object exist

let obj = {};
if( obj.a Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions null ) {
    //这里相对于:obj.a Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions null || obj.a Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions undefined 的简写形式,jquery源码的推荐写法
}
Copy after login
  • Used to determine whether the parameters of the function exist

function fn( a, b ) {
    if( a Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions null ) {
        //这里也相当于 a Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions null || a Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions undefined 的简写
    }
}
Copy after login

Summary: Under normal circumstances, we try to use " Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions" to accurately judge, you can use "Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions" when judging whether object attributes and function parameters exist.

2. Result judgment reference table

Next let us summarize the results obtained by using these two operators for various data types, among which: Green means the result is true, white means the result is false

2.1 Congruence operator (“<span style="font-size: 18px;">Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions</span>") operation result

Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions

##2.2 Equality operator ("Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions<span style="font-size: 18px;"></span>”) Operation result

Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions

2.3 Matching rules of JS equality comparison operators and judgment of if() conditions condition judgment result

Matching rules of JS equality comparison operators and judgment of if() conditions

3. Logical description of specific judgment

(Reprinted from: Comparison operator implicit in js Type conversion)

3.1 Congruence operator (“Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions<span style="font-size: 18px;"></span>”)

Note: Strict matching, no type conversion, the data type and value must be completely consistent.

先判断类型,如果类型不是同一类型的话直接为false;

1 对于基本数据类型(值类型): Number,String,Boolean,Null和Undefined:两边的值要一致,才相等
      console.log(null Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions null)   // true
      console.log(undefined Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions undefined)  // true
   注意: NaN: 不会等于任何数,包括它自己
   console.log(NaN Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions NaN)  // false 

2 对于复杂数据类型(引用类型): Object,Array,Function等:两边的引用地址如果一致的话,是相等的
     arr1 = [1,2,3];
     arr2 = arr1;
     console.log(arr1 Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions arr2)   // true
Copy after login

3.2 Equality operator (“Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions<span style="font-size: 18px;"></span>”)

Non-strict matching: Type conversion will occur, but there are five situations with preconditions (The following code uses x Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions y as an example)

  • x and y are both null or undefined:

    Rules: No implicit type conversion, unconditionally returns true

  • console.log ( null Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions undefined );//true
    console.log ( null Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions null );//true
    console.log ( undefined Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions undefined );//true
    Copy after login
  • x Or y is NaN: NaN is not equal to any number

    Rules: No implicit type conversion, unconditionally return false

  • console.log ( NaN Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions NaN );//false
    Copy after login
  • Both x and y string, boolean, number

    Rules: There is implicit type conversion, which will convert data that is not number type into number

  • console.log ( 1 Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions true );//true    (1) 1 Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions Number(true)
    console.log ( 1 Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions "true" );//false   (1) 1 Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions Number(&#39;true&#39;)
    console.log ( 1 Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions ! "true" );//false  (1) 1 Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions !Boolean(&#39;true&#39;)  (2) 1 Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions !true  (3) 1 Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions false  (4)1 Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions Number(false)
    console.log ( 0 Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions ! "true" );//true
    console.log(true Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions &#39;true&#39;) // false
    Copy after login
  • x or y is complex Data type: The original value of the complex data type will be obtained first and then compared to the left

    The original value of the complex data type: first call the valueOf method, and then call the toString method
    valueOf: generally returns itself by default
    toString of the array : By default, the join method will be called to splice each element and the spliced ​​string will be returned.

  • 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 ] Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions "1,2,3" );//true  (1)[1,2,3].toString() Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions &#39;1,2,3&#39;  (2)&#39;1,2,3&#39; Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions &#39;1,2,3&#39;
    console.log({} Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions &#39;[object Object]&#39;);//true
    Copy after login
  • x and y are both complex data types:

    Rules only Compare the addresses and return true if the addresses are consistent, otherwise return false

  • var arr1 = [10,20,30];
    var arr2 = [10,20,30];
    var arr3 = arr1;//将arr1的地址拷贝给arr3
           
    console.log ( arr1 Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions arr2 );//虽然arr1与arr2中的数据是一样,但是它们两个不同的地址
    console.log ( arr3 Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions arr1 );//true  两者地址是一样
           
    console.log ( [] Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions [] );//false
    console.log ( {} Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions {} );//false
    Copy after login

3.3 Classic interview questions

注意:八种情况转boolean得到false: 0 -0 NaN undefined null &#39;&#39; false document.all()

console.log([] Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions 0); //true 
  // 分析:(1) [].valueOf().toString() Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions 0  (2) Number(&#39;&#39;) Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions 0  (3) false Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions 0  (4) 0 Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions 0
console.log(![] Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions 0); //true
  // 分析: 逻辑非优先级高于关系运算符 ![] = false (空数组转布尔值得到true)
        
console.log([] Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions []); //false
// [] 与右边逻辑非表达式结果比较
//(1) [] Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions !Boolean([])   (2) [] Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions !true  (3)[] Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions false  (4) [].toString() Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions false  (5)&#39;&#39; Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions false   (6)Number(&#39;0&#39;) Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions Number(false)
console.log([] Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions ![]); //true

onsole.log({} Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions {}); //false
// {} 与右边逻辑非表达式结果比较
//(1){} Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions !{} (2){} Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions !true  (3){} Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions false  (4){}.toString() Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions false  (5)&#39;[object Object]&#39; Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions false  (6)Number(&#39;[object Object]&#39;) Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions false
console.log({} Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions !{}); //false
Copy after login

3.4 Abnormal interview questions

 var  a = ???
  if(a Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions 1 && a Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions 2 && a Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions 3 ){
      console.log(1)
  }

//如何完善a,使其正确打印1

//答案
var a = {
  i : 0,    //声明一个属性i
    valueOf:function ( ) {
     return ++a.i;    //每调用一次,让对象a的i属性自增一次并且返回
    }
 }
 if (a Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions 1 && a Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions 2 && a Matching rules of JS equality comparison operators and judgment of Matching rules of JS equality comparison operators and judgment of if() conditions conditions 3){  //每一次运算时都会调用一次a的valueOf()方法
  console.log ( "1" );
 }
Copy after login
[Related recommendations:

javascript video tutorial, programming video

The above is the detailed content of Matching rules of JS equality comparison operators and judgment of if() conditions. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:csdn.net
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template