JavaScript study notes (2) process control

• Process control: sequence structure, branch structure, loop structure
• sequential flow control
• Branch flow control: if-else, ternary expression, switch statement
• Loop flow control: for, while, do-while
• break，continue

1. Process control

The code is controlled in a different order, called flow control

2. Sequential flow control

The program proceeds sequentially according to the code sequence

3. Branch process control

Execute different path codes according to different conditions (choose one from multiple codes)

<script>
        var age = prompt('请输入你的年龄：')
        if (age >= 18){
            alert('你已成年')
        }
        else if(age >= 14){
            alert('14岁以上未成年')
        }
        else{
            alert('儿童')
        }
</script>

3.1 Ternary expressions

A formula composed of ternary operators becomes a ternary expression

Conditional expression 1? expression1: expression2

var num = prompt('你的年龄')
var result = num > 18 ? '成年人' : '未成年'
alert(result)

3.2 Branch process control switch statement

The switch statement is also a multi-branch statement, and it can also implement multiple choices

        switch(表达式1){
            case  value1:
                执行语句1;
                break
            case value2
                执行语句2;
                break
            default:
                执行最后的语句
        }

        var score = prompt('输入您的成绩，查看等级ABCD')
        switch(score){
            case score >= 90:
                alert('等级为A')
            case score >= 70:
                alert('等级为B')
            case score >= 60:
                alert('等级为C')
            default:
                alert('等级为D')
        }

4. Cycle

Repeat some code

Breakpoint debugging, observe the running process of the program: F12->sources->breakpoint->refresh->F11 next step

Watch monitoring, you can watch variable changes

4.1 for loop

Example 1: Cumulative sum

    <script>
        //1~100累加
        var sum = 0
        for(var i = 1 ; i <= 100 ; i++){
            sum += i
        }
        console.log('1-100累加和为' + sum);
        //1~100偶数和奇数和
        var even = 0 , odd = 0
        for(var j = 1 ; j <= 100; j++){
            if(j % 2 == 0)
                even += j
            else if(j % 2 != 0)
                odd += j
        }
        console.log('1-100偶数累加和为' + even + '\n' + '1-100奇数累加和为' + odd);
    </script>

 Example 2, calculate according to the input value in the prompt box

        console.log('1-100偶数累加和为' + even + '\n' + '1-100奇数累加和为' + odd);

        var totalStu = prompt('请输入班级总人数：'),stuTotalScore = 0 , stuAvgScore = 0;
        for(i = 1 ; i <= totalStu ; i++){
            temp = prompt('第'+i+'个学生成绩')
            stuTotalScore += Number(temp);
        }
        stuAvgScore = stuTotalScore/totalStu
        alert('学生总成绩'+stuTotalScore+'平均成绩'+ stuAvgScore)

 Example 3, output ⭐⭐⭐⭐: output the same character by appending a string

        //追加字符串
        var star = ''
        for(i = 0 ; i <= 5 ; i++){
            star += '⭐'
        }
        console.log(star)
        //直接重复字符会折叠
        for(i = 0 ; i <= 5 ; i++){
            console.log('⭐')
        }

The output is:

 4.2 for loop nesting

Example: output inverted triangle star

        //倒三角星星
        str = ''
        for(i=1;i<=5;i++){
            for(j=5;j>=i;j--){
                str += '⭐'
            }
            str += '\n'
        }
        console.log('\n'+str)

output:

 4.3 while loop

The advantage is that more complex conditional judgments can be made

4.4 do while loop

Execution idea: first make the loop body in do, and then make a loop judgment, proceed if the conditions are satisfied, and exit if the conditions are not satisfied

The body of the do-while loop will be executed at least once

5. continue、break

continue Jump out of this cycle and continue to the next cycle

break exits the entire loop