📌 배열(Array)

각 값들은 요소 'element'라고 부르며 index를 가지는 특징이 있다.
배열도 객체의 한 종류입니다.

// 배열 
let courseRanking = [
  '자바스크립트 프로그래밍 기초',
  'Git으로 배우는 버전 관리'
]

// indexing (0~...)
console.log(courseRanking[0+1]);

👉 객체 활용 범위

• 순서가 있는 여러 값들의 묶음
• 여러 값의 묶음

✨ splice()

splice(startIndex, deleteCount, item)
🚧 기억하기: 인덱스, 카운트, 추가할 아이템

1. 인덱스 이후의 모든 요소들 삭제

members.splice(1);  // 1 이후 모든 요소 삭제

2. 배열의 첫 요소 삭제

members.splice(0, 1);

3. 배열의 마지막 요소 삭제

members.splice(members.length - 1, 1);

4. 삭제 없이 배열의 첫 요소 값 추가

members.splice(0, 0, 'Add');

5. 삭제 없이 배열의 마지막 요소 값 추가

members.splice(members.length, 0, 'Add');

📝 splice 적용해 보기

ex-1) 1번 인덱스부터 2개 요소 삭제

members.splice(1,2);

ex-2) 삭제한 곳에 'Nice1', 'Nice2' 추가 작성
🚧 추가로 생성되면 추가된 만큼 index가 밀리는 현상이 발생합니다.

members.splice(1, 1, 'Nice1', 'Nice2');

ex-3) 삭제되지 않고 1번 인덱스 자리에 'Nice'추가

members.splice(1, 0, 'Nice');

---

✨ 배열의 양 끝의 값을 다뤄야 할때 - shift(), pop(), unshift(), push()

배열의 첫 요소 삭제 - shift()

• 파라미터 없음
• 첫요소를 삭제하고 나머지 요소들이 앞으로 밀림

members.shift();

배열의 마지막 요소 삭제 - pop()

• 파라미터 없음

members.pop();

배열의 첫 요소로 값 추가 - unshift(value)

members.unshift('Add');

배열의 마지막 요소로 값 추가 - push(value)

members.push('Add');

---

✨ 배열에서 특정한 값 찾기 - indexOf / lastIndexOf

indexOf

배열에서 특정 값을 찾을 때 사용

• 값이 포함되어 있으면: 인덱스리턴
• 값이 포함되어 있지 않으면: -1 리턴
• 여러번 포함되어 있을 경우 : 처음 발견된 인덱스 리턴

let brands = ['Google', 'Kakao', 'Naver', 'Kakao'];
console.log(brands.indexOf('Kakao'));  // 1
console.log(brands.indexOf('Daum'));  // -1

lastIndexOf

lastIndexOf : 반대로 탐색을 뒤에서부터 함

let brands = ['Google', 'Kakao', 'Naver', 'Kakao'];
console.log(brands.lastIndexOf('Kakao'));  // 3
console.log(brands.lastIndexOf('Daum'));  // -1

---

✨ 특정 값이 있는지 확인- includes

배열에서 특정 값이 있는지 확인하기

• 값이 있으면: true 리턴
• 값이 없으면: false 리턴

let brands = ['Google', 'Kakao', 'Naver', 'Kakao'];
console.log(brands.includes('Kakao'));  // true
console.log(brands.includes('Daum'));  // false

---

✨ 배열 뒤집기 - reverse

배열의 순서를 뒤집을 때 사용

let brands = ['Google', 'Kakao', 'Naver', 'Kakao'];

brands.reverse();
console.log(brands);  // ["Kakao", "Naver", "Kakao", "Google"]

---

✨ for...of 반복문

for (변수 of 배열) {
동작부분;
}

for (let i = 0; i < arrayName.length; i++) {
	console.log(arrayName[i]);
}

for (let element of arrayName) {
	console.log(element);
}

🔥 배열에서 for...in문 권장하지 않음 🔥

• 배열보다 객체에 적합하게 설계된 반복문
• 특정 상황에서 배열 메서드나 배열의 길이 속성이 할당될 수 있으므로 사용을 권장하지 않습니다.(객체에 최적화되어 있음)
• 배열의 인덱스를 활용하려면 for 문을 사용하는 것이 더 안전합니다.

---

📌 다차원 배열

let multiArray = [[1,2], [3,4]];

console.log(multiArray[0][1]);  // 2

실습 문제

오늘은 풋살 동아리 경기가 있는 날입니다. 총인원 10명이서 5명씩 팀을 나누려고 하는데요.
실력이 비슷한 사람들끼리 가위바위보를 했고, 이긴사람이 0번 index, 진 사람이 1번 index 배열을 만들어 정리했습니다.
다음 groups 배열을 가지고, 이긴 사람끼리 그리고 진 사람끼리 팀을 나눠 teams 배열을 완성해 주세요.

let groups = [
	['영준', '캡틴'], 
	['태순', '우재'],
	['재훈', '지웅'],
	['윤형', '동욱'],
	['규식', '소원'],
];

let teams = [
	[],
	[],
];

console.log(teams[0]);
console.log(teams[1]);

풀이

for...of를 사용해서 각 indexd에 맞게 push함

for(let element of groups){
  teams[0].push(element[0]);
  teams[1].push(element[1]);
}