current position:Home>05. JavaScript operator

05. JavaScript operator

2022-04-29 12:42:12Hold the [email protected]

The journey of life , You can't use your eyes to capture every bit of life in other people's stories . With your own hands , Create your own dreams .
I am a vegetable chicken front-end lover , It's been a few months since I was on the front road , Finally, I decided to take a look at the front-end classic books , Here are my notes , I hope you can correct me .

1、 The operator

 Operators describe a set of symbols that can be used to manipulate data values , It mainly contains mathematical operators 、 Bit operators 、 Relational operator 、 Equality operator, etc .

1、 Unary operators

 Operators that operate on only one value , It's called a unary operator .
The operator explain
++a Add value 1 After the operation , That is to add 1 Then proceed to the next operation
a++ First perform the operation and then add the value 1 , That is, take part in the operation first , Then add 1
- -a Subtract... From the value 1 After the operation , That is to reduce 1 Then proceed to the next operation
a- - Calculate first and then subtract the value 1 , That is, take part in the operation first , Then subtract 1
a = +num take + Putting the number in front of a number has no effect , It means a positive number
a= - num Putting a minus sign in front of a number means that the number is a negative number

【 Unary operator rules 】:

  • For strings , If the character is a valid numeric format , Then change it to a numerical value . That is, from a string to a numeric value for operation .
  • For strings , If it is not a valid numeric format , Set the value of the variable to NaN, The variable changes from a string to a numeric value .
  • For boolean type , If it is false, Then it turns into 0 recompute .
  • For boolean type , If it is true, Then it turns into 1 recompute
  • For floating point , Add directly 1 Or minus 1 operation
  • If it's an object , Call their valueOf() Method to get an actionable value . Apply the above rule to the obtained value .
  • If it is NaN, Call toString() And apply the other rules again . Variable type changes from object to value .

【 The demo case 】:

let s1 = "2";
let s2 = "z";
let b = false;
let f = 1.1;
let o = {
    
 valueOf() {
    
 return -1;
 }
};
s1++; //  Value becomes value  3
s2++; //  Value change  NaN
b++; //  Value becomes value  1
f--; //  Value change  0.10000000000000009( Because floating point numbers are imprecise )
o--; //  Value change -2

2、 Bit operators

 Tips : When looking at this part , If you are not familiar with the way numerical values are stored in the computer , It is suggested to review the principles of computer composition first , Knowledge of numerical operation .

1、 Bitwise non

【 Representation form 】: ~( Wave sign )

【 effect 】: Returns the complement of a numeric value and converts it to a decimal number

【 case analysis 】:

let num1 = 25;    //  Binary system  00000000000000000000000000011001
let num2 = ~num1; //  Binary system  11111111111111111111111111100110
console.log(num2); // -26 

2、 Bitwise AND

【 Representation form 】: a & b

【 The essence 】: Bitwise and is to align each bit of two numbers , Then based on the rules in the truth table , Perform corresponding and operations for each bit .

【 Truth table 】:
 Insert picture description here
【 case analysis 】:

let result = 25 & 3;
console.log(result); // 1 
//  process analysis :
    //25 = 0000 0000 0000 0000 0000 0000 0001 1001
    // 3 = 0000 0000 0000 0000 0000 0000 0000 0011
    // --------------------------------------------
// Bitwise AND  = 0000 0000 0000 0000 0000 0000 0000 0001 
//  Convert bitwise and results to decimal  = 1 

3、 Press bit or

【 Representation form 】: a | b

【 The essence 】: Bitwise and is to align each bit of two numbers , Then based on the rules in the truth table , Perform corresponding or operations on each bit .

【 Truth table 】:
 Insert picture description here
【 case analysis 】:

let result = 25 | 3;
console.log(result); // 27 
//  process analysis 
// 25 = 0000 0000 0000 0000 0000 0000 0001 1001
// 3 = 0000 0000 0000 0000 0000 0000 0000 0011
//---------------------------------------------
//  or  = 0000 0000 0000 0000 0000 0000 0001 1011
//  It turns out to be decimal  :27

4、 Bitwise XOR

【 Representation form 】: a ^ b

【 Truth table 】:
 Insert picture description here
【 case analysis 】:

let result = 25 ^ 3;
console.log(result); // 26 
//  process analysis :
// 25 = 0000 0000 0000 0000 0000 0000 0001 1001
// 3 = 0000 0000 0000 0000 0000 0000 0000 0011
//---------------------------------------------
// Exclusive or  = 0000 0000 0000 0000 0000 0000 0001 1010 
//  The XOR result is converted to decimal  26

5、 Move left

【 Representation form 】: <<

【 The essence 】: Move the number of bits of binary number according to the specified number of bits , The sign bit remains unchanged during the movement .

【 case analysis 】:

let oldNum = 2; //  It's binary  10
let newNum = oldNum << 5;  //  It's binary  1000000, Decimal system  64

【 process analysis 】:
 Insert picture description here

6、 Move the sign right

【 Representation form 】: >>

【 The essence 】: Move all bits by the specified number of bits , Contains sign bits .

【 case analysis 】:

let oldValue = 64; //  It's binary  1000000
let newValue = oldValue >> 5; //  It's binary  10, Decimal system  2 

【 process analysis 】:
 Insert picture description here

7、 unsigned right shift

【 Representation form 】: >>>

