Cos'è l'operatore double pipe ( ||)?
L'operatore double pipe ( ||) è l' operatore logicoOR . Nella maggior parte delle lingue funziona nel modo seguente:
- Se il primo valore è
false, controlla il secondo valore. Se lo è true, ritorna truee se lo è false, ritorna false.
- Se il primo valore è
true, restituisce sempre true, qualunque sia il secondo valore.
Quindi sostanzialmente funziona come questa funzione:
function or(x, y) {
if (x) {
return true;
} else if (y) {
return true;
} else {
return false;
}
}
Se ancora non capisci, guarda questa tabella:
| true false
------+---------------
true | true true
false | true false
In altre parole, è falso solo quando entrambi i valori sono falsi.
In cosa differisce in JavaScript?
JavaScript è un po 'diverso, perché è un linguaggio vagamente digitato . In questo caso significa che è possibile utilizzare l' ||operatore con valori non booleani. Sebbene non abbia senso, è possibile utilizzare questo operatore con ad esempio una funzione e un oggetto:
(function(){}) || {}
Cosa succede lì?
Se i valori non sono booleani, JavaScript rende la conversione implicita in booleano . Ciò significa che se il valore è falsey (ad esempio 0, "", null, undefined(vedi anche Tutti i valori Falsey in JavaScript )), viene trattata come false; altrimenti viene trattato come true.
Quindi l'esempio sopra dovrebbe dare true, perché la funzione vuota è vera. Beh, non lo fa. Restituisce la funzione vuota. Questo perché l' ||operatore JavaScript non funziona come ho scritto all'inizio. Funziona nel modo seguente:
- Se il primo valore è false , restituisce il secondo valore .
- Se il primo valore è vero , restituisce il primo valore .
Sorpreso? In realtà, è "compatibile" con l' ||operatore tradizionale . Potrebbe essere scritto come la seguente funzione:
function or(x, y) {
if (x) {
return x;
} else {
return y;
}
}
Se passi un valore di verità come x, restituisce x, cioè un valore di verità. Quindi, se lo usi in seguito nella ifclausola:
(function(x, y) {
var eitherXorY = x || y;
if (eitherXorY) {
console.log("Either x or y is truthy.");
} else {
console.log("Neither x nor y is truthy");
}
}(true/*, undefined*/));
hai capito "Either x or y is truthy.".
Se xfosse falso, lo eitherXorYsarebbe y. In questo caso otterresti il "Either x or y is truthy."se yfosse sincero; altrimenti otterresti "Neither x nor y is truthy".
La vera domanda
Ora, quando sai come ||funziona l'operatore, probabilmente puoi capire da solo cosa x = x || ysignifica. Se xè vero, xè assegnato a x, quindi in realtà non accade nulla; altrimenti yè assegnato a x. È comunemente usato per definire i parametri predefiniti nelle funzioni. Tuttavia, è spesso considerata una cattiva pratica di programmazione , perché impedisce di passare un valore di falso (che non è necessariamente undefinedo null) come parametro. Prendi in considerazione il seguente esempio:
function badFunction(/* boolean */flagA) {
flagA = flagA || true;
console.log("flagA is set to " + (flagA ? "true" : "false"));
}
Sembra valido a prima vista. Tuttavia, cosa accadrebbe se passassi falsecome flagAparametro (dato che è booleano, cioè può essere trueo false)? Lo sarebbe true. In questo esempio, non è possibile impostare flagAsu false.
Sarebbe meglio verificare esplicitamente se flagAè undefinedcosì:
function goodFunction(/* boolean */flagA) {
flagA = typeof flagA !== "undefined" ? flagA : true;
console.log("flagA is set to " + (flagA ? "true" : "false"));
}
Anche se è più lungo, funziona sempre ed è più facile da capire.
È inoltre possibile utilizzare la sintassi ES6 per i parametri delle funzioni predefinite , ma si noti che non funziona nei browser più vecchi (come IE). Se vuoi supportare questi browser, dovresti trascrivere il tuo codice con Babel .
Vedi anche Operatori logici su MDN .
falsy, non SOLOundefined. Il numero di volte che ho vistodoWeDoIt = doWeDoIt || trueè abbastanza per farmi piangere. (cioèdoWeDoItora non lo sarà maifalse)