建站
咨詢
售后
建站咨詢
新聞中心
JavaScript中優(yōu)化條件表達(dá)式相關(guān)的重構(gòu)思路是怎樣的，相信很多沒有經(jīng)驗(yàn)的人對此束手無策，為此本文總結(jié)了問題出現(xiàn)的原因和解決方法，通過這篇文章希望你能解決這個問題。
創(chuàng)新互聯(lián)是網(wǎng)站建設(shè)技術(shù)企業(yè)，為成都企業(yè)提供專業(yè)的成都網(wǎng)站設(shè)計、成都網(wǎng)站制作，網(wǎng)站設(shè)計，網(wǎng)站制作，網(wǎng)站改版等技術(shù)服務(wù)。擁有十余年豐富建站經(jīng)驗(yàn)和眾多成功案例，為您定制適合企業(yè)的網(wǎng)站。十余年品質(zhì)，值得信賴！
JavaScript 是一種易于學(xué)習(xí)的編程語言，編寫運(yùn)行并執(zhí)行某些操作的程序很容易。然而，要編寫一段干凈的JavaScript 代碼是很困難的。
分解條件表達(dá)式
我們可以將長的條件表達(dá)式分解成有命名的短小條件表達(dá)多，這樣有利于閱讀。例如我們可能會寫這樣的代碼：
let ieIEMac = navigator.userAgent.toLowerCase().includes("mac") && navigator.userAgent.toLowerCase().includes("ie")上面的代碼太過冗長了，不利于閱讀，我們可以把它分解成幾個短小且有名字的條件表達(dá)式，如下所示：
let userAgent = navigator.userAgent.toLowerCase(); let isMac = userAgent.includes("mac"); let isIE = userAgent.toLowerCase().includes("ie"); let isMacIE = isMac && isIE;合并條件表達(dá)式
與上面相反的，如果有多個簡短的條件表達(dá)式，則可以將它們合并成一個。例如我們可能會寫這樣的代碼：
const x = 5; const bigEnough = x > 5; const smallEnough = x < 6; const inRange = bigEnough && smallEnough;
我們可以這樣合并：
const x = 5; const inRange = x > 5 && x < 6;
因?yàn)楸磉_(dá)式很短，即使把它們組合在一起也不會使表達(dá)式變長，所以我們可以這樣做。
合并重復(fù)的條件片段
如果我們在條件塊中有重復(fù)的表達(dá)式或語句，則可以將它們移出。例如我們可能會寫這樣的代碼：
if (price > 100) { //... complete(); } else { //... complete(); }我們可以把重復(fù)的內(nèi)容移到條件表達(dá)式外面，如下所示：
if (price > 100) { //... } else { //... } complete();這樣，我們不必重復(fù)不必要地調(diào)用complete函數(shù)。
刪除控制標(biāo)志
如果我們在循環(huán)中使用了控制標(biāo)志，那應(yīng)該會這樣代碼：
let done = false; while (!done) { if (condition) { done = true; } //... }在上面的代碼中，done 是控制標(biāo)，在condition為true時，將done設(shè)置為true停止while循環(huán)。
相對于上面，我們可以使用break來停止循環(huán)，如下所示：
let done = false; while (!done) { if (condition) { break; } //... }用衛(wèi)語句代替嵌套條件
衛(wèi)語句就是把復(fù)雜的條件表達(dá)式拆分成多個條件表達(dá)式，比如一個很復(fù)雜的表達(dá)式，嵌套了好幾層的if-then-else語句，轉(zhuǎn)換為多個if語句，實(shí)現(xiàn)它的邏輯，這多條的if語句就是衛(wèi)語句。
嵌套條件語句很難閱讀，所以我們可以使用「衛(wèi)語句」代替它們。例如我們可能會寫這樣的代碼：
const fn = () => { if (foo) { if (bar) { if (baz) { //... } } } }我們可以這樣優(yōu)化：
if (!foo) { return; } if (!bar) { return; } if (baz) { //... } }在上面的代碼中，衛(wèi)語句是：
if (!foo) { return; }和
if (!bar) { return; }如果這些條件為假，它們會提前返回函數(shù)，這樣，我們就不需要嵌套了。
用多態(tài)替換條件
我們可以使用switch語句為不同種類的數(shù)據(jù)創(chuàng)建相同的子類，而不是使用switch語句對不同類型的數(shù)據(jù)執(zhí)行相同的操作，然后針對對象的類型使用不同的方法。
例如我們可能會寫這樣的代碼：
class Animal { constructor(type) { this.type = type; } getBaseSpeed() { return 100; } getSpeed() { switch (this.type) { case ('cat'): { return getBaseSpeed() * 1.5 } case ('dog'): { return getBaseSpeed() * 2 } default: { return getBaseSpeed() } } } }我們可以這樣重構(gòu)：
class Animal { constructor(type) { this.type = type; } getBaseSpeed() { return 100; } } class Cat extends Animal { getSpeed() { return super.getBaseSpeed() * 1.5; } } class Dog extends Animal { getSpeed() { return super.getBaseSpeed() * 2; } }當(dāng)switch語句很長時，應(yīng)該為不同類型的對象定制case塊。
采用空對象
如果我們重復(fù)檢查null或undefined，則可以定義一個代表該類的null或undefined版本的子類，然后使用它。
例如我們可能會寫這樣的代碼：
class Person { //... }我們可以這樣重構(gòu)：
class Person { //... } class NullPerson extends Person { //... }然后，我們將Person設(shè)置為null或undefined 的對象屬性，而不是將其設(shè)置為NullPerson實(shí)例。
這樣就無需使用條件檢查這些值。
看完上述內(nèi)容，你們掌握J(rèn)avaScript中優(yōu)化條件表達(dá)式相關(guān)的重構(gòu)思路是怎樣的的方法了嗎？如果還想學(xué)到更多技能或想了解更多相關(guān)內(nèi)容，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道，感謝各位的閱讀！
分享題目：JavaScript中優(yōu)化條件表達(dá)式相關(guān)的重構(gòu)思路是怎樣的
URL地址：http://fisionsoft.com.cn/article/piphgd.html
