Cách tốt nhất để lưu trữ mảng key => value trong JavaScript?

Question

Cách tốt nhất để lưu trữ mảng key=>value trong javascript là gì và cách vòng lặp đó có thể lặp lại như thế nào?

Khóa của mỗi phần tử phải là thẻ, chẳng hạn như {id} hoặc chỉ id và giá trị phải là giá trị số của id.

Nó phải là thành phần của lớp javascript hiện tại hoặc là biến toàn cầu có thể dễ dàng được tham chiếu thông qua lớp.

jQuery có thể được sử dụng.

Answer 1

Đó chỉ là những gì một đối tượng JavaScript là:

var myArray = {id1: 100, id2: 200, "tag with spaces": 300}; 
myArray.id3 = 400; 
myArray["id4"] = 500; 

Bạn lặp qua nó có thể sử dụng for..in loop:

for (var key in myArray) { 
    console.log("key " + key + " has value " + myArray[key]); 
} 

Xem thêm: Working with objects (MDN).

Trong ECMAScript6 cũng có Map (xem trình duyệt bảng tương thích có):

• Một đối tượng có một nguyên mẫu, vì vậy có phím mặc định trong bản đồ. Điều này có thể được bỏ qua bằng cách sử dụng map = Object.create (null) từ ES5, nhưng ít khi được thực hiện.

• Các khóa của đối tượng là Chuỗi và Ký hiệu, nơi chúng có thể là bất kỳ giá trị nào cho Bản đồ.

• Bạn có thể nhận được kích thước của Bản đồ một cách dễ dàng trong khi bạn phải theo dõi kích thước của đối tượng theo cách thủ công.

Answer 2

Nếu tôi hiểu bạn một cách chính xác:

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

var sum = 0; 
for (var name in hash) { 
    sum += hash[name]; 
} 
alert(sum); // 579 

Answer 3

Trong javascript, mảng giá trị khóa được lưu trữ dưới dạng đối tượng. Có những thứ như mảng trong javascript, nhưng chúng cũng được coi là vẫn còn đối tượng, hãy kiểm tra câu trả lời này - What is the difference between an array and an object?

Mảng thường được sử dụng cú pháp khung vuông và đối tượng ("key => value" mảng) cú pháp khung, mặc dù bạn có thể truy cập và đặt thuộc tính đối tượng bằng cách sử dụng cú pháp khung vuông như Alexey Romanov đã hiển thị.

Mảng trong javascript thường chỉ được sử dụng với số, phím tăng tự động, nhưng đối tượng javascript có thể chứa cặp giá trị khóa, chức năng và thậm chí cả các đối tượng khác.

Ví dụ: Mảng đơn giản.

$(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); 
    }); 

}); 

Output -

0 "Canada"

1 "Us"

2 "Pháp"

3 "Ý"

Chúng ta thấy ở trên chúng ta rằng có thể lặp lại một mảng số bằng cách sử dụng hàm jQuery.each và truy cập thông tin bên ngoài vòng lặp bằng cách sử dụng hình vuông dấu ngoặc với các phím số.

Object đơn giản (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); 
    }); 

}); 

Output -

Tên tôi là James và tôi là một 6 ft 1 lập trình viên

tên James

nghề lập trình viên

chiều cao Đối tượng {feet: 6, inches: 1}

Trong một ngôn ngữ như php, đây sẽ được coi là một mảng đa chiều với các cặp giá trị khóa hoặc một mảng trong một mảng. Tôi giả sử vì bạn hỏi về cách lặp qua mảng giá trị khóa bạn muốn biết cách lấy đối tượng (key => array giá trị) giống như đối tượng người ở trên có, giả sử, nhiều hơn một người.

Vâng, bây giờ mà chúng ta biết mảng javascript được sử dụng thường cho chỉ mục số và các đối tượng linh hoạt hơn cho chỉ mục kết hợp, chúng tôi sẽ sử dụng chúng với nhau để tạo ra một mảng các đối tượng mà chúng ta có thể lặp qua, như vậy -

JSON mảng (mảng các đối tượng) -

$(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"); 
    }); 

}); 

Output -

tên tôi là Joshua và tôi là một 5 ft 11 CEO

Tên tôi là James và tôi là một 6 ft 1 lập trình viên

Tên tôi là Peter và tôi là một 4 ft 10 nhà thiết kế

Tên tôi là Joshua và tôi là một 5 ft 11 CEO

Note bên ngoài vòng lặp, tôi phải sử dụng cú pháp khung hình vuông với một khóa số vì đây là một mảng các đối tượng được lập chỉ mục bằng số, và dĩ nhiên bên trong vòng lặp, phím số được ngụ ý.

Answer 4

Tôi biết muộn nhưng có thể hữu ích cho những người muốn theo cách khác. Một cách khác mảng key => giá trị có thể được lưu trữ bằng cách sử dụng một phương thức mảng gọi là map(); (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map) bạn cũng có thể sử dụng chức năng mũi tên quá

    var countries = ['Canada','Us','France','Italy']; 
 
    // Arrow Function 
 
    countries.map((value, key) => key+ ' : ' + value); 
 
    // Anonomous Function 
 
    countries.map(function(value, key){ 
 
     return key + " : " + value; 
 
    });