The optimization method of JS if else

Source: Internet
Author: User

Conditional statement
When you write code, you often need to perform different behaviors according to different conditions. You can use conditional statements in your code to accomplish this task.

In the web effects, we can use the following conditional statements:

If statement
Executes code when a specified condition is set up.
If...else statement
Executes code when the specified condition is set up, and executes additional code when the condition is not valid.
If...else If....else Statement
Use this statement to choose to execute one of several block of code.
Switch statement


If statement
You can use this statement if you want the specified condition to execute code when it is set up.

Grammar:

if (condition)
{
Execute code when conditions are set
}
Note: Please use lowercase letters. Using uppercase if can be an error!

Instance 1

<script type= "Text/javascript" >
Write a "Good morning" greeting if
The time is less than 10

var d=new date ()
var time=d.gethours ()

if (time<10)
{
document.write ("<b>good morning</b>")
}
</script> Example 2
<script type= "Text/javascript" >
Write "lunch-time!" if the time is 11

var d=new date ()
var time=d.gethours ()

if (time==11)
{
document.write ("<b>lunch-time!</b>")
}
</script>

Note: Use the double equal sign (= =) to compare variables!

Note: There is no else in the syntax. The code executes only if the condition is true


First, use the common ternary operator


Copy code code as follows:

<body>

<script type= "Text/javascript" >
var d = new Date ()
var time = d.gethours ()

if (Time < 10)
{
document.write ("<b> Good Morning </b>")
}
Else
{
document.write ("<b> Wish you a Happy </b>")
}
</script>

<p> This example demonstrates the If...else statement. </p>

<p> If the browser time is less than 10, then will ask you "Good morning", otherwise will greet you "wish you Happy". </p>

</body>

if (foo) bar (); else Baz (); ==> Foo?bar (): Baz ();
if (!foo) bar (); else Baz (); ==> Foo?baz (): Bar ();
if (foo) return bar (); else return Baz (); ==> return Foo?bar (): Baz ();

For the above use ternary operator to optimize the IF statement you are certainly not unfamiliar, perhaps you often use it.

II. Use and (&&) and OR (| |) Operator

Copy code code as follows:

if (foo) bar (); ==> Foo&&bar ();
if (!foo) bar (); ==> foo| | Bar ();

To be honest, I didn't write code like this, I've seen it when I was studying "brother Bird's Linux private dish", but I didn't expect it to happen in JS.

Three, omit curly braces {}

Copy code code as follows:

if (foo) return bar (); else something (), ==> {if (foo) return bar (); something ()}

You and I are familiar with this type of writing, but I suggest doing it in code optimization, or handing it over to Uglifyjs to help you solve it. After all, less than a curly brace, the code is not very readable.

Writing here, I think of the way in which the father of jquery is getting HTML element attributes in "proficient in JavaScript."
Copy code code as follows:

function GetAttr (el, Attrname) {
var attr = {' for ': ' Htmlfor ', ' class ': ' ClassName '}[attrname] | | Attrname;
};

If we do not write this, we may need to use two if statements for processing, and the above code is not only simple and effective, but also strong readability.

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.