Operator trójskładnikowy JavaScript jako skrót do instrukcji If/Else

Obrazy kamienia/kawany/obrazy Getty

Warunkowy operator trójargumentowy w JavaScript przypisuje wartość do zmiennej na podstawie pewnego warunku i jest jedynym operatorem JavaScript, który przyjmuje trzy operandy.

Operator trójskładnikowy jest substytutem an jeśli oświadczenie, w którym zarówno jeśli oraz w przeciwnym razie klauzule przypisują różne wartości do tego samego pola, na przykład:

jeśli (warunek) 
wynik = „coś”; 
w przeciwnym razie 
wynik = 'coś';

Operator trójargumentowy skraca tę instrukcję if/else do pojedynczej instrukcji:

wynik = (warunek) ? „coś” : „coś innego”;

Jeśli stan jest prawdziwe, operator trójargumentowy zwraca wartość pierwszego wyrażenia; w przeciwnym razie zwraca wartość drugiego wyrażenia. Rozważmy jego części:

• Najpierw utwórz zmienną, której chcesz przypisać wartość, w tym przypadku wynik . Zmienna wynik będzie miał różną wartość w zależności od stanu.
• Zwróć uwagę, że po prawej stronie (tj. sam operator) stan jest pierwszy.
• The stan zawsze następuje po nim znak zapytania ( ? ), które można zasadniczo odczytać jako „czy to prawda?”
• Dwa możliwe wyniki są ostatnie, oddzielone dwukropkiem ( : ).

To użycie operatora trójskładnikowego jest dostępne tylko wtedy, gdy oryginał jeśli Instrukcja jest zgodna z formatem pokazanym powyżej — ale jest to dość powszechny scenariusz, a użycie operatora potrójnego może być znacznie bardziej wydajne.

Przykład operatora trójskładnikowego

Spójrzmy na prawdziwy przykład.

Być może musisz ustalić, które dzieci są w odpowiednim wieku, aby uczęszczać do przedszkola. Możesz mieć takie wyrażenie warunkowe:

var wiek = 7; 
var przedszkole_eligible;

jeśli (wiek > 5 lat) { 
kindergarten_eligible = 'Wystarczająco stary'; 
} 
w przeciwnym razie { 
kindergarten_eligible = 'Za młody'; 
}

Używając operatora potrójnego, możesz skrócić wyrażenie do:

var przedszkole_uprawnione = (wiek<5) ? 'Too young' : 'Old enough'; 

Ten przykład zwróci oczywiście „wystarczająco stary”.

Wiele ocen

Możesz także uwzględnić wiele ocen:

var wiek = 7, var social_ready = prawda; 
var przedszkole_uprawnione = (wiek<5) ? 'Too young' : socially_ready  
„Wystarczająco stary, ale jeszcze nie gotowy” „Stary i wystarczająco dojrzały społecznie” 
console.log ( przedszkole_eligible ); // loguje „Stary i wystarczająco dojrzały społecznie”

Wiele operacji

Operator trójargumentowy umożliwia również uwzględnienie wielu operacji dla każdego wyrażenia, oddzielonych przecinkiem:

var wiek = 7, social_ready = true;

wiek > 5 ? ( 
alert('Jesteś wystarczająco stary.'), 
location.assign('continue.html') 
) : ( 
social_ready = fałsz, 
alert('Przepraszamy, ale nie jesteś jeszcze gotowy.') 
);

Implikacje operatora trójskładnikowego

Operatory trójskładnikowe unikają inaczej gadatliwych kod , więc z jednej strony wydają się pożądane. Z drugiej strony mogą pogorszyć czytelność — oczywiście „JEŻELI INNY” jest łatwiej zrozumiały niż tajemnicze „?”.

Używając operatora trójargumentowego — lub dowolnego skrótu — zastanów się, kto będzie odczytywał Twój kod. Jeśli mniej doświadczeni programiści mogą potrzebować zrozumieć logikę programu, być może należy unikać używania operatora trójskładnikowego. Jest to szczególnie ważne, jeśli warunek i oceny są na tyle złożone, że konieczne byłoby zagnieżdżenie lub łączenie operatora trójargumentowego. W rzeczywistości tego rodzaju operatory zagnieżdżone mogą wpływać nie tylko na czytelność, ale także na debugowanie.

Podobnie jak w przypadku każdej decyzji programistycznej, przed użyciem operatora trójargumentowego należy wziąć pod uwagę kontekst i użyteczność.