[JS] 배열

jwww·2023년 9월 11일
0

JavaScript 개념

목록 보기
6/9

1. 배열

배열은 자바스크립트의 비원시타입의 자료형이다.
순서가 있는 요소들의 집합으로, 순서가 있는 컬렉션이 필요할 때 사용한다.

2. 배열 선언

배열을 선언하는 방법은 생성자를 사용하거나, 배열 리터럴을 사용하는 두 가지 방법이 있다.
아래와 같이 만들면 빈 배열을 만들 수 있다.

// (1) 생성자
let arr = new Array[];

// (2) 배열 리터럴
let arr = [];

각 요소에 접근하기

각 배열 요소에는 배열 내 순서를 나타내는 숫자, 인덱스가 매겨져있다.
배열 내에서 특정 요소에 접근하고 싶다면 대괄호 안에 인덱스를 넣어주면 된다.

let students = ["성희","지운","상아"];
console.log( students[0] );	// 성희

이 방법으로 요소를 수정하거나 추가하는 것도 가능하다.

// 수정
students[0] = "민지";
console.log(students[0]);	// 성희에서 민지로 변경됨.

// 추가
students[3] = "민지";
console.log(students);	// [object Array] (4) ["민지","지운","상아","지연"]

배열 길이 확인하기

length를 사용하면 배열에 담긴 요소가 몇 개인지 알 수 있다.

let students = ["성희","지운","상아"];
console.log(students.length);	// 3

배열 요소의 자료형에는 제약이 없기 때문에 객체, 함수 등 여러가지 값이 들어갈 수 있다.

let students = ["성희", { name: "지운", age: 18, height: 174,},
                "상아", function(){alert("출석 끝!")}];

console.log(students[1].age);	// 18
console.log(students[3]());		// 함수 실행, "출석 끝!"

3. 내장 메서드를 사용해 배열 수정하기

(1) pop

배열 끝 요소를 제거하고, 제거한 요소를 반환한다.

let students = ["성희","지운","상아"];
console.log(students.pop());	// 배열에서 "상아" 제거하고 "상아" 콘솔창에 출력
console.log(students);		// [object Array] (2) ["성희","지운"]

(2) push

배열 끝에 요소를 추가한다.

let students = ["성희","지운","상아"];
console.log(students.push("은서"));		// 4
console.log(students);		// [object Array] (4) ["성희","지운","상아","은서"]

여기서 students.push("...") 를 호출하는 것은 fruits[fruits.length] = ... 와 같은 효과를 보인다.

(3) shift

배열 앞 요소를 제거하고, 제거한 요소를 반환한다.

let students = ["성희","지운","상아"];
console.log(students.shift());		// "성희"
console.log(students);		// [object Array] (2) ["지운","상아"]

(4) unshift

배열 앞에 요소를 추가한다.

let students = ["성희","지운","상아"];
console.log(students.unshift("민지"));	// 4
console.log(students);		// [object Array] (4) ["민지","성희","지운","상아"]
  • pushunshift는 요소를 한 번에 여러 개 추가할 수 있다.

성능

pushpop은 빠르지만 shiftunshift는 느리다.
shiftunshift는 3가지 동작을 수행해야 이뤄진다.
(1) 인덱스 0인 요소를 제거
(2) 모든 요소를 왼쪽으로 이동시킨다. (인덱스 1은 0으로, 2는 1로)
(3) length 값을 갱신한다.
배열에 요소가 많으면 요소를 이동시키는데 걸리는 시간이 길고 메모리 관련 연산도 많아진다.
반대로 pushpop은 요소 이동이 필요하지 않기 때문에 실행 속도가 빠르다.

4. 배열의 동작 원리

배열은 특별한 종류의 객체이다. 배열 arr의 요소를 arr[0] 처럼 접근하는 방식은 객체 문법에서 온 것이다. 하지만 객체의 키가 배열에서는 숫자라는 점이 다르다.
배열의 본질을 객체이기 때문에 원시 자료형이 아닌 비원시자료형인 객체형에 속하기 때문에 객체처럼 동작한다.

객체와 마찬가지로 주소(참조)를 통해 복사된다.

let student = ["성희"];
let friend = student;

console.log(friend === student);		// true, 같은 주소를 가리킴(두 변수가 같은 객체 참조)

friend.push("민지");
console.log(student);		// [object Array] (2)["성희","민지"]
profile
퍼블리셔 공부 블로그 입니다

0개의 댓글

관련 채용 정보