Front-end/javascript

[JavaScript] 배열 내장 함수

잔디🌿 2023. 7. 12. 21:43

forEach

 

배열을 하나씩 순회할 수 있게 해주는 함수

const arr = [1,2,3,4];

arr.forEach((elm) => console.log(elm));

배열의 모든 요소를 한번씩 출력해준다.

 

const arr = [1,2,3,4];
const newArr = [];

arr.forEach(function (elm){
    newArr.push(elm * 2);
    });

이렇게 하면 기존 배열 *2 한 값이 새 배열에 들어가게 된다.

 

map

 

const arr = [1,2,3,4];
const newArr = arr.map((elm) =>{
   return elm*2;
   });
   
   console.log(newArr);

map를 사용하면 알아서 넣어준다.

 

includes

const arr = [1,2,3,4];
let number = "3";

console.log(arr.includes(number));

includes는 해당 변수와 같은 원소가 존재하는지를 출력해준다. 따라서 위 코드는 true를 출력한다.

 

indexOf

 

const arr = [1,2,3,4];
let number = "3";

console.log(arr.indexOf(number));

변수와 같은 요소가 몇번째 index에 있는지 출력하는 함수이다.

만약 존재하지 않으면 -1을 출력한다.

 

findIndex

 

const arr = [  //객체배열
   {color : "red"},
   {color : "blue"},
   {color : "black"},
   {color : "green"}, 
   ]
   
   
 console.log(arr.findIndex((elm) => elm.color === "green")); //3
 //elm에 차례로 배열의 값이 들어가게 된다.

findIndex를 find로 수정하면 요소를 그대로 받는다.

 

filter

 

const arr = [  //객체배열
   {num : 1, color : "red"},
   {num : 2,color : "blue"},
   {num : 3,color : "black"},
   {num : 4,color : "green"}, 
   ]
   
   
 console.log(arr.filter((elm) => elm.color === "green")); //green이 있는 객체들을 반환

filter을 쓰면 특정 값을 프로퍼티로 같는 객체들을 얻을 수 있다.

 

slice

 

배열을 자르는 함수이다.

const arr = [  //객체배열
   {num : 1, color : "red"},
   {num : 2,color : "blue"},
   {num : 3,color : "black"},
   {num : 4,color : "green"}, 
   ]
   
   
 console.log(arr.slice(0,3));

slice(0,3)이렇게 하면 index가 0인 것부터 2인 것까지 잘린 배열이 출력된다.

 

concat

배열을 붙이는 함수이다.

const arr1 = [  //객체배열
   {num : 1, color : "red"},
   {num : 2,color : "blue"},
   ]
   
const arr2 = [  //객체배열
   {num : 3, color : "red"},
   {num : 4,color : "black"},
   ]
   
   
 console.log(arr.concat(arr2));

이렇게 하면 arr1과 arr2가 붙인 형태로 출력된다.

 

sorts

 

let chars = ["a","c","b"];
chars.sort();

 

sort는 배열을 정렬해주는 함수이다. 따라서 위의 배열이 ["a","b","c"]로 바뀐다.

sort는 문자열을 기준으로 정렬한다. 따라서 숫자를 넣고 sort를 하면 이상하게 정렬된다.

 

숫자배열 정렬하기

compare함수를 따로 만들어주어야한다.

 

let numbers = [0,1,2,3,4,5,6];

const compare = (a,b) =>{
   if(a>b){
      return 1;
      }
      
   if(a<b){
      return -1;
      }
   return 0;
   
   };
   
   
numbers.sort(compare);
console.log(numbers);

내림차순으로 만들고싶으면 1과 -1의 자리를 바꾸면 된다.

 

배열 하나의 문자열로 합치기

 

const arr = ["안녕","반가워요"];

console.log(arr.join());

이렇게 하면 "안녕 반가워요"가 출력된다.

 

arr.join(" ") 이런 식으로 하면 요소들 사이에 공백이 생긴다.