declaración de control de flujo de JavaScript (2)

Operador

Los operadores también se denominan operadores, que se utilizan para implementar asignaciones, comparaciones y realizar operaciones aritméticas.

operadores comunes de javascript

• Operador aritmético
• Operador de comparación
• Operadores logicos
• Operador de asignación
• Operadores de incremento y decremento

Operador aritmético

Se utiliza para realizar operaciones aritméticas en dos variables o valores.

<script>
    // 算数运算符包括加减乘除 取余等等
    console.log(1 + 1);
    console.log(2 - 1);
    console.log(1 * 6);
    console.log(6 / 3);
    console.log(6 % 3);

    // 在算数运算符中 浮点数的精度会产生细微的差距，不要拿两个浮点数相比较
    console.log(0.1 + 0.2);
    console.log(0.7 * 100);

    console.log(0.1 + 0.2 == 0.3)
</script>

Precauciones

• En js, dos números de punto flotante no se pueden comparar directamente
• En el orden de las operaciones en js, la multiplicación y la división se calculan primero, seguidas de la suma y la resta, y los paréntesis se calculan primero.

¿Cómo juzgar si un número puede ser divisible?

余数为0 说明这个数可以被整除

expresión

Una fórmula compuesta por identificadores de operadores numéricos se llama expresión

valor de retorno

La expresión finalmente nos devuelve un resultado, este resultado se llama valor de retorno

     var  num = 1 + 1 

上述代码中，这样的式子便叫做表达式，右边的公式计算完毕后有一个返回值，这个返回值赋值给左边的num

Operador unario

Los operadores unarios se dividen en tipo pre-tipo y post-posición, se utilizan principalmente para realizar las operaciones de incremento y decremento de variables y deben utilizarse en conjunto con variables.

Operador de preposición

Los operadores de tipo previo primero incrementan (disminuyen) y luego realizan operaciones

Operador de incremento previo: Incrementar primero, luego realizar operaciones

    <script>
        //前置型运算符 先自增（自减） 再进行运算
        var num = 10;
        ++num;
        console.log('num的值：', num) //11

        var num2 = ++num + 5;
        console.log('num2的值：', num2) //17
    </script>

Operador de pre-decremento: primero decrementar, luego realizar la operación

 <script>
        //前置自减运算符  
        var num = 20;
        --num;
        console.log('num的值：', num); //19

        var num2 = --num + 5;
        console.log('num2的值', num2); //23
    </script>

Operador de correos

Calcule primero el valor original y luego realice la operación de incremento o decremento

Operador de post-incremento: calcula primero el valor original y luego autoincremento xi

<script>
    //后置型自增运算符  先原值运算，再自加
    var num = 2;
    num++;
    console.log('num的值：', num); //3

    var num2 = num++ + 2;
    console.log('num2的值：', num2) //5

    var num3 = num++ + 1;
    console.log('num3的值：', num3) //5
</script>

Operador de decremento posterior: calcula primero el valor original y luego decrementa

<script>
    //后置自减运算符 进行原值计算 再自增
    var num = 6;
    num--;
    console.log('num的值:', num); //5

    var num2 = num-- + 1;
    console.log('num2的值为:', num2); //6

    var num3 = num-- + 1;
    console.log('num3的值：', num3); //5
</script>

Ejercicios integrales de operadores unarios

    <script>
        //第一题
        var a = 5;
        ++a;
        var b = ++a + 6;
        console.log('b的值:', b); //13


        //第二题
        var c = 10;
        c++;
        var d = c++ + 2;
        console.log('d的值:', d); //13


        // 第三题
        var e = 10;
        var f = e++ + ++e; //首先e++是10 然后自增1 于是++e变成12  所以值为22=10+12
        console.log('f的值:', f) //22
    </script>

Resumen de operadores unarios

