-

객체 접근 객체 접근 방법1. 점 표기법(dot notation) 가장 흔히 사용하는 접근 방법키 이름이 유효한 식별자(identifier)이어야 가능사용 가능 : 문자(A-Z, a-z), _, $로 시작 가능 (ex) name, age, _id, $value ...)사용 불가 : 공백, 숫자로 시작, 특수문자 (ex) "full name", "123abc", "user-name"..)식별자로 사용할 수 없는 키를 사용할 때는 무조건 대괄호 [] 사용해야 객체 접근 가능장점: 코드 읽기 쉬움단점: 변수로 동적 접근 불가// [문법 - 값 접근]객체명.키명// [문법 - 메서드 호출]객체명.키명()console.log(person.name); // "Alice"person.greet(); ..

객체객체는 키(key)와 값(value)의 쌍으로 구성된 속성을 가진 데이터 타입키(key): 보통 문자열(String) 또는 심볼(Symbol)값(value): 숫자, 문자열, 불리언, 함수, 배열, 다른 객체 등 모든 자료형이 가능속성(property) : 키(key) + 값(value)의 쌍을 의미데이터를 {}로 감싸 객체를 정의데이터 타입의 제한이 없음키를 사용하여 데이터를 불러오거나 값을 변경할 수 있음const로 선언할 경우 객체 자체를 변경할 수는 없으나, 객체 안의 프로퍼티나 메서드는 변경이 가능객체의 키와 속성 값이 같을 경우 하나로 입력가능특징특징설명동적(Dynamic)객체는 생성 후에도 속성을 자유롭게 추가, 수정, 삭제할 수 있음참조 타입(Reference Type)객체는 메모리에 ..

유사배열유사배열은 배열과 비슷하게 생겼지만 진짜 배열은 아닌 객체즉, 배열처럼 인덱스(0, 1, 2...)와 length 프로퍼티가 있어서 배열처럼 접근할 수 있지만, 배열 메서드(Array.prototype 메서드)는 없는 객체특징인덱스로 요소에 접근 가능 (ex, obj[0], obj[1])length 속성 존재배열 고유 메서드(ex: push(), pop(), forEach())를 사용할 수 없음반복문 접근 가능(for, while)일반 객체이므로 배열 메서드를 바로 사용할 수 없음 Array.from() 또는 전개 연산자 ...로 배열로 변환 가능유사배열을 진짜 배열로 만들어야 배열 메서드를 쓸 수 있음Array.from() 함수나 [...obj] (이터러블인 경우)로 변환 가능반복문으로 접근 가..

arguments정의 : 함수 내부에서 사용할 수 있는, 호출 시 전달된 모든 인자(argument)를 담고 있는 유사 배열 객체함수 내부에 자동으로 생성됨함수가 호출될 때 전달된 모든 인자들을 순서대로 담고 있음유사 배열 객체(array-like object)즉, 인덱스(0, 1, 2, ...)로 접근 가능하고 .length 프로퍼티도 있지만, 배열 메서드(ex. .map(), .forEach())는 없음주요 특징특징설명인덱스 접근 가능arguments[0], arguments[1] 등으로 인자에 접근 가능.length 프로퍼티함수에 전달된 인자 개수를 알 수 있음배열 메서드 없음arguments는 배열이 아니어서 .map(), .filter() 같은 메서드 사용 불가함수 선언과 상관없이 존재모든 일반..

화살표 함수와 일반함수의 this 비교일반 함수는 호출 방식에 따라 this가 달라짐.화살표 함수는 정의된 위치의 this를 그대로 가짐.따라서 화살표 함수는 보통 this를 고정해서 사용하고 싶을 때 사용일반 함수에서의 this일반 함수 안에서 this는 함수를 호출한 주체(객체)를 가리킴그래서 호출 방식에 따라 this가 달라짐예를 들어, 객체의 메서드로 호출하면 그 객체를 가리키고, 그냥 함수로 호출하면 전역 객체(또는 엄격 모드면 undefined)를 가리킴const obj = { name: "철수", sayName: function() { console.log(this.name); }};obj.sayName(); // 철수 (obj가 this)const fn = obj.sayNam..

