重構我的Javascript IF語句

Question

我得到了一些非常難看的代碼，我需要重構&我不確定最好的解決方法。對我來說，它的工作原理是我應該每次嘗試更改它時都會出現&，它似乎會引入一個錯誤。

任何想法都會很棒。

if (product) { 
    if (product.available) { 
     $addToCart.removeClass('disabled').prop('disabled', false); 

     if (lang_key_change) { 
     $addToCartText.html(lang_key_change); 
     } else { 
     $addToCartText.html({{ 'add_to_cart'}}); 
     } 

    } else { 
     $addToCart.addClass('disabled').prop('disabled', true); 
     $addToCartText.html({{ 'sold_out'}}); 
    } 

    } else { 
    $addToCart.addClass('disabled').prop('disabled', true); 
    $addToCartText.html({{ 'unavailable'}}); 
    } 

Answer 1

使用下重構的代碼

$addToCart.addClass('disabled').prop('disabled', true); 
if (product && product.available) { 
    $addToCart.removeClass('disabled').prop('disabled', false); 
    $addToCartText.html(lang_key_change? lang_key_change: {{ 'add_to_cart'}}); 
} 
else if (product && product.available === false) {  
    $addToCartText.html({{ 'sold_out'}}); 
} 
else { 
    $addToCartText.html({{ 'unavailable'}}); 
} 

Answer 2

你可能不需要任何if聲明，點擊這裏

$addToCart.toggleClass('disabled', !product || (product && !product.available)); 
$addToCart.prop('disabled', !product || (product && !product.available)); 
$addToCartText.html(!product ? {{ 'unavailable'}} : (!product.available ? {{ 'sold_out'}} : (lang_key_change || {{ 'add_to_cart'}})) );