A variety of usage techniques for JavaScript ternary operators

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

The

code is as follows:


if (Bai Chun | | Worship Exam emperor) {


not Hanging Branch;


}else{


door hanging;


}

So the ternary notation is

The

code is as follows:


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

The

code is as follows:


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

Even more perverted.

The

code is as follows:


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

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

The

code is as follows:


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

This is equivalent to.

The

code is as follows:


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

A little more sublimation.

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

The

code is 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.

The

code is 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

The

code is 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

The

code is 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.

The

code is as follows:


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

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.