[JAVASCRIPT] Array 객체

toString()

toString() 함수는 배열 안의 모든 문자를 쉼표(,)를 이용해 모두 결합해서 하나의 문자열로 반환한다

let fruits=["Banana", "Orange", "Apple", "Mango"];
fruits.toString();	//Banana,Orange,Apple,Mango

join()

join() 함수는 배열 안의 모든 문자를 파라미터로 지정한 문자를 이용해서 모두 결합해서 하나의 문자열로 반환한다

let fruits=["Banana", "Orange", "Apple", "Mango"];
fruits.join("*");	//Banana*Orange*Apple*Mango

pop()

pop() 함수는 배열에서 마지막 데이터를 제거하고, 마지막 데이터를 반환한다

let fruits=["Banana", "Orange", "Apple", "Mango"];
let x=fruits.pop();	//x="Mango"

push()

push() 함수는 배열에 새로운 요소(데이터, 객체 등)를 추가한다

let fruits=["Banana", "Orange", "Apple", "Mango"];
fruits.push("Kiwi");	//["Banana", "Orange", "Apple", "Mango", "Kiwi"]

shift()

shift() 함수는 배열에서 첫 번째 요소를 제거하고, 첫 번째 요소를 반환한다

let fruits=["Banana", "Orange", "Apple", "Mango"];
fruits.shift();	//Banana

unshift()

unshift() 함수는 배열의 맨 앞에 요소를 추가하고, 배열의 길이를 반환한다

let fruits=["Banana", "Orange", "Apple", "Mango"];
fruits.unshift("Lemon"); //5

배열 요소 변경

배열의 요소를 변경할 때는 변경하고자 하는 배열 인덱스로 접근해서 새로운 요소를 할당한다

let fruits=["Banana", "Orange", "Apple", "Mango"];
fruits[0]="Kiwi";	//["Kiwi", "Orange", "Apple", "Mango"]

splice()

splice() 함수는 새로운 요소를 특정 위치에 추가한다. 추가 시에는 기존 요소를 삭제할 수도 있다

let fruits=["Banana", "Orange", "Apple", "Mango"];
fruits.splice(2,0,"Lemon","Kiwi");	//["Banana", "Orange", "Lemon", "Kiwi",  "Apple", "Mango"]

• 첫 번째 파라미터: 새로운 요소를 추가할 인덱스 번호
• 두 번째 파라미터: 첫 번째 파라미터에 해당하는 인덱스에서 요소를 추가하기 전에 삭제할 요소 수
• 나머지 파라미터: 추가할 요소

concat()

concat() 함수는 2개 이상의 배열을 하나의 배열로 결합한다

let arr1=["서울", "경기"];
let arr2=["인천", "충북", "충남"];
let arr3=["경북", "경남"];
let arr=arr1.concat(arr2,arr3);	//["서울", "경기", "인천", "충북", "충남", "경북", "경남"]

slice()

slice() 함수는 2개의 파라미터를 사용하며, 첫 번째 파라미터는 시작 인덱스, 두 번째 파라미터는 종료 인덱스 번호이다. 두 번째 파라미터는 생략 가능하며, 생략하면 시작 인덱스에서 마지막 배열 요소까지 잘라내서 배열 형태로 반환한다. 두 번째 파라미터를 사용하는 경우 종료 인덱스에 해당하는 요소는 반환하지 않는다

let fruits=["Banana", "Orange", "Lemon", "Apple", "Mango"];
let citrus=fruits.slice(3);	//[Apple, Mango]
let citrus2=fruits.slice(1,3);	//[Orange, Lemon]

sort()

sort() 함수는 배열에 문자형 데이터가 있는 경우 오름차순으로 정렬한다

let fruits=["Banana", "Orange", "Lemon", "Apple", "Mango"];
fruits.sort();	//["Apple", "Banana", "Lemon", "Mango", "Orange"]

배열 안에 숫자형 데이터가 있더라도 기본적으로는 문자로 인식해서 오름차순으로 정렬을 하게 된다. 그래서 숫자 값으로 정렬하려면 정렬(sort)함수를 정의해서 사용해야 한다.

정렬된 배열을 역순으로 정렬하려면 reverse() 함수를 사용하면 된다

let fruits=["Banana", "Orange", "Lemon", "Apple", "Mango"];
fruits.sort();
fruits.reverse();	//["Orange", "Mango", "Lemon", "Banana", "Apple"]

filter()

filter() 함수는 배열에서 특정 조건을 만족하는 배열의 요소만을 찾아서 새로운 배열로 반환한다.
arr.filter(callback(element[, index[, array]])[, thisArg])
filter() 함수에는 특정 조건을 체크할 callback 함수를 매개변수로 전달한다. callback 함수는 배열의 각 요소를 시험할 함수이다. 시험을 통과(true)하면 요소를 그대로 유지하고, false라면 버리게 된다. 즉 true인 요소만을 찾아낸다

callback 함수의 매개변수

• element: 처리할 현재 요소
• index(optional): 처리할 현재 요소의 인덱스
• array:(optional): 배열 전체

let words=['spray', 'limit', 'elite', 'exuberant', 'destruction', 'present'];
let result=words.filter(function(word){
	return word.length>6;	//단어의 길이가 6자리보다 큰 단어만 추출해서 새로운 배열 반환 ["exuberant", "destruction", "present"]
});

map()

map() 함수는 배열의 데이터가 Object형일 때, 배열에 담긴 Object를 새로운 형태의 Object로 변환해서 배열로 반환한다

let userList=[{
  firstName:"재석",
  lastName:"유",
  email:"yu@naver.com"
},
{
  firstName:"종국",
  lastName:"김",
  email:"kim@naver.com"
}];

let userList2=userList.map(function(user){
  return{
    fullName:user.lastName+user.firstName,
    firstName:user.firstName,
    lastName:user.lastName,
    email:user.email
  }
});

console.log(userList2[0]);//{fullName: "유재석", firstName: "재석", lastName: "유", email: "yu@naver.com"}

reduce()

reduce() 함수는 배열에 담긴 데이터를 하나씩 순회하며 callback 함수의 실행 값을 누적하여 결과값을 반환하는 함수이다. 누적 결과값은 숫자, 문자, 객체 모두 가능하다. reduce() 함수는 주로 배열에 담긴 데이터의 합계를 구하는 데 가장 많이 사용한다. 배열에 담긴 데이터가 오브젝트인 경우는 누적 값을 구하고자 하는 오브젝트 키를 사용해서 누적 값을 구한다.

callback 함수는 4개의 매개변수를 가질 수 있다.(주로 2개의 매개변수를 사용한다)

• 첫 번째 매개변수: 누적 값
• 두 번째 매개변수: 현재 배열의 요소
• 세 번째 매개변수: 인덱스 번호
• 네 번째 매개변수: 배열

let points=[40,100,1,5,25,10];
let sum=points.reduce(function(total, currentValue){
  return total+currentValue;
},0);

console.log(sum);	//181