Question

简化此代码的最佳方法是什么。我想过使用.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

看起来只是在top 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));
}

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>';

}

组合if else语句的简单方法（.contains？）

5 个答案: