Operator trójargumentowy (ternary operator) w JavaScript – jak uprościć warunki w kodzie

Chcesz poznać sposób na uproszczenie instrukcji warunkowych w swoim kodzie? JS ternary operator, czyli operator trójargumentowy w JavaScript, pozwala na zwięzłe i czytelne zapisywanie warunków. W tym artykule omówimy, jak działa operator ternarny, przedstawimy jego składnię oraz pokażemy praktyczne przykłady zastosowania.

Czym jest operator trójargumentowy w JavaScript?

Operator trójargumentowy, znany również jako operator warunkowy, to skrócona forma instrukcji if...else. Umożliwia on zapisanie warunku, który zwraca jedną z dwóch wartości w zależności od spełnienia określonego kryterium.

Składnia operatora ternarnego:

warunek ? wyrażenieJeśliPrawda : wyrażenieJeśliFałsz;

• warunek – wyrażenie logiczne, które zostanie ocenione jako prawda lub fałsz.

• wyrażenieJeśliPrawda (exprIfTrue) – wartość lub wyrażenie zwracane, gdy warunek jest prawdziwy.

• wyrażenieJeśliFałsz (exprIfFalse) – wartość lub wyrażenie zwracane, gdy warunek jest fałszywy.

Jak działa operator ternarny?

Operator ternarny działa na zasadzie oceny warunku i zwrócenia odpowiedniej wartości:

• Jeśli warunek jest prawdziwy, zwraca wyrażenieJeśliPrawda.

• Jeśli warunek jest fałszywy, zwraca wyrażenieJeśliFałsz.

Przykład:

let wiek = 18;
let status = (wiek >= 18) ? 'Dorosły' : 'Niepełnoletni';
console.log(status); // Wyświetli "Dorosły"

W powyższym przykładzie, jeśli zmienna wiek jest większa lub równa 18, zmienna status otrzyma wartość 'Dorosły', w przeciwnym razie 'Niepełnoletni'.

Dokumentacja operatora warunkowego na MDN Web Docs

Frontend Master 2026 · Kodożercy

Pisz kod, nie tylko prompty

Frontend Master 2026 to pakiet sześciu kursów Kodożerców (HTML, CSS, JavaScript, Git) w polskim wideo z 12-miesięcznym dostępem. Fundamenty frontu od pierwszej linijki kodu do deploy.

Wchodzę w to →

Zastosowanie operatora ternarnego w praktyce

Uproszczenie instrukcji if...else

Tradycyjna instrukcja if...else:

let liczba = 10;
let wynik;
if (liczba % 2 === 0) {
  wynik = 'Parzysta';
} else {
  wynik = 'Nieparzysta';
}
console.log(wynik); // Wyświetli "Parzysta"

Z użyciem operatora ternarnego:

let liczba = 10;
let wynik = (liczba % 2 === 0) ? 'Parzysta' : 'Nieparzysta';
console.log(wynik); // Wyświetli "Parzysta"

Przypisanie wartości do zmiennej

Operator ternarny jest często używany do przypisywania wartości do zmiennych na podstawie warunków.

Przykład:

let user = {
  imie: 'Anna',
  premium: true
};
let poziomUżytkownika = user.premium ? 'Premium' : 'Standard';
console.log(poziomUżytkownika); // Wyświetli "Premium"

Wywołanie funkcji na podstawie warunku

function powitanie() {
  console.log('Witaj!');
}
function pozegnanie() {
  console.log('Do zobaczenia!');
}
let godzina = 10;
(godzina < 12) ? powitanie() : pozegnanie(); // Wyświetli "Witaj!"

Zagnieżdżone operatory ternarne

Używanie operatora ternarnego w sposób zagnieżdżony pozwala na obsługę wielu warunków. Należy jednak zachować ostrożność, aby kod pozostał czytelny.

Przykład:

let ocena = 85;
let wynik = (ocena >= 90) ? 'A' :
            (ocena >= 80) ? 'B' :
            (ocena >= 70) ? 'C' :
            (ocena >= 60) ? 'D' : 'F';
console.log(wynik); // Wyświetli "B"

W powyższym przykładzie operator ternarny zwraca ocenę literową na podstawie wartości punktowej.

Wskazówka: Jeśli zagnieżdżone operatory ternarne stają się zbyt skomplikowane, warto rozważyć użycie instrukcji switch lub if...else dla lepszej czytelności.

Operator ternarny a operator warunkowy

Warto zauważyć, że operator ternarny jest jedynym operatorem w JavaScript, który przyjmuje trzy argumenty, stąd nazwa operator trójargumentowy. Często jest on również nazywany operatorem warunkowym lub conditional operator. Pozostałe operatory używane w warunkach opisujemy w tekście operatory logiczne w JavaScript.

Praktyczne porady

• Czytelność kodu: Używaj operatora ternarnego do prostych warunków. W przypadku złożonych logik lepiej zastosować tradycyjne instrukcje warunkowe.

• Unikaj nadmiernego zagnieżdżania: Zbyt wiele zagnieżdżonych operatorów ternarnych może uczynić kod trudnym do zrozumienia.

• Przypisywanie wartości: Operator ternarny jest idealny do przypisywania wartości na podstawie warunku.

Alternatywy dla operatora ternarnego

W niektórych przypadkach zamiast operatora ternarnego można użyć innych konstrukcji:

• Instrukcja if...else: Dla bardziej rozbudowanych warunków.

• Instrukcja switch: Przy wielu możliwych wartościach jednej zmiennej.

Podsumowanie

JS ternary operator, czyli operator trójargumentowy w JavaScript, to potężne narzędzie pozwalające na uproszczenie i skrócenie kodu. Pozwala na zwięzłe zapisywanie warunków i jest szczególnie przydatny przy przypisywaniu wartości na podstawie prostych kryteriów. Pamiętaj jednak, aby używać go z rozwagą, dbając o czytelność i zrozumiałość swojego kodu.

Zapraszamy do dalszego odkrywania tajników JavaScript i doskonalenia swoich umiejętności programistycznych. Im lepiej zrozumiesz narzędzia oferowane przez język, tym efektywniej będziesz tworzyć czysty i zrozumiały kod. Jeśli dopiero zaczynasz, podstawy języka zebraliśmy w przewodniku kurs JavaScript od podstaw.

Mateusz Wojdalski

Specjalista SEO i content marketingu w Devstock. Zajmuję się strategią treści, automatyzacją procesów marketingowych i wdrożeniami AI w codziennej pracy. Badam nowe narzędzia, adaptuję je do realnych zadań i piszę o tym, co faktycznie działa.