• El operador unario es para simplificar la operación del código, principalmente para hacer que la variable realice la operación de autoincremento o auto decremento
• No hay diferencia cuando se usa solo
• Operador de incremento previo y operador de decremento previo: primero incremente (decremento) y luego calcule
• Operador de posincremento y operador de posincremento: primero opere en el valor original y luego aumente (disminuya)
• En el proceso de desarrollo real, se utilizan más operadores de correos

Operador de comparación

El operador de comparación (operador relacional) se utiliza principalmente para comparar dos operadores de datos, que devolverán un valor booleano como resultado de la operación de comparación.

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        //比较运算符 是用来进行两个数据的比较所使用的运算符 得出的结果为布尔值
        console.log(5 > 3) //true
        console.log(6 < 7) //true
        console.log(6 >= 5); //true 解析：因为6大于5  所以正确
        console.log(7 <= 8); //true 解析：因为7小于8 所以正确

        console.log(8 == '8') //true 解析：比较值而不比较数据类型
        console.log(8 != 9); //true
        console.log(8 !== 8) //false 
        console.log(8==="8") //false 解析：===要求数据类型和值都相等
    </script>
</head>

Operadores logicos

Los operadores lógicos son operadores que se utilizan para realizar operaciones booleanas, y el resultado también es un valor booleano. En el desarrollo real, se utiliza principalmente para juzgar múltiples condiciones

    <script >
        /* 
         *    逻辑运算符：是用来比较布尔值运算的运算符，其结果也是布尔值，开发中常用于多重条件的判断
         */
        console.log(5 > 3 && 3 < 5); //true 
        console.log(5 < 3 && 3 < 7); //false

        console.log(5 < 7 || 5 < 3); //true
        console.log(5 < 7 && 5 < 3) //false

        console.log(!true) //false
        console.log(!false) //true
    </script>

Resumen de operadores lógicos

• &&: Si ambos lados son verdaderos, el resultado será verdadero, y hay un falso en ambos lados, y el resultado también será falso.
• ||: Si ambos lados son falsos, el resultado será falso. Si hay un verdadero en ambos lados, el resultado también será verdadero;
• !:¡Negar! El resultado de verdadero es falso

Resumen de operadores lógicos

    <script>
        var num = 7;
        var str = "我爱你，亲爱的中国"
        console.log(num > 5 && num <= str.length) //true
        console.log(num < 5 && num <= str.length) //false

        console.log(!(str.length > 11)) //true
        console.log(!(num > 5 || str.length == num)) //fase
    </script>

Efecto de cortocircuito

Cuando hay varias expresiones (valores), si se puede determinar el valor de la expresión de la izquierda, no se realizará la operación de valor de la expresión de la derecha.

AND lógico de interrupción lógica

  <script>
        console.log(234 && 456); //456
        console.log(0 && 440) //0
        console.log('' && 254 && 546); //""
    </script>

OR lógico de interrupción lógica

Sintaxis: expresión 1 || expresión 2

• Si la expresión 1 es verdadera, devuelve el valor de la expresión 1
• Si la expresión 1 es falsa, devuelve el valor de la expresión 2 (se puede comparar con el Y lógico)

	<script>
        console.log(234 || 456); //234
        console.log(0 || 440) // 440
        console.log('' || 254 || 546); //254
    </script>

Operador de asignación

Operador que asigna datos a variables, denominado operador de asignación

  <script>
        var num = 20;
        num += 5;
        console.log(num); //25


        var num2 = 6;
        num2 *= 6;
        console.log(num2) //36

        var num4 = 20;
        num4 %= 4;
        console.log(num4) //0
    </script>

Precedencia del operador

• ¡El operador unario! Tiene una alta prioridad
• El AND lógico es más alto que el OR lógico

Ejercicios de secuencia de operadores (1)

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>练习1</title>
</head>

<body>

