Question : Comment déterminer si une chaîne de caractères str est vide ?
Réponse : 1) str===" " (ne filtre pas les espaces et tabulations)
- str.length===0 (ne filtre pas non plus les espaces et tabulations), str.trim().length===0 (filtre les espaces et tabulations)
- !str (ne filtre pas non plus les espaces et tabulations, ni 0 ni false)
En résumé, pour vérifier qu'une chaîne est vide incluant les espaces et tabulations, utiliser str===""||str.trim().length===0. Pour ajouter la vérification des valeurs nulles, il faut également inclure les cas null et udnefined : str===""||str.trim().length===0||str==null
Voici les explications détaillées :
Exemple illustratif :
var addr = "";
var billAddr = " ";//caractère de tabulation
var homeAddr = " ";//espace
var numberZero = 0;
var boolFalse = false;
console.log("addr: " + addr);//affiche vide
console.log("billAddr: " + billAddr);//affiche vide
console.log("homeAddr: " + homeAddr);//affiche vide
console.log("numberZero: " + numberZero);//affiche 0
console.log("boolFalse: " + boolFalse);//affiche false
console.log("addr: " + typeof addr);//retourne string
console.log("billAddr: " + typeof billAddr);//retourne string
console.log("homeAddr: " + typeof homeAddr);//retourne string
console.log("numberZero: " + typeof numberZero);//retourne number
console.log("boolFalse: " + typeof boolFalse);//retourne boolean
console.log("Une chaîne vide est-elle équivalente à null avec == ? Résultat : " + ("" == null));
console.log("Une chaîne vide est-elle équivalente à null avec === ? Résultat : " + ("" === null));
console.log("Une chaîne vide est-elle équivalente à undefined avec == ? Résultat : " + ("" == undefined));
console.log("Une chaîne vide est-elle équivalente à undefined avec === ? Résultat : " + ("" === undefined));
console.log("Une chaîne vide est-elle équivalente à 0 avec == ? Résultat : " + ("" == 0));
console.log("Une chaîne vide est-elle équivalente à 0 avec === ? Résultat : " + ("" === 0));
console.log("Une chaîne vide est-elle équivalente à false avec == ? Résultat : " + ("" == false));
console.log("Une chaîne vide est-elle équivalente à false avec === ? Résultat : " + ("" === false));
Résultats d'exécution :
Les tests montrent que l'utilisation de == peut conduire à des résultats inattendus lorsque la variable vaut 0 ou false.
Il est donc crucial d'utiliser === pour des comparaisons précises.
Méthode 1 : Utilisation de === mais cela pose un problème concernant les espaces et tabulations
//Méthode 1 : Comparaison pure avec === (pourquoi addr est vrai, tandis que billAddr et homeAddr sont faux ?)
console.log("Méthode 1 : Comparaison pure avec ===");
if (addr === "") {
console.log("addr est vide");
} else {
console.log("addr contient une valeur : " + addr);
}
if (billAddr === "") {
console.log("billAddr est vide");
} else {
console.log("billAddr contient une valeur : " + billAddr)
}
if (homeAddr === "") {
console.log("homeAddr est vide");
} else {
console.log("homeAddr contient une valeur : " + homeAddr);
}
if (numberZero === "") {
console.log("numberZero est vide");
} else {
console.log("numberZero contient une valeur : " + numberZero)
}
if (boolFalse === "") {
console.log("boolFalse est vide");
} else {
console.log("boolFalse contient une valeur : " + boolFalse);
}
Résultats :
Méthode 2 : Utilisation de .length
//Méthode 2 : Vérification uniquement par .length (remarquez les différences de longueur entre addr, billAddr, homeAddr)
console.log("Méthode 2 : Vérification par .length");
if (addr.length === 0) {
console.log("addr est vide, longueur = " + addr.length);
} else {
console.log("addr contient une valeur, longueur = " + addr.length);
}
if (billAddr.length === 0) {
console.log("billAddr est vide, longueur = 0");
} else {
console.log("billAddr contient une valeur, longueur de tabulation = " + billAddr.length)
}
if (homeAddr.length === 0) {
console.log("homeAddr est vide, longueur = 0");
} else {
console.log("homeAddr contient une valeur, longueur d'espace = " + homeAddr.length);
}
if (numberZero.length === 0) {
console.log("numberZero est vide, longueur = 0");
} else {
console.log("numberZero contient une valeur, longueur de tabulation = " + numberZero.length)
}
if (boolFalse.length === 0) {
console.log("boolFalse est vide, longueur = 0");
} else {
console.log("boolFalse contient une valeur, longueur d'espace = " + boolFalse.length);
}
Résultats :
Pour résoudre ce problème, on peut utiliser trim(), comme suit :
//Méthode 3 : Utilisation de .trim().length (correspond au comportement attendu, le résultat après trim est toujours 0)
console.log("Méthode 3 : Utilisation de .trim().length");
if (addr.trim().length > 0) {
console.log("addr contient une valeur, non vide");
} else {
console.log("longueur après trim : " + addr.trim().length);
console.log("addr est vide");
}
if (billAddr.trim().length > 0) {
console.log("billAddr contient une valeur, non vide");
} else {
console.log("longueur après trim : " + billAddr.trim().length);
console.log("billAddr est vide")
}
if (homeAddr.trim().length > 0) {
console.log("homeAddr contient une valeur, non vide");
} else {
console.log("longueur après trim : " + homeAddr.trim().length);
console.log("homeAddr est vide");
}
Résultats :
Méthode 4 : Convesrion en valeur booléenne pour vérification (notez que billAddr et homeAddr sont considérés comme non vides)
//Méthode 4 : Utilisation de ! (question : cette méthode semble bizarre pour les chaînes ? Les résultats montrent que !addr est vrai, !billAddr et !homeAddr sont faux)
//réponse : cette méthode n'est pas bizarre. Si une variable contient null, undefined, 0, "", false, alors !variable est vrai, !!variable est faux
console.log("Méthode 4 : Utilisation de !");
if (!addr) {
console.log("addr est vide");
} else {
console.log("addr contient une valeur");
}
if (!billAddr) {
console.log("billAddr est vide");
} else {
console.log("billAddr contient une valeur")
}
if (!homeAddr) {
console.log("homeAddr est vide");
} else {
console.log("homeAddr contient une valeur");
}
if (!numberZero) {
console.log("numberZero est vide");
} else {
console.log("numberZero contient une valeur")
}
if (!boolFalse) {
console.log("boolFalse est vide");
} else {
console.log("boolFalse contient une valeur");
}
Résultats :
Référence : https://www.delftstack.com/howto/javasrcipt/javascript-check-if-string-is-empty/