Bleeding edge

41장 타이머 41.1 호출 스케줄링 호출 스케줄링은 명시적으로 호출하지 않고 일정 시간이 경과된 이후에 호출되도록 함수 호출을 예약하는 것을 말한다. 타이머를 생성할 수 있는 타이머 함수는 setTimeout, setInterval 두개가 있다. 타이머를 제거하는 함수는 clearTimeout과 clearInterval이 있다. 단발성 : setTimeout 다회성 : setInterval 자바스크립트엔진은 하나의 실행 컨텍스트 스택을 가지기 때문에 두 가지 이상의 태스크를 동시에 실행할 수 없다. 따라서 이러한 이유로 타이머 함수는 비동기 처리 방식으로 동작한다 41.2 타이머 함수 setTimeout((name, ...args )=> console.log(name, args), 1000, name,..

39.4 노드 정보 취득 Node.prototype.nodeType = 노드 객체의 종류 Node.prototype.nodeName = 노드의 이름을 문자열로 반환한다 hello document.nodeType = 9// 문서 노드타입은 9 텍스트 노드는 3 요소 노드는 1이다 document.nodeName = #document//텍스트 노드 #text, 요소노드는 태그이름에 #을붙인다 39.5 요소 노드 텍스트 조작 39.5.1 nodeValue node1.nodeValue = "a"//텍스트 노드에 있는 값을 변경한다 39.5.2 textContent document.getElementbyId('foo')//프로퍼티에 의한 텍스트 취득 null은 생략한다 vs innerText ⇒ innerText..

38장 브라우저의 렌더링 과정 브라우저가 HTML CSS 자바스크립트로 작성된 텍스트 문서를 파싱하여 브라우저에 렌더링한다. 파싱 : 프로그램밍 언어의 문법에 맞게 작성된 텍스트 문서를 읽어 들여 실행하기 위해 텍스트 문서의 문자열을 토큰으로 분해하고, 토큰에 문법적 의미와 구조를 반영하여 트리구조의 자료구조인 파스트리를 생성하는 일련의 과정을 말한다. HTML CSS 자바스크립트로 작성된 문서를 파싱하여 브라우저에 시각적으로 출력한다. 브라우저 렌더링 수행과정 브라우저는 HTML, CSS, 자바스크립트, 이미지, 폰트 파일 등 렌더링에 필요한 리소스를 요청하고 서버로부터 응답을 받는다 렌더링 엔진은 서버로부터 받은 HTML과 CSS를 파싱하여 DOM과 CSSOM을 생성하고 이를 결합하여 렌더 트리를 생..

34장 이터러블 34.1 이터레이션 프로토콜 34.1.1 이터러블 이터러블 프로토콜을 준수한 객체이다 Symbol.iterator를 프로퍼티 키로 사용한 메서드로 직접 구현하거나 프로토타입으로 상속받은 객체를 말한다 const isIterableList = [[], '', new Map(), new Set(), {}] isIterble(n) //true, true, true, true, false 배열은 Symbol.iterator 메서드를 상속받은 이터러블이다. 이터러블은 for of문으로 순회할 수 있다. console.log(Symbol.iterator in obj) //fakse 일반 객체는 Symbol.iterator 메서드를 구현하거나 상속받지 않는다 for(const item of obj){..

30장 Date 30.1 Date 생성자 함수 new Date() ; //Mon Jul .... typeof new Date() object Date(); //Mon Jul ..... typeof Date() String 30.2 Date 메서드 Date.parse('Jan 2, 1970 00:00:00 UTC') Date.parse('19970/01/02/09:00:00') Date.prase를 이용하여 주어진 인수를 밀리초로 변환한다. 30.3 Date를 활용한 시계 예제 31장 RegExp 31.1~3 정규 표현식 regExp.exec(target) //정규 표현식의 패턴을 검색하여 매칭 결과를 배열로 반환한다. /is/ regExp.test(target) //매칭 결과를 불리언으로 반환한다 /is..

26장 ES6 함수의 추가 기능 26.1 함수의 구분 ES6 이전의 메서드라고 부르던 객체에 바인딩된 함수도 callable이며 constructor이다.(내부 메서드 Call Construct를 둘다 가지고 있다) 불필요한 객체를 생성하기 때문에, 성능 문제가 있따. 26.2 메서드 ES6 사양에서 메서드는 메서드 축약 표현으로 정의된 함수만을 의미한다 ES6 사양에서 정의한 메서드는 인스턴스를 생성할 수 없는 non-constructor이기에 생성자 함수로 생성이 불가능하다 prototype 프로퍼티가 없고 프로토타입도 생성하지 않는다. ES6 메서드는 자신이 바인딩한 객체를 가리키는 내부 슬롯 [[HomeObject]]를 갖는다. super는 내부 슬롯 [[HomeObject]]를 사용하여 수퍼클래..

25장 클래스 25.1 클래스는 프로토타입의 문법적 설탕인가? 클래스와 생성자 함수는 모두 프로토타입 기반의 인스턴스를 생성하지만 정확히 동일하게 동작하지는 안흔다. 클래스는 생성자 함수 보다 엄격하며, 생성자 함수에서는 제공하지 않는 기능도 제공한다. 클래스는 new 연산자 없이 호출하면 에러가 발생한다 클래스는 extends와 super 키워드를 지원한다 클래스는 호이스팅이 발생하지 않는 것처럼 동작한다. 클래스 내의 모든 코드는 strict mode가 지정되어 실행된다. 클래스의 constructor, 프로토타입 메서드, 정적 메서드는 모두 프로퍼티 어트리뷰트 [[Enumerable]]의 값이 false이다.(열거가 불가능하다) 클래스는 생성자 함수 기반 객체보다 견고하고 명료하다. 특히 클래스의 ..

실행 컨텍스트 1. 소스코드의 타입 소스코드는 실행컨텍스트를 생성한다. 소스코드는 ECMAScript 사양으로 4가지로 구분한다 [전역 코드, 함수 코드, eval 코드, 모듈 코드] 소스코드의 타입에 따라 실행 컥텍스트를 생성하는 과정과 관리 내용이 다르다. | 전역 코드 | 전역 스코프(최상위 스코프)를 생성한다(전역 변수, 전역 함수 관리를 위해). 전역변수(var), 전역함수(함수 선언문)를 전역 객체의 프로퍼티와 메서드로 바인딩하고 전역 객체와 연결한다 전역 코드가 평가되면 전역 실행 컨텍스트가 생성된다 | | --- | --- | | 함수 코드 | 지역 스코프를 생성한다(매개변수, arguments 객체 관리를 위해) 지역 스코프를 전역 스코프에서 시작하는 스코프 체인의 일원으로 연결한다 함수..

22장 this 22.1 this 키워드 객체는 상태(프로퍼티)와 동작(메서드)를 하나의 논리적인 단위로 묶은 복합적인 자료구조다. 동작을 나타나는 메서드는 자신이 속한 객체를 가리키는 식별자를 참조할 수 있어야 한다. this는 자신이 속한 객체 또는 자신이 생성할 인스턴스를 가리키는 자기 참조 변수다. this를 통해 자신이 속한 객체 또는 자신이 생성할 인스턴스의 프로퍼티나 메서드를 참조할 수 있다 this는 자바스크립트 엔진에 의해 암묵적으로 생성되며, 코드 어디서든 참조할 수 있다. 함수를 호출하면 arguments 객체와 this와 암묵적으로 함수 내부에 전달된다. this가 가리키는 값, 즉 this 바인딩은 함수 호출 방식에 의해 동적으로 결정된다. 바인딩이란 식별자의 값을 연결하는 과정을..