javascript - 如何在javascript中实现字典？

Question

这是我的源代码，但我有问题。我无法实现字典数据结构的 showAll() 函数。

你能帮我吗？

function Dictionary() {
   this.add = add;
   this.datastore = new Array();
   this.find = find;
   this.remove = remove;
   this.showAll = showAll;
   this.count = count;
   this.clear = clear;
}
function add(key, value) {
   this.datastore[key] = value;
}
function find(key) {
   return this.datastore[key];
}
function remove(key) {
   delete this.datastore[key];
}
function showAll() {
    Object.keys(this.datastore).forEach( function(key, index) {
       console.log(key + "->" + this.datastore[key]);
    });
}
function count() {
    return Object.keys(this.datastore).length;
}
/*function count() {
   // var n = 0;
   // Object.keys(this.datastore).forEach( function(key, index) {
   // for each (var key in Object.keys(this.datastore)) {
   //      ++n;
   //};
   //return n;
}*/
function clear() {
   Object.keys(this.datastore).forEach( function(key, index) {
    // for each (var key in Object.keys(this.datastore)) {
      delete this.datastore[key];
  });
}

var pbook = new Dictionary();

pbook.add("Michael", "012345");
pbook.add("Sam", "54654654");
pbook.add("Shen", "5465464");

console.log("Sam's extension: " + pbook.find("Sam"));
pbook.remove("Sam");
pbook.showAll();

我收到此错误:

undefined:31
       console.log(key + "->" + this.datastore[key]);
                                              ^
TypeError: Cannot read property 'Michael' of undefined
    at eval (eval at <anonymous> (C:\DATA\NetBeansProjects\StudyForDTwithJS\public_html\js\CH07-Dictionaries\02-TestDictionaryDefinitionClass.js:8:56), <anonymous>:31:47)
    at Array.forEach (native)
    at Dictionary.showAll (eval at <anonymous> (C:\DATA\NetBeansProjects\StudyForDTwithJS\public_html\js\CH07-Dictionaries\02-TestDictionaryDefinitionClass.js:8:56), <anonymous>:30:33)
    at Object.<anonymous> (C:\DATA\NetBeansProjects\StudyForDTwithJS\public_html\js\CH07-Dictionaries\02-TestDictionaryDefinitionClass.js:18:7)
    at Module._compile (module.js:460:26)
    at Object.Module._extensions..js (module.js:478:10)
    at Module.load (module.js:355:32)
    at Function.Module._load (module.js:310:12)
    at Function.Module.runMain (module.js:501:10)
    at startup (node.js:129:16)

Answer 1

this里面forEach回调不一样this在调用之前，因为执行上下文(对于已调用函数并创建新的作用域而言)已更改。将其保存在变量中并在回调中使用它。

function showAll() {
    var ds = this.datastore;
    Object.keys(this.datastore).forEach( function(key, index) {
       console.log(key + "->" + ds[key]);
    });
}

function Dictionary() {
  this.add = add;
  this.datastore = new Array();
  this.find = find;
  this.remove = remove;
  this.showAll = showAll;
  this.count = count;
  this.clear = clear;
}

function add(key, value) {
  this.datastore[key] = value;
}

function find(key) {
  return this.datastore[key];
}

function remove(key) {
  delete this.datastore[key];
}

function showAll() {
  var ds = this.datastore;
  Object.keys(this.datastore).forEach(function(key, index) {
    console.log(key + "->" + ds[key]);
  });
}

function count() {
  return Object.keys(this.datastore).length;
}

/*
function count() {
   // var n = 0;
   // Object.keys(this.datastore).forEach( function(key, index) {
   // for each (var key in Object.keys(this.datastore)) {
   //      ++n;
   //};
   //return n;
}
*/
function clear() {
  Object.keys(this.datastore).forEach(function(key, index) {
    // for each (var key in Object.keys(this.datastore)) {
    delete this.datastore[key];
  });
}

var pbook = new Dictionary();

pbook.add("Michael", "012345");
pbook.add("Sam", "54654654");
pbook.add("Shen", "5465464");

console.log("Sam's extension: " + pbook.find("Sam"));
pbook.remove("Sam");
pbook.showAll();

或者，另一种选择是传递 this进入forEach作为documentation州

arr.forEach(callback[, thisArg])

function showAll() {
  var ds = this.datastore;
  Object.keys(this.datastore).forEach(function(key, index) {
    console.log(key + "->" + this[key]);
  }, this);
}

function Dictionary() {
  this.add = add;
  this.datastore = new Array();
  this.find = find;
  this.remove = remove;
  this.showAll = showAll;
  this.count = count;
  this.clear = clear;
}

function add(key, value) {
  this.datastore[key] = value;
}

function find(key) {
  return this.datastore[key];
}

function remove(key) {
  delete this.datastore[key];
}


function showAll() {
  var ds = this.datastore;
  Object.keys(this.datastore).forEach(function(key, index) {
    console.log(key + "->" + this[key]);
  }, this);
}

function count() {
  return Object.keys(this.datastore).length;
}

/*
function count() {
   // var n = 0;
   // Object.keys(this.datastore).forEach( function(key, index) {
   // for each (var key in Object.keys(this.datastore)) {
   //      ++n;
   //};
   //return n;
}
*/
function clear() {
  Object.keys(this.datastore).forEach(function(key, index) {
    // for each (var key in Object.keys(this.datastore)) {
    delete this.datastore[key];
  });
}

var pbook = new Dictionary();

pbook.add("Michael", "012345");
pbook.add("Sam", "54654654");
pbook.add("Shen", "5465464");

console.log("Sam's extension: " + pbook.find("Sam"));
pbook.remove("Sam");
pbook.showAll();

如需进一步阅读，请参阅 What is “this” Context