JavaScript Foundation Day 02

1 - Operator (operator)

1.1 classification of operators

Operator, also known as operator, is a symbol used to realize the functions of assignment, comparison and arithmetic operation.

JavaScript Operators commonly used in are:
  • Arithmetic operator
  • Increment and decrement operators
  • Comparison operator
  • Logical operator
  • Assignment Operators

1.2 arithmetic operators

  • Overview of arithmetic operators

    A concept or two symbols used to perform arithmetic operations.

  • Precision of floating point numbers

    The highest precision of floating-point value is 17 decimal places, but its precision in arithmetic calculation is far less than that of integer.

    var result = 0.1 + 0.2;    // The result is not 0.3, but 0.300000000000000 4
    console.log(0.07 * 100);   // The result is not 7, but 7.000000000000001

    So: do not directly judge whether two floating-point numbers are equal!

  • Expressions and return values

    Expression: it is a combination of numbers, operators, variables and other meaningful permutations that can obtain numerical values

    Simple understanding: it is a formula composed of numbers, operators, variables, etc

    The final result of the expression will be returned to the developer, which is called the return value

1.3 increment and decrement operators

  • Overview of increment and decrement operators

    If you need to add or subtract 1 from a numeric variable repeatedly, you can use the increment (+) and decrement (–) operators.

      stay JavaScript Medium, increasing(++)And decreasing( -- )It can be placed either in front of the variable or behind the variable. When placed in front of a variable, we can call it a pre increment (decrement) operator, and when placed behind a variable, we can call it a post increment (decrement) operator.
      Note: increment and decrement operators must be used with variables. 
  • Increment operator

    • Pre increment operator

      ++Increment before num is self adding 1, which is similar to num = num + 1, but + + num is easier to write.

      Use the formula: add it first and then return the value

    var  num = 10;
    alert(++num + 10);   // 21
    • Post increment operator

      Num + + Post increment is to add 1 by itself, which is similar to num = num + 1, but num + + is easier to write.

      Use the formula: first return the original value, and then add it by yourself

    var  num = 10;
    alert(10 + num++);  // 20

1.4 comparison operators

  • Overview of comparison operators

    Concept: comparison operator (relational operator) is the operator used when comparing two data. After the comparison operation, a Boolean value (true / false) will be returned as the result of the comparison operation.

  • Equal sign comparison

    [the external chain picture transfer fails. The source station may have an anti-theft chain mechanism. It is recommended to save the picture and upload it directly (img-AC12xmyw-1606994322423)(images \ picture 3.png)]

    console.log(18 == '18');
    console.log(18 === '18'); 

1.5 logical operators

  • Overview of logical operators

    Concept: logical operator is an operator used for Boolean operation, and its return value is also a Boolean value. In the later development, it is often used to judge multiple conditions

  • Logic and&&

    True is returned only when both sides are true, otherwise false is returned

  • Logical or||

    True is returned only when both sides are true, otherwise false is returned

  • Logical non!

    Logical non (!) Also called negation, it is used to take a value opposite to the Boolean value. For example, the opposite value of true is false

    var isOk = !true;
    console.log(isOk);  // false
  • Short circuit operation (logic interrupt)

    Principle of short circuit operation: when there are multiple expressions (values) and the expression value on the left can determine the result, the operation of the expression value on the right will not be continued;

    • Logic and

      Syntax: expression 1 & & expression 2

      - If the value of the first expression is true, expression 2 is returned
      - If the value of the first expression is false, the expression 1 is returned
      console.log( 123 && 456 );        // 456
      console.log( 0 && 456 );          // 0
      console.log( 123 && 456&& 789 );  // 789
    • Logical or

      Syntax: expression 1 | expression 2

      - If the value of the first expression is true, the expression 1 is returned
      - If the value of the first expression is false, expression 2 is returned
      console.log( 123 || 456 );         //  123
      console.log( 0 ||  456 );          //  456
      console.log( 123 || 456 || 789 );  //  123

1.6 assignment operator

