Question

我正在寻找相当于这个：

var myArr = [DOMElement, DOMElement];
Array.prototype.forEach.call(myArr, function(el, i) {
   el.addEventListener('click', function() {
      alert('you clicked on element number ' + i);
   }, false);
});

关于这一点的是你不要像在这里一样遇到addEventListener问题：

var myArr = [DOMElement, DOMElement];
for (var i=0; i<myArr.length; i++) {
   myArr[i].addEventListener('click', function() {
      alert('you clicked on element number ' + i);
   }, false);
}

在第二种情况下，只要你点击一个元素，它总会说你点击了最后一个。

所以我想知道如何在安全地使用addEventListener的同时循环访问对象及其键。所以喜欢：

var myObj = {blahKey: DOMElement};
for (var k in myObj) {
   myObj[k].addEventListener('click', function() {
      alert('you clicked on element with key = ' + k)
   }, false);
}

Answer 1

只需使用Object.keys获取密钥数组，然后照常使用forEach，就像这样

Object.keys(myObj).forEach(function(k) {
   myObj[k].addEventListener('click', function() {
      alert('you clicked on element with key = ' + k)
   }, false);
});

Answer 2

由于您使用的是forEach，我认为您可以安全使用ES5。您可以使用Object.keys从对象返回一组键。然后在其上使用forEach。

Object.keys(myObj).forEach(function(key,i){
  myObj[key].addEventListener(...);
});

请注意Object.keys返回的键的顺序与for-in循环的情况相同。它并不能保证跨浏览器的订单相同。如果订单确实很重要，我建议您坚持使用数组。

Array.prototype.forEach.call对象的等价物

2 个答案: