JS 기초 | 배열 (array)

🚀 오늘의 학습 목표

• 배열(array) 이해
• 배열의 특징 알기
• length 알기
• 배열 메서드 알기
• 반복문 (for, for...of) 이해
  
  

15. 배열 (array)

배열 은 순서 가 있는 리스트

배열은 대괄호 [] 로 묶어 준다.
같은 방식으로 수정도 가능하다.
배열 내부에 든 값을 요소(Element)라고 한다.

let students = ['철수', '영희', '영지', '영수'];

console.log(students[0]);
console.log(students[1]);
console.log(students[2]);
console.log(students[3]);

students[0] = '민정';
console.log(students); 	// ["민정","영희","영지","영수"]

students[0] = '민정'; 을 입력 하면 첫번째 학생이 철수에서 민정으로 바뀌게 된다.

15-1. 배열의 특징

배열은 문자 뿐만 아니라 숫자, 객체, 함수 등도 포함할 수 있다.

15-2. length : 배열의 길이

length 는 배열이 가지고 있는 요소의 개수를 반환한다.

let students = ['철수', '영희', '영지', '영수'];

console.log(students.length); // 4

15-3. 배열 메서드

15-3-1. push() : 배열 끝에 추가

let days = ['월','화','수'];
days.push ('목');

console.log(days); // ["월","화","수","목"]

15-3-2. pop : 배열 끝 요소 제거

let days = ['월','화','수'];
days.pop()

console.log(days); // ["월","화"]

15-3-3. unshift 배열 앞에 추가

let days = ['월','화','수'];
days.unshift('일');

console.log(days); // ["일","월","화","수"]

15-3-4. shift 배열 앞 요소 제거

let days = ['월','화','수'];
days.shift();

console.log(days); // ["화","수"]

📢 참고로 push 와 unshift 는 여러 요소를 한 번에 추가할 수도 있다.

15-4. 반복문

15-4-1. for

배열을 쓰는 가장 큰 이유는 반복을 위해서다.
length 를 통해 배열의 개수를 알수 있기 때문에 for문을 사용할 수 있다.

let days = ['월', '화', '수'];

for (let  index = 0; index < days.length; index++){
  console.log(days[index]); // 0 ~ 2 까지 반복
}
/*
"월"
"화"
"수"
*/

15-4-2. 반복문 : for ... of

객체를 순회하는 for ... in 과 헷갈리지 않게 주의!
배열 days 를 돌면서 요소를 day 라는 이름으로 접근할 수 있다.
for 문 보다는 간단하지만 index 를 못 얻는다는 단점이 있다.

let days = ['월','화','수'];

for(let day of days){
  console.log(day);
}

---

🧑🏻‍💻 코드로 살펴보기

let days = ['mon','tud','wed'];

❓ 해당 배열 중 'tud' 를 '화요일' 로 배열을 바꿔 보자.

days[1] = "화요일"

console.log(days); // ["mon","화요일","wed"]

❓ 배열의 길이를 알아 보자.

console.log(days.length); // 3

❓ 배열의 제일 뒤에 thu 를 추가해 보자.

let days = ['mon','tud','wed'];

days.push('thu');
console.log(days); // ["mon","tud","wed","thu"]

❓ 배열의 제일 앞에 sun 를 추가해 보자.

let days = ['mon','tud','wed'];

days.unshift('sun');
console.log(days); // ["sun","mon","tud","wed"]

❓ 이제 for 문을 이용해서 반복해 보자.

let days = ['mon','tud','wed'];

days.push('thu');
days.unshift('sun');

for (let index = 0; index < days.length; index++) {
  console.log(days[index]);
}
/*
"sun"
"mon"
"tud"
"wed"
"thu"
*/

❓ 이번에는 for ... of 문을 이용해서 반복해 보자.

let days = ['mon','tud','wed'];

days.push('thu');
days.unshift('sun');

for (let day of days){
  console.log(day);
}
/*
"sun"
"mon"
"tud"
"wed"
"thu"
*/