자바스크립트에서의 배열 : Array

Array

 

배열(Array) 정의

배열(array)은 같은 타입의 변수들로 이루어진 유한 집합입니다. 배열을 구성하는 각각의 값을 배열 요소(element, 엘리먼트)라고 하며, 배열의 위치를 가리키는 숫자를 인덱스(index)라고 합니다.

 

---

 

 

Array 객체로 배열 만들기

//배열생성 첫번째 방법
var 참조 변수 이름 = new Array();
참조 변수 이름[0] = 값1; 참조 변수 이름[1] = 값2; ... 참조 변수 이름[n] = 값n;

//배열생성 두번째 방법
var 참조변수이름 = new Array(값1, 값2, 값3, ..., 값n);

//배열생성 세번째 방법
var 참조변수이름 = [값1, 값2, 값3, ..., 값n];

배열을 생성하는 방법에는 다음과 같습니다. '참조 변수 이름'이라는 변수에 새로운 배열을 생성한다.

즉, array라는 변수에 새로운 배열을 생성하였다는 의미가 된다.

 

 

---

 

배열 예제

배열에 대한 예제는 다음과 같습니다.

//배열 첫번째 예시
var array = new Array();
array[0] = 1; array[1] = 2; array[2] = 3; array[3] = 4; ... array[n] = n;

다음은 배열을 새로 생성한다는 예시이다. array라는 배열을 새로 만들어 그 안에 배열에 숫자를 넣는 방법이다.

 

//배열 두번째 예시
var array = new Array(1, 2, 3, 4, ..., n); // Array 객체사용

두번째는 첫번째 과정에서 두줄로 나뉜 것을 한줄로 표현한 것이다.

 

//배열 세번째 예시
var day = ['mon', 'tue', 'wed', 'thu', 'fri', 'sat', 'sun']; // 리터럴 사용
var number = [1, 2, 3, 4, ..., n];

마지막은 숫자, 문자를 모두 쓸 수 있는 배열입니다.

 

---

 

concat() 함수

기존의 배열에 또 다른 배열이나 값을 합쳐서 새로운 배열을 만드는 함수.

var nums = ["1,", "2", "3"];
var chars = ["a", "b", "c", "d"];
nums.concat(chars)

이 스크립트를 이용할 경우 nums 배열에 chars 배열을 추가한다는 의미이다.

그럼 배열은 다음과 같다.

["1,", "2", "3", "a", "b", "c", "d"]

 

만약 반대로 했다면?

chars.concat(nums)

 

다음과 같은 배열이 만들어진다.

["a", "b", "c", "d", "1,", "2", "3"]

 

join() 함수

배열에 요소를 연결하는 함수

nums.join()

만약 이렇게 함수를 호출하였다면 "1, 2, 3" 의 기본값을 호출하게 되는데

nums.join("-");

join()함수 안에 하이폰("-")을 넣게 되면 "1-2-3"의 값을 호출하게 된다.

 

push()함수

기존 배열에 새로운 요소를 추가할 때 사용한다.

nums.push("4", "5");

그 다음에 nums를 호출하게 되면 다음과 같은 값으로 변하게 된다.

["1","2","3","4","5"]

즉, push()함수는 해당하는 배열 뒤에 붙는다.

 

unshift()함수

nums.unshift("0");

를 하게 되면 다음과 같은 배열이 됩니다.

["0","1","2","3","4","5"]

즉, unshift()함수는 배열의 맨 앞에 추가가 된다.

 

pop() 함수

맨 뒤에 있는 요소를 추출할 때 사용하는 함수이다.

var study = ["html", "css", "javascript"];
study.pop();

위와 같이 실행을 하게 되면 javascript가 추출이 된다. 그리고 다시 study를 확인하게 되면 html, css 이 두가지만 남게 된다.

 

shift() 함수

맨 앞에 있는 요소를 추출할 때 사용하는 함수이다.

var js = ["es6+", "node", "react", "angular", "vue"];
js.shift();

es6+가 추출이 되고 js에는 es6+를 제외한 나머지만 남게 된다.