Пример тернарного оператора 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);
}
6 ответов:
Хех, в вашем вопросе есть несколько довольно интересных применений тернарного синтаксиса; мне больше нравится последний...
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 используется практически для всего. Это особенно популярно, если вы попадаете в большие блоки кода в каждой ветви, у вас есть muti-разветвленное дерево if/else или несколько 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; }
A основные эмпирическое правило - вы можете понять все это, а также или лучше на одна строчка? Троичный-это нормально. В противном случае разверните его.
нет ничего особенно сложного в Примере, который вы опубликовали.
в тернарном операторе вычисляется первый аргумент (условный) и если результат
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.
это фактически другая перспектива этого оператора.