Sök…


Introduktion

Villkorliga uttryck, inbegripet sökord som om och annat, ger JavaScript-program möjlighet att utföra olika åtgärder beroende på ett booleskt tillstånd: sant eller falskt. Det här avsnittet behandlar användningen av JavaScript-konditioner, booleska logik och ternära uttalanden.

Syntax

  • if ( villkor ) uttalande ;
  • if ( villkor ) statement_1 , statement_2 , ... , statement_n ;
  • if ( villkor ) {
    påstående
    }
  • if ( villkor ) {
    uttalande_1 ;
    uttalande_2 ;
    ...
    uttalande_n ;
    }
  • if ( villkor ) {
    påstående
    } annat {
    påstående
    }
  • if ( villkor ) {
    påstående
    } annat om ( villkor ) {
    påstående
    } annat {
    påstående
    }
  • switch ( uttryck ) {
    fallvärde1 :
    påstående
    [ha sönder;]
    ärendevärde2 :
    påstående
    [ha sönder;]
    fallvärdeN :
    påstående
    [ha sönder;]
    standard:
    påstående
    [ha sönder;]
    }
  • villkor ? value_for_true : value_for_false ;

Anmärkningar

Förhållanden kan bryta det normala programflödet genom att köra kod baserat på ett uttrycks värde. I JavaScript betyder detta att använda if , else if och else uttalanden och ternära operatörer.

If / Annars If / Else Control

I sin enklaste form kan ett if villkor användas på detta sätt:

var i = 0;

if (i < 1) {
    console.log("i is smaller than 1");
}

Villkoret i < 1 utvärderas, och om det utvärderas till true exekveras blocket som följer. Om den utvärderas till false , hoppas blocket över.

Ett if villkor kan utökas med ett else block. Villkoret kontrolleras en gång som ovan, och om det utvärderar till false ett sekundärt block att köras (som skulle hoppas över om villkoret var true ). Ett exempel:

if (i < 1) {
    console.log("i is smaller than 1");
} else {
    console.log("i was not smaller than 1");
}

Anta att det else blocket innehåller inget annat än ett annat if block (med valfritt ett else block) som detta:

if (i < 1) {
    console.log("i is smaller than 1");
} else {
    if (i < 2) {
        console.log("i is smaller than 2");
    } else {
        console.log("none of the previous conditions was true");
    }
}

Då finns det också ett annat sätt att skriva detta som minskar boet:

if (i < 1) {
    console.log("i is smaller than 1");
} else if (i < 2) {
    console.log("i is smaller than 2");
} else {
    console.log("none of the previous conditions was true");
}

Några viktiga fotnoter om ovanstående exempel:

  • Om något villkor utvärderas till true , kommer inget annat villkor i den kedjan av block utvärderas, och alla motsvarande block (inklusive det else blocket) kommer inte att exekveras.

  • Antalet else if delar är praktiskt taget obegränsat. Det sista exemplet ovan innehåller bara ett, men du kan ha så många du vill.

  • Villkoret i ett if uttalande kan vara allt som kan tvingas till ett booleskt värde, se ämnet på booleska logik för mer information;

  • Stegen if-else-if går ut vid den första framgången. Det vill säga i exemplet ovan, om värdet på i är 0,5, utförs den första grenen. Om förhållandena överlappar exekveras de första kriterierna som förekommer i exekveringsflödet. Det andra villkoret, som också kan vara sant, ignoreras.

  • Om du bara har ett uttalande är hängslen runt det uttalandet tekniskt frivilligt, t.ex. är det bra:

    if (i < 1) console.log("i is smaller than 1");
    

    Och detta fungerar också:

    if (i < 1) 
        console.log("i is smaller than 1");
    

    Om du vill utföra flera uttalanden i ett if block, är de lockiga hängslen runt dem obligatoriska. Endast att använda intryck räcker inte. Till exempel följande kod:

    if (i < 1) 
        console.log("i is smaller than 1");
        console.log("this will run REGARDLESS of the condition"); // Warning, see text!
    

    är ekvivalent med:

    if (i < 1) {
        console.log("i is smaller than 1");
    }
    console.log("this will run REGARDLESS of the condition");
    

Byt uttalande

Växlingssatser jämför värdet på ett uttryck mot 1 eller flera värden och kör olika kodsektioner baserat på den jämförelsen.

var value = 1;
switch (value) {
  case 1:
    console.log('I will always run');
    break;
  case 2:
    console.log('I will never run');
    break;
}

De break uttalande "pauser" ur switch uttalande och säkerställer inte mer kod i switch uttalande körs. Så här definieras avsnitt och gör det möjligt för användaren att göra "fall" -fall.

Varning: avsaknaden av en break eller return uttalande för varje fall innebär att programmet kommer att fortsätta att utvärdera nästa fall, även om kriterierna fall är otillfredsställda!

switch (value) {
  case 1:
    console.log('I will only run if value === 1');
    // Here, the code "falls through" and will run the code under case 2
  case 2:
    console.log('I will run if value === 1 or value === 2');
    break;
  case 3:
    console.log('I will only run if value === 3');
    break;
}

Det sista fallet är default . Den här kommer att köras om inga andra matcher gjordes.

var animal = 'Lion';
switch (animal) {
  case 'Dog':
    console.log('I will not run since animal !== "Dog"');
    break;
  case 'Cat':
    console.log('I will not run since animal !== "Cat"');
    break;
  default:
    console.log('I will run since animal does not match any other case');
}

Det bör noteras att ett falluttryck kan vara vilken som helst typ av uttryck. Detta innebär att du kan använda jämförelser, funktionssamtal etc. som ärendevärden.

