Wie benutzt man das? : (bedingter) Operator in JavaScript?

Kann mir bitte jemand in einfachen Worten erklären, was der ?:(bedingte, "ternäre") Operator ist und wie man ihn benutzt?

Dies ist eine einzeilige Abkürzung für eine if-else-Anweisung. Es heißt der bedingte Operator. ¹

Hier ist ein Beispiel für Code, der mit dem bedingten Operator gekürzt werden könnte:

var userType;
if (userIsYoungerThan18) {
  userType = "Minor";
} else {
  userType = "Adult";
}

if (userIsYoungerThan21) {
  serveDrink("Grape Juice");
} else {
  serveDrink("Wine");
}

Dies kann folgendermaßen gekürzt ?:werden:

var userType = userIsYoungerThan18 ? "Minor" : "Adult";

serveDrink(userIsYoungerThan21 ? "Grape Juice" : "Wine");

Wie alle Ausdrücke kann der bedingte Operator auch als eigenständige Anweisung mit Nebenwirkungen verwendet werden, obwohl dies außerhalb der Minimierung ungewöhnlich ist :

userIsYoungerThan21 ? serveGrapeJuice() : serveWine();

Sie können sogar verkettet werden:

serveDrink(userIsYoungerThan4 ? 'Milk' : userIsYoungerThan21 ? 'Grape Juice' : 'Wine');

Seien Sie jedoch vorsichtig, sonst erhalten Sie einen verschlungenen Code wie den folgenden:

var k = a ? (b ? (c ? d : e) : (d ? e : f)) : f ? (g ? h : i) : j;

¹ Wird oft als "ternärer Operator" bezeichnet, ist jedoch nur ein ternärer Operator [ein Operator, der drei Operanden akzeptiert]. Es ist jedoch das einzige JavaScript, das derzeit verfügbar ist.

Ich möchte einige zu den gegebenen Antworten hinzufügen .

Wenn Sie in einer Situation wie "Eine Variable anzeigen, wenn sie gesetzt ist, sonst ..." auf ein Ternär stoßen (oder es verwenden möchten), können Sie es ohne Ternär noch kürzer machen .

Anstatt:

var welcomeMessage  = 'Hello ' + (username ? username : 'guest');

Sie können verwenden:

var welcomeMessage  = 'Hello ' + (username || 'guest');

Dies sind Javascripts, die dem ternären Kurzoperator von PHP entsprechen ?:

Oder auch:

var welcomeMessage  = 'Hello ' + (username || something || maybethis || 'guest');

Die Variable wird ausgewertet, und wenn sie falsch oder nicht gesetzt ist, wird mit der nächsten fortgefahren.

Es wird als "ternärer" oder "bedingter" Operator bezeichnet.

Beispiel

Der Operator?: Kann als Verknüpfung für eine if ... else-Anweisung verwendet werden. Es wird normalerweise als Teil eines größeren Ausdrucks verwendet, bei dem eine if ... else-Anweisung umständlich wäre. Zum Beispiel:

var now = new Date();
var greeting = "Good" + ((now.getHours() > 17) ? " evening." : " day.");

Das Beispiel erstellt eine Zeichenfolge mit "Guten Abend". wenn es nach 18 Uhr ist. Der äquivalente Code mit einer if ... else-Anweisung würde wie folgt aussehen:

var now = new Date();
var greeting = "Good";
if (now.getHours() > 17)
   greeting += " evening.";
else
   greeting += " day.";

Aus der MSDN JS-Dokumentation .

Grundsätzlich handelt es sich um eine bedingte Kurzaussage.

Siehe auch:

• Vorrang des Operators beim ternären Javascript-Operator
• Wikipedia

Es ist ein wenig schwierig zu googeln, wenn Sie nur Symbole haben;) Die zu verwendenden Begriffe sind "Javascript-Bedingungsoperator".

