배열 (Array)

 

배열 (Array)

 

배열 (Array) 이란?

• 한개의 변수에 여러 개의 값을 순차적으로 저장할 때 사용한다.

let arr = new Array()
let arr = []

• 배열 안에 들어있는 값들을 요소(element, item, etc)라고 한다.

let arr = [ 1, '2', ture ]
let arr1 = [ undefined, null, false, NaN, 1000 ]

• 배열은 어떤 값이라도 배열의 요소로 추가할 수 있으며 종류가 다른 값들도 함께 담을 수 있다.
• 배열의 크기는 고정되지 않는다. ( ⇒ 언제든 요소를 추가하거나 제거할 수 있다.)
• 항상 0부터 시작한다.

---

💡 💡 배열은 기능이 추가된 특수 객체이므로 배열에 숫자가 아닌 키나 분수, 음수 등을 키로 사용할 수는 있다. 하지만 이러한 행동은 설계 목적에 어긋날 뿐만 아니라 혼란스러운 동작과 찾기 어려운 버그를 초래할 수 있기 때문에 지양해야 한다.

---

 

배열의 특징

• 배열은 번호가 매겨진 인덱스를 갖는 특별한 유형의 객체이다. (객체이긴 하지만 객체와 접근 방법이 다름)

let fruits = [ 'apple', 'orange', 'banana' ]
fruits[0]		// 결과 : apple

let fruits = { first : 'apple', second : 'orange', third : 'banana' }
fruits.first	 // 결과 : apple

• 배열 요소는 객체가 될 수 있다.
• 동일한 배열에 다른 유형의 변수를 가질 수 있다.
• 배열에 객체를 가질 수 있다.
  • 💡 배열과 객체의 차이점
    • 배열은 숫자 인덱스를 사용한다.
    • 객체는 이름으로 된 인덱스를 사용한다. 
• 배열에 함수를 가질 수 있다.
• 배열에 배열을 가질 수 있다. (다차원 배열)
• 배열은 객체와 달리 본질에서 순서가 있는 데이터 집합이며 0으로 시작하는 숫자형 인덱스를 사용한다.
• 모든 배열에는 요소가 몇 개 있는지 나타내는 length 프로퍼티가 있다.
• 배열에 배열 길이보다 큰 인덱스를 사용해서 요소를 할당하면 배열은 자동으로 그 인덱스에 맞게 늘어나며, 빈자리는 undefined로 채워진다.

 

배열 인식 방법

• isArray() 이용하기
  변수가 배열인지 알고 싶은 경우, JavaScript 연산자 array.isArray 를 이용하여 알 수 있다.

let fruits = ["Banana", "Orange", "Apple", "Mango"]

Array.isArray(fruits)

// 결과 : true

그러나 이 방법은 ECMAScript 5가 이전 브라우저에서 지원이 되지 않는다.

 

배열 요소 접근

• 인덱스를 이용하여 접근하기

let food = [ 'pasta', 'steak', 'rice' ]
let myFavoriteFood = food[1]
console.log(myFavoriteFood)

// 결과 : steak

• 인덱스를 이용하여 배열의 해당 인덱스 위치에 있는 요소를 수정하기

let fibonacci = [ 1, 2, 3, 5, 8, 13 ]

console.log(fibonacci[4]) 		// 결과 : 8
fibonacci[4] = false
console.log(fibonacci[4]) 		// 결과 : false

 

배열의 속성

• length배열의 array.length method는 배열의 길이를 반환한다.
  • 함수와 매개변수를 응용해서 배열의 길이를 반환해주는 함수 만들어보기
• let fruits = [ 'apple', 'banana', 'orange' ] console.log(fruits) // 결과 : [ 'apple', 'orange', 'grape' ] console.log(fruits.length) // 결과 : 3

let fruits = [ 'apple', 'grape', 'banana' ]

function getNumOfFruits(array) {
	return array.length
}
let numOfFruits = getNumOfFruits(fruits)
console.log(numOfFruits)

// 결과 : 3