摘要:本質(zhì)上它登記了一堆回調(diào),并且按注冊回調(diào)的順序執(zhí)行。調(diào)用回調(diào)的過程由方法觸發(fā),該方法接受一個數(shù)據(jù)負(fù)載對象作為唯一參數(shù)。通過自身定義并注冊的回調(diào)進(jìn)入,而不是通過類似之類的方法調(diào)用。在某種情況下可能依賴,而在另一種情況下又依賴。
Flux: Actions and the Dispatcher
原文: Flux: Actions and the Dispatcher
Flux是Facebook用于構(gòu)建javascript應(yīng)用的架構(gòu)。它基于單向數(shù)據(jù)流。利用Flux我們將所有東西都拆分成小的組件(widgets)然后組合成龐大的應(yīng)用,而Flux成功應(yīng)對了所有遇到的困難。我們認(rèn)為這是一種非常好的組織代碼的架構(gòu),因此非常高興能夠?qū)⑺暙I(xiàn)給開源社區(qū)。Jing Chen在F8會議上展示了Flux(youtube視頻,墻內(nèi)慎點),從那以后我們了解到很多人對它非常感興趣。同時,我們公布了Flux概覽與帶有入門指南的TodoMVC示例。
Flux與其說是一整套的框架,不如說是一種模式,在React之上你只需要寫很少的代碼就可以開始使用它。直到最近我們都還沒有公布Flux的一個重要部分:dispatcher。但隨著Flux代碼庫和Flux主頁的建立,現(xiàn)在我們已經(jīng)將dispatcher開源并與生產(chǎn)環(huán)境版本保持同步
Dispatcher在Flux數(shù)據(jù)流中的作用dispatcher是單例的,在Flux應(yīng)用中它被用作數(shù)據(jù)流的中央集線器。本質(zhì)上它登記了一堆回調(diào),并且按store注冊回調(diào)的順序執(zhí)行。當(dāng)有新的數(shù)據(jù)傳入時,它向所有stores注冊的回調(diào)傳播此數(shù)據(jù)。調(diào)用回調(diào)的過程由dispatch方法觸發(fā),該方法接受一個數(shù)據(jù)負(fù)載對象(data payload object)作為唯一參數(shù)。
Actions 與 ActionCreators當(dāng)有新數(shù)據(jù)進(jìn)入系統(tǒng)時,無論是通過用戶交互還是web api請求,該數(shù)據(jù)會被封裝成一個action——一個包含了數(shù)據(jù)字段和特別聲明的action類型的對象。通常我們會新建一類工具方法的集合叫做ActionCreators,用于創(chuàng)建action對象并傳遞給dispatcher。
不同的actions用類型區(qū)分。當(dāng)所有stores接收到action時,通常他們通過識別類型來決定是否響應(yīng)和如何響應(yīng)。在Flux應(yīng)用中,stores和views都是“自治”的,他們的行為不由外部決定。actions通過store自身定義并注冊的回調(diào)進(jìn)入store,而不是通過類似setter之類的方法調(diào)用。
stores的“自治”消除了許多MVC框架中常見的糾結(jié)現(xiàn)象。傳統(tǒng)MVC框架model間的級聯(lián)更新往往會導(dǎo)致不穩(wěn)定的狀態(tài)并且使得應(yīng)用難以準(zhǔn)確測試。而Flux應(yīng)用則高度解耦,并且堅守了迪米特法則:系統(tǒng)中的不同對象之間相互了解得越少越好。這使得軟件更加可維護(hù),可擴展,和可測試,并且更利于新團(tuán)隊成員理解。
為什么需要Dispatcher隨著應(yīng)用規(guī)模的增長,Store之間的相互依賴變得無法避免。Store A可能會需要 Store B先執(zhí)行update,然后才能正確地update自己。Dispatcher可以讓我們先行調(diào)用并完成Store B所注冊的回調(diào),再繼續(xù)執(zhí)行Store A的業(yè)務(wù)。要顯式地聲明這種依賴,Store需要向dispatcher表明“我要等Store B處理完了才能繼續(xù)處理當(dāng)前的action”。而dispatcher的waitFor方法則提供了這種功能。
dispatch方法對回調(diào)的遍歷是簡單、同步式的。當(dāng)在執(zhí)行callback過程中遇到waifFor方法時,對當(dāng)前callback的調(diào)用就會中斷,wairFor方法會根據(jù)聲明的依賴重新確定遍歷順序(注:原文字面意思如此,但從dispatcher的源代碼看是檢查依賴項是否已執(zhí)行,若否,則立即去執(zhí)行依賴項),當(dāng)所有依賴都被執(zhí)行后,原先中止的callback才會繼續(xù)執(zhí)行
更進(jìn)一步地,waifFor方法可以在同一個store回調(diào)的不同action處理分支中使用。在某種情況下Store A可能依賴Store B,而在另一種情況下又依賴Store C。在action處理語句塊中使用waitFor使我們能夠更細(xì)粒度地控制依賴關(guān)系。
當(dāng)然也會出現(xiàn)問題,比如循環(huán)依賴。A依賴B然后B又依賴A這樣的情況,會導(dǎo)致無限循環(huán)。目前Flux實現(xiàn)的dispatcher在遇到這種情況時會拋出一個包含錯誤信息的Error來警告開發(fā)者,然后開發(fā)者可以選擇新建一個Store來避免這種情況。
注:從源代碼看其實不用新建store,只要通過register新注冊一個回調(diào)id即可,環(huán)檢測是基于回調(diào)id的,F(xiàn)lux的官方demo中每個store有一個dispatcherToken來保存該store的回調(diào)id,事實上一個store持有多個回調(diào)id也是可行的
Chat App示例我們和dispatcher同時公布的還有一個新的示例程序chat app ,稍微比TodoMVC的例子更復(fù)雜一點,以便于開發(fā)者能更好地理解Flux是如何解決Stores間的依賴關(guān)系以及如何調(diào)用web API的
注:這個flux-chat例子非常非常重要,store的waitFor和前置web api調(diào)用個人認(rèn)為是flux理念的核心,也是store與傳統(tǒng)MVC的Model層為何完全不同的核心
We"re hopeful that the new Flux repository will grow with time to include additional tools, boilerplate code and further examples. And we hope that Flux will prove as useful to you as it has to us. Enjoy!
注:客套話懶得翻了
文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址:http://systransis.cn/yun/85512.html
摘要:在方法中處理數(shù)據(jù)有三不同的角色派發(fā)器儲存視圖層我們的組件的主要思想是有一個單一源儲存他們只能通過觸發(fā)更新。這些操作負(fù)責(zé)調(diào)用派發(fā)器可以訂閱更改并相應(yīng)地更新自己的數(shù)據(jù)。與不同不使用派發(fā)器而是使用純函數(shù)來定義數(shù)據(jù)變異函數(shù)。 本文轉(zhuǎn)載自:眾成翻譯譯者:iOSDevLog鏈接:http://www.zcfy.cc/article/3812原文:https://www.fullstackreact...
摘要:應(yīng)用架構(gòu)是用來構(gòu)建客戶端應(yīng)用的一種應(yīng)用架構(gòu)體系。它是一種類似的架構(gòu),但是它更加簡單清晰,是一種單向數(shù)據(jù)流的架構(gòu)設(shè)計。將數(shù)據(jù)和動作類型傳遞給去分發(fā)數(shù)據(jù)流是一個包含所有動作類型的常量對象一個分發(fā)中心,它管理著應(yīng)用的所有數(shù)據(jù)流向。 Flux 應(yīng)用架構(gòu) Flux是Facebook用來構(gòu)建客戶端Web應(yīng)用的一種應(yīng)用架構(gòu)體系。它是一種類似MVC的架構(gòu),但是它更加簡單、清晰,是一種單向數(shù)據(jù)流的架構(gòu)設(shè)...
摘要:應(yīng)用架構(gòu)是用來構(gòu)建客戶端應(yīng)用的一種應(yīng)用架構(gòu)體系。它是一種類似的架構(gòu),但是它更加簡單清晰,是一種單向數(shù)據(jù)流的架構(gòu)設(shè)計。將數(shù)據(jù)和動作類型傳遞給去分發(fā)數(shù)據(jù)流是一個包含所有動作類型的常量對象一個分發(fā)中心,它管理著應(yīng)用的所有數(shù)據(jù)流向。 Flux 應(yīng)用架構(gòu) Flux是Facebook用來構(gòu)建客戶端Web應(yīng)用的一種應(yīng)用架構(gòu)體系。它是一種類似MVC的架構(gòu),但是它更加簡單、清晰,是一種單向數(shù)據(jù)流的架構(gòu)設(shè)...
摘要:自己英語一般,水平有限,獻(xiàn)上原文地址,還有我翻譯的中文地址,歡迎大家勘誤下面是自己的一點感想先說一下,我們知道,前端優(yōu)化有這么幾步,第一步首先呢我們知道,一個應(yīng)用要依賴好多條文件,而瀏覽器加載完一條,要執(zhí)行完這條才加載下一條,所以呢,就很慢 自己英語一般,水平有限,獻(xiàn)上原文地址,還有我翻譯的中文地址,歡迎大家勘誤 下面是自己的一點感想 先說一下webpack,我們知道,前端優(yōu)化有這么幾...
閱讀 2199·2021-11-18 10:02
閱讀 3302·2021-11-11 16:55
閱讀 2705·2021-09-14 18:02
閱讀 2442·2021-09-04 16:41
閱讀 2076·2021-09-04 16:40
閱讀 1200·2019-08-30 15:56
閱讀 2222·2019-08-30 15:54
閱讀 3173·2019-08-30 14:15