javascript - 可迭代关联数组对象

Question

我需要一个列表类型对象，同时提供可迭代和关联的相反 JS 数组行为。因此，有时我想运行一个基于索引的遍历成员，而在另一个时候我想做“这个键是否存在”和“更新那个键下的数据”。

我在 SO 中看到很多关于关联数组讨论的问题，但这个问题有所不同，因为我正在寻找包含这两种行为的可重用代码。解决方案可以是数组原型(prototype)的修饰符，或者是独立的对象创建函数。我接受列表必须是唯一的键，仅供引用，在我的例子中，成员本身就是对象。

请注意，我知道 JavaScript 中没有关联数组这样的东西——我不需要那种说教。我在同一列表中寻找具有两种功能的单个对象的解决方案。

这是工作片段中的基本版本。我正在寻找一个更充实的版本，其中包括全套生命周期功能，例如处置等。

var List = function() {
  this.elements={} // assoc list of elements.
  this.elementArray=[] // plain array
  this.addElement=function (id, member) {
    this.elements[id]=member;
    this.elementArray.push(member);
    }
}

var myList = new List();

myList.addElement('V', {id: 'key2', name: 'Volvo'});
myList.addElement('A', {id: 'key4', name: 'Apple'});
myList.addElement('S', {id: 'key3', name: 'Google'});

console.log('Via iteration');
for (var i = 0; i < myList.elementArray.length; i = i + 1) {
  console.log('id=' + myList.elementArray[i].id + ' name=' + myList.elementArray[i].name); 
}

console.log('Via association');
console.log('Value of A: id=' + myList.elements['A'].id + ' name=' + myList.elements['A'].name);
console.log('Value of V: id=' + myList.elements['V'].id + ' name=' + myList.elements['V'].name);
console.log('Value of S: id=' + myList.elements['S'].id + ' name=' + myList.elements['S'].name);

Answer 1

我知道这还远未完成，但它可能会给你一个起点，扩展 Array 类给你数组的特殊 length 属性(在推送时添加，当它被修改时，它会修改数组本身，等等)

'use strict';

class AssociativeArray extends Array {
   constructor() {
      super();
      this.data = {};
   }
   push(key, value) {
      super.push(key);
      this.data[key] = value
   }
   *[Symbol.iterator]() {
      let nextIndex = 0;
      while(nextIndex < this.length) {
        yield this[nextIndex];
        nextIndex++;
      }
   }
}

var myAssociativeArray = new AssociativeArray();
myAssociativeArray.push("1st", "Bamieh");
myAssociativeArray.push("2nd", "value");
myAssociativeArray.push("3nd", "anotherValue");
console.log('myAssociativeArray::', myAssociativeArray);
console.log('myAssociativeArray.length::', myAssociativeArray.length);

for (let key of myAssociativeArray) {
  console.log('key::', key);
}

基本上，您是在重新实现 Map 或 Set 函数，这些函数在 es6 中是原生支持的。尽管如此，这仍然是一个很好的做法。