// 我們知道 createStore 返回三個(gè)函數(shù) { subscribe, dispatch, getState }。
// 并且需要傳入一個(gè)reducers
function reducer(state = 0, action) {
switch (action.type) {
case 'INCREMENT':
return state + 1;
case 'DECREMENT':
return state - 1;
default:
return state;
}
}
const createStore = (reducer) => {
let currentState; // state
let observers = [] // 觀察者隊(duì)列
// 直接返回當(dāng)前狀態(tài)
// https://github.com/reduxjs/redux/blob/master/src/createStore.ts#L125
function getState() {
return currentState
}
// 觸發(fā)reducers內(nèi)的方法九昧，更改 state
// https://github.com/reduxjs/redux/blob/master/src/createStore.ts#L246
function dispatch(action) {
currentState = reducer(currentState, action)
observers.forEach(fn => fn())
}
// subscribe 將傳入的回調(diào)加入觀察者隊(duì)列齐莲，觸發(fā)dispatch的時(shí)候會(huì)觸發(fā)所有回調(diào)
// https://github.com/reduxjs/redux/blob/master/src/createStore.ts#L160
// redux 使用了 proposal-observable 這個(gè)庫(kù)的觀察者模式
// 地址:https://github.com/tc39/proposal-observable
function subscribe(cb) {
observers.push(cb)
}
// https://github.com/reduxjs/redux/blob/master/src/createStore.ts#L341
// 初始化store數(shù)據(jù)
dispatch({type:'INIT_SATATE'})
return { getState, dispatch, subscribe }
}
export const store = createStore(reducer)
store.subscribe(()=>{
console.log(store.getState())
})
手寫(xiě)一個(gè)redux
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
- 文/潘曉璐 我一進(jìn)店門(mén)屉栓，熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái)舷蒲，“玉大人，你說(shuō)我怎么就攤上這事友多∩剑” “怎么了？”我有些...
- 文/不壞的土叔 我叫張陵域滥，是天一觀的道長(zhǎng)纵柿。 經(jīng)常有香客問(wèn)我蜈抓，道長(zhǎng)，這世上最難降的妖魔是什么昂儒？ 我笑而不...
- 正文 為了忘掉前任沟使，我火速辦了婚禮，結(jié)果婚禮上渊跋，老公的妹妹穿的比我還像新娘腊嗡。我一直安慰自己，他們只是感情好刹枉，可當(dāng)我...
- 文/花漫 我一把揭開(kāi)白布叽唱。 她就那樣靜靜地躺著，像睡著了一般微宝。 火紅的嫁衣襯著肌膚如雪棺亭。 梳的紋絲不亂的頭發(fā)上，一...
- 那天蟋软，我揣著相機(jī)與錄音镶摘，去河邊找鬼。 笑死岳守，一個(gè)胖子當(dāng)著我的面吹牛凄敢，可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播湿痢，決...
- 文/蒼蘭香墨 我猛地睜開(kāi)眼涝缝，長(zhǎng)吁一口氣：“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼！你這毒婦竟也來(lái)了譬重？” 一聲冷哼從身側(cè)響起拒逮，我...
- 序言：老撾萬(wàn)榮一對(duì)情侶失蹤，失蹤者是張志新（化名）和其女友劉穎臀规，沒(méi)想到半個(gè)月后滩援，有當(dāng)?shù)厝嗽跇?shù)林里發(fā)現(xiàn)了一具尸體，經(jīng)...
- 正文 獨(dú)居荒郊野嶺守林人離奇死亡塔嬉，尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
- 正文 我和宋清朗相戀三年玩徊，在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片谨究。...
- 正文 年R本政府宣布，位于F島的核電站俩檬，受9級(jí)特大地震影響萎胰，放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜棚辽，卻給世界環(huán)境...
- 文/蒙蒙 一技竟、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧屈藐，春花似錦榔组、人聲如沸。這莊子的主人今日做“春日...
- 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)。三九已至包归，卻和暖如春锨推，著一層夾襖步出監(jiān)牢的瞬間，已是汗流浹背公壤。 一陣腳步聲響...
- 正文 我出身青樓沾鳄，卻偏偏與公主長(zhǎng)得像，于是被迫代替她去往敵國(guó)和親确憨。 傳聞我的和親對(duì)象是個(gè)殘疾皇子译荞，可洞房花燭夜當(dāng)晚...
推薦閱讀更多精彩內(nèi)容
- 簡(jiǎn)介：簡(jiǎn)單實(shí)現(xiàn)react-redux基礎(chǔ)api react-redux api回顧 把store放在context...
- 本周在閱讀redux源碼時(shí)，發(fā)現(xiàn)一個(gè)文章休弃，由簡(jiǎn)至深吞歼，甚好，原文地址在這里玫芦，學(xué)習(xí)一下。 但是本篇內(nèi)容并不是介紹red...
- 前言 記得開(kāi)始接觸 react 技術(shù)棧的時(shí)候本辐，最難理解的地方就是 redux桥帆。全是新名詞：reducer、stor...
- 搭建一個(gè)React-redux-router + antd項(xiàng)目（一）初始化項(xiàng)目搭建一個(gè)React-redux-ro...
- webpack配置 一切都是安裝文檔配置慎皱，結(jié)果報(bào)了個(gè)錯(cuò)： [HMR] Hot Module Replacement...
