Remplacer une valeur si elle est nulle ou indéfinie en JavaScript

Question

J'ai besoin d'appliquer le ?? L'opérateur C# en JavaScript et je ne sais pas comment. Considérons ceci en C# :

int i?=null;
int j=i ?? 10;//j is now 10

Maintenant, j'ai mis cela en place en JavaScript :

var options={
       filters:{
          firstName:'abc'
       } 
    };
var filter=options.filters[0]||'';//should get 'abc' here, it doesn't happen
var filter2=options.filters[1]||'';//should get empty string here, because there is only one filter

Comment procéder correctement ?

Merci.

EDIT : J'ai repéré la moitié du problème : je ne peux pas utiliser la notation 'indexer' pour les objets ( my_object[0] ). Existe-t-il un moyen de le contourner ? (Je ne connais pas les noms des propriétés des filtres à l'avance et je ne veux pas itérer sur eux).

Answer 1

Voici l'équivalent en JavaScript :

var i = null;
var j = i || 10; //j is now 10

Il convient de noter que le opérateur logique || ne renvoie pas une valeur booléenne mais la première valeur qui peut être convertie en vrai .

En outre, utilisez un tableau d'objets au lieu d'un seul objet :

var options = {
    filters: [
        {
            name: 'firstName',
            value: 'abc'
        }
    ]
};
var filter  = options.filters[0] || '';  // is {name:'firstName', value:'abc'}
var filter2 = options.filters[1] || '';  // is ''

On peut y accéder par l'index.

Answer 2

Réponse ES2020

La nouvelle Coalescence molle Operator, est enfin disponible sur JavaScript. Toutefois, il convient de noter que le support du navigateur . Vous devrez peut-être utiliser un compilateur JavaScript tel que Babel pour le convertir en quelque chose de plus rétrocompatible.

Selon la documentation,

L'opérateur de coalescence nul ( ??) est un opérateur logique qui renvoie son opérande de droite lorsque son opérande de gauche est nul ou indéfini. nul ou indéfini, et renvoie sinon son opérande de gauche.

const options={
  filters:{
    firstName:'abc'
  } 
};
const filter = options.filters[0] ?? '';
const filter2 = options.filters[1] ?? '';

Cela garantira que vos deux variables auront une valeur de repli de '' si filters[0] o filters[1] son null ou undefined .

Il convient de noter que l'opérateur de fusion des valeurs nulles ne renvoie pas la valeur par défaut pour d'autres types de valeurs fictives telles que 0 y '' . Si vous souhaitez prendre en compte toutes les valeurs erronées, vous devez utiliser l'opérateur OR || .

Answer 3

Affaire de la nullité logique, solution 2020+.

Un nouvel opérateur a été ajouté, ??= . Cela équivaut à value = value ?? defaultValue .

||= y &&= sont similaires, voir les liens ci-dessous.

Cette opération vérifie si le côté gauche est indéfini ou nul, en court-circuitant s'il est déjà défini. Si ce n'est pas le cas, la valeur du côté droit est attribuée au côté gauche.

Exemples de base

let a          // undefined
let b = null
let c = false

a ??= true  // true
b ??= true  // true
c ??= true  // false

// Equivalent to
a = a ?? true

Exemples d'objets/de tableaux

let x = ["foo"]
let y = { foo: "fizz" }

x[0] ??= "bar"  // "foo"
x[1] ??= "bar"  // "bar"

y.foo ??= "buzz"  // "fizz"
y.bar ??= "buzz"  // "buzz"

x  // Array [ "foo", "bar" ]
y  // Object { foo: "fizz", bar: "buzz" }

Exemple fonctionnel

function config(options) {
    options.duration ??= 100
    options.speed ??= 25
    return options
}

config({ duration: 555 })   // { duration: 555, speed: 25 }
config({})                  // { duration: 100, speed: 25 }
config({ duration: null })  // { duration: 100, speed: 25 }

??= Prise en charge des navigateurs Sept 2021 - 90%

??= Documentation Mozilla

||= Documentation Mozilla

&&= Documentation Mozilla

Answer 4

TLDR :

int j=i ?? 10; est parfaitement utilisable en javascript également. Il suffit de remplacer int con let .

?? vs ||

?? doit être préférée à || parce qu'il vérifie uniquement pour les valeurs nulles et indéfinies .

Toutes les expressions ci-dessous sont vraies :

(null || 'x') === 'x' ;
(undefined || 'x') === 'x' ;
//Most of the times you don't want the result below
('' || 'x') === 'x'  ;
(0 || 'x') === 'x' ;
(false || 'x') === 'x' ;
//-----

//Using ?? is preferred
(null ?? 'x') === 'x' ;
(undefined ?? 'x') === 'x' ;
//?? works only for null and undefined, which is in general safer
('' ?? 'x') === '' ;
(0 ?? 'x') === 0 ;
(false ?? 'x') === false ;

Astérisque : Vérifier compatibilité avec les navigateurs et si vous avez vraiment besoin de soutenir ces autres navigateurs, utilisez babel .

Answer 5

J'ai identifié la moitié du problème : je ne peux pas utiliser la notation 'indexer' pour les objets (mon_objet[0]). Existe-t-il un moyen de contourner ce problème ?

Non, un objet littéral, comme son nom l'indique, est un objet et non un tableau, de sorte qu'il n'est pas possible d'extraire simplement une propriété en fonction d'un index, puisqu'il n'y a pas d'ordre spécifique pour les propriétés. La seule façon de récupérer leurs valeurs est d'utiliser leur nom spécifique :

var someVar = options.filters.firstName; //Returns 'abc'

Ou en itérant sur eux à l'aide de la fonction for ... in boucle :

for(var p in options.filters) {
    var someVar = options.filters[p]; //Returns the property being iterated
}