如何在 JavaScript 中创建字典并动态添加键值对

Question

来自帖子：

发送一个 JSON 数组作为字典接收，

我正在尝试做与那篇文章相同的事情。唯一的问题是我不知道预先的键和值是什么。所以我需要能够动态添加键和值对，但我不知道该怎么做。

如何创建该对象并动态添加键值对？

我试过了：

var vars = [{key:"key", value:"value"}];
vars[0].key = "newkey";
vars[0].value = "newvalue";

但这不起作用。

Answer 1

使用：

var dict = []; // Create an empty array

dict.push({
    key:   "keyName",
    value: "the value"
});
// Repeat this last part as needed to add more key/value pairs

基本上，您正在创建一个具有两个属性（称为key和value）的对象文字并插入它（使用push()）进入数组。

---

这不会创建“正常”JavaScript 对象文字（又名地图、又名散列、又名字典）。
然而，它正在创建 OP 要求的结构（在链接到的另一个问题中对此进行了说明），它是一个对象文字数组，每个数组都有 key 和 value 属性。不要问我为什么需要这种结构，但这是我们所要求的。

但是，但是，如果你想要一个普通的 JavaScript 对象 - 而不是 OP 要求的结构 - 请参阅 tcll 的答案，尽管如果您只有作为有效 JavaScript 名称的简单键，那么括号表示法有点麻烦。您可以这样做：

// Object literal with properties
var dict = {
  key1: "value1",
  key2: "value2"
  // etc.
};

或者在创建对象后使用常规点符号来设置属性：

// Empty object literal with properties added afterward
var dict = {};
dict.key1 = "value1";
dict.key2 = "value2";
// etc.

如果您的键中包含空格、特殊字符或其他内容，您确实需要括号符号像那样。例如：

var dict = {};

// This obviously won't work
dict.some invalid key (for multiple reasons) = "value1";

// But this will
dict["some invalid key (for multiple reasons)"] = "value1";

如果您的键是动态的，您还需要括号表示法：

dict[firstName + " " + lastName] = "some value";

请注意，键（属性名称）始终是字符串，并且非字符串值在用作键时将被强制为字符串。例如，Date 对象被转换为其字符串表示形式：

dict[new Date] = "today's value";

console.log(dict);
// => {
//      "Sat Nov 04 2016 16:15:31 GMT-0700 (PDT)": "today's value"
//    }

但请注意，这不一定“正常工作”，因为许多对象将具有类似 “[object Object]” 的字符串表示形式 这并不构成非唯一的密钥。因此，请注意以下内容：

var objA = { a: 23 },
    objB = { b: 42 };

dict[objA] = "value for objA";
dict[objB] = "value for objB";

console.log(dict);
// => { "[object Object]": "value for objB" }

尽管 objA 和 objB 是完全不同且独特的元素，但它们都具有相同的基本字符串表示形式："[object Object]"。

Date 之所以没有这样的行为，是因为 Date 原型有一个自定义的 toString 方法，该方法会覆盖默认的字符串表示形式。您也可以这样做：（

// A simple constructor with a toString prototypal method
function Foo() {
  this.myRandomNumber = Math.random() * 1000 | 0;
}

Foo.prototype.toString = function () {
  return "Foo instance #" + this.myRandomNumber;
};

dict[new Foo] = "some value";

console.log(dict);
// => {
//      "Foo instance #712": "some value"
//    }

请注意，由于上面使用了随机数字，因此仍然很容易发生名称冲突。这只是为了说明toString的实现。）

因此，当尝试使用对象作为键时，JavaScript 将使用对象自己的 toString 实现（如果有），或者使用默认的字符串表示形式。

Answer 2

使用：

var dict = {};

dict['key'] = "testing";

console.log(dict);

它的工作方式就像 Python :)

控制台输出：

Object {key: "testing"}

Answer 3

就像这样简单：

var blah = {}; // Make a new dictionary (empty)

或

var blah = {key: value, key2: value2}; // Make a new dictionary with two pairs 

然后

blah.key3 = value3; // Add a new key/value pair
blah.key2; // Returns value2
blah['key2']; // Also returns value2

Answer 4

既然您已经声明您想要一个字典对象（并且不是数组，就像我假设有些人理解的那样），我认为这就是您所追求的：

var input = [{key:"key1", value:"value1"},{key:"key2", value:"value2"}];

var result = {};

for(var i = 0; i < input.length; i++)
{
    result[input[i].key] = input[i].value;
}

console.log(result); // Just for testing

Answer 5

JavaScript 的 Object 本身就像一本字典。无需重新发明轮子。

var dict = {};

// Adding key-value -pairs
dict['key'] = 'value'; // Through indexer
dict.anotherKey = 'anotherValue'; // Through assignment

// Looping through
for (var item in dict) {
  console.log('key:' + item + ' value:' + dict[item]);
  // Output
  // key:key value:value
  // key:anotherKey value:anotherValue
}

// Non existent key
console.log(dict.notExist); // undefined

// Contains key?
if (dict.hasOwnProperty('key')) {
  // Remove item
  delete dict.key;
}

// Looping through
for (var item in dict) {
  console.log('key:' + item + ' value:' + dict[item]);
  // Output
  // key:anotherKey value:anotherValue
}

