在JavaScript中存储key => value数组的最佳方法?

Cli*_*ote 215 javascript jquery

key=>value在javascript中存储数组的最佳方法是什么,如何循环?

每个元素的键应该是一个标记,例如{id}或者只是id,值应该是id的数值.

它应该是现有javascript类的元素,或者是可以通过类轻松引用的全局变量.

可以使用jQuery.

Ale*_*nov 384

这就是JavaScript对象:

var myArray = {id1: 100, id2: 200, "tag with spaces": 300};
myArray.id3 = 400;
myArray["id4"] = 500;
Run Code Online (Sandbox Code Playgroud)

你可以使用for..in循环遍历它:

for (var key in myArray) {
  console.log("key " + key + " has value " + myArray[key]);
}
Run Code Online (Sandbox Code Playgroud)

另请参阅:使用对象(MDN).

在ECMAScript6中也有Map(参见那里的浏览器兼容性表):

  • Object有一个原型,因此地图中有默认键.这可以通过使用自ES5以来的map = Object.create(null)来绕过,但很少完成.

  • Object的键是字符串和符号,它们可以是Map的任何值.

  • 您必须手动跟踪对象的大小,才能轻松获得Map的大小.

  • 如果您的浏览器支持它(IE9及更高版本),首先使用[`var foo = Object.create(null)`]创建空对象会更安全(https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/create)然后添加属性,如`foo.bar ="baz"`.用`{}`创建一个对象相当于`Object.create(Object.prototype)`,这意味着它继承了`Object`的所有属性.通常这不是问题,但如果某个库修改了全局`Object.prototype`,它可能会导致您的对象有意外的键. (26认同)
  • @DaMaxContent你也可以左转三次右转. (3认同)

Bli*_*ixt 93

如果我理解正确的话:

var hash = {};
hash['bob'] = 123;
hash['joe'] = 456;

var sum = 0;
for (var name in hash) {
    sum += hash[name];
}
alert(sum); // 579
Run Code Online (Sandbox Code Playgroud)

  • 哈希['长度'] = 问题。 (2认同)

Muk*_*ain 21

你可以使用Map.

  • JavaScript ES6中引入的新数据结构.
  • 用于存储键/值对的JavaScript对象的替代方法.
  • 具有用于迭代键/值对的有用方法.
var map = new Map();
map.set('name', 'John');
map.set('id', 11);

// Get the full content of the Map
console.log(map); // Map { 'name' => 'John', 'id' => 11 }
Run Code Online (Sandbox Code Playgroud)

使用键获取Map的值

console.log(map.get('name')); // John 
console.log(map.get('id')); // 11
Run Code Online (Sandbox Code Playgroud)

获取地图的大小

console.log(map.size); // 2
Run Code Online (Sandbox Code Playgroud)

地图中存在检查键

console.log(map.has('name')); // true
console.log(map.has('age')); // false
Run Code Online (Sandbox Code Playgroud)

获取密钥

console.log(map.keys()); // MapIterator { 'name', 'id' }
Run Code Online (Sandbox Code Playgroud)

获得价值

console.log(map.values()); // MapIterator { 'John', 11 }
Run Code Online (Sandbox Code Playgroud)

获取地图的元素

for (let element of map) {
  console.log(element);
}

// Output:
// [ 'name', 'John' ]
// [ 'id', 11 ]
Run Code Online (Sandbox Code Playgroud)

打印键值对

for (let [key, value] of map) {
  console.log(key + " - " + value);
}

// Output: 
// name - John
// id - 11
Run Code Online (Sandbox Code Playgroud)

仅打印地图的键

for (let key of map.keys()) {
  console.log(key);
}

// Output:
// name
// id
Run Code Online (Sandbox Code Playgroud)

仅打印地图的值

for (let value of map.values()) {
  console.log(value);
}

