Home > Article > Web Front-end > Conditional branches that must be learned every day in javascript_javascript skills
Hello everyone, let’s continue today. We have already briefly talked about operators. Today’s task is mainly to explain logical conditional branches and loops.
Let's simulate a logic block first. Let's use the ticket buying that we often come into contact with. The price of the ticket is different for different people, but we all perform the same behavior of buying tickets. We will You can write the ticket purchase as a function BuyTicket
//代码 function BuyTicket(){ console.log("请付款200元"); }
Everyone has seen that this function body is actually flawed. When each of us goes to buy a ticket, we execute this function. If we are soldiers or students, this function does not apply. Their discounts There is no way to use it. We can only write one more function to solve such a problem. Then, our javascript language has provided us with branch statements, so we can easily solve such problems. We can modify the function Let’s take a look at the next modified code
function BuyTicket(identity){ if(identity == "学生"){ console.log("请付款100元"); } if(identity == "军人"){ console.log("请付款150元"); } if(identity == "普通人"){ console.log("请付款200元"); } } //模拟3种人去买票 BuyTicket("学生"); BuyTicket("军人"); BuyTicket("普通人");
Is using it this way more scientific than the previous way of writing? I will slowly upgrade it later, and gradually everyone will understand the cuteness of the program.
Through the above example, we can easily see that such a function can solve the branch problem. Let’s now explain the if branch syntax
if(条件){ //执行语句 }
The conditions are what we mentioned earlier, non-empty objects, non-undefined objects, Boolean values true, non-0 numbers, all strings. In our function body, we use the == comparison operator to operate and get a Boolean value. To make judgments, this is also a method we often use. We can also use other values as conditions. Here is another picture for everyone to understand
A: The conditions are all established, so the words "executed" are printed; B: the conditions are not the qualified value of the if condition, so they are not executed. Note: Here we are all using clear values. Sometimes we will use the return value after the operation, just like the == operation used in the previous BuyTicket function. If the return value is true, it will be executed. If the return value is If false, it will definitely not be executed. Every time we execute BuyTicket, the value passed in can only meet one condition.
Next, let’s learn the complete if branch
//第一种,两个分支 if(条件){ //执行 }else{ //执行 }
Just go to the picture and you will understand immediately
A: The previous code is executed; the condition at B is not qualified, so the statement in the else block is executed. It's very simple and doesn't require much explanation.
In the case of two branches, one of the two branches will always be executed, not both at the same time
//第二种,多个分支 if(条件){ //执行 }else if(条件){ //执行 }else if(条件){ //执行 }…else if(条件){ //执行 }else{ //执行 }
In the case of multiple branches, only one of them will be executed. If one of the branches is executed, the following condition comparison will not continue. This is a more efficient way. If you simply write if block, it will be like the BuyTicket function above, which is a very inefficient way of writing. The three if blocks will be compared. So, we can transform the BuyTicket function
//代码 funciton BuyTicket(identity){ if("学生"){ console.log("请付款100元"); }else if("军人"){ console.log("请付款150元"); }else{ console.log("请付款200元"); } }
This way of writing is more scientific, and the execution effect is the same as before. The advantage of writing this way is that the execution efficiency is high. The conditions are matched one by one. If the conditions are qualified, they will be executed without matching other condition blocks. This is more efficient than the function code written before. However, there is also a multi-branch alternative writing method, the switch structure. Let’s look at the syntax first
switch(表达式){ case 常量表达式1: //执行 break; case 常量表达式1: //执行 break; case 常量表达式1: //执行 break; default: //执行 break; }
The process of execution from top to bottom is to use expressions to match the following constant expressions one by one. If they match, execute the statements inside. Remember to add the break keyword after each case block. Otherwise, the statements in the subsequent case blocks will be executed sequentially until break is encountered, so we can also take advantage of this feature. Under appropriate circumstances, we will not write the break keyword. Okay, let’s first use the switch structure to modify the previous BuyTicket function
function BuyTicket(identity){ switch(identity){ case "学生": console.log("请付款100元"); break; case "军人": console.log("请付款150元"); break; case "普通人": console.log("请付款200元"); break; default: console.log("请出示身份证"); } }
デフォルト ブロックは、一致する式がない場合にデフォルトでこのコード ブロックを実行することを意味します。これは最後のコード ブロックでもあるため、break キーワードも省略できます。
要約すると、今日は条件分岐とその他の知識、if、if--else、if--else、switch についてのみ話しました。書くにはある程度の時間があり、スペースは限られています。次の記事は執筆サイクルについてです。それでは、次の記事に進みます。