Javascript-форум (https://javascript.ru/forum/)
-   Events/DOM/Window (https://javascript.ru/forum/events/)
-   -   Удаление нескольких объектов из массива (https://javascript.ru/forum/events/72970-udalenie-neskolkikh-obektov-iz-massiva.html)

konstantin-921 10.03.2018 16:51

Удаление нескольких объектов из массива
 
Добрый день!
Необходимо удалить из массива объектов все объекты с классом ".complited" по событию. Такая конструкция не справляется, видимо из-за смещения индексов при использовании .splice():

function deleteComplited() {
    
     	arrayTodo.forEach( function(element, index, array) {
    		if(element.classList.contains('complited')){
    			array.splice(index , 1);
    		}
    	});


Вариант c delete тоже не подходит, потому что в дальнейшем мне потребуется использовать длину массива. Подскажите рабочие решения. Перепробовал 3 варианта цикла, но все упирается в это смещение индексов из-за splice.

рони 10.03.2018 17:26

konstantin-921,
если исходный массив не нужен, достаточно filter.
ниже вариант с сохранением.
<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  .max{
    color: #008000;
     font-size: 2em;
  }
  .complited:after{
    content: " complited"
  }
  </style>


</head>

<body>
<div class="item">01</div>
<div class="item complited">02</div>
<div class="item">03</div>
<div class="item">04</div>
<div class="item">05</div>
<div class="item">06</div>
<div class="item">07</div>
<div class="item">08</div>
<div class="item">09</div>
<div class="item">10</div>
<div class="item complited">11</div>
<div class="item">12</div>
<div class="item complited">13</div>
<div class="item">14</div>
 <script>
var arrayTodo = [].slice.call(document.querySelectorAll(".item"));
function deleteComplited() {
  arrayTodo.reduceRight(function(array, element, index) {
    if (element.classList.contains("complited")) {
      array.splice(index, 1);
    }
    return array;
  }, arrayTodo) // далее для теста
  .forEach(function(element, index) {
    element.classList.add("max");
  });
};

deleteComplited()
  </script>
</body>
</html>

konstantin-921 10.03.2018 17:45

А если мне нужен исходный массив? Я из него рендерю все пункты списка, то есть он мне нужен, но уже без удаленных элементов с классом .complited.

рони 10.03.2018 18:00

Цитата:

Сообщение от konstantin-921
А если мне нужен исходный массив?

не понял??? чем решение выше не устроило?

konstantin-921 10.03.2018 18:16

Ох, сорри) Сейчас сделал проверку состояния массива - все удалено корректно. Щас буду интегрировать все это в свое приложение. Спасибо за помощь)


Часовой пояс GMT +3, время: 09:26.