[기초 이론] Array

Array

Array 클래스는 리스트 형태의 고수준 객체인 배열을 생성할 때 사용하는 전역객체이다. 배열은 리스트와 비슷한 객체로서 순회와 변형 작업을 수행하는 메서드를 갖고 있다. JavaScript 배열은 길이도, 각 요소의 자료형도 고정되어 있지 않다. 배열의 길이가 언제든지 늘거나 줄어들 수 있고 데이터를 연속적이지 않은 곳에 저장할 수 있으므로 JavaScript 배열은 밀집성을 보장하지 않는다. 즉 배열은 정의된 상태에서 추가하거나 삭제할 수도 있고, 내용을 변경할 수도 있다. 

const week = ['mon', 'tue', 'wed', 'thu', 'fri', 'sat'];

week 이라는 변수에 6개의 요소를 가진 배열을 생성했다. 이렇게 정의된 상태에서 다양한 연산을 사용할 수 있다. 참고로 Array 는 0부터 세어야 한다.

자주 쓰이는 기초적인 연산

배열 요소 파악하기

const week = ['mon', 'tue', 'wed', 'thu', 'fri', 'sat'];
console.log(week.length); // > 6

배열의 항목에 접근하기

const week = ['mon', 'tue', 'wed', 'thu', 'fri', 'sat'];
console.log(week[0]); // > mon (대괄호를 이용해 감싸야 오류가 생기지 않는다)
console.log(week[week.length - 6]); // > mon
console.log(week[week.length - 1]); // > sat (배열의 length 속성에서 1을 뺀 것과 같은 마지막 인덱스)

배열 끝에 항목 추가하기

const week = ['mon', 'tue', 'wed', 'thu', 'fri', 'sat'];
const weekPush = week.push('sun'); 
console.log(week) // > mon, tue, wed, thu, fri, sat, sun

배열 끝에서 항목 제거하기

const week = ['mon', 'tue', 'wed', 'thu', 'fri', 'sat', 'sun'];
const weekPop = week.pop('sun'); 
console.log(week) // > mon, tue, wed, thu, fri, sat

배열 앞에 항목 추가하기

const week = ['mon', 'tue', 'wed', 'thu', 'fri', 'sat'];
const weekUnshift = week.unshift('sun'); 
console.log(week) // > sun, mon, tue, wed, thu, fri, sat

배열 앞에서 항목 제거하기

const week = ['sun', 'mon', 'tue', 'wed', 'thu', 'fri', 'sat'];
const weekShift = week.shift('sun'); 
console.log(week) // > mon, tue, wed, thu, fri, sat

배열 변경하기

const todayDinner = ['rice', 'kimchi', 'fried egg']
todayDinner[0] = 'multigrain rice';

console.log(todayDinner); // > multigrain rice, kimchi, fried egg

 

 

결론

이미 코딩챌린지를 통해 Array 의 장점에 대해 알고 있었던 터라 공부가 어렵지 않았다. CSS 요소를 Array 로 배치해놓고 필요한 요소만 가져오는 건 무척 재미 있었다! 아주 기초, 쉬운 영역의 Array 이기 때문에 공부해야 할 것은 산더미지만 개념은 확실히 잡아놓고 가도록 하자.