[javascript] forEach is not a function error

 

문제 

자바스크립트에서 문자열에 대해 forEach문을 사용했는데 이 에러가 나면서 실행이 되지 않음.

 

원인 

문자열은 배열이 아니기 때문에, 유사 배열이라 이런 오류가 생긴다고 한다. 

 

 

 

유사 배열 객체

Array 형태란 arguments가 length 속성과 0부터 인덱스 된다는 특징을 가지고 있지만,  Array의 forEach, map과 같은 내장 메서드를 가지고 있지 않는 것을 의미한다.

 

배열인지 아닌지 확인하는 방법은 Array.isArray(유사 배열 객체 또는 배열 객체) 로 확인하면 된다.

const arr = [1,2,3,4,5];
const str = "2e3";
var node = document.querySelector('div'); 
var ele = document.body.children;

console.log(Array.isArray(arr)); //true
console.log(Array.isArray(str)); //false
console.log(Array.isArray(node)); //false
console.log(Array.isArray(ele)); //false

 

해결

Array.from(유사배열객체).forEach를 사용함으로써 해결 되었다. 

const str = "2e3";
Array.from(str).forEach(e => {
        ...
});

 

 

참고

https://enchiridion.tistory.com/64

https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach