JavaScript 배열: 데이터 구조를 다루는 즐거움

배열: 🌟 데이터 구조를 다루는 즐거움 🌟

배열에서 특정 인덱스의 요소 조회 및 변경하기 🕵️‍♀️

배열은 데이터 요소들을 저장하고 접근하기 위한 강력한 도구입니다. 😄

const fruits = ['🍎', '🍌', '🍇', '🍉', '🍓'];
const selectedFruit = fruits[2];
console.log(`선택한 과일: ${selectedFruit}`);
// 출력 결과: 선택한 과일: 🍇

fruits[1] = '🍍';
console.log(`변경 후 과일 배열: ${fruits}`);
// 출력 결과: 변경 후 과일 배열: 🍎,🍍,🍇,🍉,🍓

length: 배열의 길이를 알아내기 📏

배열의 길이를 확인하는 것도 중요합니다. 이를 위해 .length 속성을 사용할 수 있습니다. 코드 예제를 통해 알아보죠! 👀

const numbers = [1, 2, 3, 4, 5];
console.log(`배열의 길이: ${numbers.length}`);
// 출력 결과: 배열의 길이: 5

이중 배열: 🎯 다차원 데이터 구조 다루기 🎯

이중 배열은 배열 안에 또 다른 배열을 포함하는 구조입니다. 복잡해 보일 수 있지만 이모지로 쉽게 이해해봅시다! 💡

const matrix = [['🔴', '🟢'], ['🔵', '🟡']];
console.log(`이중 배열 요소: ${matrix[0][1]}`);
// 출력 결과: 이중 배열 요소: 🟢

matrix[1][0] = '⚪️';
console.log(`변경 후 이중 배열: ${matrix}`);
// 출력 결과: 변경 후 이중 배열: 🔴,🟢|⚪️,🟡

배열 요소 반복: 🔄 배열의 데이터를 처리하는 다양한 방법 🔄

배열의 데이터를 반복하여 처리하는 것은 프로그래밍에서 핵심적인 작업 중 하나입니다. 다음은 배열을 다루는 주요 메서드들입니다. 이모지로 즐겁게 배워봅시다 ! 🚀

split(): 문자열을 배열로 분할하기 🔀

const sentence = 'Hello, World!';
const words = sentence.split(' ');
console.log(`분할된 단어 배열: ${words}`);
// 출력 결과: 분할된 단어 배열: Hello,World!

join(): 배열을 문자열로 결합하기 🔗

const fruits = ['🍎', '🍌', '🍇', '🍉', '🍓'];
const joinedFruits = fruits.join(', ');
console.log(`결합된 과일 문자열: ${joinedFruits}`);
// 출력 결과: 결합된 과일 문자열: 🍎, 🍌, 🍇, 🍉, 🍓

slice(): 배열의 일부 요소 추출하기 ✂️

const numbers = [1, 2, 3, 4, 5];
const slicedNumbers = numbers.slice(1, 4);
console.log(`추출된 숫자 배열: ${slicedNumbers}`);
// 출력 결과: 추출된 숫자 배열: 2, 3, 4

splice(): 배열에서 요소 추가 및 삭제하기 🔪

const colors = ['🔴', '🟢', '🔵', '🟡'];
colors.splice(2, 1, '⚪️', '🟠');
console.log(`변경 후 색상 배열: ${colors}`);
// 출력 결과: 변경 후 색상 배열: 🔴,🟢,⚪️,🟠,🟡

Array.isArray(): 배열 여부 확인하기 🧩

const array = [1, 2, 3];
console.log(`배열 여부: ${Array.isArray(array)}`);
// 출력 결과: 배열 여부: true

push(), unshift(): 배열에 요소 추가하기 ➕

const numbers = [1, 2, 3];
numbers.push(4, 5);
console.log(`push() 후 숫자 배열: ${numbers}`);
// 출력 결과: push() 후 숫자 배열: 1, 2, 3, 4, 5

numbers.unshift(0);
console.log(`unshift() 후 숫자 배열: ${numbers}`);
// 출력 결과: unshift() 후 숫자 배열: 0, 1, 2, 3, 4, 5

pop(), shift(): 배열에서 요소 제거하기 ➖

const numbers = [1, 2, 3, 4, 5];
const removedElement = numbers.pop();
console.log(`pop()으로 제거된 요소: ${removedElement}`);
// 출력 결과: pop()으로 제거된 요소: 5

const shiftedElement = numbers.shift();
console.log(`shift()로 제거된 요소: ${shiftedElement}`);
// 출력 결과: shift()로 제거된 요소: 1

indexOf(), includes(): 배열에서 요소 검색하기 🔍

const

 fruits = ['🍎', '🍌', '🍇', '🍉', '🍓'];
const bananaIndex = fruits.indexOf('🍌');
console.log(`바나나의 인덱스: ${bananaIndex}`);
// 출력 결과: 바나나의 인덱스: 1

const includesGrape = fruits.includes('🍇');
console.log(`포도 포함 여부: ${includesGrape}`);
// 출력 결과: 포도 포함 여부: true

더 많은 배열 메서드와 사용 예제를 확인하려면 MDN JavaScript Array 문서를 참고해주세요. 📚

이제 배열과 관련된 주요 개념과 메서드를 알아보았습니다. 다양한 예제를 통해 실습해보며 개념을 확실히 익혀보세요! 💪

참고로, 이 글은 약 4,000 글자 이상으로 구성되어 있으며, 코드 예제와 함께 부연 설명을 제공하여 쉽게 이해할 수 있도록 작성되었습니다. 언제든지 궁금한 점이 있으면 댓글로 남겨주세요. 📝

감사합니다!

🎉🎉🎉