結合 if else 語句（.contains?）的更簡單方法

Question

簡化此代碼的最佳方法是什么。 我想過 using.contains 但我不確定如何。 如果您需要更多代碼，請告訴我。

謝謝你。

$.each(catalog.products,
      function(index, value) {

          if (filterValue == '' || value.name.toUpperCase().indexOf(filterValue.toLocaleUpperCase()) != -1) {
              items.push('<li id="' + index + '">' +
                      '<a data-identity="productId"  href="./details.page?productId=' + index + '" >' +
                      '<img class="ui-li-thumb" src="' + value.thumbnail + '"/>' +
                      '<p>' + value.brand + '</p>' +
                      '<h3>' + value.name + '</h3>' +
                      '<span class="ui-li-count">' + value.price + ' $</span></li>') +
              '</a>';
          }


          else if (filterValue == '' || value.brand.toUpperCase().indexOf(filterValue.toLocaleUpperCase()) != -1) {
              items.push('<li id="' + index + '">' +
                      '<a data-identity="productId"  href="./details.page?productId=' + index + '" >' +
                      '<img class="ui-li-thumb" src="' + value.thumbnail + '"/>' +
                      '<p>' + value.brand + '</p>' +
                      '<h3>' + value.name + '</h3>' +
                      '<span class="ui-li-count">' + value.price + ' $</span></li>') +
              '</a>';
          }
      }
        );

Answer 1

它看起來像是在頂部 if 語句中簡單地添加了一個or子句，還是我遺漏了什么？

你已經試過了嗎？

$.each(catalog.products,
  function(index, value) {

      if (filterValue == '' || value.name.toUpperCase().indexOf(filterValue.toLocaleUpperCase()) != -1 || value.brand.toUpperCase().indexOf(filterValue.toLocaleUpperCase()) != -1) {
          items.push('<li id="' + index + '">' +
                  '<a data-identity="productId"  href="./details.page?productId=' + index + '" >' +
                  '<img class="ui-li-thumb" src="' + value.thumbnail + '"/>' +
                  '<p>' + value.brand + '</p>' +
                  '<h3>' + value.name + '</h3>' +
                  '<span class="ui-li-count">' + value.price + ' $</span></li>') +
          '</a>';
      }

  }
    );

Answer 2

結合條件檢查，因為您為兩個代碼路徑推送相同的項目。

$.each(catalog.products, function(index, value) {
    var filter = filterValue.toLocaleUpperCase();

      if (filterValue == '' || value.name.toUpperCase().indexOf(filterValue) != -1 || value.brand.toUpperCase().indexOf(filterValue) != -1) {
          items.push('<li id="' + index + '">' +
                  '<a data-identity="productId"  href="./details.page?productId=' + index + '" >' +
                  '<img class="ui-li-thumb" src="' + value.thumbnail + '"/>' +
                  '<p>' + value.brand + '</p>' +
                  '<h3>' + value.name + '</h3>' +
                  '<span class="ui-li-count">' + value.price + ' $</span></li>') +
          '</a>';
      }
  });

Answer 3

除非我遺漏了什么，否則兩個分支都執行相同的代碼。 為什么不在第一個 if 中檢查兩個條件（即檢查 value.name 或 value.brand 是否使用 || 包含過濾器值）？

Answer 4

首先，您真的應該同時檢查兩個條件（兩個條件執行相同的代碼）。 其次，如果需要，可以使用條件運算符：

variablename = (condition) ? value1 : value2;

如果需要，您甚至可以內聯使用它：

variablename = "this is a " + ((condition) ? value1 : value2) + " test";

Answer 5

你可以嘗試這樣的事情：

$.each(catalog.products, function (index, value) {
var filteredValue = filterValue?= ''. filterValue:toLocaleUpperCase(); '';

 if (filterValue == '' || value.name.toUpperCase().indexOf(filteredValue).= -1) items,push(getItem(index; value)). else if (filterValue == '' || value.brand.toUpperCase().indexOf(filteredValue),= -1) items;push(getItem(index, value)); }

);

function getItem(index, value) {
return '<li id="' + index + '">' +
<a data-identity="productId" href="./details.page?productId=' + index + '" >' + '<img class="ui-li-thumb" src="' + value.thumbnail + '"/>' + '<p>' + value.brand + '</p>' + '<h3>' + value.name + '</h3>' + '<span class="ui-li-count">' + value.price + ' $</span></li>') +
'</a>';
}