🎇 배열
배열 Array 은 여러 개의 변수를 한 번에 선언하여 다룰 수 있는 자료형이다.
배열 내부에 있는 값을 요소 element 라고 하고,
요소의 순서를 인덱스 index 라고 한다. 인덱스는 0부터 시작한다.
JavaScript 배열은 길이와 각 요소의 자료형이 고정되어 있지 않다.
🔗 배열 기초
배열 선언
let array = new Array(); // 빈 배열 만들기
let array = []; // 빈 배열 만들기
let array = [1, 2, 3, 4]; // 선언과 동시에 초기화하기배열 접근하기
let animals = ["강아지", "토끼", "고양이"];
console.log( animals[0] ); // 강아지
console.log( animals[1] ); // 토끼
console.log( animals[2] ); // 고양이배열 수정하기
animals[0] = "담비"; // 배열 ["담비", "토끼", "고양이"]로 수정새로운 요소 추가하기
animals[3] = "코끼리"; // 배열 ["담비", "토끼", "고양이", "코끼리"]로 수정배열 요소 개수 확인하기
console.log( animals.length ); // 3
console.log( animals[animals.length -1] ); // 이와 같은 방식으로 접근하기도 한다. ❕ trailing 쉼표
배열의 마지막 요소는 객체와 마찬가지로 쉼표로 끝날 수 있다.
let fruits = {
"사과",
"오렌지",
"자두",
];trailing, 길게 늘어지는 쉼표를 사용하면
모든 줄의 생김새가 유사해져 요소를 넣거나 빼기가 쉬워진다.
🔗 배열 메소드
push() : 배열 끝에 요소 추가하기
pop() : 배열 끝에서부터 요소 제거하기
shift() : 배열 앞에서부터 요소 제거하기
unshift() : 배열 앞에 요소 추가하기
indexOf() : 배열 안 요소의 인덱스 찾기
splice() : 인덱스 위치에 있는 요소 제거하기
splice() : 인덱스 위치에서부터 여러개의 요소 제거하기
sort() : 정렬하기
join() : 배열을 문자열로 변환하기
split() : 문자열을 배열로 변환하기
reverse() : 배열의 아이템 순서 뒤집기
slice() : 배열의 특정한 부분 리턴하기
find() : 콜백함수의 true 리턴 값들만 모아서 새로운 배열 만들기
filter() : 콜백함수의 true 리턴 값들만 모아서 새로운 배열 만들기
map() : 콜백함수의 리턴 값들로 새로운 배열 만들기
forEach() : 배열 내부의 요소를 사용하여 콜백 함수를 호출
🎇 반복문
🔗 for-in 반복문
for-in 반복문 은 배열 요소를 하나하나 꺼내서 특정 문장을 실행할 때 사용한다.
for (const 반복 변수 in 배열 또는 객체) {
문장
}const foods = ['피자', '회', '삼겹살'];
for (const i in foods) {
console.log(`${i}번째 음식 : ${foods[i]}`);
}0번째 음식 : 피자
1번째 음식 : 회
2번째 음식 : 삼겹살반복 변수에는 요소의 인덱스가 들어온다. 그래서 반복문 내부에 요소를 사용하려면 foods[i]와 같은 형태로 사용되며, 안정성을 위해 몇 가지 코드를 더 추가해야 한다.
for-in 반복문은 비교적 안정적이지 않다. 가장 기초적인 반복문이지만,
이것 대신에for-of,for반복문을 활용하는 것이 좋다.
🔗 for-of 반복문
for-of 반복문 은 요소의 값을 반복할 때 안정적으로 사용할 수 있다.
for-in 반복문 과 다르게 반복 변수에 요소의 값이 들어간다.
for (const 반복 변수 of 배열 또는 객체) {
문장
}const foods = ['피자', '회', '삼겹살'];
for (const food of foods) {
console.log(`음식 : ${food}`);
}음식 : 피자
음식 : 회
음식 : 삼겹살🔗 for 반복문
일반적으로 특정 횟수만큼 반복하고 싶을 때 사용하는 반복문이다.
for (let i = 0; i < 반복 횟수; i++){
문장
}const foods = ['피자', '회', '삼겹살'];
for (let i = 0; i < foods.length; i++){
console.log(`음식 : ${foods[i]}`);
}음식 : 피자
음식 : 회
음식 : 삼겹살🔗 while 반복문
while 반복문은 if 조건문과 비슷한 반복문이다.
while (boolean 표현식) {
문장
}boolean 이 true 이면 계속해서 문장을 실행한다.
여기서 조건이 변하지 않는다면 무한하게 반복실행을 하여 무한 루프에 빠질 수도 있으니 조건을 거짓으로 만들 수 있는 내용이 포함되어야 한다.
while 반복문은 조건에 큰 비중이 있을 때 사용하는 것이 좋다.
특정 시간 동안 어떤 데이터를 받을 때까지, 배열에서 어떠한 요소가 완전히 제거될 때 까지 등 조건을 기반으로 사용하는 반복문에 while 반복문을 사용한다.
🔗 break 키워드
break 키워드는 반복문을 벗어날 때 사용하는 키워드이다.
for (let i = 0; true; i++) {
alert(i + '번쨰 반복문');
const isContinue = confirm('계속 진행?');
if(!isContinue)
break;
}
alert('반복 종료');confirm() 함수는 사용자에게 확인을 받는 대화상자를 실행한다. [확인]은 true을 반환하고, [취소]는 false를 반환한다.
사용자가 [취소]를 클릭하며 false를 받았을 때, break 키워드가 실행되어 반복문이 종료된다.
🔗 continue 키워드
continue 키워드는 반복문 안의 반복 작업을 멈추고 반복문의 처음으로 돌아가 다시 반복 작업을 진행한다.
for (let i = 0; i < 10; i++) {
if (i%2 === 0)
continue;
console.log(`홀수 : ${i}`);
}짝수일 때 continue 키워드가 실행되어 console창에 짝수는 출력되지 않는다.
break, continue 키워드를 사용하면 코드가 간결해 보인다. 하지만 나같은 초보가 괜히 필요 없는 부분에도 키워드를 굳이 굳이 넣어서 사용하는 낭패가 많다고 하니 조심하도록 하자.
