프론트엔드/JS 공부17 클로저 최종 수정: 2025.06.04클로저(Closure)함수와 그 함수가 선언된 렉시컬 환경의 조합이다. 즉, 내부 함수가 외부 함수의 변수에 접근할 수 있는 개념으로, 외부 함수가 실행을 마친 후에도 외부 함수의 변수를 참조할 수 있다. function outerFunction(x) { // 외부 함수의 변수 const outerVariable = x; // 내부 함수 function innerFunction(y) { // 내부 함수에서 외부 함수의 변수에 접근 console.log(outerVariable + y); } return innerFunction;}const myClosure = outerFunction(10);myClosure(5); // 15 출력// outer.. 2025. 6. 4. 자바스크립트 this 최종 수정: 2025.06.04JavaScript의 This함수가 호출될 떄 결정되는 특별한 키워드로, 현재 실행 컨텍스트에서 "누가 이 함수를 호출했는가"를 나타낸다. 이를 자신이 속한 객체 또는 자신이 생성할 인스턴스를 가리키는 자기 참조 변수라고도 한다.■ this 바인딩바인딩 우선순위 (new - 명시적 - 암시적 - 기본)1. 기본 바인딩 (Default Binding)function sayHello() { console.log(this); // 전역 객체 (브라우저에서는 window)}sayHello(); // window 객체 출력// strict mode에서는 undefined"use strict";function strictHello() { console.log(this); // un.. 2025. 6. 4. 프로토타입 체인 최종 수정: 2025.06.04프로토타입 체인(Prototype Chain) JavaScript 객체들이 다른 객체로부터 속성과 메서드를 상속받는 메커니즘을 말한다. ■ 프로토타입(Prototype) 원형이라는 의미를 가지고 있으며, 자바스크립트에서는 객체의 원형이라 할 수 있다. 모든 객체들은 메서드와 속성들을 상속 받기 위해 프로토타입 객체를 갖는다. 콘솔에 console.dir() 메서드를 활용하면, [[Prototype]] 이라는 숨어있는 속성을 확인할 수 있다. 이는 해당 객체의 입장에서 자신의 부모 역할을 하는 객체를 가리킨다. 1. [[Prototype]] 개발자가 직접 접근이 불가능하고 간접적으로 접근할 수 있는 내부 슬롯이다. 내부 슬롯이란 자바스크립트 엔진의 구현된 내용을 설명하기 위한.. 2025. 6. 4. 동기 / 비동기 최종 수정: 2025.05.28동기 / 비동기자바스크립트의 실행 방식에 대한 개념이며, 특히 웹 개발에서 아주 중요한 개념이다.■ 동기 (Synchronous)작업이 순차적으로 처리되며, 코드가 위에서 아래로 실행된다. 직관적이지만 오래 걸리는 작업이 있으면 전체가 멈춘다. 이를 블로킹(blocking) 방식이라고도 한다. 순차적으로 실행되는 만큼, 단순하고 예측 가능하다.■ 비동기 (Asynchronous)시간이 걸리는 작업은 작업이 백그라운드에서 실행하고 완료되면 나중에 알림(콜백, Promise 등)으로 처리된다. 웹 요청, 타이머, 파일 읽기 등에서 자주 사용된다.빠른 사용자 경험을 제공하다.비동기 결과 처리를 위해 콜백, Promise, async / await 등을 사용한다. Q. 콜백 (ca.. 2025. 5. 28. 스토리지(Storage) 최종 수정 : 2024-05-01세션 스토리지와 로컬 스토리지사이트마다 클라이언트에서만 사용하고 싶은 데이터를 저장해 놓고 싶을 때 사용한다. 세션 스토리지(Session Storage)현재 탭에서만 유요한 저장소이다.탭을 닫으면 데이터가 사라진다.다른 탭과 데이터는 공유되지 않는다.// 값을 저장const data = inputElement.value;sessionStorage.setItem('draft', data);// 값을 참조하여 사용const draftData = sessionStorage.getItem('draft');// 값 지우기sessionStorage.removeItem('draft');로컬 스토리지(Local Storage)해당 사이트에서 유요한 저장소이다.탭을 닫거나 브라우저를 닫.. 2024. 5. 1. 이전 1 2 3 4 다음