[자바스크립트] forEach(), indexOf(), map(), filter()

forEach()

Array에서 사용할수 있는 반복문이며 callback 함수를 반드시 전달해야한다.

value값을 callback 함수에 넣어 출력이 가능하다.

 

var datas = [10,20,54,66,22,80]
datas.forEach(function(v){
    console.log(v)
});

 

 

 

indexOf()

값을 해당 Array에서 찾은뒤 인덱스 번호로 리턴할 수 있고 그 값을 찾지 못하면 -1로 리턴한다.

var datas = [10,20,54,66,22,80]
console.log(datas);
console.log(datas.indexOf(66));
console.log(datas.indexOf(50));

indexOf로 66의 위치는 3번째 index에 위치하는 결과가 나왔고 50이라는 값은 없으므로 -1이 리턴되었다.

 

map()

기존 값을 원하는 값으로 변경할 때 리턴한다.

var datas = [10,20,54,66,22,80]
datas.map(function(v){
    return v * 2
}).forEach(function(v, i, ar){console.log(datas[i]=ar[i])});
console.log(datas);

datas.map(function(v){ return v * 2 })

이것만 봤을 때에 datas에 있는 값을 x2를 해준다는 해석을 할 수 있다. 하지만 값을 출력해보면 값은 바뀌지 않는다.

왜냐하면 datas에 값을 직접적으로 준것이 아니기 때문이다. 그렇기 때문에 forEach를 사용하여 v, i, ar를 설정해줘야 한다.

마지막으로 datas[i]의 값을 ar[i]의 값으로 설정해줘야 한다.

 

 

filter()

리턴값이 true 인 값만 추출한다.

Array 값에서 만약 10의 배수인 값만 추출하고 싶을 때 filter를 사용하여 추출할 수 있다.

var datas = [10,20,54,66,22,80]
datas = datas.filter(function(v){return v%10==0});
console.log(datas);

filter로 추출한 값을 다시 datas에 담아줘야 원하는 값만 담아진 datas를 출력할 수 있다.