// Output:
// John
// 11
Run Code Online (Sandbox Code Playgroud)

  • 似乎与JSON.stringify()不兼容。 (2认同)
  • @kenorb 这是 ES6 ,使用 `JSON.stringify([...map]);` (2认同)

kik*_*sse 9

在javascript中,键值数组存储为对象.在javascript中有像数组这样的东西,但它们在某种程度上也被认为是对象,请检查这些人的答案 - 为什么我可以将命名属性添加到数组中,就像它是一个对象一样?

通常使用方括号语法和使用大括号语法的对象("key => value"数组)可以看到数组,尽管您可以使用方括号语法访问和设置对象属性,如Alexey Romanov所示.

javascript中的数组通常仅用于数字,自动递增的键,但javascript对象也可以包含命名键值对,函数甚至其他对象.

简单数组例如.

$(document).ready(function(){

    var countries = ['Canada','Us','France','Italy'];
    console.log('I am from '+countries[0]);
    $.each(countries, function(key, value) {
        console.log(key, value);
    });

});
Run Code Online (Sandbox Code Playgroud)

输出 -

0"加拿大"

1"我们"

2"法国"

3"意大利"

我们在上面看到,我们可以使用jQuery.each函数循环数值数组,并使用带数字键的方括号访问循环外部的信息.

简单对象(json)

$(document).ready(function(){

    var person = {
        name: "James",
        occupation: "programmer",
        height: {
            feet: 6,
            inches: 1
        },
    }

    console.log("My name is "+person.name+" and I am a "+person.height.feet+" ft "+person.height.inches+" "+person.occupation);

    $.each(person, function(key, value) {
        console.log(key, value);
    });

});
Run Code Online (Sandbox Code Playgroud)

输出 -

我的名字是詹姆斯,我是一个6英尺1的程序员

詹姆斯

职业程序员

height Object {feet:6,inches:1}

在像php这样的语言中,这将被认为是具有键值对的多维数组,或者是数组中的数组.我假设是因为你问过如何循环键值数组你想知道如何获得一个对象(key => value array),就像上面的person对象一样,让我们​​说,不止一个人.

好吧,既然我们知道javascript数组通常用于数字索引,对象更灵活地用于关联索引,我们将一起使用它们来创建一个我们可以遍历的对象数组,就像这样 -

JSON数组(对象数组) -

$(document).ready(function(){

    var people = [
        {
            name: "James",
            occupation: "programmer",
            height: {
                feet: 6,
                inches: 1
            }
        }, {
            name: "Peter",
            occupation: "designer",
            height: {
                feet: 4,
                inches: 10
            }
        }, {
            name: "Joshua",
            occupation: "CEO",
            height: {
                feet: 5,
                inches: 11
            }
        }
    ];

    console.log("My name is "+people[2].name+" and I am a "+people[2].height.feet+" ft "+people[2].height.inches+" "+people[2].occupation+"\n");

    $.each(people, function(key, person) {
        console.log("My name is "+person.name+" and I am a "+person.height.feet+" ft "+person.height.inches+" "+person.occupation+"\n");
    });

});
Run Code Online (Sandbox Code Playgroud)

输出 -

我的名字是Joshua,我是一名5英尺11的CEO

我的名字是詹姆斯,我是一个6英尺1的程序员

我的名字是彼得,我是一个4英尺10的设计师

我的名字是Joshua,我是一名5英尺11的CEO

请注意,在循环外部我必须使用方括号语法和数字键,因为这现在是一个数字索引的对象数组,当然在循环内部隐含数字键.


小智 5

只需这样做

var key = "keyOne";
var obj = {};
obj[key] = someValue;
Run Code Online (Sandbox Code Playgroud)


Tad*_*dej 5

数组内的对象:

var cars = [
        { "id": 1, brand: "Ferrari" }
        , { "id": 2, brand: "Lotus" }
        , { "id": 3, brand: "Lamborghini" }
    ];
Run Code Online (Sandbox Code Playgroud)