Javascript如何避免調(diào)用不存在的屬性而導(dǎo)致報TypeError錯？

張紅新發(fā)布于2019-08-23 14:54 / 730人閱讀

摘要：問題上述代碼會返回方法一方法二使用方法三方法四自判斷鏈接自判斷鏈接還未納入官方規(guī)范中，只處于第一階段的實驗特性。您需要在中添加后方可使用它。參考鏈接譯優(yōu)秀開發(fā)人員應(yīng)掌握的個技巧

問題

var object = { "a": [{ "b": { "c": 3 } }] }

console.log(object.a[0].b.c.d)

上述代碼會返回

方法一

var object = { "a": [{ "b": { "c": 3 } }] }

console.log(object&&object.a)
console.log(object&&object.a&&object.a[0])
console.log(object&&object.a&&object.a[0]&&object.a[0].b)
console.log(object&&object.a&&object.a[0]&&object.a[0].b&&object.a[0].b.c)
console.log(object&&object.a&&object.a[0]&&object.a[0].b&&object.a[0].b.c&&object.a[0].b.c.d)

方法二

使用lodash

var object = { "a": [{ "b": { "c": 3 } }] }

console.log(_.get(object, "a"))
console.log(_.get(object, "a[0]"))
console.log(_.get(object, "a[0].b"))
console.log(_.get(object, "a[0].b.c"))
console.log(_.get(object, "a[0].b.c.d"))

方法三

var getProps = (p, o) => p.reduce((xs, x) => (xs && xs[x]) ? xs[x] : null, o)

var object = { "a": [{ "b": { "c": 3 } }] }

console.log(getProps(["a"], object))
console.log(getProps(["a", "0"], object))
console.log(getProps(["a", "0", "b"], object))
console.log(getProps(["a", "0", "b", "c"], object))
console.log(getProps(["a", "0", "b", "c", "d"], object))

方法四

自判斷鏈接,自判斷鏈接還未納入官方規(guī)范中，只處于第一階段的實驗特性。您需要在 babelrc 中添加 @ babel / plugin-proposal-optional-chaining 后方可使用它。

var object = { "a": [{ "b": { "c": 3 } }] }

console.log(object?.a[0]?.b?.c?.d)

參考鏈接

[譯] 優(yōu)秀 JavaScript 開發(fā)人員應(yīng)掌握的 9 個技巧

云服務(wù)器 GPU云服務(wù)器屬性導(dǎo)致只刪除小米云服務(wù)器的視頻而不刪除本機(jī)視頻服務(wù)器報內(nèi)存錯遠(yuǎn)程報錯提示協(xié)議

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/101337.html

相關(guān)文章

貓頭鷹的深夜翻譯：從1000+JS項目中匯總的10個最容易出現(xiàn)的錯誤(以及如何解決)

摘要：常出現(xiàn)的錯誤前十位為了可讀性，錯誤名稱進(jìn)行了一定的簡寫。讓我們深入了解每個錯誤發(fā)生的原因以及解決方法。這個問題很容易解決。當(dāng)未捕獲的錯誤跨越違法跨域策略的域邊界時，會發(fā)生腳本錯誤。這是當(dāng)你在中試圖調(diào)用的方法時出現(xiàn)的錯誤。 JavaScript常出現(xiàn)的錯誤前十位 showImg(https://segmentfault.com/img/bV3Z1z?w=1116&h=691); 為了可讀...

eccozhou 2019-08-26 11:46 評論0 收藏0
JavaScript之錯誤異常探討

摘要：提供一套錯誤處理機(jī)制，錯誤是干擾程序正常流程的非正常的事故。構(gòu)造函數(shù)是通用錯誤類型，除了類型，還有等類型。瀏覽器輸出其他錯誤類型構(gòu)造函數(shù)是繼承，實例是一致的。數(shù)值超出有效范圍數(shù)值超出有效范圍創(chuàng)建一個實例，表示錯誤的原因無效引用。同步發(fā)布于 https://github.com/xianshanna... 我的建議是不要隱藏錯誤，勇敢地拋出來。沒有人會因為代碼出現(xiàn) bug 導(dǎo)致程序崩潰...

LdhAndroid 2019-08-23 16:43 評論0 收藏0
錯誤檢測（1）------try-catch語句 From 《高程3》

摘要：類型的錯誤會在數(shù)值超出相應(yīng)范圍時觸發(fā)。最常發(fā)生類型錯誤的情況，就是傳遞給函數(shù)的參數(shù)事先未經(jīng)檢查，結(jié)果傳入類型與預(yù)期類型不相符。捕獲錯誤的目的在于避免瀏覽器以默認(rèn)方式處理它們而拋出錯誤的目的在于提供錯誤發(fā)生具體原因的消息。 0 前言目前讀到了《高程3》的錯誤檢測部分，現(xiàn)在先挖一個坑，關(guān)于錯誤檢測應(yīng)該寫三篇總結(jié)：firebug檢測錯誤和輸出信息；try-catch錯誤捕獲；常見錯誤種類。...

UnixAgain 2019-08-21 14:38 評論0 收藏0
錯誤檢測（1）------try-catch語句 From 《高程3》

摘要：類型的錯誤會在數(shù)值超出相應(yīng)范圍時觸發(fā)。最常發(fā)生類型錯誤的情況，就是傳遞給函數(shù)的參數(shù)事先未經(jīng)檢查，結(jié)果傳入類型與預(yù)期類型不相符。捕獲錯誤的目的在于避免瀏覽器以默認(rèn)方式處理它們而拋出錯誤的目的在于提供錯誤發(fā)生具體原因的消息。 0 前言目前讀到了《高程3》的錯誤檢測部分，現(xiàn)在先挖一個坑，關(guān)于錯誤檢測應(yīng)該寫三篇總結(jié)：firebug檢測錯誤和輸出信息；try-catch錯誤捕獲；常見錯誤種類。...

Thanatos 2019-08-01 15:50 評論0 收藏0
面對對象嚴(yán)格模式

摘要：對只讀屬性賦值會報錯刪除不可配置的屬性會報錯只設(shè)置了取值器的屬性不可寫嚴(yán)格模式下，對一個只有取值器沒有存值器的屬性賦值，會報錯。嚴(yán)格模式禁止這種用法，全局變量必須顯式聲明。嚴(yán)格模式明確規(guī)定，函數(shù)內(nèi)部使用將會報錯。設(shè)計目的啟用方法顯式報錯只讀屬性不可寫只設(shè)置了取值器的屬性不可寫禁止擴(kuò)展的對象不可擴(kuò)展eval、arguments 不可用作標(biāo)識名函數(shù)不能有重名的參數(shù)禁止八進(jìn)制的前綴0表示法...

paraller 2019-08-26 10:12 評論0 收藏0