본문 바로가기

Javascript27

[Javascript강의]16강.AJAX AJAX 비동기 프로그래밍 자바스크립트 엔진은 단 하나의 실행 컨텍스트 스택을 갖는다. 한 번에 하나의 태스크만 실행할 수 있는 싱글 스레드 방식으로 동작한다. 싱글 스레드 방식은 한 번에 하나의 테스크만 실행할 수 있기 때문에 처리에 시간이 걸리는 테스크를 실행하는 경우 작업중단이 발생한다. function sleep(func, delay){ const delayUtil = Date.now() + delay; while(Date.now() < delayUtil ); func(); } function foo(){ console.log('foo'); } function bar(){ console.log('bar'); } sleep(foo, 3 * 1000); bar(); 위 예제의 sleep 함수는 3초 .. 2021. 10. 17.
[Javascript강의]15강.이벤트 이벤트 이벤트 핸들러 등록 1. 이벤트 핸들러 이트리뷰트 방식 Click me! 2.이벤트 핸들러 프로퍼티 방식 Click me! Click me! 이벤트 핸들러 제거 Click me! 이벤트 객체 클릭하세요. 클릭한 곳의 좌표가 표시됩니다 클릭하세요. 클릭한 곳의 좌표가 표시됩니다 이벤트 전파 Apple Banana Orange 이벤트 위임 이벤트 위임은 여러 개의 하위 DOM 요소에 각각 이벤트 핸들러를 등록하는 대신 하나의 상위 DOM 요소에 이벤트 핸들러를 등록하는 방법을 말한다 Apple Banana Orange 선택된 내비게이션 아이템: apple 일반적으로 이벤트 객체의 target 프로퍼티와 currentTarget 프로퍼티는 동일한 DOM 요소를 가리키지만 이벤트 위임을 통해 상위 DOM.. 2021. 10. 12.
[Javascript강의]14강. 클로저 클로저 자바스크립트 엔진은 함수를 어디서 호출했는지가 아니라 함수를 어디에 정의했는지에 따라 상위 스코프를 결정한다. 이를 렉시컬 스코프(정적 스코프)라 한다. 렉시컬 환경의 "외부 렉시컬 환경에 대한 참조"에 저장할 참조값, 즉 상위 스코프에 대한 참조는 함수 정의가 평가되는 시점에 함수가 정의된 환경(위치)에 의해 결정된다. 이것이 바로 렉시컬 스코프다. 클로저와 렉시컬 환경 외부 함수보다 중첩 함수가 더 오래 유지되는 경우 중첩 함수는 이미 생명 주기가 종료한 외부 함수의 변수를 참조할 수 있다. 이러한 중첩 함수를 클로저라 부른다. const x = 1; function outer(){ const x = 10; const inner = function(){ console.log(x);}; retu.. 2021. 10. 11.
[Javascript 강의]13 강 실행 컨텍스트 실행 컨텍스트 # 소스코드 타입 1.전역 코드 : 전역에 존재하는 소스코드를 말한다. 전역에 정의된 함수, 클래스 등의 내부 코드는 포함되지 않는다. 2.함수 코드 : 함수 내부에 존재하는 소스코드를 말한다. 함수 내부에 중첩된 함수, 클래스 등의 내부 코드는 포함되지 않는다. 3.eval 코드 : 빌트인 전역 함수인 eval 함수에 인수로 전달되어 실행되는 소스코드를 말한다. 4.모듈 코드 : 모듈 내부에 존재하는 소스코드를 말한다. 모듈 내부의 함수, 클래스 등의 내부 코드는 포함되지 않는다. 소스코드의 평가와 실행 소스코드의 평가: 실행 컨텍스트를 생성하고 변수, 함수 등의 선언문만 먼저 실행하여 생성된 변수나 함수 식별자를 키로 실행 컨텍스트가 관리하는 스코프(렉시컬 환경의 환경 레코드)에 등록한.. 2021. 10. 10.