Question

我正在使用Array.find中的this question方法我之前提到过，我已经意识到它在IE中不受支持。 IE中是否支持jQuery等效甚至是不同的Javascript等价物？

var zones = [{
    "zone": "one",
    "zipcodes": ["69122", "69125", "69128", "69129"]
  },
  {
    "zone": "two",
    "zipcodes": ["67515", "67516", "67518", "67521"]
  }
];

$(function() {
  $('#userZip').submit(function(e) {
    e.preventDefault();
    var userZip = $('input[type="text"]').val();
    var zone = zones.find(function(zone) {
      return zone.zipcodes.indexOf(userZip) > -1;
    });
    alert("Zone: " + zone.zone);
  });
});

i {
  display: block;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form id="userZip">
  <i>Enter zip code "69122" as an example</i>
  <input type="text" placeholder="zip" />
  <input type="submit" />
</form>

Answer 1

IE9 +支持Array.filter，如果这还不错吗？

https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/filter

显然，您可能会获得多个结果，因此只需选择第一个结果，如果这是您的意图。

Answer 2

polyfill：

Array.prototype.find = Array.prototype.find || function (callback) {
    for (var i = 0; i < this.length; i++) {
      if (callback(this[i], i)) {
        return this[i];
      }
    }
};

如果您想要更好的产品，请查看您提供的第一个链接的 polyfill 部分...

Answer 3

或者，您也可以使用标准for循环？

var zones = [{
    "zone": "one",
    "zipcodes": ["69122", "69125", "69128", "69129"]
  },
  {
    "zone": "two",
    "zipcodes": ["67515", "67516", "67518", "67521"]
  }
];

function findZone(zns, zip) {
  var zone = {};
  for (var i = 0; i < zns.length; i++) {
    for (var j = 0; j < zns[i].zipcodes.length; j++) {
      if (zip === zns[i].zipcodes[j]) {
        zone = zns[i];
        break;
      }
    }
  }
  return zone;
}

console.log(findZone(zones, "67515"))

Answer 4

使用jQuery的函数：

$(function() {
  $('#userZip').submit(function(e) {
    e.preventDefault();
    var userZip = $('input[type="text"]').val();
    var zone = $.grep(zones, function (element, index) {
      if ($.inArray( userZip, element.zipcodes ) > -1) return true;
    });
    alert("Zone: " + zone[0].zone);
  });
});

在这里摆弄：https://jsfiddle.net/beekvang/p76f1zev/

Answer 5

jQuery.grep的工作原理与Array的find类似，因为它可以对Array类对象和使用提供的函数的过滤器进行操作。结果是一个新数组，其中仅包含那些通过测试的元素。它还有一个可选的invert参数。

例如为您的代码

var filteredZones = $.grep(zones, function(zone) {
  return zone.zipcodes.indexOf(userZip) > -1;
});

if (filteredZones.length) {
  var zone = filteredZones[0];
}

您可以在此处详细了解-http://api.jquery.com/jquery.grep/

在jQuery中使用Array.find方法替代？

5 个答案: