await과 Promise

await과 Promise

await : async 함수의 실행을 일시 중지하고 전달 된 Promise의 해결을 기다린 다음 async 함수의 실행을 다시 시작하고 완료후 값을 반환

Promise 객체는 비동기 작업이 맞이할 미래의 완료 또는 실패와 그 결과 값을 나타낸다.

• 대기(pending): 이행하지도, 거부하지도 않은 초기 상태.
• 이행(fulfilled): 연산이 성공적으로 완료됨.
• 거부(rejected): 연산이 실패함.

let myFirstPromise = new Promise((resolve, reject) => {
  // 우리가 수행한 비동기 작업이 성공한 경우 resolve(...)를 호출하고,
  실패한 경우 reject(...)를 호출한다.
  // 이 예제에서는 setTimeout()을 사용해 비동기 코드를 흉내낸다.
  // 실제로는 여기서 XHR이나 HTML5 API를 사용
  setTimeout( function() {
    resolve("성공!")
  }, 250)
})

myFirstPromise.then((successMessage) => {
  // successMessage는 위에서 resolve(...) 호출에 제공한 값.
  console.log("성공!" + successMessage)
});

node

node는 DOM 계층구조에 속한 객체의 어떤 타입이든 가리킬 수 있는 이름이다. node는 내장 DOM 엘리먼트(document, document.body)나 HTML의 특정 태그(input, p) 또는 텍스트 노드가 될 수도 있다. 간단히 말하면 node는 아무 DOM 객체나 될 수 있다는 것.

element

element 또한 node의 특정한 타입 중 하나로, 노드에는 정말 많은 타입이 있다. (텍스트 노드, 주석 노드, document 노드 기타 등등) element는 HTML tag로 바로 특정할 수 있거나, id나 class 같은 속성을 가진 것들이다.

각 노드들은 .nodeType이라는 프로퍼티를 가지고 있는데, ELEMENT_NODE 타입은 nodeType 프로퍼티 값이 1인 특정 타입이다.

Node의 여러 타입 중 하나가 element이며 element는 Node보다 더 작은 하위개념이라고 생각하면 될 듯

try … catch

: async/await 때문에 요즘 다시 많이 사용되는 코드.
여러 종류의 에러를 잡을 때 사용한다.

const a = 5
try {
    console.log(b) // b is not defined, so throws an error
} catch (err) {
    console.error(err) // will log the error with the error stack
}
console.log(a) // still gets executed

try, catch 블록으로 console.log(b) 를 감싸지 않으면, 스크립트 실행은 멈추게 된다.

… finally

: 에러 유무와 상관 없이 실행시키고 싶은 코드가 있을 때 finally를 사용한다.

const a = 5

try {
    console.log(b) // b is not defined, so throws an error
} catch (err) {
    console.error(err) // will log the error with the error stack
} finally {
    console.log(a) // will always get executed
}

출처 : https://dongmin-jang.medium.com/javascript-%EC%97%90%EB%9F%AC-%EC%B2%98%EB%A6%AC-%EB%B0%A9%EB%B2%95-e6cecca61974