배열이란?

1️⃣ 배열

• 배열은 순서가 있는 데이터를 저장하는 자료구조입니다.

• 여러 타입의 데이터를 저장할 수 있습니다.

• 배열에 저장된 데이터를 요소라고 하며, 요소의 위치는 인덱스(index)라고 합니다.
  • 인덱스는 0부터 시작하는 정수입니다.
  • 대괄호( [] ) 안에 인덱스 번호를 작성해 해당 요소에 접근할 수 있습니다.

const mixedArray = ['Hello', 42, true, { name: 'John', age: 30 }];

console.log(mixedArray);

// 결과
[ 'Hello', 42, true, { name: 'John', age: 30 } ]

 

⚠️ 여기서 잠깐!

• 배열은 요소가 순서를 유지하는, 특수한 형태의 객체입니다.

• 일반 객체는 키를 통해 값에 접근하고, 배열은 인덱스를 통해 요소에 접근합니다.

 

2️⃣ 배열의 생성

• 배열은 ‘ [ ] ‘ 또는 new Array()로 생성할 수 있습니다.

const array1 = new Array();
const array2 = []; 

 

➕ new와 생성자 함수

• new는 새로운 객체를 생성하는 연산자입니다.

• new와 함께 사용하는 Array()와 같은 함수를 생성자 함수라고 부릅니다.

• Array()를 비롯한 일부 생성자 함수는 new 없이도 호출할 수 있습니다.

 

3️⃣ 인덱스로 요소에 접근하기

• 인덱스를 이용해 배열의 요소에 접근하는 것을 ‘인덱싱’이라고 합니다.

• 배열의 마지막 인덱스는 ‘배열의 전체 길이 - 1’입니다.

const seasons = ['spring', 'summer', 'autumn', 'winter'];

console.log(seasons[0]);
console.log(seasons[3]); 

// 결과
spring
winter

 

가방들 = ['캐리어','메신저 백','서류 가방'] 

 

객체는 : key 와 value가 한쌍인 property이다.

객체의 property는 순서가 중요하지않다.

key를 통해 배열을 꺼낼수있다.

 

배열 값이 일렬로 나열 n번째 데이터로 지목.

 

배열 vs 객체와 다른점 중괄호{} 가 아닌 대괄호[] 순서대로 나열함

const seasons = ['spring','summer','autumn','winter'];

 

const array = new Array();

const array = [];

 

배열은 순서대로 순서대로 값을 부여받게되는데 인덱스

 

const seasons ['spring','summer','autumn','winter'];

                             [0]           [1]            [2]          [3]

 

 

console.log(seasons[0]);  [0] 배열의 첫 번째값

console.log(seasons[3]);  [3] 배열의 네 번째 값

 

 

배열의 이름

대괄호 []

배열의 길이

대입 연산자 작성

 

const fruits = ['apple','lemon','kiwi','cherry','mango']

fruit[4] = 'mango';

 

console.log(fruits);

1️⃣ 배열의 길이 확인하기

• length 속성을 사용해 배열의 길이를 확인할 수 있습니다.

const nums = [10, 16, 23, 29, 33, 37, 40];
console.log(nums.length);

 

// 결과
7

• 배열의 length 속성은 읽기 전용이 아니기 때문에 직접 수정이 가능합니다.

• length 속성을 감소시키면 길이를 벗어나는 요소가 자동으로 삭제됩니다.

• length 속성을 증가시키면 배열의 길이가 증가하고, 새로운 요소는 undefined로 채워집니다.

const nums = [7, 11, 12, 21];
nums.length = 2;
console.log(nums);

nums.length = 4;
console.log(nums);

// 결과
[ 7, 11 ]
[ 7, 11, <2 empty items> ]

2️⃣ 배열에 요소 추가하기

인덱스를 사용한 요소 추가

• 배열의 마지막 인덱스 이후에 새로운 요소를 추가해 배열을 확장할 수 있습니다.

const fruits = ['apple', 'lemon', 'kiwi', 'cherry'];
fruits[4] = 'mango';

console.log(fruits);

// 결과
[ 'apple', 'lemon', 'kiwi', 'cherry', 'mango' ]

 

push()를 사용한 요소 추가

• push()를 사용해 배열의 마지막에 요소를 추가할 수 있습니다.

• push()는 인수로 추가할 요소를 전달받습니다.

const characters = ['e', 'f', 'g'];
characters.push('h');
console.log(characters); 

// 결과
[ 'e', 'f', 'g', 'h' ]

 

unshift()를 사용한 요소 추가

• unshift()를 사용해 배열의 시작 부분에 요소를 추가할 수 있습니다.

• unshift()는 인수로 추가할 요소를 전달받습니다.

const characters = ['e', 'f', 'g', 'h'];
characters.unshift('d');
console.log(characters);

// 결과
[ 'd', 'e', 'f', 'g', 'h' ]

 

⚠️ 여기서 잠깐!

• push()와 unshift()는 한 번에 여러 개의 요소를 배열에 추가할 수 있습니다.

• 추가된 요소의 순서는 인수의 순서와 같습니다.

const characters = ['e', 'f', 'g'];
characters.push('h', 'i');
characters.unshift('c', 'd');
console.log(characters);

// 결과
[ 'c', 'd', 'e', 'f', 'g', 'h', 'i' ]

 

3️⃣ 배열에서 요소 삭제하기

pop()을 사용한 요소 삭제

• pop()을 사용해 배열의 마지막 요소를 삭제할 수 있습니다.

const characters = ['e', 'f', 'g'];
characters.pop();
console.log(characters);

// 결과
[ 'e','f' ]

 

shift()를 사용한 요소 삭제

• shift()를 사용해 배열의 첫 번째 요소를 삭제할 수 있습니다.

const characters = ['e', 'f'];
characters.shift();
console.log(characters);

// 결과
[ 'f' ]