Wenn Sie in Javascript weitere lustige Symbole sehen, sollten Sie zuerst die Operatoren von Javascript nachschlagen: die Liste der Operatoren von MDC . Die einzige Ausnahme, auf die Sie wahrscheinlich stoßen, ist das $Symbol .

Um Ihre Frage zu beantworten, ersetzen bedingte Operatoren einfache if-Anweisungen. Ein Beispiel ist am besten:

var insurancePremium = age > 21 ? 100 : 200;

Anstatt:

var insurancePremium;

if (age > 21) {
    insurancePremium = 100;
} else {
    insurancePremium = 200;
}

z = (x == y ? 1 : 2);

ist äquivalent zu

if (x == y)
    z = 1;
else
    z = 2;

außer natürlich, es ist kürzer.

Die meisten Antworten sind richtig, aber ich möchte noch etwas hinzufügen. Der ternäre Operator ist rechtsassoziativ, was bedeutet, dass er auf folgende Weise verkettet werden kann if … else-if … else-if … else:

function example() {
    return condition1 ? value1
         : condition2 ? value2
         : condition3 ? value3
         : value4;
}

Gleichwertig:

function example() {
    if (condition1) { return value1; }
    else if (condition2) { return value2; }
    else if (condition3) { return value3; }
    else { return value4; }
}

Weitere Details finden Sie hier

Es wird der ternäre Operator genannt

tmp = (foo==1 ? true : false);

Ternärer Operator

Im Allgemeinen haben wir bedingte Anweisungen in Javascript.

Beispiel:

if (true) {
    console.log(1)
} 
else {
    console.log(0)
}
# Answer
# 1

Es enthält jedoch zwei oder mehr Zeilen und kann keiner Variablen zugewiesen werden. Javascript hat eine Lösung für dieses Problem Ternary Operator . Der ternäre Operator kann in eine Zeile schreiben und einer Variablen zuweisen.

Beispiel:

var operator = true ? 1 : 0
console.log(operator)
# Answer
# 1

Dieser ternäre Operator ist in der Programmiersprache C ähnlich.

Hey Kumpel, erinnere dich nur daran, dass js funktioniert, indem er entweder wahr oder falsch bewertet, oder?

Nehmen wir einen ternären Operator:

questionAnswered ? "Awesome!" : "damn" ;

Zunächst prüft js, ob questionAnswered trueoder ist false.

if true( ?) du bekommst "Awesome!"

sonst ( :) wirst du "verdammt" bekommen;

Hoffe das hilft Freund :)

Es ist if statementalles in einer Zeile.

Damit

var x=1;
(x == 1) ? y="true" : y="false";
alert(y);

Der auszuwertende Ausdruck befindet sich in der ( )

Wenn es mit true übereinstimmt, führen Sie den Code nach dem aus ?

Wenn es mit false übereinstimmt, führen Sie den Code nach dem aus :

x = 9
y = 8

einstellig

++x
--x

Binär

z = x + y

Ternär

2>3 ? true : false;
2<3 ? true : false;
2<3 ? "2 is lesser than 3" : "2 is greater than 3";

Es heißt das ternary operator. Für weitere Informationen habe ich hier eine weitere Frage beantwortet:

Wie schreibe ich eine IF else-Anweisung ohne 'else'?

Dies ist wahrscheinlich nicht gerade der eleganteste Weg, dies zu tun. Für jemanden, der mit ternären Operatoren nicht vertraut ist, könnte sich dies jedoch als nützlich erweisen. Meine persönliche Präferenz ist es, 1-Liner-Fallbacks anstelle von Bedingungsblöcken durchzuführen.

  // var firstName = 'John'; // Undefined
  var lastName = 'Doe';

  // if lastName or firstName is undefined, false, null or empty => fallback to empty string
  lastName = lastName || '';
  firstName = firstName || '';

  var displayName = '';

  // if lastName (or firstName) is undefined, false, null or empty
  // displayName equals 'John' OR 'Doe'

  // if lastName and firstName are not empty
  // a space is inserted between the names
  displayName = (!lastName || !firstName) ? firstName + lastName : firstName + ' ' + lastName;


  // if display name is undefined, false, null or empty => fallback to 'Unnamed'
  displayName = displayName || 'Unnamed';

  console.log(displayName);