小提琴

Answer 6

您可以将地图与 Map 结合使用，像这样：

var sayings = new Map();
sayings.set('dog', 'woof');
sayings.set('cat', 'meow');

Answer 7

使用 ES6，您可以执行以下操作：

let cake = '

Answer 8

我碰巧遇到这个问题寻找类似的东西。它为我提供了足够的信息来运行测试以获得我想要的答案。因此，如果其他人想知道如何在 JavaScript 对象中动态添加或查找 {key: 'value'} 对，此测试应该告诉您可能需要知道的所有信息。

var dictionary = {initialkey: 'initialValue'};
var key = 'something';
var key2 =  'somethingElse';
var value = 'value1';
var value2 = 'value2';
var keyInitial = 'initialkey';

console.log(dictionary[keyInitial]);

dictionary[key] =value;
dictionary[key2] = value2;
console.log(dictionary);

输出

initialValue
{ initialkey: 'initialValue',
  something: 'value1',
  somethingElse: 'value2' }

Answer 9

var dictionary = {};//create new object
dictionary["key1"] = value1;//set key1
var key1 = dictionary["key1"];//get key1

Answer 10

在现代 JavaScript (ES6/ES2015) 中，应该使用字典的Map数据结构。 ES6 中的 Map 数据结构允许您使用任意值作为键。

const map = new Map();
map.set("true", 1);
map.set("false", 0);

在您仍在使用 ES5 时，正确的创建方法字典是通过以下方式创建没有原型的对象。

var map = Object.create(null);
map["true"] = 1;
map["false"] = 0;

创建没有原型对象的字典有很多优点。以下关于该主题的博客文章值得一读。

字典模式

对象作为地图

Answer 11

首先全局初始化数组：

var dict = []

将对象添加到字典中

dict.push(
     { key: "One",value: false},
     { key: "Two",value: false},
     { key: "Three",value: false});

输出：

   [0: {key: "One", value: false}
    1: {key: "Two", value: false}
    2: {key: "Three", value: false}]

从字典中更新对象

Object.keys(dict).map((index) => {
  if (index == 1){
    dict[index].value = true
  }
});

输出：

   [0: {key: "One", value: false},
    1: {key: "Two", value: true},
    2: {key: "Three", value: false}]

从字典中删除对象

Object.keys(dict).map((index) => {
      if (index == 2){
        dict.splice(index)
      }
    });

输出：

    [0: {key: "One", value: false},
     1: {key: "Two", value: true}]

Answer 12

您可以创建一个字典类，以便可以轻松地与字典列表进行交互：

class Dictionary {
  constructor() {
    this.items = {};
  }
  has(key) {
    return key in this.items;
  }
  set(key,value) {
    this.items[key] = value;
  }
  delete(key) {
    if( this.has(key) ){
      delete this.items[key]
      return true;
    }
    return false;
  }
}

var d = new Dictionary();
d.set(1, "value1")
d.set(2, "value2")
d.set(3, "value3")
console.log(d.has(2));
d.delete(2);
console.log(d.has(2));

Answer 13

对 var dict = {} 的改进是使用 var dict = Object.create(null)。

这将创建一个空对象，不将Object.prototype作为其原型。

var dict1 = {};
if (dict1["toString"]){
    console.log("Hey, I didn't put that there!")
}

var dict2 = Object.create(null);
if (dict2["toString"]){
    console.log("This line won't run :)")
}

Answer 14

使用单行代码创建键值对：

let result = { ["foo"]: "some value" };

以及一些迭代器函数，例如 reduce 来动态地将数组转换为字典

var options = [
  { key: "foo", value: 1 },
  { key: "bar", value: {id: 2, name: "two"} },
  { key: "baz", value: {["active"]: true} },
];

var result = options.reduce((accumulator, current) => {
  accumulator[current.key] = current.value;
  return accumulator;
}, {});

console.log(result);

Answer 15

我遇到了这个问题......但是在 for 循环中。顶级解决方案不起作用（当使用变量（而不是字符串）作为推送函数的参数时），其他解决方案没有考虑基于变量的键值。我很惊讶这种方法（这在 PHP 中很常见）有效......

// Example dict/JSON
var iterateDict = {'record_identifier': {'content':'Some content', 'title':'Title of my Record'},
  'record_identifier_2': {'content':'Some  different content', 'title':'Title of my another Record'} };

var array = [];

// Key to reduce the 'record' to
var reduceKey = 'title';

for(key in iterateDict)
 // Ultra-safe variable checking...
 if(iterateDict[key] !== undefined && iterateDict[key][reduceKey] !== undefined)
  // Build element to new array key
   array[key] = iterateDict[key][reduceKey];

Answer 16

如果有人需要动态创建字典对象，您可以使用以下代码片段

let vars = [{key:"key", value:"value"}, {key:"key2", value:"value2"}];
let dict = {}
vars.map(varItem => {
             dict[varItem.key] = varItem.value
         })

console.log(dict)

Answer 17

您可以像这样初始化字典

var vars = {
    "key1": "Search",
    "key2": "View"
};

并像这样访问它

console.log(vars["key1"]);