Multiple usage techniques for JavaScript ternary operators _javascript tips

found that the code slowly write more time will not consciously will if else with ternary to replace, just unfinished to make the code more concise and incisive, of course, some people say with ternary can let you have the feeling of orgasm. Recently in the writing JS also have this feeling, and collected some tips, share sharing.

Big Bird, please skip this section, Big Bird Help to correct ^__^

Popular line = = = =

An expression (EXPR1)? (EXPR2): (EXPR3)

When EXPR1 evaluates to TRUE, the value is EXPR2, and when Expr1 evaluates to FALSE, the value is EXPR3.

============

Common usage

When you find that you often use if else

Copy Code code as follows:

if (Bai Chun | | Worship Test Emperor) {
Does not hang the section;
}else{
Door hanging;
}

So the ternary notation is

Copy Code code as follows:

Brother Bai Chun | | The Test Emperor? No hanging section: door hanging

Very handsome discovery code brilliantly a lot.

Daily often have such if else to judge, especially nesting more time with ternary is more harmonious, you can make your code look more refreshing, clear structure.

A little smarter usage.
Many ternary usages can be derived from the constant changes. The following is a section of jquery code

Copy Code code as follows:

Flag? $ (' body '). addclass (' hover '): $ (' body '). Removeclass (' hover ');

even more perverted.

Copy Code code as follows:

$ ('. Item ') [flag? ' AddClass ': ' Removeclass '] (' hover ')

The code above looks rather confusing. Because when flag = True, the code becomes the following code:

Copy Code code as follows:

$ ('. Item ') [' AddClass '] (' hover ')

This is equivalent to.

Copy Code code as follows:

$ ('. Item '). addclass (' hover ')

A little more sublimation.

You can call the function you want to handle more things as needed.

Copy Code code as follows:

function A () {
Do something
}
Function B () {
Do something
}

Flag? A (): B ();

Then the complete body of the Division

So with this case, two buttons a forward behavior, a backward behavior. Operations are similar in function.

Copy Code code as follows:

var Action_turn = function (e, type) {
var self = $ (e). Closest (' Li ');
var target = Self[type = = ' prev '? ' prev ': ' Next '] ();
Target.addclass (' has-img ');
Self.removeclass (' has-img ')
}

var Btn_next = $ (' #item-photo-panel a.next ')
Btn_next.click (function () {
Action_turn (This, ' next ');
return false;
});
var Btn_prev = $ (' #item-photo-panel a.prev ')
Btn_prev.click (function () {
Action_turn (this, ' prev ');
return false;
});

try to avoid the situation

Copy Code code as follows:

Alert (true?) ' True ': false? ' t ': ' F ')

I mean as far as possible to avoid as a nested ternary, because in JS the statement is right-to-left, the above code is equivalent to

Copy Code code as follows:

Alert (true?) ' True ': (false? ' t ': ' F ')

such as PHP in the result is completely different, ternary nesting time is preferred to the left.

Copy Code code as follows:

Echo (true? ' True ': false? ' t ': ' F '//php in

Tip
also found in the PHP ternary has such a hint

Note: Notice that the ternary operator is a statement, so its evaluation is not a variable, but rather a result of the statement. This is important if you want to return a variable by reference. Statement return $var = 42 in a function returned by reference? $a: $b; Will not work, and future versions of PHP will issue a warning for this.

But after the experiment, found that in JavaScript above the practice can work, is probably JS compared to BT, rigor is not as big as PHP reasons.