Как добавить данные в объект из input?

Question

[testkeyc]

Нужно сделать так, чтобы в объект при клике на кнопку добавлялись данные. Из одного поля ключ, а из другого значение и объект выводился в консоль. Где я ошибся?

<input type="text" class="u7-key__input1">
	<input type="text" class="u7-key__input2">
	<button>click</button>
	<div class="out"></div>

arr = {
    '1': 'hello',
    '2': 'cracker',
}

let input1 = document.querySelector('.u7-key__input1'.value);
let input2 = document.querySelector('.u7-key__input2'.value);
let button = document.querySelector('button');
let out = '';

button.onclick = () => {
    arr[input1] = input2;
}

out = '';

for (let key in arr) {
    if (arr[key].length > 4) {
        out += arr[key] + '<br>';
        console.log(arr[key]);
    }
}

Answer 1

[Sashqa]

let input1 = document.querySelector('.u7-key__input1'.value);
let input2 = document.querySelector('.u7-key__input2'.value);

Что вы тут делаете? вы бы хоть погуглили синтаксис что ли..

let input1 = document.querySelector('.u7-key__input1').value;
let input2 = document.querySelector('.u7-key__input2').value;

arr = {
    '1': 'hello',
    '2': 'cracker',
}

const button = document.querySelector('button');
button.addEventListener('click', function() {
  let input1 = document.querySelector('.u7-key__input1').value;
  let input2 = document.querySelector('.u7-key__input2').value;
  arr[input1] = input2
})

Answer 2

[Роман]

Comments

[Сергей Соколов]

вместо let можно нужно const для элементов

[Роман]

Сергей Соколов, согласен, но так как можно а не нужно, не стал менять вариант автора)

[Роман]

Сергей Соколов, в любом случае изначально было понятно, что даже с вашими подсказками автор не увидит нужного ему результата, так как совсем не сечет что все события по сути являются асинхронными, и как следствие на момент вывода он даже с вашими подсказками будет иметь дефолтный массив )))
А отправлять его учить само понятие событий и асинхронности мне уже лень. Только за вчера было около шести вопросов с такой же ошибкой.