콜백 함수 (Callback Function)다른 함수의 인자로 전달되어, 특정 작업이 끝난 후 호출되는 함수비동기 처리나 이벤트 처리에 많이 사용됨.자바스크립트는 기본적으로 비동기 방식이 많아서, 어떤 작업이 끝난 뒤에 무언가를 하고 싶을 때 그 작업이 끝났을 때 실행할 함수를 미리 넘겨주는 것호출되는 시점이 비동기 작업 완료 이후임문제점: 콜백 지옥 (Callback Hell)콜백을 여러 번 중첩해서 사용하면 코드가 복잡해지고 가독성이 떨어짐 → 이 문제를 해결하려고 프로미스(Promise)나 async/await가 등장// [문법 - 함수를이자로 전달하는 형태]function 함수이름(콜백함수) { // 작업 후 콜백 호출 콜백함수();}기본적인 콜백 함수 구조/* 함수A : 콜백 함수를 받을 ..

전개 연산자(Spread Operator) ... 문법을 사용해 배열, 객체, 문자열 등 반복 가능한(iterable) 값의 요소를 개별적으로 펼쳐서 전달하는 ES6 문법사용위치 : 함수 호출, 배열, 객체 리터럴 등에서 사용* iterable : 배열, 문자열, 객체 등 반복 가능한 값 또는 펼칠 수 있는 값을의미const arr = [1, 2, 3];console.log(...arr); // 1 2 3✓ 배열/객체 펼쳐서 낱개로 만듦주요 사용 패턴배열 복사 (얕은 복사)원본 배열 변경 없이 복사 (얕은 복사)// [문법]const 새배열 = [...기존배열];const original = [1, 2, 3];const copy = [...original];console.log(copy); // [1..

나머지 매개변수(rest parameter) (...args)정의 :함수의 매개변수 목록에서 ‘나머지’ 인자들을 하나의 배열로 모아주는 문법ES6(ECMAScript 2015) 부터 도이타입 : 배열...rest ← rest 파라미터rest는 배열(type) 형태로 전달됨// [문법]function funcName(고정매개변수, ...rest) { // 함수 본문}function showInfo(name, age, ...skills) { console.log(name); // 'Jisoo' console.log(age); // 25 console.log(skills); // ['HTML', 'CSS', 'JS']}showInfo('Jisoo', 25, 'HTML', 'CSS', 'JS')..

스코프 (Scope)변수에 접근할 수 있는 범위를 의미종류설명전역 스코프함수 바깥에서 선언된 변수. 전체 코드에서 접근 가능함수 스코프함수 안에서 선언된 변수. 함수 내부에서만 접근 가능블록 스코프 (let, const){} 블록 내부에서 선언된 변수는 블록 안에서만 유효let a = 10; // 전역 스코프function test() { let b = 20; // 함수 스코프 if (true) { let c = 30; // 블록 스코프 console.log(a, b, c); // ✅ 가능 } console.log(c); // ❌ ReferenceError: c is not defined}test();console.log(b); // ❌ ReferenceError: b is not de..

재귀 호출 (Recursion)정의 : 함수 안에서 자기 자신을 다시 호출하는 것을 의미사용 상황 : 문제가 자기 자신을 포함한 형태일 때→ 예: 트리 구조 탐색, 디렉토리 구조, 수학적 계산(피보나치, 팩토리얼 등)재귀 함수의 호출 핵심종료 조건 (Base case) : 종료 조건이 없다면, 함수는 무한히 자기 자신을 호출하다가 ❗️"Maximum call stack size exceeded" 오류가 발생 (스택 오버플로우)자기 자신 호출 (Recursive call) : 문제를 더 작은 문제로 줄여 다시 호출재귀 함수 구조의 기본function 함수명(매개변수) { if (종료 조건) { return 결과; } return 함수명(다음 값); // 자기 자신을 다시 호출}재귀..