async function myFunc() { try { const res1 = await fetch("URL 입력"); const req1 = await res1.json(); console.log("첫번째 Request 완료", req1); const res2 = await fetch("URL 입력"); const req2 = await res2.json(); console.log("두번째 Request 완료", req2); } catch (err) { console.log(err); } finally { console.log("done"); } } myFunc(); - 좋은 가독성 promise, callback 보다 훨씬 보기 편함 - await 는 async 내부 함수에만 사용 가능

Promise 객체는 new 키워드와 생성자를 사용해 만든다. 인자로 함수를 받고 함수의 첫번째 인자는 resolve 성공했을때 결과값 반환, 두번째 인자는 reject 작업이 실패했을때 오류원인 반환 const promise1 = new Promise((resolve, reject) => { setTimeout(() => { resolve('foo'); }, 300); }); promise1.then((value) => { console.log(value); // Expected output: "foo" }); console.log(promise1); // Expected output: [object Promise] 출처 : mdn javascript 링크 : https://developer.mozil..

이벤트 루프를 이해하기 넘나 좋은 사이트 링크 : http://latentflip.com/loupe/ http://latentflip.com/loupe/ latentflip.com 동기와 비동기의 차이 동기는 먼저 이전의 것이 끝나야 다음 것을 할 수 있다. 줄서는느낌 비동기는 여러가지를 할 수 있다. 운전하면서 노래를 듣고 네비게이션도 확인하며 대화도 가능 - 자바스크립트는 동기 언어이다. 비동기 코드가 있을뿐 console.log() 의 경우 동기이고 setTimeout() 은 비동기이다. - 힙 : 메모리 할당이 일어남 - 호출 스택 : 실행될 코드를 한 줄 단위로 할당해 동작된다. - Web APIs : 비동기 처리 - 콜백 큐 : 비동기 처리 후 실행되야할 콜백 함수가 순서대로 할당 - 이벤트 ..

다른 함수 내부에 정의된 함수가 있는 경우 외부 함수가 실행을 완료하고 해당 변수가 해당 함수 외부에서 더이상 액세스 할 수 없는 경우에도 내부 함수는 외부 함수의 변수 및 범위에 액세스 할 수 있다. let num1 = 1; const A = () => { let num2 = 2; console.log(num1, num2, num3); }; const B = () => { let num3 = 3; console.log(num1, num3); A(); }; B(); let num1 = 1; const B = () => { const A = () => { let num2 = 2; console.log(num1, num2, num3); }; let num3 = 3; console.log(num1, num3)..

ES6 에서 나온 Class 를 이용해서 쉽게 OOP 를 구현할 수 있다. 문법은 OOP 방식을 이용하지만 내부에서는 prototype 을 사용하며 작동한다. class Person { constructor(name, age, job) { this.name = name; this.age = age; this.job = job; } sayHello() { return `안녕 나는 ${this.name}야 정말 반가워`; } } const yeon = new Person("yeon", 29, "false"); console.log(yeon); console.log(yeon.sayHello()); - constructor 는 인스턴스의 생성과 동시에 클래스 필드의 생성과 초기화를 실행, 또 constructo..

객체를 만들면 prototype 이라는게 생긴다. 모든 객체는 global Object prototype 을 가진다. prototype 이란? 자바스크립트 객체가 다른 객체로 부터 메서드와 속성을 상속받는 메커니즘이다. ( prototype chain ) prototype 을 사용 함으로서 더 적은 메모리를 사용할 수가 있고 코드를 재사용 할 수 있다. 예시 출처 : mdn javascript 속성상속 // o라는 객체가 있고, 속성 'a' 와 'b'를 갖고 있다고 하자. let f = function () { this.a = 1; this.b = 2; } let o = new f(); // {a: 1, b: 2} // f 함수의 prototype 속성 값들을 추가 하자. f.prototype.b = 3..