</body>
<script>
    console.log(4 >= 6 || '人' != '阿凡达' && !(12 * 2 == 144) && true)
        /* 
        解析：4 >= 6 || '人' != '阿凡达' && true && true
            false|| true && true && true
             true
        结果：true
            
         */

    var num = 10;
    console.log(5 == num / 2 && (2 + 2 * num).toString() === '22')
    /*

    * 解析：5==num/2&&(2+2*num).toString()==='22'
            5==num/2&&'22'==='22'
            5==5&&'22'==='22'
            true
     结果：true

     */
</script>

</html>

Ejercicios de secuencia de operadores (2)

    <script>
        var a = 3 > 5 && 2 < 7 && 3 == 4;
        console.log(a)
            /* 
            解析：a=false && true && false
            结果：a= false
             */



        var b = 3 <= 4 || 3 > 1 || 3 != 2
        console.log(b);
        /* 
            解析：b= 3 <= 4 || 3 > 1 || 3 != 2
                  b= 3 <= 4 || 3 > 1 || true
                  b= true || true || true
            结果：true
         */



        var c = 2 === "2"
        console.log(c);
        /* 
            解析：=== 用来比较数据类型和值是否相等  所以为false
         */


        var d = !c || b && a;
        console.log(d)
            /* 解析： d = !c ||b && a;
                      d = true||b && a;
                      d = true||true && false;
                      d= true
               结果为true

             */
    </script>

Declaración de control de flujo

En pocas palabras, significa que la secuencia del código de control se ejecuta en una secuencia estructural diferente.

Declaración de control de flujo: estructura de secuencia estructura de rama estructura de bucle

Estructura de secuencia de declaraciones de control de flujo

En javascript, el orden de ejecución del código se ejecuta secuencialmente de arriba a abajo, y este orden de ejecución se denomina estructura secuencial.

Estructura de la rama

Durante la ejecución del código de arriba a abajo, el código en diferentes rutas se ejecuta de acuerdo con diferentes condiciones para obtener diferentes resultados.

Se proporcionan dos estructuras de rama en javascript

• si declaración
• declaración de cambio

si declaración

gramática

if(条件表达式) {
	//执行的语句
	}

Nota: Si la expresión condicional es verdadera, la declaración se ejecutará; si la expresión condicional es falsa, la declaración no se ejecutará.

   <script>
        if(true) {
            console.log('条件表达式为真，则执行语句');
        }

        if(false) {
            console.log('条件表达式为假，则不执行语句');
        }
    </script>

si declaración de doble rama

gramática

 if(条件表达式) {
        //执行的语句
    }else {
        //执行的语句
    }

Precauciones

• Solo se puede ejecutar una instrucción en if y else
• Nada después {}

Caso de cibercafé de declaración de doble rama if

 要求：弹出一个输入框，用户输入自己的年龄，如果大于等于18岁，提示可以进入网吧，如果小于18，则提示用户不能进入网吧

La idea es la siguiente

• 1. Abra el cuadro de entrada y guarde el valor ingresado por el usuario como una variable
• 2. Use declaraciones if para emitir juicios y ejecute declaraciones diferentes según la edad del usuario.

    <script>
        var userName = Number(prompt("请输入年龄")); //Number（）:将字符串类型转换成Number类型
        if (userName >= 18) {
            alert("恭喜你，可以进入网吧")
        } else {
            alert("对不起，你不能进入网吧")
        }
    </script>

Sentencia de si declaración de doble rama año bisiesto y año normal

提示：能被4整除且不能整除100的为闰年（如2004年就是闰年，1901年不是闰年）或者能够被 400 整除的就是闰年

La idea es la siguiente

• 1. El usuario ingresa el año y guarda el valor ingresado por el usuario en forma de variable
• 2. Utilice las declaraciones if para juzgar los años bisiestos y los años normales de acuerdo con diferentes condiciones.

    <script>
        var userName = Number(prompt("请输入年份"));
        if (userName % 4 == 0 && userName % 100 != 0 || userName % 400 == 0) {
            alert("闰年")

        } else {
        
            alert('平年')


        }
    </script>

