Динамически добавлять в разные объекты JS данные - внутри цикла или коммутатора и т. Д.?

Question

все, что я застрял в этой позиции и не знаю, как ее решить :) Я получаю много разных атрибутов с веб-страницы - которые я хочу сохранить в объектах, чтобы отправить их позже в PHP / Mysql - моя проблемачто я не знаю, сколько объектов создается пользователем, который помещает данные на страницу, поэтому мне нужно создавать объекты, скажем: object1 {id, name, date ...}, object2, object3 нажатием на кнопку sendкнопка на странице - я знаю, что не может быть более 150 объектов одновременно + данные, хранящиеся в объекте.Поэтому я попытался динамически создавать объекты при чтении длины полей ввода, что до сих пор работало.Теперь я хочу заполнить созданные объекты данными, итерируя по странице с помощью jquery, и искать классы с идентификатором и данными, которые нужно хранить в Object1, Object2 и т. Д. Моя проблема в том, что я не знаю, как сохранить данные вобъект внутри цикла

var objekt1 =  {};
var objekt2 =  {};


// handle click and add class
$("#but1").on("click", function(){
 for (x=1;x<3; x++ ){
 var key = "objekt"+x;
 alert(key);
 var value = x;
 key.id=x;
 key.name="name"+x;
 }
 /*objekt1.id='10';
 objekt1.name='obj1';
 objekt2.id='20';
 objekt2.name='obj2';*/
 
 $("#output1").html(objekt1.id+ ' ' + objekt1.name);
 $("#output2").html(objekt2.id+ ' ' + objekt2.name);
}) //opn click

#but1 {
  background: #0084ff;
  border: 1px solid white;
  border-radius: 5px;
  padding: 8px 14px;
  font-size: 15px;
  color: #fff;
}

#but1:hover{
  cursor: pointer;}
body {
  background: #20262E;
  padding: 20px;
  font-family: Helvetica;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="but1">try me</div>
<div id="output1">

</div>
<div id="output2">

</div>

Вот моя проблема, которую я не знаю, как ее создать: я хочу достичь: objekt1.id = 1;но не знаю, как его создать: это совсем не работает: 'objekt' + x = x;но также метод значения ключа не работает должным образом :( что я делаю не так?

Я знаю, что есть также массивы для этого типа проблемы, но действительно многомерные массивы работают на всех других языках, где я могуиметь пары ключ-значение, а не только числовые индексы ...: (

Надеюсь, вы понимаете, что я имел в виду ... сегодня очень поздно ...

Спасибо всем за то, что вы!время и терпение :)

Answer 1

Для создания objekt1 & objekt2 в качестве глобальных переменных используйте window["variable_name"]

for (x=1; x < 3; x++){
window["objekt" + x] = {};
window["objekt" + x].name = "name" + x;
window["objekt" + x].id = x * 10;
 }
console.log(objekt1)
console.log(objekt2)

Или создать свой собственный родительский объект и дочерние объекты динамически

var data = {};

for (x=1; x < 3; x++){
data["objekt" + x] = {};
data["objekt" + x].name = "name" + x;
data["objekt" + x].id = x * 10;
 }
console.log(data.objekt1)
console.log(data.objekt2)

Answer 2

Мне немного непонятно, о чем вы спрашиваете, но похоже, что вы пытаетесь динамически создавать объекты в цикле for.Ниже приведен пример того, как перебрать что-то и создать объект, а затем сохранить его в массиве.Дайте мне знать, если мое понимание неверно.

// Option 1
const objects = [];
for (let x = 1; x < 3; x++ ){
   const obj = {
    id: x,
    name: `something ${x}`
   }
   objects.push(obj);
 }
 console.log(objects);
 
 
 // Option 2
 const obj2 = {};
 for (let x = 1; x < 3; x++) {
  obj2[`Item_${x}`] = { id: x };
 }
 console.log(obj2);