코드 스터디

JS 배열메서드 『reduce( )』

Recstasy 2021. 5. 4. 06:26

 

reduce( )메서드는 배열을 객체로 변환할 수 있다.

사실상 객체 뿐만 아니라 배열, 문자열, Symbol 등...

모든 유형으로 전환이 가능하다.

 

가령, 아래처럼 DB에서 특정항목을 추출한 뒤

map()메서드처럼 새로운 배열에 담을 수 있고,

				let fruitName = Data.map( item=>return item.name )

 

객체나 문자열 값을 반환할 수도 있다. 

 

 

│Data(예시)

let Data=[
		{
		   name:'사과',
		   state:'상급',
		   price:'2,000원'
		}, 
		{
		   name:'사과폰pro10',
		   state:'중급',
		   price:'1100000원'
		}, 
		{
		   name:'바나나',
		   state:'상급',
		   price:'800원'
		}, 
		{
		   name:'바나나폰',
		   state:'하급',
		   price:'50000원'
		}
	   ];

 

│reduce(콜벡함수, 변수)

reduce()메서드의 첫번째 파라미터는 콜벡함수를 받고,

 콜벡함수는 다시 변수와 반환값을 파라미터로 받는다. 

 

 

 

 

│callback(변수, 반환값)

콜벡이 2번 이뤄내는 형태가 다소 복잡할 수 있지만

예시를 보면 꽤 간단하다.

 

        const fruits = Data.reduce((array,fruit)=>{

            array.quality = fruit.state;
            array.price = fruit.price;
            return array;

        },{});

         console.log(fruits);

 

예시의 reduce()메서드에는 빈 객체를 반환값으로(reduce()의 두번째 파라미터) 사용했고,

사실상 콜벡의 첫번째 파라미터는 빈 객체와 같다.

 

 

결론적으로,

배열로 감싸고 있는 무의미한 데이터에서 '유의미한 값'을 추출할 때,

reduce( )메서드를 사용할 수 있다.