[Javascript] 배열함수 Array function

 

 

자바스크립트에서는 배열에 다양한 함수를 제공해준다.

사람들이 배열과 for문으로 가장 많이 하는게 뭐냐? 

그런걸 함수화 시켜서 그 함수만 부르면 모든걸 할 수 있도록 만든것이 배열함수 이다.

알아서 잘 딱 깔끔하고 센스있게!

 

배열함수

 

for문을 사용하지 않고! 배열에서 원하는 값을 찾거나 검사하거나 할 때 사용할 수 있는 함수세트!

 

let names = [ "Red Apple",
	      "Yellow Banana",
              "Blue blueberry",
              "Purple grapes",
              "Orange oranges",
              "Green kiwi"
		]

 

만약 array함수가 없다면 매번 아래와같이 작성해야 할 것이다.

for(let i=0; i<names.length; i++){
	console.log(names[i])
}

 

하지만 forEach를 사용해보자

names.forEach(함수)



function printName(item){
	console.log(item);
}

names.forEach(printName);
> forEach가 알아서 회전을 하면서 매번 아이템을 하나씩 넘긴다.

모든 배열함수가 함수를 매개변수로 받는다. 이 함수에 item을 넣어준면 array함수가 알아서 각각의 item을 매번 넣어준다.

 

또 printName이라는 함수가 다른데 사용되지 않는다? 하면 굳이 이름을 부여할 필요가 없어진다.

이름이 없는 함수를 만들어 갖다 붙여주면 된다.

익명함수는 불필요하게 메모리 차지하지 않고 사용되고 난 후 사라진다.

names.forEach(function (item){
	console.log(item);
})

이렇게도 가능하다.

 

그런데 일반 function 사용하는것은 옛날 문법 방식이다. 새로운 ES6+ syntax를 사용한다면

names.forEach((item)=>{console.log(item)})

 

그렇다면, forEachh가 item만 넘겨줄까? 배열에 중요한 인덱스 번호도 상당히 중요하다.  index

두번째 매개변수로 index 로 넘겨준다면

names.forEach((item, index)=>{console.log(item, index)})

인덱스는 필요하면 넣고 필요하지 않으면 사용하지 않는다.

 

 

map()

let data = names.map((item)=>{
	return item
})
console.log(data)

map으로 출력시 [ ] 안에 출력이 된다.

data안에 배열이 들어있다.

 

forEach는 반환값이 없다.

map 은 반드시 배열(array)을 리턴한다.

 

배열에 무슨값을 넣어줄지는 저 return이 결정한다. map은 반환값이 있기 때문에 반드시 return을 해줘야한다. 

 

map은 언제사용할까?

let studentList = [
	{ name : "KIM ANNA", age : 23, student : true },
	{ name : "KANG ANNA", age : 17, student : true },
	{ name : "PARK ANNA", age : 10, student : false }
]

이 중 name만 모아서 프린트를 하고싶다?


let data = studentList.map( (item)=>{
	return item.name
})
console.log(data)

이렇게 가져올 수 있다.

 

주로,  나중에 Api를 배우게 되면 api를 받아 json파일을 받으면, 그 파일은 object형식으로 되어있기 때문에 

(대부분의 데이터가 객체형식임)

내가 원하는 데이터만 가져오고 싶을 때 map을 사용한다.

 

filter()

let studentList = [
	{ name : "KIM ANNA", age : 23, student : true },
	{ name : "KANG ANNA", age : 17, student : true },
	{ name : "PARK ANNA", age : 10, student : false }
]

let data2 = studentList.filter((item)=>{
	return item.age == 23
})
console.log(data2)

원하는 조건을 넣어주면 그 조건에 충족하는 값만 배열로 반환된다.

결과값 역시 배열이다.

조건문은 항상 true/false로 떨어져야한다.

 

some()

let studentList = [
	{ name : "KIM ANNA", age : 23, student : true },
	{ name : "KANG ANNA", age : 17, student : true },
	{ name : "PARK ANNA", age : 10, student : false }
]

let data3 = studentList.some((item)=>{
	return item.startsWith("P")
})
console.log(data3)

P로 시작하는 item 있는가?

조건식에 하나라도 참인게 있으면 true

filter같은 경우 true인 값을 다 반환하는데, some같은 경우 조건에 만족을 하는게 있따? => true 를 반환한다.

있냐 없냐 물어볼때 유용하다.

 

every()

모든것이 조건을 만족하는가 ? true false 반환