說說最近的項目總結(jié)吧

part1. 如何減少代碼中的指針錯誤,我們知道空指針錯誤會試整個頁面掛掉,所以這個錯誤要盡量避免

最近讀到了一篇阿里是如何減少前端空指針錯誤的文章,里面介紹了兩個比較常見的寫法來避免這,一個是寫了一個工具函數(shù)遍歷對象,判斷有沒有值,沒有返回空,一個是使用的時候判斷前面一個父對象是不是空再使用。其實我們在以前的項目里面為了避免空指針就是使用的類似方法的辦法,然后這次寫了個工具方法實踐第一張方法,但是在項目中如果遇到了復(fù)雜的對象這個方法就很難寫了,例如:對象和數(shù)組混用的情況。
然后在這次項目的數(shù)據(jù)初始化中用到了這種寫法,感覺還不錯.

arr&&arr.length>0&&arr.map((value)=>{
return <component value={value}/>);
});

以及

let initArr = arr.map((v)=>{
return v;
}) || []

以及

let xx = obj&&obj.obj2&&obj.obj2[0]||{};

這三種方法基本上可以解決空指針的問題

part2. 如何寫組件更利于維護

之前的項目組件管理都有點混亂,這次組件目錄按功能先分一級目錄,然后按名稱分二級目錄,沒錯就是按名字分二級目錄,然后每個文件夾必須有個index.js作為組件入口,這樣命名比較容易找主組件,這種命名和目錄結(jié)構(gòu)很多開源的項目有用到。

part3. 不同功能的職能分配

首先功能模塊 大概有 store用于存儲數(shù)據(jù)和action,model用于確定數(shù)據(jù)模型,數(shù)據(jù)初始化需要的二級接口也在model中調(diào)用,組件渲染頁面和組件中不設(shè)計到store的操作函數(shù),遇到操作store則調(diào)用store的action。
分配好各模塊職能后,不同代碼函數(shù)不同分類,使代碼不過與太亂利于維護。

part4. 關(guān)于store的定義

之前項目差不多是一類數(shù)據(jù)用一個store,這次仔細想了下,兩個store已經(jīng)可以應(yīng)付大部分的需求,如果遇到新需求另加store,一個mainStore主要數(shù)據(jù),一個controlStore控制頁面。

part5. 暫時只想到這么多,項目完結(jié)后再補充

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容