Experience this series of video tutorials

Click to watch: Bilibili

Operator 2

Boolean operators (logical operators)

The and operator &&

The and operator (&&) is often used to evaluate multiple expressions.

  • Operation rules:
    • If the Boolean of the first operator is zerotrue, returns the value of the second operator.
    • If the Boolean of the first operator is zerofalse, returns the value of the first operator directly, and does not evaluate the second operator.
't' && ' ' / / ""
't' && 'f' // "f"
't' && (1 + 2) / / 3
' ' && 'f' / / ""
' ' && ' ' / / ""
Copy the code

If the first operand is false, the following code will not be executed, called “short-circuiting”

/ / short circuit
var x = 1;
(1 - 1) && ( x += 1) / / 0
x / / 1
Copy the code

The and operator can be used more than once to return the first value false. Or return the value of the last one.

true && 'foo' && ' ' && 4 && 'foo' && true
/ /"

1 && 2 && 3
/ / 3
Copy the code

Or the operator | |

Or operator (| |) is also used for multiple expressions are evaluated.

  • Operation rules:
    • If the Boolean of the first operator is zerotrue, returns the value of the first operator and does not evaluate the second operator
    • If the Boolean of the first operator is zerofalse, returns the value of the second operator.
't' || ' ' // "t"
't' || 'f' // "t"
' ' || 'f' // "f"
' ' || ' ' / / ""
Copy the code

The short circuit rule also applies to this operator. If the first operand is true, the following code is not executed

var x = 1;
true || (x = 2) // true
x / / 1
Copy the code

The or operator can be used multiple times, returning the first value true. Or return the value of the last one.

false || 0 || ' ' || 4 || 'foo' || true
/ / 4

false || 0 || ' '
/ /"
Copy the code

Non-operator!

  • Non-operator:!
    • ! Boolean value => Take the reverse Boolean value
    • ! Non-boolean value => First convert to Boolean value and then invert
    • !!!!! => Reverse the <=> Boolean function twice
// Six values of false!!!!!false // false!!!!!undefined // false!!!!!null // false!!!!!0 // false!!!!!NaN // false!!!!!"" // false
Copy the code

Ternary operators? :

The ternary operator is defined by the question mark? And colon: formed to separate three expressions. If the first expression has a Boolean value of true, the second expression is returned, otherwise the third expression is returned.

't' ? 'hello' : 'world' // "hello"
0 ? 'hello' : 'world' // "world"
Copy the code

Comparison operators (relational operators)

The comparison operator is used to compare the sizes of two values and then returns a Boolean value indicating whether the specified condition is met.

JavaScript provides a total of eight comparison operators.

  • > greater than operator
  • < < operator
  • <= less than or equal to operator
  • >= greater than or equal to operator
  • == equality operator
  • === strict equality operator
  • ! = unequal operator
  • ! == strictly unequal operator

Size comparison

If at least one of the two operators is not a value of the primitive type of the string, it is converted to a numeric value and then compared.

9 > '6' // true
true > false // true
2 > true // true
Copy the code

The comparison with NaN is important here. Any size comparison with NaN, including NaN itself, returns false.

1 > NaN // false
1< =NaN // false
'1' > NaN // false
'1'< =NaN // false
NaN > NaN // false
NaN< =NaN // false
Copy the code

Equal to compare

The equality operator ==

Are the values equal

1= =1.0 // true
Copy the code

Values of non-numeric types are converted to numeric values for comparison.

1= ='1' // true
1= =true // true
'true'= =true // false
' '= =0 // true
' '= =false  // true
'1'= =true  // true
Copy the code

Undefined and null are false when compared with other types of values, and true when compared with each other.

false= =null // false
false= =undefined // false
0= =null // false
0= =undefined // false
undefined= =null // true
Copy the code

Unequal operator! = : See if it is equal, and then invert

Whether the congruent operator ===

Whether value and type are congruent

The values are the same, but the types are different

1= = ="1" // false
true= = ="true" // false
Copy the code

The value and type are the same, but the base is different

1= = =0x1 // true
Copy the code

Complex types (reference types) compare addresses

= = = {} {}// false[] [] = = =// false
(function () = = = {}function () {}) // false
Copy the code
var v1 = {};
var v2 = v1;
v1 === v2 // true
Copy the code

Note that NaN is not equal to any value (including itself)

NaN= = =NaN  // false
+0= = = -0 // true
undefined= = =undefined // true
null= = =null // true
Copy the code

Whole range! == : Check whether it is congruent first and then invert

1! = ='1' // true
65! = =0o101 // false
Copy the code

Operator priority

  • Parentheses :()
  • Unary operator:! ++ —
  • Arithmetic operators: * / % followed by + -(binary operator)
  • Comparison operators: > >= < <=
  • Equal operator: === ==! = =! =
  • Boolean operator: first && and | |
  • The assignment operator: =
  • Comma operator:,

The lower the priority, the later the calculation

associativity

  • Left associative: As opposed to enclosing the expression on the left in parentheses
  • Right concatenation: As opposed to enclosing the right expression in parentheses

Only the exponentiation and assignment operators are right-associative. When determining the order of execution, priority precedes associativity


console.log(2 ** 3 ** 2); / / 512

var x = 123
var y = 456
x = y = 3 + 36 / 3 * 2
console.log(x); / / 27
console.log(x); / / 27
Copy the code

practice

  1. Determine the output
var a = 68
console.log('10.00'< =0xa || '9.00'= =0o11 && 5 + 26 <= a++ - 76 / 2);
Copy the code
  1. Determine the output
var a = 68
console.log(5 + 26 <= ++a - 76 / 2 && 16 + 69 / 3 * 2 < 30 && 2 ** 3 ** 2 > 500);
Copy the code