개요

베이커드에서 이동하는 자바스크립트의 코드를 물려받았을 때 좀 안 좋은 오류를 범해 공유한 것이다.

컨디션

OS:Windows 10
언어: Javascript

splice 함수?

Javascript의 배열 표준 함수입니다.
대략적인 사용 방법은 아래를 참조하시오.
splice는 캡처하는 방법만은 아니에요.

문제의 소재

문제는 다음과 같다.
splice로 특정 형식의 오류 데이터를 삭제하려고 합니다.

// ErrorData削除処理
for(var i=0; i<array.length; i++){
  if(checkErrorData(array[i]===true)){
    array.splice(i, 1);  // i番目の要素を削除
  }
}

언뜻 보기에는 별 문제가 없는 것 같지만 큰 문제다.
splice 함수는 배열된 인덱스를 어지럽히기 때문에 일련의 순환 처리에서 반복적으로 실행하면 심해집니다.

파내다

실례를 들어 고려하다.

Error 데이터를 삭제하려면 i=3 에 삭제를 수행합니다.

이 때 삭제 단계에서 다시 배열되었습니다.for 순환의 계수기 i가 그렇게 증가하기 때문에 원래 index=4의 요소에 대해 Error 검사를 하지 않습니다.

문제 요약

이것은 Error 데이터의 다음 데이터를 검사할 수 없는 구조입니다.
따라서 아래의 데이터는 삭제 누락을 초래할 수 있다.

대책

스프링 함수를 사용하는 언니에게 불평하라

배열에서 요소를 삭제할 때 Filter 함수를 사용하십시오

Filter 함수 참조 이하

[JavaScript 입문] 필터로 데이터를 추출하는 방법
삭제라기보다는 Error 데이터의 새 배열을 대체한 것입니다.
속도에서도 이쪽이 압도적으로 빠르다.
다음 항목으로 덮어씁니다.

// ErrorData削除処理
array = array.filter( function (item) {
  return checkErrorData(item) === false;
})

콜백 함수로 item (수조의 각 요소) 을 검사하고, 정상적인 데이터에서만 실제 값을 되돌려줍니다.
이상은 졸문입니다.