0

En este codigo no entiendo porque el if que esta adelante se ignora ya que aunque haya un error en la autenticacion, siempre pasa a la pagina principal sin importar si la variable err es true.

entrar()
{ 
var err=false;

firebase.auth().signInWithEmailAndPassword(this.email, this.password).then(function(result){
  console.log("exito");
  err=false
})
.catch(function(error) {
  console.log("error");
  console.log(error.code);
  console.log(error.message);
  err=true;
});

if (err){
console.log("error");}
else{
this.navCtrl.push(HomePage);}
}  

Alguien me explica que estoy haciendo mal.

JackNavaRow
  • 6,836
  • 5
  • 22
  • 49
  • 1
    Claro, el catch se ejecuta en forma asincrona en un momento posterior cuando `signInWithEmailAndPassword` finaliza. En cambio el codigo `if else` de abajo se ejecuta inmediatamente – Klaimmore Mar 12 '18 at 17:45
  • Eso que me dices tiene mucho sentido, soy demasiado nuevo en este lenguaje y hay conceptos que no entiendo bien. – ctrl_alt_del Mar 12 '18 at 17:46
  • Como dice Klaimmore, es por la asincronía de la promesa. Te recomiendas leas un poco sobre el tema, [aquí](https://developer.mozilla.org/es/docs/Web/JavaScript/Guide/Usar_promesas) – Federico Madoery Mar 12 '18 at 17:46
  • Puse dentro del .then(function....) esto: this.navCtrl.push(HomePage); y ahora me dice que: Cannot read property 'navCtrl' of undefined aunque si parece reconocer el fallo de autenticacion. – ctrl_alt_del Mar 12 '18 at 17:54
  • lee algo de [Promesas en javascript](https://es.stackoverflow.com/questions/64265/qu%C3%A9-es-una-promesa-en-javascript) – JackNavaRow Mar 12 '18 at 18:04
  • claro porque ahora el contexto es la function ejecutada – LPZadkiel Mar 12 '18 at 18:04
  • Les agradezco a todos grandemente por sus respuestas. – ctrl_alt_del Mar 12 '18 at 18:24

1 Answers1

3

Ya teniendo una funcion then y err escribiendo la lógica de cuando es satisfactorio y cuando da error quedaria lo siguiente :

entrar(){ 
  var err=false;
  var _this = this; //guardamos la instancia
  firebase.auth().signInWithEmailAndPassword(this.email, 
  this.password).then(function(result){
    console.log("exito");
    err=false;
    _this.navCtrl.push(HomePage);
  })
  .catch(function(error) {
    console.log("error");
    console.log(error.code);
    console.log(error.message);
    err=true;
});

Con respecto al guardar la instancia this , generalmente el this es el objeto que llama a la funcion, ya sea un objeto javascript o un objeto del DOM, pero cuando utilizas funciones que llaman funciones anónimas el alcance de this el contexto es el dentro de la funcion por eso te da undefined.

Te aconsejo que busques un tutorial sobre el this en javascript, porque es un poco complicado de explicar (al menos para mi), aprenderlo en la practica será darte de cabezazos contra el teclado.

Algunos enlaces de referencia

Contexto this en un Objeto

Que Son Promesas

JackNavaRow
  • 6,836
  • 5
  • 22
  • 49
LPZadkiel
  • 2,172
  • 5
  • 10
  • 1
    tu respuesta es buena, para los que saben , trata de mejorar tu explicacion y te aseguro que muchos usuarios de SoEs te premiaran por eso, explica el porque _this, porque tiene el catch ,el then y otras cosas, yo le agregaria a la respuesta que por convencion en algunos programadores a las variables que manejan el dom le colocan $ – JackNavaRow Mar 12 '18 at 18:22
  • @LPZadkiel mi estimado, diste en el clavo. – ctrl_alt_del Mar 12 '18 at 18:23
  • @LPZadkiel segun yo veia en Visual Studio Code cuando ponia el mouse sobre navCtrl dentro de la funcion que no me daba la informacion sino que me decia any, ¿hay alguna especie de perdida de alcance en esas funciones? – ctrl_alt_del Mar 12 '18 at 18:26
  • @ctrl_alt_del si bien te resolvio el problema creo que debes entender lo que hizo , por favor una vez editada la respuesta que espero que lo haga pasa de nuevo para que aprendas un poco mas sore la asincronia y javascript – JackNavaRow Mar 12 '18 at 18:28
  • @JackNavaRow comprendo que ese tipo de codigo es asincrono, el if esta fuera de la parte asincrona y es por tanto sincrona. Cuando el if se ejecuta, la todavia no se ha resuelto la promesa y err tiene false por tanto. Ademas veo que dentro de la promesa se pierde el ambito y el this no funciona – ctrl_alt_del Mar 12 '18 at 18:35
  • 1
    me es un poco engorroso explicar el alcance del this, generalmente el this es el objeto que llama a la funcion, ya sea un objeto javascript o un objeto del DOM, pero cuando utilizas funciones que llaman funciones anónimas el alcance de this ya no existe por eso te manda undefined, te aconsejo que busques un tutorial sobre el this en javascript, porque es un poco complicado de explicar (al menos para mi), aprenderlo en la practica será darte de cabezazos contra el teclado. – LPZadkiel Mar 12 '18 at 19:29