Почему повторяющиеся элементы возвращают undefined?
const cardChild = document.querySelectorAll('.card i');
const cardsArray = ['a','a','b','b','c','c'];
const matchArray = [];
function cardsToClass() {
for (i = 0; i < cardChild.length; i++) {
let newCard = cardsArray.pop();
let newCardClass = cardChild[i];
matchArray.push(cardsArray[i]);
newCardClass.className += newCard;
console.info(cardsArray);
}; }
Привет! Эта функция использует .pop () для «выталкивания» элементов cardArray как класса в элементе DOM. Моим окончательным результатом должны быть два идентичных массива (cardArray и matchArray). Я уже близко. Однако, когда я console.info matchArray, он возвращает:
['a','b','c',undefined,undefined,undefined]
Я думаю, что что-то происходит в
matchArray.push(cardsArray[i]);
но не уверен. Кто-нибудь знает, почему он не возвращает повторяющиеся элементы?
Спасибо!
Вы можете добавить свой html?
Я пытаюсь сделать matchArray ['a', 'b', 'c', 'a', 'b', 'c'], как и cardsArray. Однако последний 'a' 'b' 'c' оказывается неопределенным
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 2
Это происходит потому, что .pop фактически изменяет исходный массив.
См. документация
Поскольку .pop модифицирует cardsArray, массив фактически сжимается по мере продвижения цикла.
Для каждой итерации цикла cardsArray начинается как:
cardsArray = ['a','b','c','a','b','c'];cardsArray = ['a','b','c','a','b'];cardsArray = ['a','b','c','a'];cardsArray = ['a','b','c'];cardsArray = ['a','b'];cardsArray = ['a'];
Из этого ясно, что из третьей итерации (i = 2) на cardsArray[i] стоит undefined.
хммм ..... ты прав. Мне нужно будет в конечном итоге сравнить карты и сопоставить массив. Я попробую клонировать "новый" массив карточек и "вытолкнуть" старый.
Вы копируете массив с первой позиции до последней.
Но, добавляя pop(), вы также удаляете последний элемент каждый раз, когда используете pop, потому что половина значений не определена.
Замените pop на unshift(), это решит вашу проблему.
Я действительно не понимаю цели кода, но HTML может помочь, если вы добавите его.
Надеюсь, это поможет:>
//const cardChild = document.querySelectorAll('.card i');
const cardsArray = ['a','a','b','b','c','c'];
const matchArray = [];
function cardsToClass() {
for (i = 0; i < cardsArray.length; i++) {
let newCard = cardsArray.unshift();
//let newCardClass = cardChild[i];
matchArray.push(cardsArray[i]);
//newCardClass.className += newCard;
};
console.info(cardsArray);
console.info(matchArray);
}
cardsToClass() Ты прав! благодарю вас! Это дает мне дубликат массива, который мне нужен. Однако без .pop () он не «выталкивает» эти элементы в DOM. Я должен разобраться с этим. Спасибо, что направили меня в правильное русло!
Хотите, чтобы cardArray был
['a','b','c']?