guida di stile angular2 - proprietà con simbolo del dollaro?


185

Guardando l' esempio di codice angular2 , vediamo alcune proprietà pubbliche con $ sign:

  <....>
  private missionAnnouncedSource = new Subject<string>();
  private missionConfirmedSource = new Subject<string>();
  // Observable string streams
  missionAnnounced$ = this.missionAnnouncedSource.asObservable();
  missionConfirmed$ = this.missionConfirmedSource.asObservable();
  <....>

Qualcuno può spiegare:

  • perché $ è usato (qual è il motivo dietro questa notazione? usalo sempre per proprietà pubbliche)?
  • vengono utilizzate proprietà pubbliche ma non metodi (ad es. missionAnnouncements (), missionConfirmations ()) - di nuovo, questa è una convenzione per le app ng2?

Non sembra che ci sia qualcosa al riguardo nella guida di stile ufficiale ?

Risposte:


265

$ suffix (reso popolare da Cycle.js ) viene utilizzato per indicare che la variabile è osservabile . Potrebbe arrivare anche alla guida ufficiale di stile, ma non è ancora lì

Maggiori informazioni qui: cosa significa il simbolo del dollaro con suffisso $?

Aggiornamento: Ulteriori informazioni sul segno "$" finale sul sito Web angolare qui: https://angular.io/guide/rx-library#naming-conventions-for-observables


4
Non arriverà alla guida di stile ufficiale. Metterò $ 100 su questo.
Eric Bishard,


66
@EricBishard Intendi 100 $
TabsNotSpaces

1
che dire delle promesse?
galki,

7
sicurezza del lavoro - rendere il codice più difficile da capire per i non addetti ai lavori.
java-addict301

14

Il paradigma $ naming è nato con Andre Saltz e suggerisce la pluralizzazione di tutti i nomi di variabili che contengono osservabili o flussi.

getAll(): Observable<Zone[]>{
    let zone$ = this.http
      .get(`${this.baseUrl}/zones`, {headers: this.getHeaders()})
      .map(mapZone);
      return zone$;
  }

Un altro approccio è quello di pluralizzare nomi di variabili che contengono osservabili o flussi con un carattere unicode che corrisponde all'ultima lettera della parola. Questo risolve il problema con parole che non sono pluralizzate da una "s".

mouse$ vs mic€

Nessuna di queste convenzioni di denominazione si trova nella guida ufficiale dello stile angolare. L'uso dell'uno o dell'altro (o nessuno) dipende interamente dalle preferenze personali.


10
cactu $ vs cactï
BYTE RIDER

Bel riferimento! Dai un'occhiata anche a questo articolo. Ciò che mi infastidisce è trovare un tentativo di fare questo nel mio codebase (altri collaboratori) e sbagliarlo, mettendo il suffisso sulla variabile sbagliata o, peggio ancora, avviarla. Ho visto persone usare questo anche senza coerenza, in quel caso non ha assolutamente senso. medium.com/@benlesh/…
Eric Bishard

Se vuoi usarlo, consiglierei le seguenti convenzioni di denominazione come in questo repository: github.com/bodiddlie/rxheroes/blob/master/app/effects/hero.ts E anche farlo sempre o mai. Sii coerente per l'amor del cielo osservabile.
Eric Bishard,

2
fish$vsfish€$
Martin Schneider,

11

Aggiornamento : https://angular.io/guide/rx-library#naming-conventions-for-observables

Poiché le applicazioni angolari sono per lo più scritte in TypeScript, in genere saprai quando una variabile è osservabile. Sebbene la struttura angolare non imponga una convenzione di denominazione per gli osservabili, vedrai spesso osservabili denominati con un segno "$" finale.

Ciò può essere utile durante la scansione del codice e la ricerca di valori osservabili. Inoltre, se si desidera che una proprietà memorizzi il valore più recente di un osservabile, può essere conveniente utilizzare semplicemente lo stesso nome con o senza "$".


Originale :

Ho visto le variabili terminare con la $lettura del tutorial ufficiale sull'eroe:

<div id="search-component">
  <h4>Hero Search</h4>

  <input #searchBox id="search-box" (keyup)="search(searchBox.value)" />

  <ul class="search-result">
    <li *ngFor="let hero of heroes$ | async" >
      <a routerLink="/detail/{{hero.id}}">
        {{hero.name}}
      </a>
    </li>
  </ul>
</div>

Guarda da vicino e vedrai che * ngPer scorre su un elenco chiamato heroes$, non eroi .

<li *ngFor="let hero of heroes$ | async" >

$ È una convenzione che indica che gli eroi $ è un osservabile, non un array.

Nella maggior parte dei casi non sottoscriviamo tali variabili osservabili nel componente. Di solito utilizziamo AsyncPipe per abbonarci automaticamente alle variabili osservabili

Non l'ho trovato nella Guida allo stile da quando Angular5.1 è stato rilasciato ieri (6 dicembre 2017).


Da Angular 9 style guideheroes: Observable<Hero[]>;
Ricardo Saracino,

9

Non l'ho visto $nella guida di stile, ma l'ho visto usato frequentemente per proprietà pubbliche che fanno riferimento a osservabili a cui è possibile abbonarsi.

Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.