function john() {
  return 'John';
}

function jacob() {
  return 'Jacob';
}

switch (name) {
  case john(): // Compare name with the return value of john() (name == "John")
    console.log('I will run if name === "John"');
    break;
  case 'Ja' + 'ne': // Concatenate the strings together then compare (name == "Jane")
    console.log('I will run if name === "Jane"');
    break;
  case john() + ' ' + jacob() + ' Jingleheimer Schmidt':
    console.log('His name is equal to name too!');
    break;
}

Flera inkluderande kriterier för fall

Eftersom fall "faller igenom" utan break eller return uttalande kan du använda detta för att skapa flera allomfattande kriterier:

var x = "c"
switch (x) {
   case "a":
   case "b":
   case "c":
      console.log("Either a, b, or c was selected.");
      break;
   case "d":
      console.log("Only d was selected.");
      break;
   default:
      console.log("No case was matched.");
      break;  // precautionary break if case order changes
}

Ternära operatörer

Kan användas för att förkorta om / annars-operationer. Detta är praktiskt för att snabbt returnera ett värde (dvs. för att tilldela det till en annan variabel).

Till exempel:

var animal = 'kitty';
var result = (animal === 'kitty') ? 'cute' : 'still nice';

I detta fall får result det "söta" värdet, eftersom värdet på djur är "kitty". Om djur hade ett annat värde, skulle resultatet få det "fortfarande trevliga" värdet.

Jämför detta med vad koden vill ha med if/else villkor.

var animal = 'kitty';
var result = '';
if (animal === 'kitty') {
    result = 'cute';
} else {
    result = 'still nice';
}

if eller else kan förhållandena ha flera operationer. I detta fall returnerar operatören resultatet av det sista uttrycket.

var a = 0;
var str = 'not a';
var b = '';
b = a === 0 ? (a = 1, str += ' test') : (a = 2);

Eftersom a var lika med 0 blir det 1 och str blir "inte ett test". Den operation som involverade str var den sista, så b får resultatet av operationen, vilket är värdet i str , dvs "inte ett test".

Ternära operatörer förväntar sig alltid andra förhållanden, annars får du ett syntaxfel. Som en lösning kan du returnera noll något liknande i den andra grenen - det spelar ingen roll om du inte använder returvärdet utan bara förkortar (eller försöker förkorta) operationen.

var a = 1;
a === 1 ? alert('Hey, it is 1!') : 0;

Som du ser, if (a === 1) alert('Hey, it is 1!'); skulle göra samma sak. Det skulle bara vara en tjockare längre, eftersom den inte behöver ett obligatoriskt else villkor. Om ett else tillstånd var involverat, skulle den ternära metoden vara mycket renare.

a === 1 ? alert('Hey, it is 1!') : alert('Weird, what could it be?');
if (a === 1) alert('Hey, it is 1!') else alert('Weird, what could it be?');

Trälar kan kapslas för att kapsla in ytterligare logik. Till exempel

foo ? bar ? 1 : 2 : 3

// To be clear, this is evaluated left to right 
// and can be more explicitly expressed as:

foo ? (bar ? 1 : 2) : 3

Detta är samma som följande if/else

if (foo) {
  if (bar) {
    1
  } else {
    2
  }
} else {
  3
}

Stylistiskt bör detta endast användas med korta variabla namn, eftersom flerstreckade ternärer drastiskt kan minska läsbarheten.

De enda uttalanden som inte kan användas i ternary är kontrolluttalanden. Till exempel kan du inte använda retur eller bryta med ternärer. Följande uttryck kommer att vara ogiltigt.

var animal = 'kitty';
for (var i = 0; i < 5; ++i) {
    (animal === 'kitty') ? break:console.log(i);
}

För returrätt skulle följande också vara ogiltiga:

var animal = 'kitty';
(animal === 'kitty') ? return 'meow' : return 'woof';

För att göra ovanstående ordentligt, skulle du returnera ternary enligt följande:

var animal = 'kitty';
return (animal === 'kitty') ? 'meow' : 'woof';

Strategi

Ett strategimönster kan användas i Javascript i många fall för att ersätta ett switch-uttalande. Det är särskilt användbart när antalet förhållanden är dynamiskt eller mycket stort. Det gör att koden för varje villkor är oberoende och testbar separat.

Strategiobjekt är enkelt ett objekt med flera funktioner som representerar varje separat villkor. Exempel:

const AnimalSays = {
    dog () {
        return 'woof';
    },

    cat () {
        return 'meow';
    },

    lion () {
        return 'roar';
    },

    // ... other animals

    default () {
        return 'moo';
    }
};

Ovanstående objekt kan användas enligt följande:

function makeAnimalSpeak (animal) {
    // Match the animal by type
    const speak = AnimalSays[animal] || AnimalSays.default;
    console.log(animal + ' says ' + speak());
}

Resultat:

makeAnimalSpeak('dog') // => 'dog says woof'
makeAnimalSpeak('cat') // => 'cat says meow'
makeAnimalSpeak('lion') // => 'lion says roar'
makeAnimalSpeak('snake') // => 'snake says moo'

I det sista fallet hanterar vår standardfunktion alla djur som saknas.

Med hjälp av || och && kortslutning

De booleska operatörerna || och && kommer att "kortsluta" och inte utvärdera den andra parametern om den första är sann respektive falsk. Detta kan användas för att skriva korta villkor som:

var x = 10

x == 10 && alert("x is 10")
x == 10 || alert("x is not 10")


Modified text is an extract of the original Stack Overflow Documentation
Licensierat under CC BY-SA 3.0
Inte anslutet till Stack Overflow