Implémentation de la fonction JavaScript areDifferent (oldValue, newValue) pour comparer le style de type humain vide

Question

Je reçois et j'objecte du back-end avec quelques propriétés et utilise AngularJS pour les mettre dans des champs de saisie (entrées, zones de texte, cases à cocher, liste déroulante listes).

Ces propriétés sont dans certains cas, une valeur de texte, dans certains une valeur numérique, mais peut aussi être null, undefined, false ou "".

Je clone cet objet puis vérifie si l'utilisateur apporte des modifications à chacune de ces valeurs en comparant l'ancienne (stockée) avec la nouvelle valeur (courante).

Je ne souhaite pas utiliser la classe ng-dirty pour détecter une modification car elle ne disparaît pas lorsque vous revenez à la valeur précédente après une modification antérieure (par exemple, lorsque vous utilisez Ctrl + Z).

Je pensais que cette tâche serait simple, mais j'ai des problèmes avec cela en raison des valeurs ambiguous nature of JS.

Bien sûr, je traite chacun de ces:

• null
• undefined
• false
• ""

une "valeur vide", car pour l'utilisateur « un champ vide est un champ vide ", quel que soit le modèle stocké sous En dessous. Ainsi, par exemple, un changement de undefined à "" n'est pas vraiment un changement.

Jusqu'à présent, j'ai ceci:

$scope.areDifferent = function (oldValue, newValue) { 

    var a = true, b = true; 

    if (oldValue === null || 
     oldValue === undefined || 
     oldValue === false || 
     oldValue === "") { 
     a = false; 
    } 

    if (newValue === null || 
     newValue === undefined || 
     newValue === false || 
     newValue === "") { 
     b = false; 
    } 

    if (!a && !b) { 
     return false; // both values are "empty" 
    } 
    else if (a != b) { 
     return true; // one of the values is "non-empty" 
    } 
    else { 
     return oldValue != newValue; // compare the value of "non-empty" properties 
    } 
} 

Mais je suis curieux de savoir si cela est vrai (ce qu'il ya des cas limites non couvertes?) Et si elle peut être simplifiée, parce que je sais que dans JS il y a quelques shorthand coding techniques utiles comme:

• a || ''
• if(a)
• if(a.length)
• if(a == null)

J'ai essayé de les utiliser ici, mais il ne conduit qu'à la frustration parce qu'il ya toujours un cas de bord qui ne sont pas couverts. Toute aide appréciée.

Answer 1

Vous pouvez utiliser exclusive OR et vérifier les valeurs avec

if (!oldValue && newValue || oldValue && !newValue) { 
    // update 
} 

cela signifie que, si l'oldValue est truthy et newValue est falsy ou oldValue est falsy et newValue est truthy puis faire une mise à jour des données.

Une vérification étendue pour le même type et les modifications.Êtes-vous certain de vouloir traiter `false` comme une valeur vide?

if (!oldValue && newValue || oldValue && !newValue || typeof oldValue === typeof newValue && oldValue !== newValue) { 
    // update 
}