Приклад потрійного оператора JavaScript з функціями

Я використовую jQuery 1.7.1

Я тільки починаю використовувати тернарний оператор JavaScript для заміни простих операторів if / else. Я зробив це успішно в кількох місцях. Я був здивований, коли успішно змусив щось інше працювати, коли впевнений, що це не стане, але все-таки спробував.

Ось оригінальне твердження:

function updateItem() {
    $this = $(this);
    var IsChecked = $this.hasClass("IsChecked");
    if (IsChecked == true){
        removeItem($this);
    } else {
        addItem($this);
    }
}

Ось та сама функція за допомогою тернарного оператора:

function updateItem() {
    $this = $(this);
    var IsChecked = $this.hasClass("IsChecked");
    (IsChecked == true) ? removeItem($this) : addItem($this);
}

Я був здивований, тому що всі приклади, які я бачив, що використовуються, просто встановлювали змінні, як це:

x = (1 < 2) ? true : false;

Моє питання полягає в тому, чи є це "звичайним" використанням і чи буде воно працювати в більшості версій JavaScript? Де це не вдасться? Чи існують інші менш очевидні способи використання?

ОНОВЛЕННЯ - Дякуємо за пораду "реального світу" !!!

Я використовую це як свою функцію:

function updateItem() {
    $this = $(this);
    $this.hasClass("IsChecked") ? removeItem($this) : addItem($this);
}

Хе, у вашому запитанні є декілька досить захоплюючих застосувань потрійного синтаксису; Мені найбільше подобається останній ...

x = (1 < 2) ? true : false;

Використання трійки тут абсолютно необов’язкове - ви можете просто написати

x = (1 < 2);

Аналогічно, елемент умови тривимірного оператора завжди обчислюється як логічне значення, тому ви можете виразити:

(IsChecked == true) ? removeItem($this) : addItem($this);

Просто як:

(IsChecked) ? removeItem($this) : addItem($this);

Фактично, я б також видалив і IsCheckedтимчасовий, який залишає у вас:

($this.hasClass("IsChecked")) ? removeItem($this) : addItem($this);

Що стосується цього, це прийнятний синтаксис, це точно! Це чудовий спосіб зменшити чотири рядки коду в один, не впливаючи на читабельність. Єдина порада, яку я б вам дав, - це уникати вкладання кількох тернарних висловлювань в один рядок (таким чином брехня божевільна!)

Трійковий стиль зазвичай використовується для економії місця. Семантично вони однакові. Я вважаю за краще використовувати повний синтаксис if / then / else, тому що я не люблю жертвувати читабельністю - я олдскул і віддаю перевагу брекетам.

Повний формат if / then / else використовується майже для всього. Це особливо популярно, якщо ви потрапляєте у більші блоки коду в кожній гілці, у вас є розгалужене дерево if / else або декілька інших / ifs у довгій рядковій лінії.

Трійковий оператор є загальним, коли ви присвоюєте значення змінної на основі простої умови або приймаєте кілька рішень із дуже короткими результатами. Наведений вами приклад насправді не має сенсу, оскільки вираз оцінюватиметься до одного з двох значень без зайвої логіки.

Хороші ідеї:

this > that ? alert(this) : alert(that);  //nice and short, little loss of meaning

if(expression)  //longer blocks but organized and can be grasped by humans
{
    //35 lines of code here
}
else if (something_else)
{
    //40 more lines here
}
else if (another_one)  /etc, etc
{
    ...

Менш добре:

this > that ? testFucntion() ? thirdFunction() ? imlost() : whathappuh() : lostinsyntax() : thisisprobablybrokennow() ? //I'm lost in my own (awful) example by now.
//Not complete... or for average humans to read.

if(this != that)  //Ternary would be done by now
{
    x = this;
}
else
}
    x = this + 2;
}

Дійсно основне правило - ви можете зрозуміти все це так само добре або краще на одній лінії? З Тернаром все в порядку. Інакше розширте його.

У прикладі, який ви опублікували, немає нічого особливо хитрого.

У потрійному операторі обчислюється перший аргумент (умовний), і якщо результат є true, то другий аргумент обчислюється і повертається, інакше третій обчислюється і повертається. Кожен із цих аргументів може бути будь-яким дійсним блоком коду, включаючи виклики функцій.

Подумайте про це так:

var x = (1 < 2) ? true : false;

Можна також записати як:

var x = (1 < 2) ? getTrueValue() : getFalseValue();

Це цілком справедливо, і ці функції можуть містити будь-який довільний код, незалежно від того, пов’язаний він із поверненням значення чи ні. Крім того, результати потрійної операції ні до чого не повинні призначатися, як і результати функції не повинні бути призначені ні до чого:

(1 < 2) ? getTrueValue() : getFalseValue();

Тепер просто замініть їх будь-якими довільними функціями, і у вас залишиться щось на зразок вашого прикладу:

(1 < 2) ? removeItem($this) : addItem($this);

Тепер у вашому останньому прикладі насправді взагалі не потрібен тернар, оскільки це можна написати так:

x = (1 < 2);  // x will be set to "true"

Якщо ви збираєтеся вкладати трикомпонентні оператори, я вважаю, ви хотіли б зробити щось подібне:

   var audience = (countrycode == 'eu') ? 'audienceEU' :
                  (countrycode == 'jp') ? 'audienceJP' :
                  (countrycode == 'cn') ? 'audienceCN' :
                  'audienceUS';

Писати / читати набагато ефективніше, ніж:

var audience = 'audienceUS';
if countrycode == 'eu' {
   audience = 'audienceEU';
} else if countrycode == 'jp' {
   audience = 'audienceJP';
} else if countrycode == 'cn' {
   audience = 'audienceCN';
}

Як і у випадку з хорошим програмуванням, пробіл робить все приємним для людей, яким доведеться читати ваш код після того, як ви закінчите з проектом.

Я також хотів би додати щось від мене.

Іншим можливим синтаксисом виклику функцій за допомогою тернарного оператора може бути:

(condition ? fn1 : fn2)();

Це може бути корисно, якщо вам доведеться передавати однаковий список параметрів обом функціям, тому вам доведеться писати їх лише один раз.

(condition ? fn1 : fn2)(arg1, arg2, arg3, arg4, arg5);

Ви можете використовувати тернарний оператор навіть з іменами функцій-членів, що мені особисто дуже подобається, щоб заощадити місце:

$('.some-element')[showThisElement ? 'addClass' : 'removeClass']('visible');

або

$('.some-element')[(showThisElement ? 'add' : 'remove') + 'Class']('visible');

Інший приклад:

var addToEnd = true; //or false
var list = [1,2,3,4];
list[addToEnd ? 'push' : 'unshift'](5);

Я знаю, що на питання вже відповіли.

Але дозвольте додати тут один момент. Це стосується не лише справжнього чи хибного. Дивись нижче:

var val="Do";

Var c= (val == "Do" || val == "Done")
          ? 7
          : 0

Тут, якщо val - Do або Done, тоді c буде 7, інакше це буде нуль. У цьому випадку c буде 7.

Це насправді ще одна перспектива цього оператора.