-

[javascript] 객체 5 / 객체 존재 여부 확인, 반복 (in 연산자, hasOwnProperty(), for...in)

in 연산자객체 또는 배열에 특정 프로퍼티(키)가 존재하는지 여부를 확인하는 연산자반환값: true 또는 false범위 : 객체 자신 + 부모(상속)값이 undefined라도 존재하면 true.배열의 경우 인덱스 존재 여부 확인 가능// [문법]"키이름" in 객체이름const person = { name: "Alice", age: 25};console.log("name" in person); // trueconsole.log("gender" in person); // false사용 예값이 없어도 in은 "존재"로 판단 → 디폴트 값 처리할 때 유용상속까지 포함 → 객체가 어디서 프로퍼티를 받았는지 신경 써야 할 때 주의배열 인덱스 체크 → sparse array(빠진 요소) 처리 가능in연산자 특징..

[javascript] 객체 4 / 객체 삭제

객체 삭제객체 프로퍼티 삭제방법1. delete 연산자가장 기본적인 방법객체에서 해당 프로퍼티 자체를 완전히 제거키 자체가 사라짐성능상 아주 큰 객체를 반복 삭제할 때는 조금 느릴 수 있음// [문법]delete 객체명.키명;delete 객체명["키명"];const user = { name: "철수", age: 20, city: "서울" };delete user.age; // 점 표기법delete user["city"]; // 대괄호 표기법console.log(user);// { name: "철수" }2. null 또는 undefined 할당프로퍼티를 아예 제거하는 대신, 값만 없애는 방식키(name, age)는 여전히 존재데이터만 비워야 할 때 사용프로퍼티는 유지, 값만 비움/..

[javascript] 객체 1 / 객체 기본, 특징, 객체 선언, 메서드 정의

객체객체는 키(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] (이터러블인 경우)로 변환 가능반복문으로 접근 가..

화살표 함수와 일반함수의 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 : 콜백 함수를 받을 ..

rest 파라미터 (...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'); 주의사항rest 파라미터..

스코프 (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 함수명(다음 값); // 자기 자신을 다시 호출}재귀..

엄격 모드정의 : "use strict" 지시어를 사용하여 코드 실행을 더 엄격하게 만드는 자바스크립트 기능실수를 더 빠르게 잡아냄구문 오류를 강하게 체크암묵적인 동작 금지 → 개발자가 의도하지 않은 버그 예방엄격모드 사용 방법"use strict"는 반드시 파일 또는 함수의 맨 앞에 와야 함!전체 스크립트에 적용"use strict";x = 10; // ❌ ReferenceError: x is not defined함수 단위로 적용function myFunc() { "use strict"; y = 5; // ❌ ReferenceError: y is not defined} 엄격 모드에서 달라지는 주요 동작 비교상황느슨한 모드(기본)엄격 모드선언 없이 변수 사용x = 3 가능❌ ReferenceError..