Лучший способ хранения массива key => value в JavaScript?
Каков наилучший способ хранения массива key=>value
в javascript и как его можно зацикливать?
Ключ каждого элемента должен быть тегом, например {id}
или просто id
, а значением должно быть числовое значение id.
Он должен быть либо элементом существующего класса javascript, либо быть глобальной переменной, на которую можно легко ссылаться через класс.
Можно использовать jQuery.
Ответы
Ответ 1
Вот что такое объект JavaScript:
var myArray = {id1: 100, id2: 200, "tag with spaces": 300};
myArray.id3 = 400;
myArray["id4"] = 500;
Вы можете выполнить цикл с помощью for..in
loop:
for (var key in myArray) {
console.log("key " + key + " has value " + myArray[key]);
}
Смотрите также: Работа с объектами (MDN).
В ECMAScript6 также есть Map
(см. таблицу совместимости браузера):
-
Объект имеет прототип, поэтому на карте есть ключи по умолчанию. Это можно обойти, используя map = Object.create(null) с ES5, но это было редко сделано.
-
Ключами объекта являются строки и символы, где они могут быть любым значением для Карты.
-
Вы можете легко получить размер карты, когда вам нужно вручную отслеживать размер для объекта.
Ответ 2
Если вы правильно поняли:
var hash = {};
hash['bob'] = 123;
hash['joe'] = 456;
var sum = 0;
for (var name in hash) {
sum += hash[name];
}
alert(sum); // 579
Ответ 3
Вы можете использовать карту.
- Новая структура данных введена в JavaScript ES6.
- Альтернатива JavaScript Object для хранения пар ключ/значение.
- Имеет полезные методы для итерации по парам ключ/значение.
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 }
Получить значение карты, используя ключ
console.log(map.get('name')); // John
console.log(map.get('id')); // 11
Получить размер карты
console.log(map.size); // 2
Проверьте ключ существует в карте
console.log(map.has('name')); // true
console.log(map.has('age')); // false
Получить ключи
console.log(map.keys()); // MapIterator { 'name', 'id' }
Получить значения
console.log(map.values()); // MapIterator { 'John', 11 }
Получить элементы карты
for (let element of map) {
console.log(element);
}
// Output:
// [ 'name', 'John' ]
// [ 'id', 11 ]
Распечатать пары ключ-значение
for (let [key, value] of map) {
console.log(key + " - " + value);
}
// Output:
// name - John
// id - 11
Печатать только ключи карты
for (let key of map.keys()) {
console.log(key);
}
// Output:
// name
// id
Печатать только значения карты
for (let value of map.values()) {
console.log(value);
}
// Output:
// John
// 11
Ответ 4
В javascript массив значений ключей хранится как объект. В javascript есть такие вещи, как массивы, но они также все еще считаются объектами, проверьте ответ этого парня: почему я могу добавить именованные свойства в массив, как если бы это был объект?
Массивы обычно отображаются с использованием синтаксиса в квадратных скобках, а объекты (массивы "key => value") - с использованием синтаксиса фигурных скобок, хотя вы можете получить доступ и задать свойства объекта с помощью синтаксиса в квадратных скобках, как показал Алексей Романов.
Массивы в 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);
});
});
Выход -
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);
});
});
Выход -
Меня зовут Джеймс, и я программист 6 футов 1
имя Джеймс
профессиональный программист
Высота объекта {футы: 6, дюймы: 1}
В языке, подобном php, это будет считаться многомерным массивом с парами ключ-значение или массивом в массиве. Я предполагаю, потому что вы спросили о том, как пройти через массив значений ключа, вы хотели бы знать, как получить объект (массив значений =>), такой как объект 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");
});
});
Выход -
Меня зовут Джошуа, и я 5 футов 11 генеральный директор
Меня зовут Джеймс, и я программист 6 футов 1
Меня зовут Питер, и я 4 фута 10 дизайнеров
Меня зовут Джошуа, и я 5 футов 11 генеральный директор
Обратите внимание, что вне цикла я должен использовать синтаксис в квадратных скобках с числовым ключом, потому что теперь это числовой индексированный массив объектов, и, конечно, внутри цикла подразумевается числовой ключ.
Ответ 5
Я знаю, что уже поздно, но это может быть полезно для тех, кто хочет других путей. Другой способ сохранить массив key => values - использовать метод массива map(); (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map) вы также можете использовать функцию стрелки
var countries = ['Canada','Us','France','Italy'];
// Arrow Function
countries.map((value, key) => key+ ' : ' + value );
// Anonomous Function
countries.map(function(value, key){
return key + " : " + value;
});
Ответ 6
Просто сделай это
var key = "keyOne";
var obj = {};
obj[key] = someValue;
Ответ 7
Сегодня мы выпустили наш новый пакет под названием laravel-blade-javascript. Он предоставляет вам директиву Blade javascript для экспорта переменных PHP в JavaScript. Таким образом, он в основном делает то же самое, что и популярный пакет PHP-Vars-To-Js-Transformer от Jeffrey Way, но вместо экспорта переменных в контроллер наш пакет делает это в виде.
Вот пример того, как это можно использовать:
@javascript('key', 'value')
Визуализированный вид выведет:
<script type="text/javascript">window['key'] = 'value';</script>
Итак, в вашем браузере у вас теперь есть доступ к ключевой переменной:
console.log(key); //outputs "value"
Вы также можете использовать один аргумент:
@javascript(['key' => 'value'])
Который будет выводить так же, как в первом примере.
Вы также можете использовать файл конфигурации для настройки пространства имен, в котором должны находиться все экспортированные переменные JavaScript.