constructor(http:HttpClient){
console.log(http);
http.get<Object[]>("http://localhost:3000/flavio/photos").subscribe(photo =>{
this.photos=photo;
});
}vs
constructor(http:HttpClient){
console.log(http);
http.get<Object[]>("http://localhost:3000/flavio/photos").subscribe(function(photo){
this.photos = photo;
console.log(this.photos);
});
}
Fala aí Maicon, tudo bem? O problema acontece por conta do contexto referente a this de cada uma.
Arrow functions: Possuem o escopo de onde foram criadas.
Funções normais: Possuem escopo de onde foram executadas.
Dessa maneira, quando você está usando arrow function e faz uso de this, o this será referente ao seu componente, dessa maneira, ele vai conseguir acessar o this.photos.
Porém, quando você usa a função normal, o escopo muda, a referencia de this será o subscriber, logo, o mesmo não possuí acesso á this.photos.
Espero ter ajudado.
Boa noite, Maicon! Como vai?
O segundo caso não funciona pois o this faz referência ao contexto interno de onde foram executadas! E dentro desse contexto não há nenhum objeto photos! No primeiro caso, o this faz referência ao contexto do lugar onde a função foi declarada, ou seja, o próprio objeto da classe em questão! Essa diferença ocorre pq as arrow functions funcionam de uma forma um pouco diferente em relação às funções normais!
Para saber mais: Se vc quiser se aprofundar um pouco mais nesse assunto, os cursos de JavaScript avançado do mestre Flávio tratam sobre ele e várias outras coisa bacanas!
Pegou a ideia? Qualquer coisa é só falar!
Grande abraço e bons estudos, meu aluno!