Discussion :

[olivier252]

Bonjour,

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

1ere syntaxe

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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 :

Sélectionner tout - Visualiser dans une fenêtre à part

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 :

Sélectionner tout - Visualiser dans une fenêtre à part

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

[dukoid]

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




*****

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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

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

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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 :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
  getTemperature(10);

[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

[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 !

[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 ?

[krakatoa]

NON

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

// 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 :

Sélectionner tout - Visualiser dans une fenêtre à part

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'
          );
        })
    );
  }

[olivier252]

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

[krakatoa]

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 :

Sélectionner tout - Visualiser dans une fenêtre à part

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);
});

[olivier252]

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