반응형 Programming30 [JS] 자바스크립트 반복문으로 배열과 객체 순회하기 자바스크립트에서 데이터를 처리할 때 배열과 객체를 순회(iteration)하는 방법은 매우 중요합니다. 이번 글에서는 배열과 객체를 효과적으로 순회하는 방법을 실무 예제와 함께 알아보겠습니다.순회(iteration)란?순회란 배열이나 객체와 같은 데이터 구조에 저장된 여러 개의 값에 순서대로 접근하여 처리하는 작업을 말합니다.1. 배열(Array) 순회하기1-1. 기본 for 문을 이용한 배열 순회가장 기본적인 방법으로 배열의 길이를 이용하여 각 인덱스에 접근하는 방법입니다.const arr = [1, 2, 3];for (let i = 0; i 1-2. for...of 반복문을 이용한 배열 순회for...of는 배열을 순회하는데 특화된 방법으로 값을 바로 접근할 수 있어 편리합니다.const arr = .. 2025. 4. 24. [JS] 원시 타입(Primitive Type)과 객체 타입(Object Type)의 이해 및 활용 📌 원시 타입과 객체 타입자바스크립트의 데이터 타입은 크게 원시 타입(Primitive Type)과 객체 타입(Object Type)으로 나눌 수 있습니다.🔹 나눈 이유데이터가 메모리에 저장되고 복사되는 방식이 서로 다르기 때문입니다.원시 타입: Number, String, Boolean, Null, Undefined값 자체가 변수에 저장되고 복사됩니다.메모리에 저장된 값이 직접 변경되지 않습니다(불변성).객체 타입: Object (Array, Function, RegExp 등 포함)값이 메모리 주소(참조값)를 통해 변수에 저장되고 복사됩니다.메모리에 저장된 값이 직접 변경될 수 있습니다(가변성).📌 원시 타입 예시let p1 = 10;let p2 = p1;p2 = 20;console.log(p1).. 2025. 4. 24. [JS] Spread 연산자와 Rest 매개변수 정리 자바스크립트에서 개발을 하다 보면 자주 사용하는 편리한 문법들이 있습니다. 특히 ES6에서 도입된 Spread 연산자와 Rest 매개변수는 현대 웹 개발에서 필수적인 기능 중 하나입니다. 이 둘의 개념과 사용법을 명확히 이해해보겠습니다.1. Spread 연산자(...)Spread는 말 그대로 '흩뿌리다', '펼치다'라는 뜻입니다. Spread 연산자는 배열이나 객체에 저장된 값들을 개별적인 요소로 펼쳐주는 역할을 합니다.1-1) 배열에서의 Spread 사용 예시배열을 결합하거나 특정 요소를 중간에 삽입할 때 매우 유용합니다.let arr1 = [1, 2, 3];let arr2 = [4, 5, 6];// arr2 안에 arr1의 요소들을 삽입하고 싶다면?arr2 = [4, ...arr1, 5, 6];con.. 2025. 4. 23. [JS] 자바스크립트 버전이 낮아서 findIndex() 메소드를 쓸 수가 없다? function findIndex(arr, prdc){ for (var i=0; i 개발 환경 상 자바스크립트 버전이 매우 낮은 경우가 있다. 이번에는 당연히 될 줄 알았던 findIndex() 메소드가 안되서 직접 짰다. 2025. 2. 18. [JS] 구조 분해 할당(Destructuring Assignment)이란? 구조 분해 할당(Destructuring Assignment)은 배열이나 객체의 속성을 해체하여 개별 변수에 담을 수 있게 하는 JavaScript의 강력한 표현식입니다.1. 배열 구조 분해 1-1) 기본 할당배열의 요소들을 순서대로 새로운 변수에 할당할 수 있습니다: const colors = ["green", "blue", "purple"];const [c1, c2, c3] = colors;console.log(c1); // "green"console.log(c2); // "blue"console.log(c3); // "purple"1-2) 선언 분리 할당변수 선언과 할당을 분리하여 구조분해를 할 수 있습니다: let a, b;[a, b] = [1, 2];console.log(a); // 1conso.. 2025. 1. 6. [JS] 옵셔널 체이닝(Optional Chaining) 이란? 1. 개념과 도입 배경 옵셔널 체이닝은 ES2020에서 도입된 기능으로, 객체의 중첩된 속성에 안전하게 접근할 수 있게 해주는 연산자입니다. `?.` 연산자를 사용하여 객체의 속성이나 메서드가 undefined 또는 null인 경우에도 에러 없이 안전하게 접근할 수 있습니다. 2. 기본 사용법 const user = { profile: { name: 'John Doe' }};const userName = user?.profile?.name;3. 메서드 호출const result = someInterface.customMethod?.();4. 배열 접근const value = arr?.[0];5. 기존 방식과의 비교 5-1) 기존 방식const zipCode = person && person.ad.. 2025. 1. 6. 이전 1 2 3 4 5 다음 반응형