[항해99] 3일차(DOM, Callback, Class)

728x90

DOM(Document Object Modeling)

1. html 파일을 자바스크립트가 이해할 수 있는 Object 형태로 모델링한 것

2. 기본적으로 브라우저에 내장되어 있는 API

=> API: 다른 시스템에서 제공하는 기능을 사용할 수 있도록 도와주는 중간자 역할

3. DOM은 node를 갖으며, 각각의 node들은 속성과 메서드(동사형)를 갖는다.

=> node: <head>, <title>, <h1> 등과 같은 것

콜백 함수

1. 매개 변수로 사용되는 함수

2. 콜백 함수는 제어권을 다른 함수에 넘겨주고, 받은 함수는 자신의 로직대로 콜백 함수를 처리

3. 아래의 코드에서 cbFunc로 호출하면 제어권은 cbFunc에 있지만, timer2로 호출하면 제어권은 setInterval에 있음

var cbFunc = function(){
    console.log(count);
    if(++count>4) clearInterval(timer2)
}
var timer2 = setInterval(cbFunc, 300)

콜백 지옥

1. 콜백 함수로 인해 들여쓰기 수준이 지속적으로 깊어진 경우

2. 동기적 실행방식: 일의 순서대로 진행하는 방식으로, 앞 순번이 완료되지 않으면 뒤로 진행되지 않음

3. 비동기적 실행방식: 일의 순서와 관계없이 빨리 완료된 순서로 진행

// 비동기적 코드의 이해
setTimeout(function(){
    console.log("여기가 먼저 실행될까?")
}, 1000)

console.log("여기가 먼저 실행되지롱!")

Promise

1. 비동기 작업을 동기적 작업으로 구현할 수 있게 해주는 것

2. resolve는 성공, reject는 거절

3. .then은 다음, .catch는 오류시 실행

class의 getter과 setter

1. get은 값을 가져옴

2. set은 class 외부값을 가져오며, 조건을 주어 값을 선별할 수 있음

3. get이나 set을 사용할 경우 this 뒤에 _를 붙여주지 않으면 무한 루프에 빠지는 오류가 발생함

클로저

1. 함수와 그 함수가 선언된 렉시컬 환경과의 조합

2. 외부 함수보다 중첩 함수가 더 오래 유지되는 경우 call stack에서 중첩 함수는 이미 빠져나오는데, 외부 함수의 변수를 여전히 참조할 수 있는 함수

728x90

Do It