Ternärer Operator

Wir können mit Jquery sowie Länge wie im folgenden Beispiel verwenden:

Angenommen, wir haben ein GuarantorName-Textfeld, das einen Wert hat und Vor- und Nachnamen abrufen möchte. Es kann null sein. So rathar als

        var gnamesplit = $("#txtGuarantorName").val().split(" ");
        var gLastName = "";
        var gFirstName = "";
        if(gnamesplit.length > 0 ){
           gLastName  = gnamesplit[0];        
        }
        if(gnamesplit.length > 1 ){
           gFirstName = gnamesplit[1];        
        }

Wir können den folgenden Code mit Jquery mit minimalem Code verwenden

    

    var gnamesplit = $("#txtGuarantorName").val().split(" ");
    var gLastName = gnamesplit.length > 0  ? gnamesplit[0] : "";
    var gFirstName =  gnamesplit.length > 1  ? gnamesplit[1] : "";
    $("#txtLastName").val(gLastName);
    $("#txtFirstName").val(gFirstName);
    
    

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div >
  Guarantor Name: <input type="text" id="txtGuarantorName" value="ASP.NET Core"  /><br/>
  <br/>
  <br/>
  
  First Name: <input type="text" id="txtLastName" value="ASP.NET Core"  />
  Last Name: <input type="text" id="txtFirstName" value="ASP.NET Core"  />
</div>

Ternäre Ausdrücke sind in JS sehr nützlich, insbesondere in React. Hier ist eine vereinfachte Antwort auf die vielen guten, detaillierten Antworten.

condition ? expressionIfTrue : expressionIfFalse

Stellen Sie sich expressionIfTruedie OG if-Anweisung vor, die wahr macht.
Betrachten Sie expressionIfFalseals die else-Anweisung.

Beispiel:

var x = 1;
(x == 1) ? y=x : y=z;

Dies überprüfte den Wert von x, das erste y = (Wert) wurde zurückgegeben, wenn true, die zweite Rückgabe nach dem Doppelpunkt: gab y = (Wert) zurück, wenn false.

Der bedingte (ternäre) Operator ist der einzige JavaScript-Operator, der drei Operanden akzeptiert. Dieser Operator wird häufig als Verknüpfung für die if-Anweisung verwendet.

condition ? expr1 : expr2 

Wenn die Bedingung erfüllt ist, gibt der Operator den Wert von expr1 zurück. Andernfalls wird der Wert von expr2 zurückgegeben.

function fact(n) {
  if (n > 1) {
    return n * fact(n-1);
  } else {
    return 1;
  }
  // we can replace the above code in a single line of code as below
  //return (n != 1) ? n * fact(n - 1) : 1;
}
console.log(fact(5));

Weitere Informationen finden Sie unter Link zum MDN-Dokument

Wenn Sie eine Bedingung haben, überprüfen Sie die Instanzfunktion in Javascript . Es ist einfach, ternäre Operatoren zu verwenden . für die Implementierung wird nur eine einzige Zeile benötigt . Ex:

    private module : string ='';
    private page:boolean = false;
    async mounted(){
     if(this.module=== 'Main')
    {
    this.page = true;}
    else{
    this.page = false;
    }
}

Eine solche Funktion mit einer Bedingung kann wie folgt geschrieben werden.

this.page = this.module=== 'Main' ?true:false;

Bedingung ? wenn wahr: wenn falsch

 (sunday == 'True') ? sun="<span class='label label-success'>S</span>" : sun="<span class='label label-danger'>S</span>";

 sun = "<span class='label " + ((sunday === 'True' ? 'label-success' : 'label-danger') + "'>S</span>"