最近有一篇在詢問 變數的尾巴有 $ 的，是代表什麼意思，我的回答是，有人將那個符號用來標是該變數是 Observable 型別變數，這屬不成文的默契。也有人提出說，變數的命名方式，不應該掛型別辨識用的符號。
1個讚
若依照 clean code 建議，變數、屬性命名時不應該任何暗示型別方式，而是該使用 IDE 工具顯示型別。
如果編輯器沒有型別提示，或是不是使用Typescript開發 RxJS 的，就沒有型別提示了。那又該如何解決這比較特殊的 Observable 型別。
我個人是不喜歡加 $
因為 VS Code 預設情況下 對變數名稱 雙擊左鍵時 $ 不會反白起來 有點煩 
遙想當年，看到變數有 $ 的時候，我還以為那是突變體，是不是有什麼特殊效果…
但我覺得，除非是團隊開發會需要做辨識的項目，通常還是不要加比較好吧?
- 個人不會加。
- 團隊規範要的話才會加。
可以舉個一定要加 $ 才能使用的例子嗎？
沒有那種例子，因為 $ 不是必需品。
有沒有 $ 都可以跑
1個讚
傾向不加，除非團隊協議要加…
我今天在寫 ngIf 文章的時候發現如果不加 $ 的麻煩。
例如說我有一個 Observable變數想要透過 async 的方式在頁面上顯示
<div *ngIf=" user|async">
{{ (user|async)?.name }}
</div>
Angular 在頁面上有另外一個寫法，可以讓我們在頁面上將資料儲存在 local 變數中
<div *ngIf=" user|async as _user">
{{ _user.name }}
</div>
假設，我前面的Observable的變數使用 $ 的話，就可以寫成這樣
<div *ngIf=" user$ | async as user">
{{ user.name }}
</div>
這樣看起來是不是會比較好懂呢?
透過 $ 來辨別同名稱的對象是 Observable 還是 Variable 聽起來不錯
可是第一種寫法比較漂亮又比較短，不是嗎～
前題是知道 ? 是做啥用的
你不講，我還沒發現我第一段寫錯了。
第一段的問題是 他有兩個 async，所以會被執行兩次。(如果該 Observable 沒有設定為 mulitcast 模式的話，就會被執行兩次)
所以使用 as 這方法會比較合適。
我這裡的範例只有顯示一個屬性而已，想像一下，如果要顯示多個屬性時，又不想多寫一個 component 時，會是怎樣的情境阿。
<div *ngIf=" user|async">
<p>Name: {{ (user|async)?.name }}</p>
<p>Gender: {{ (user|async)?.gender }}</p>
<p>Age: {{ (user|async)?.age }}</p>
</div>
或是這樣子寫
<div *ngIf=" user|async as _user">
<p>Name: {{ _user.name }}</p>
<p>Gender: {{ _user.gender }}</p>
<p>Age: {{ _user.age }}</p>
</div>
你喜歡哪一種
4個讚
這裡有一篇在講 Finnish Notation 的文章
1個讚
岔題問一個問題，今天在寫程式的時候發現採用第一種方式
如果寫這樣，會取不到資料
<div *ngIf=" user | async">
{{ user.name }}
</div>
這樣就可以
<div *ngIf=" user | async; let aaa">
{{ aaa.name }}
</div>
這部分應該用什麼關鍵字去找文件?
<div *ngIf=" user | async">
{{ user.name }}
</div>
如果你想要使用這種方式呈現，那正確的寫法是
<div *ngIf=" user | async">
{{ (user | async)?.name }}
</div>
這裡可以發現, async 被寫了很多次，所以才會使用 let 來設定 aaa 變數 ，
運作方式是當 user | async 取得資料後，將資料指給變數 aaa
之後再這一個 ngIf 下，就可以讀取 aaa 變數，不用在重複寫 async
要減少使用 async 的數量，每一個 async 都會觸發一次 subscribe 的行為。使用上要非常小心
2個讚
非常感謝，了解了!