【 The essence 】: All of the values will be 32 All bits move to the right . For positive numbers , Unsigned right shift has the same result as signed right shift . For negative numbers , Sometimes the difference can be very big .

3、 Boolean operator

1、 Logic is not

【 form 】:

**【 effect 】:** This operator always returns a Boolean value , No matter what data type is applied . Logical non operators first convert operands to Boolean values , Then reverse it .

【 The rules 】:

  • If the operands are objects , Then return to false.
  • If the operand is an empty string , Then return to true.
  • If the operand is a non empty string , Then return to false.
  • If the operand is numeric 0, Then return to true.
  • If the operand is not 0 The number ( Include Infinity), Then return to false.
  • If the operand is null, Then return to true.
  • If the operand is NaN, Then return to true.
  • If the operand is undefined, Then return to true.

【 Case presentation 】:

console.log(!false); // true
console.log(!"blue"); // false
console.log(!0); // true
console.log(!NaN); // true
console.log(!""); // true
console.log(!12345); // false

2、 Logic and

【 form 】: &&

【 Truth table 】:
 Insert picture description here
【 The rules 】:

  • If the first operand is an object , Then return the second operand .
  • If the second operand is an object , Only the first operand evaluates to true Will return the object .
  • If both operands are objects , Then return the second operand .
  • If there is an operand that is null, Then return to null.
  • If there is an operand that is NaN, Then return to NaN.
  • If there is an operand that is undefined, Then return to undefined.

3、 Logic or

【 form 】: ||

【 Truth table 】:
 Insert picture description here
【 The rules 】:

  • If the first operand is an object , Returns the first operand .
  • If the first operand evaluates to false, Then return the second operand .
  • If both operands are objects , Returns the first operand .
  • If both operands are null, Then return to null.
  • If both operands are NaN, Then return to NaN.
  • If both operands are undefined, Then return to undefined

4、 Multiplicative operators

1、 Multiplication operator

【 form 】: *

【 Precautions for use 】:

  • If the operands are numeric , Perform conventional multiplication .
  • If ECMAScript Cannot represent product , Then return to Infinity or -Infinity.
  • If any operand is NaN, Then return to NaN.
  • If it is Infinity multiply 0, Then return to NaN.
  • If it is Infinity Multiply by non 0 Finite value of , Returns... According to the sign of the second operand Infinity or -Infinity.
  • If it is Infinity multiply Infinity, Then return to Infinity.
  • If there are operands that are not numeric , Use... In the background first Number() Convert it to a numeric value , Then apply the above rules

2、 Division operator

【 form 】: /

【 Precautions for use 】:

  • If the operands are numeric , Then perform the conventional division operation .
  • If any operand is NaN, Then return to NaN.
  • If it is Infinity Divide Infinity, Then return to NaN.
  • If it is 0 Divide 0, Then return to NaN.
  • If it is right or wrong 0 The finite value of divided by 0, Returns... According to the sign of the first operand Infinity or -Infinity.
  • If it is Infinity Divide by any number , Returns... According to the sign of the second operand Infinity or -Infinity.
  • If there are operands that are not numeric , Use... In the background first Number() The function converts it to a numeric value , Then apply the above rules .

3、 Modulo operators

【 form 】: %

【 Precautions for use 】:

  • If the operand is numeric , Then perform the conventional division operation , Returns the remainder .
  • If the divisor is infinite , Divisor is a finite value , Then return to NaN.
  • If the divisor is finite , Divisor is 0, Then return to NaN.
  • If it is Infinity Divide Infinity, Then return to NaN.
  • If the divisor is finite , Divisor is infinite , Returns the divisor .
  • If the divisor is 0, Divisor is not 0, Then return to 0.
  • If there are operands that are not numeric , Use... In the background first Number() The function converts it to a numeric value , Then apply the above rules .

5、 Exponential operators

【 form 】: **

【 Case study 】:

console.log(Math.pow(3, 2); // 9
console.log(3 ** 2); // 9
console.log(Math.pow(16, 0.5); // 4
console.log(16** 0.5); // 4

6、 Additive operators

1、 Addition Operator

【 form 】: +

2、 Subtraction operator

【 form 】: -

7、 Relational operator

【 It mainly includes 】: Less than (<)、 Greater than (>)、 Less than or equal to (<=) And greater than or equal to (>=)

8、 equality operator

  • be equal to :==
  • It's not equal to :!=
  • Congruence :===
  • Incongruence :!==

9、 Conditional operators

【 grammar 】:

variable = boolean_expression ? true_value : false_value;

10、 Assignment operator

  • Multiply and assign (*=)
  • Assign value after division (/=)
  • Assign a value after taking the module (%=)
  • Add and assign (+=)
  • Value after subtraction (-=)
  • Left shift assignment (<<=)
  • Right shift after assignment (>>=)
  • Assignment after unsigned right shift (>>>=)

11、 Comma operator

//  The comma operator can be used to perform multiple operations in a statement , As shown below :
let num1 = 1, num2 = 2, num3 = 3;

The latter operators are relatively simple , It's basically the same as we usually use mathematics , There is no detailed explanation here . If you have any questions, you can consult the official documents by yourself .

copyright notice
author[Hold the [email protected]],Please bring the original link to reprint, thank you.
https://en.qdmana.com/2022/119/202204291113110084.html

Random recommended