Explicación con ejemplos:
El valor por defecto de una variable o atributo es undefined
. En navegadores antiguos este valor estaba establacido como un atributo de la clase Window, y podía ser redefinido. Eso podía dar muchos problemas y por ello en mucha literatura antigua recomendaban nunca hacer una comparación directa. Hoy día los navegadores no permiten redefinirlo y una comparación directa funciona siempre:
var hola;
console.log(hola)
//comparación directa
if (hola===undefined) {
console.log('Hola no tiene valor definido');
}
if (typeof hola === 'undefined') {
console.log('Hola sigue sin valor definido');
}
if (undefined==null) {
console.log('Cuidado al compararlo con null, == no los distingue')
}
if (!(undefined === null)) {
console.log('En cambio === los distingue');
}
El valor null
es útil cuando quieres expresamente distinguir entre "valor no definido" y "sin valor":
var resultado;
function test() {
if (resultado === undefined) {
console.log('No se ha definido aún');
} else if (resultado===null) {
console.log('se ha definido como null');
}
}
setTimeout(()=> resultado=null)
test();
setTimeout(()=> test());
También sirve para detectar atributos no definidos. Y, por supuesto, es un valor "falso", lo cual es útil cuando quieres llamar a una función que quizá no está presente:
var objeto= {
a: 1,
c: function () {
console.log('hola');
}
}
console.log('el atributo a es:' + objeto.a);
console.log('el atributo b es:' + objeto.b);
if (objeto.d) { // no existe, la condición no se cumple
objeto.d();
}
if (objeto.c && typeof objeto.c === 'function') {
objeto.c();
}