JavaScript 자주쓰는 배열관련 메소드 정리

 

sort()

  const arr1 = [1, 4, 5, 7, 9, 3];
  const result = arr1.sort(function (comp1, comp2) {
    return comp1 - comp2;
  });
  console.log(result);  // [1, 3, 4, 5, 7, 9]
  
  //or
  
    const result = arr1.sort((comp1, comp2) =>{
    return comp1 - comp2;
  });

arr1.sort() 를 사용하게 되면은 문자형 오름차순으로 정렬됩니다(내가 원하는 정렬값이 아님). 따라서 함수 comp1 과 comp2를 비교하여 return 해주는 함수를 추가해주어야 합니다. (꼭 return 해주셔야합니다 안하면 원하는 값의 배열을 얻을수없습니다)

 

배열내부에 객체형식일때는 아래처럼 정렬합니다.

//객체가 오브젝트 형식일때
let arr = [
  {
    group: "LOAN",
    title: "신용대출",
    yearRate: 6.0,
  },
  {
    group: "ORDINARY",
    title: "예금상품",
    yearRate: 2.0,
  },
  {
    group: "SAVE",
    title: "예금상품",
    yearRate: 3.639,
  },
];

let result;

result = arr.sort((a, b) => {
  a.yearRate - b.yearRate;
});

 

 

slice()

인자로는 startIndex 와 endIndex (배열의 endIndex 전까지만) 새로운 객체 배열로 반환해줍니다.

let arr = [1,2,3,4,5,6,7,8];
let arr1 = arr.slice(3,6);
console.log(arr1) // [4,5,6]

 

 

forEach()

배열의 각각 원소별로 내가 원하는 함수를 실행시켜줄수있습니다. return 값 없음

let arr = [
  {
    group: "LOAN",
    title: "신용대출",
    yearRate: 6.0,
  },
  {
    group: "ORDINARY",
    title: "예금상품",
    yearRate: 2.0,
  },
  {
    group: "SAVE",
    title: "예금상품",
    yearRate: 3.639,
  },
];

arr.forEach((value) => {
  console.log(value.yearRate);
});   // 6    2     3.639 출력이 됩니다.

 

 

map()

원 배열을 수정하지 않고 내가 원하는 조건에 맞게 짝지어진 새로운 배열을 만들어냅니다.

 

//단순 배열
const arr = [1, 2, 3];
let myarr = arr.map((num)=>{
	return num + 5;
});
console.log(myarr);		//[6, 7, 8]



//객체
let arr = [
  {
    group: "LOAN",
    title: "신용대출",
    yearRate: 6.0,
  },
  {
    group: "ORDINARY",
    title: "예금상품",
    yearRate: 2.0,
  },
  {
    group: "SAVE",
    title: "예금상품",
    yearRate: 3.639,
  },
];

// arr.forEach((value) => {
//   console.log(value.yearRate);
// });

let myarr = arr.map((value) => {
  return value.title;
});
console.log("🚀 ~ file: todo.js ~ line 89 ~ myarr ~ myarr", myarr); //['신용대출', '예금상품', '예금상품']

 

reduce()

반복해서 배열의 값을 반환 -> 누적해서 값이 필요할때 사용됩니다.

const arr = [1, 2, 3, 4, 5 ];
const myarr = arr.reduce((prev, curr, curI, arr) => (prev + curr), 0);
console.log(myarr);	//15

 

filter()

배열내에서 내가 원하는 값만 필터링해서 얻고싶을때 사용합니다.

아래 filter는 title이 "예금상품"인 물품만 filter해서 return 하여 새로운 배열에 저장합니다. 

let arr = [
  {
    group: "LOAN",
    title: "신용대출",
    yearRate: 6.0,
  },
  {
    group: "ORDINARY",
    title: "예금상품",
    yearRate: 2.0,
  },
  {
    group: "SAVE",
    title: "예금상품",
    yearRate: 3.639,
  },
];

let myarr = arr.filter((value) => {
  return value.title === "예금상품";
});
console.log("🚀 ~ file: todo.js ~ line 89 ~ myarr ~ myarr", myarr); 

// return 값
{group: 'ORDINARY', title: '예금상품', yearRate: 2}
{group: 'SAVE', title: '예금상품', yearRate: 3.639}
//