Concept: an operator used to assign data to a variable.
var age = 10;
age += 5;  // Equivalent to age = age + 5;
age -= 5;  // Equivalent to age = age - 5;
age *= 10; // Equivalent to age = age * 10;

1.7 operator priority

  • The logical non priority in unary operators is very high
  • Logical and have higher priority than logical or

2 - process control

2.1 process control concept

In the process of a program execution, the execution order of each code has a direct impact on the result of the program. Many times, we need to control the execution order of the code to realize the functions we want to complete.

Simple understanding:**Process control is to control the code to execute according to a certain structural order**

There are three main structures of process control:**Sequential structure**,**Branching structure**and**Cyclic structure**´╝îRepresents the order in which the three codes are executed.

2.2 sequence flow control

Sequential structure is the simplest and most basic process control in the program. It has no specific syntax structure. The program will execute in sequence according to the sequence of codes. Most codes in the program are executed in this way.

2.3 branch process control

  • Branching structure

    In the process of executing code from top to bottom, different path codes are executed according to different conditions (the process of executing one or more codes), so as to get different results
    JS language provides two branch structure statements: if statement and switch statement

  • if statement

    • Grammatical structure
    // If the condition is true, execute the code, otherwise do nothing
    if (Conditional expression) {
        // Code statement executed when the condition is satisfied

    A statement can be understood as a behavior. Loop statements and branch statements are typical statements. A program consists of many statements. Generally, it will be divided into statements one by one.

    • Execution process
  • if else statement (double branch statement)

    • Grammatical structure

      // If the condition holds, execute the code in if, otherwise execute the code in else
      if (Conditional expression) {
          // [if] the condition is true, the code to be executed
      } else {
          // [otherwise] executed code
    • Execution process

  • if else if statement (multi branch statement)

    • Grammatical structure

      // Suitable for checking multiple conditions.
      if (Conditional expression 1) {
          Statement 1;
      } else if (Conditional expression 2)  {
          Statement 2;
      } else if (Conditional expression 3)  {
         Statement 3;
      } else {
          // None of the above conditions holds. Execute the code here
    • Execution logic

2.4 ternary expression

  • Grammatical structure

    Expression 1 ? Expression 2 : Expression 3;
  • Implementation ideas

    • If expression 1 is true, the value of expression 2 is returned; if expression 1 is false, the value of expression 3 is returned
    • Simple understanding: it is similar to the abbreviation of if else

2.5 switch branch process control

  • Grammatical structure

    The switch statement is also a multi branch statement, which is used to execute different code based on different conditions. When you want to set a series of options for a specific value for a variable, you can use switch.

    switch( expression ){ 
        case value1:
            // Code to execute when expression equals value1
        case value2:
            // Code to execute when expression equals value2
            // Code to be executed when the expression is not equal to any value
    • Switch: switch conversion, case: small example option

    • The keyword switch can be followed by an expression or value in parentheses, usually a variable

    • Keyword case, followed by an expression or value of an option, followed by a colon

    • The value of the switch expression is compared with the value of the case in the structure

    • If there is a matching congruence (= = =), the code block associated with the case will be executed and stopped when a break is encountered, and the code execution of the whole switch statement will end

    • If the value of all case s does not match the value of the expression, execute the code in default

      Note: when executing the statement in the case, if there is no break, continue to execute the statement in the next case.

  • The difference between switch statement and if else statement

    • In general, their two statements can be replaced with each other
    • The switch... Case statement usually deals with the case where the value is determined by comparison, while the if... else... Statement is more flexible and is often used to judge the range (greater than or equal to a certain range)
    • The switch statement executes the conditional statement of the program directly after judging the condition, which is more efficient. if... else statements have several conditions, you have to judge how many times.
    • When there are few branches, the execution efficiency of if... else statement is higher than that of switch statement.
    • When there are many branches, the execution efficiency of switch statement is higher and the structure is clearer.

Tags: Javascript

Posted by Fritz on Wed, 04 May 2022 08:38:06 +0300