Как создать и изменить ассоциативный массив в JavaScript? - PullRequest
Новая
       18

Как создать и изменить ассоциативный массив в JavaScript?

1 голос
/ 26 сентября 2019

Я пытаюсь переместить некоторый код со стороны сервера на сторону клиента.Я изо всех сил пытаюсь работать с Javascript.Похоже, что мне нужно для достижения использует объекты против массивов.

У меня есть несколько полей ввода с атрибутами данных, которые я перебираю.

$(".selection:checked").each(function(){

    $selection_id=$(this).data('selection_id');
    $swatch_id=$(this).data('swatch_id');

});

Во-первых, я хочу создать массив в следующей форме: 

$array[$selection_id]=$swatch_id;

т.е. array(100=>123,200=456,300=789)

Во-вторых, я хочу просмотреть списокэлементов и поменять местами значение в соответствии с ключом массива.

т.е. element has key 100 and value 1000 then:

$array[100]=1000;

Новый массив array(100=>1000,200=456,300=789)

Наконец, мне нужно взятьэтот массив и превратить его в строку в виде: 

"100:1000,200:456,300:789"

Я новичок в Javascript и все еще изо всех сил пытаюсь разобраться с объектами.Любая помощь приветствуется.

Ответы [ 3 ]

2 голосов
/ 26 сентября 2019

Вам лучше создать объект для хранения отображения $ selection_id => $ watch_id.Вы можете добиться этого, используя следующий синтаксис 

const mapping = {};
mapping[$selection_id] = $watch_id;

. Тогда этот array(100=>123,200=456,300=789) будет выглядеть как 

mapping = {
   100: 123,
   200: 456,
   300: 789
}

. Значения могут быть доступны с помощью отображения [100], которое даст вам 123. Если выЧтобы преобразовать его в строку, как вы указали, выполните следующее. 

const mapString = Object.keys(mapping).reduce((acc, curr) =>
  `${acc}${curr}:${mapping[curr]},`,
"").slice(0, -1)

Это даст вам такой вывод "100:123,200:456,300:789"

Обновление

Для генерации mapString используйтеследующий.Спасибо @Soc за предложение. 

const mapString = Object.keys(mapping).map(key => `${key}:${mapping[key]}`).join(',');
0 голосов
/ 26 сентября 2019

Самый простой способ, используя объект javascript, вы можете достичь этого 

var mapObj = {};
$(".selection:checked").each(function(){


    var selection_id= $(this).data('selection_id');
    var swatch_id= $(this).data('swatch_id');
    //insert value in object
    mapObj[selection_id] = swatch_id;

});
// print object
console.log(mapObj);

// fetch particular key value
console.log(mapObj[100]);

// change value of object 
mapObj[100] = 1000;
console.log(mapObj);

// convert to string 
var string = "";
$.each(mapObj,function(index,val){
  string += index+':'+val+','; 
});
string = string.replace(/(^\s*,)|(,\s*$)/g, '');
console.log(string);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <input class="selection" data-selection_id="100" data-swatch_id="123" type="checkbox"  name="vehicle1" value="Bike" checked> I have a bike<br>
    <input class="selection" data-selection_id="200" data-swatch_id="456" type="checkbox" name="vehicle2" value="Car" checked> I have a car<br>
    <input class="selection" data-selection_id="300" data-swatch_id="789" type="checkbox" name="vehicle3" value="Boat" checked> I have a boat<br>
0 голосов
/ 26 сентября 2019

Сначала создайте объект 

var obj = {}

Затем зациклите его, как 

$(".selection:checked").each(function(){

    $selection_id=$(this).data('selection_id');
    $swatch_id=$(this).data('swatch_id');
    obj[$selection_id] = $swatch_id;
});

, он создаст объект, похожий на: 

{"100": 123, "200": 456, "300": 700}

, который вы можете изменитьзначение 100 вроде: 

obj[100] = 1000

Затем для преобразования в строку: 

Object.keys(obj).reduce((acc, val) => {
   acc.push(`${val}:${obj[val]}`); 
   return acc;
},[]).join()
...