Syntaxe observable correcte ?

Version imprimable

Bonjour,

Débutant sur ce framework, je voulais savoir si ces 2 syntaxes sont équivalentes :

1ere syntaxe
Code:

1 2 3 4 5 6 7 8 9 10 11 ngOnInit() { obs = this.dataService.getArticles().pipe( map( (mockArticles: Article[]) => { mockArticles.filter( (articleUnit: Article) => articleUnit.author === 'John Doe' ); }) ); }
2eme syntaxe
Code:

1 2 3 4 5 6 7 8 9 10 ngOnInit() { obs = this.dataService.getArticles().pipe( map( (mockArticles: Article[]) => mockArticles.filter( (articleUnit: Article) => articleUnit.author === 'John Doe' ) ) ); }
Je pense que oui, mais je voudrais en être sûr

Deuxième question : j'ai du mal à comprendre cette syntaxe :
Code:

1 2 const getTemperature = city => 100 / city.length;
Une constante peut être une déclaration de fonction ? Les parenthèses pour passer les paramètres et les crochets sont facultatifs du coup ?

Merci de votre aide

****
ça fonctionne tes observables ?
tu peux me faire un console.log de : this.dataService.getArticles()

*****

Code:

1
2
 
const getTemperature = city => 100 / city.length;

en effet, en javascript on peut créer une fonction dans une variable

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
 
const getTemperature = city => 100 / city.length;                                 // la plus simple       // pas besoin de mettre return, ça le fait automatiquement (puisqu'il y a qu'une seule ligne)
 
const getTemperature = (city: number) => 100 / city.length;                 //  si on veut définir un type (number) à city        
 
const getTemperature = city => {  ...autres lignes...; ...;  return 100 / city.length;  }       // si contient plusieurs lignes alors on met {  }    // ATTENTION:   puisqu'il y a plusieurs lignes, il faut bien indiquer laquelle doit être retourné   (avec return ....)
 
const getTemperature = (city) => { ...autres lignes...; ...;  return 100 / city.length; }       // les () de (city) sont facultatif puisqu'on ne définit pas de type mais ça fonctionne qd même
 
const getTemperature = (city: number) => { ...autres lignes...; ...;  return 100 / city.length; }
 
function getTemperature(city) {                     //  classique
  return 100 / city.length;
}
 
function getTemperature(city: number) {                     //  classique     //  si on veut définir un type (number) à city
  return 100 / city.length;
}

utilisation:

Code:

1
2
 
  getTemperature(10);

23/07/2020, 14h39
olivier252

Salut,

Merci pour tes explications .

Pour les observables (enfin plutôt l'observable, la 2eme version est de moi) ça vient de ce tuto que je ne fais pas tourner pour l'instant

https://makina-corpus.com/blog/metie...s-dans-angular
23/07/2020, 15h36
dukoid

pour l'observable, les 2 syntaxes sont équivalentes
mais la 1ere tu n'auras pas de résultat
il y a un oublie, une instruction qui manque

regarde ce que j'ai écrit à propos du "return" dans mon message précédent et tu trouveras !
23/07/2020, 16h28
olivier252

Ah ok, parce que du coup le getArticles() renvoie un observable de type tableau d'articles (Observable<Article[]>)
Il faut faire un return obs après la fermeture de pipe ?

NON

Code:

// si contient plusieurs lignes alors on met { } // ATTENTION: puisqu'il y a plusieurs lignes, il faut bien indiquer laquelle doit être retourné (avec return ....)
Code:

1 2 3 4 5 6 7 8 9 10 ngOnInit() { obs = this.dataService.getArticles().pipe( map( (mockArticles: Article[]) => { return mockArticles.filter( (articleUnit: Article) => articleUnit.author === 'John Doe' ); }) ); }

24/07/2020, 09h55
olivier252

Ah ok, pourtant dans la 2eme syntaxe il y a plusieurs lignes aussi, non ?

non

le fait de mettre {} indique plusieurs lignes mais on peut en mettre qu'une seule.
ce qui est le cas dans le 1er

donc si tu mets des {} , un return est attendu...

je te conseil de tester:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
 
ngOnInit() {
    this.dataService.getArticles().pipe(
      map(
        (mockArticles: Article[]) => {
          return mockArticles.filter(
            (articleUnit: Article) => articleUnit.author === 'John Doe'
          );
        })
    ).subscribe((res: any) => {
        console.log(res);
});

24/07/2020, 11h57
olivier252

enfin dcompris, désolé pour mon côté boulet...