Frontend/JavaScript30 [JS DeepDive] 42장 비동기 프로그래밍 [42장 비동기 프로그래밍]1. 동기 처리와 비동기 처리실행 컨텍스트와 콜 스택함수가 호출되면 함수 실행 컨텍스트가 생성되어 실행 컨텍스트 스택(콜 스택)에 푸시실행이 끝나면 콜 스택에서 팝되어 제거됨const foo = () => {};const bar = () => {};foo();bar();foo -> bar 순서로 실행-> 동기 처리 (블로킹 발생 가능)동기 처리작업을 순차적으로 처리하나의 태스크가 끝나기 전까지는 다음 태스크는 대기 (블로킹)실행 순서 보장단점 : 앞 작업이 길면 다음 작업이 지연됨function sleep(callback, delay) { const start = Date.now(); while (Date.now() - start DelayBlocking!sleep → fo.. 2025. 6. 17. [JS DeepDive] 39장 DOM [ 39장 DOM ]DOM(Document Object Model): HTML 문서의 계층적 구조와 정보를 표현하며 이를 제어할 수 있는 API즉, 프로퍼티와 메서드를 제공하는 트리 자료 구조1. 노드HTML 요소와 노드 객체Hello, World!요소 노드 : 어트리뷰트 노드 : class="greeting"텍스트 노드: Hello, World!-> HTML요소는 렌더링 엔진에 의해 노드 객체로 변환되어 DOM트리를 구성트리 자료 구조 = DOM 트리부모-자식 관계로 HTML요소 구조를 표현트리 용어루트 노드 : 최상위 노드자식 노드 : 부모 노드의 하위 노드형제 노드 : 같은 부모를 가진 노드부모 노드 : 자식 노드를 가진 노드리프 노드 : 자식 노드가 없는 노드노드 객체의 타입노드 타입설명문서노드D.. 2025. 6. 17. [JS DeepDive] 44장 REST API REST API : 자원, 행위, 표현 3가지로 구성 1. REST API 구성구성요소내용표현 방법자원 resource자원URI (엔드포인트)행위 verb자원에 대한 행위HTTP 요청 메서드표현 repressentations자원에 대한 행위의 구체적 내용페이로드 2. REST API 설계원칙 1. URI는 리소스를 표현해야 한다.: 리소스를 식별할 수 있는 이름은 동사보다는 명사를 사용 // badGET/getTodos/1// goodGET/todos/1 2. 리소스에 대한 행위는 HTTP 요청 메소드로 표현한다 HTTP 요청 메서드종류목적페이로드GETindex/retrieve모든/특정 리소스 취득XPOSTcreate리소스 생성OPUTreplace리소스의 전체 교체OPATCHmodify리소스의 일부 수정.. 2025. 6. 13. [JS DeepDive] 16. 프로토타입 [19장 프로토타입]1. 객체 지향 프로그래밍[객체 지향 프로그래밍]: 전통적인 명령형 프로그래밍(Imperative Programming)의 절차지향적 관점에서 벗어나 여러 개의 독립된 객체(Object) 들의 집합으로 프로그램을 표현하려는 프로그래밍 패러다임1) OOP의 철학적 기반실세계를 구성하는 사물은 각자의 속성을 가짐이 속성들을 통해 실체를 인식하고 구별 가능ex) 사람 -> 이름, 나이, 성별, 직업 등2) 추상화객체가 가진 여러 속성 중, 프로그램에 필요한 일부 속성만 선별하여 표현ex) 사람 -> 이름, 나이3) 객체란 ?속성 + 동작 을 하나의 단위로 묶은 복합적인 자료 구조객체는 상태 + 행동을 모두 가짐const circle = { radius: 5, // 속성(프로퍼티) get.. 2025. 6. 9. [JS DeepDive] 17. Number [28장 Number]1. Number 생성자 함수const num1 = new Number(10);console.log(num1); // Number { [[PrimitiveValue]]: 10 }// 문자열 타입 -> 숫자 타입Number("0");Number("-1");// 불리언 타입 -> 숫자 타입Number(true); // 12. Number 프로퍼티프로퍼티설명Number.EPSILON자바스크립트에서 표현할 수 있는 가장 작은 양수 값과 1 사이의 차이Number.MAX_VALUE자바스크립트에서 표현할 수 있는 가장 큰 숫자 값Nuber.MIN_VALUE자바스크립트에서 표현할 수 있는 가장 작은 숫자 값Number.MAX_SAFE_INTEGER자바스크립트에서 안전하게 표현할 수 있는 가장 큰.. 2025. 6. 4. [JS DeepDive] 15. 클로저 [24장 클로저] 1. 렉시컬 스코프 자바스크립트는 함수를 호출한 위치가 아닌, 정의한 위치에 따라 상위 스코프를 결정한다.이것을 **렉시컬 스코프(정적 스코프)**라고 한다.[핵심]함수의 상위 스코프 참조값은 함수가 정의될 때 결정된다.이 참조값은 **렉시컬 환경의 "외부 렉시컬 환경에 대한 참조"**에 저장된다.Environment ">2. 함수 객체의 내부슬롯 Environment 함수는 자신이 정의된 시점의 렉시컬 환경을 내부 슬롯 Environment에 저장한다.이 슬롯은 함수 실행 시 생성되는 함수 렉시컬 환경의 외부 렉시컬 환경 참조값으로 사용된다.[이유]함수는 호출 이후에도 자신이 정의된 환경의 식별자에 접근해야 하기 때문따라서 내부 슬롯 Environment는 함수가 살아있는 동안 상위 .. 2025. 5. 27. 이전 1 2 3 4 5 다음