si declaración de varias ramas

Escenario: aplicable al juicio de múltiples condiciones

if(条件表达式1) {
    语句1；
}else if(条件表达式2) {
    语句2；
}else if(条件表达式3) {
    语句3；
    .....
}else {
    //以上代码不成立执行此处代码
}

Precauciones

• Según diferentes condiciones se ejecutan diferentes rutas de código y se obtiene el resultado final, es un proceso de elección de uno más de uno.
• La expresión condicional se agrega después de else if, y no hay expresión condicional después de else

Caso de logro de una declaración de varias ramas

    <script>
        var source = Number(prompt("请输入分数"))
        if (source >= 90) {
            alert('A')
        } else if (source >= 80) {
            alert('B')
        } else if (source >= 70) {
            alert('C')
        } else if (source >= 60) {
            alert("D")
        } else {
            alert('E')
        }
    </script>

Expresión ternaria

Las expresiones ternarias pueden hacer algunos juicios condicionales simples.Las fórmulas compuestas por operadores ternarios se denominan expresiones ternarias.

La sintaxis es la siguiente

¿Expresión condicional? Expresión 1: Expresión 2 Si la expresión condicional es verdadera, devuelve el valor de la expresión 1, y si la expresión condicional es falsa, devuelve el valor de la expresión 2

El complemento de la expresión ternaria 0

Se debe utilizar expresión ternaria

La idea es la siguiente

• 1. Aparece un cuadro de entrada y el usuario ingresa un número entre 0 y 59
• Agregue 0 al frente del número entre 2.0 ~ 9 y no haga nada para números mayores que 10
• 3. Utilice variables para aceptar un valor de retorno y una salida (procesada dentro del programa)

    <script>
        var userName = Number(prompt("请输入1~59之间的数字"))

        var result = userName <= 9 ? '0' + userName : userName;
        alert(result)
    </script>

declaración de cambio

La instrucción de cambio es una instrucción de múltiples ramas, y ejecutar diferentes declaraciones condicionales para obtener diferentes resultados es un proceso de elegir una.

Precauciones

• La instrucción if de múltiples ramas solo se usa para juzgar, y la instrucción de cambio es principalmente adecuada para la coincidencia de valores específicos
• interruptor: interruptor. caso: opción.
• Si el valor de la variable después de la instrucción de cambio es congruente con el valor después del caso, se ejecuta la instrucción después del caso.
• Si el valor no coincide, ejecute la instrucción que sigue a default
• La expresión que sigue a la instrucción switch es una variable.
• No olvide escribir break, de lo contrario siempre se ejecutará.

Caso de fruta de declaración de cambio

Requisito: El usuario ingresa la fruta que necesita y el precio de la fruta se muestra en la pantalla.

La idea es la siguiente

• Aparece un cuadro de entrada y el usuario necesita la fruta deseada.
• Guarde el valor ingresado por el usuario en forma de variable. Cuando el valor de la expresión condicional después del cambio coincida con el valor después del caso, aparecerá el precio de la fruta correspondiente.
• No olvide interrumpir, de lo contrario, el programa continuará ejecutándose.

    <script>
        var fruit = prompt('请输入需要的水果');
        switch (fruit) {
            case "苹果":
                alert("苹果3.5/斤");
                break;
            case "香蕉":
                alert("香蕉5.5/斤");
                break;
            case "榴莲":
                alert("榴莲10.5/斤");
                break;
            default:
                alert("找不到此水果")
        }
    </script>

La diferencia entre la declaración de cambio y la declaración if else if

• El interruptor se usa para la coincidencia de valores específicos, y la instrucción if else se usa para el juicio condicional
• Una vez que el conmutador determina el valor, se ejecuta directamente en el programa y la instrucción if debe juzgarse a su vez (la eficiencia de ejecución es ligeramente menor)
• En el caso de menos sucursales, usar if else es más eficiente