從巢狀結構中取值時如何編寫兜底邏輯

2022-01-10 08:23:44 字數 3472 閱讀 4204

github總基地:

位元組跳動幸福裡大前端團隊邀請各路高手前來玩耍,團隊和諧有愛,技術硬核,位元組範兒正,覆蓋前端各個方向技術棧,總有位置適合你,base北京,社招實習都有hc,不要猶豫,內推簡歷請直接瞄準[email protected]~

目錄

let  = b || {};

a.map(item => );

對a解構時賦予的預設值(空陣列),僅當b.a的值為undefined時才會生效,如果b.a的值為null,預設值就無法生效,使得第二行呼叫map方法的**直接報錯,所以第一行**兜底並沒有做好。

結論:數值挖取和後續處理統一使用lodash提供的方法,例如_.map()等基本可以避免在業務層充斥過多校驗和防禦**,lodash的api語義化也相對清晰,容易理解開發者意圖。但如果和es6原生方法配合的話,還需要繼續做容錯處理以免被null坑。

• 路徑中有null或undefined時,即使有後續取值路徑,也不會報錯,而是返回預設值

• 如果取到的值為null,則返回null(不會觸發預設值),所以對於期望型別為陣列型別的,下一步如果想呼叫原生陣列方法,仍然需要進行型別容錯,如果配合lodash提供的其他方法則不用容錯。

const get = require('lodash/get');

const response =

}},,

"student1":

}}],

"test":

},"message": "success",

"status": 0

}//常規取值

let result1=get(response,'data.history[1].total.student1','defaultvalue');

let result2=get(response,'data.history[3].total.student1','defaultvalue');

let result3 = get(response, 'data.test.test_undefined','defaultvalue');

let result4 = get(response, 'data.test.test_null','defaultvalue');

let result5 = get(response, 'data.test.test_undefined.lark','defaultvalue');

let result6 = get(response, 'data.test.test_null.lark','defaultvalue');

console.log(result1); //

console.log(result2); // defaultvalue

console.log(result3); //defaultvalue

console.log(result4); //null

console.log(result5); //defaultvalue

console.log(result6); //defaultvalue

結論:實現原理和語法都更精簡,可以更好地配合es6原生方法。

• 路徑中有null或undefined時,即使有後續取值路徑,也不會報錯,而是返回預設值

• 最終結果為undefined或null時都返回預設值(和lodash.get的區別)

• mdn中關於可選鏈的描述

首先配置babel外掛程式:

在**中使用可選鏈:

const response = 

}},,

"student2":

}}],

"test":

},"message": "success",

"status": 0

}let result1 = response.data?.history[1]?.total?.student1 ?? 'defaultvalue';

let result2 = response.data?.history[3]?.total?.student1 ?? 'defaultvalue';

let result3 = response.data?.test?.test_undefined ?? 'defaultvalue';

let result4 = response.data?.test?.test_null ?? 'defaultvalue';

let result5 = response.data?.test?.test_undefined?.lark ?? 'defaultvalue';

let result6 = response.data?.test?.test_null?.lark ?? 'defaultvalue';

console.log(result1); //

console.log(result2); // defaultvalue

console.log(result3); // defaultvalue

console.log(result4); // defaultvalue

console.log(result5); // defaultvalue

console.log(result6); // defaultvalue

原文可見:如何優雅安全地在深層資料結構中取值

/**

* * @param p ['a','b'....] 屬性路徑

* @param o 待取值物件

* @param d 預設值 defaultvalue

*/const get = (p, o, d) => p.reduce((xs, x) => (xs && xs[x]) ? xs[x] : d, o);

源**:

const a = 

}};let r = a.b?.c?.d ?? "defaultvalue";

編譯後:

var _a$b$c$d, _a$b, _a$b$c;

const a =

}};let r = (_a$b$c$d = (_a$b = a.b) === null || _a$b === void 0 ? void 0 : (_a$b$c = _a$b.c) === null || _a$b$c === void 0 ? void 0 : _a$b$c.d) !== null && _a$b$c$d !== void 0 ? _a$b$c$d : "defaultvalue";

基本邏輯可以按括號從內往外看,並不複雜,就是每次取屬性都對undefined和null進行了容錯處理。

結構體中巢狀結構體

結構體的巢狀問題 結構體的自引用 self reference 就是在結構體內部,包含指向自身型別結構體的指標。結構體的相互引用 mutual reference 就是說在多個結構體中,都包含指向其他結構體的指標。1.1不使用typedef時 錯誤的方式 struct tag 1 這種宣告是錯誤的,...

巢狀結構體案例

這個案例還是有很多地方可以學習的,決定記錄一下 參考 黑馬程式設計師匠心之作 c 教程從0到1入門程式設計 include include include include using namespace std 定義結構體 struct student struct teacher 賦值函式 voi...

結構體巢狀結構體名

結構體巢狀結構體名 前一段時間在看ddk中例子的時候,看到這樣的的結構體定義 typedef struct common device data common device data,pcommon device data typedef struct pdo device data pdo dev...