function sleep(ms) { return new Promise((resolve) => setTimeout(resolve, ms)); } const getDog = async () => { await sleep(1000); return "멍멍이"; }; const getRabbit = async () => { await sleep(500); return "토끼"; }; const getTurtle = async () => { await sleep(3000); return "거북이"; }; async function process() { const dog = await getDog(); console.log(dog); const rabbit = await getRabbit(); console.log..

function sleep(ms) { return new Promise((resolve) => setTimeout(resolve, ms)); } async function process() { console.log("안녕하세요!"); await sleep(1000); console.log("반갑습니다!"); } process().then( value -> { console.log(value); }); - 프로미스 앞 부분에 await을 붙여주고, await키워드를 사용하는 함수 앞부분에 async키워드가 들어가야 함 - async를 붙이면 해당 함수는 항상 프로미스를 반환함. 프로미스가 아닌 것은 프로미스로 감싸서 반환함 - await은 해당 프로미스가 끝날때까지 기다렸다가 다른 작업을 수행할때 사용함

- 프로미스는 비동기 작업을 편하게 처리할 수 있도록 ES6에 도입된 기능. - 이전에는 비동기 작업을 끝내고 나서, 어떤 작업을 해야할 때 콜백함수로 처리를 해주었어야 했는데, 그러한 작업들이 많을 경우 여러 콜백함수로 인해 코드가 쉽게 난잡해지게 되었음 => 이를 해결하기 위해 프로미스가 만들어짐 function increaseAndPrint(n, callback) { setTimeout(() => { const increased = n + 1; console.log(increased); if (callback) { callback(increased); } }, 1000); } increaseAndPrint(0, (n) => { increaseAndPrint(n, (n) => { increaseAnd..

- Hoisting : 자바스크립트에서 아직 선언되지 않은 함수, 변수를 끌어올려서 사용할 수 있는 자바스크립트의 작동 방식 myFunction(); function myFunction() { console.log("hello world"); } 함수 선언 순서가 뒤바뀌었는데도, 위와 같이 잘 로그가 찍히는 것을 볼 수 있는데 이는 자바스크립트 엔진이 function myFunction() { console.log("hello world"); } myFunction(); 이 순서로 받아들이기 때문. 함수가 아래에 있어도 호출 가능. => 하지만 위와 같은 호이스팅 기능은 피해야함. 순서가 이상하게 배치되어있으면 유지보수하기 힘들기 때문. console.log(number); var number = 2; ..

- 자바스크립트에서 Scope란, 변수 혹은 함수를 선언하게 될 때, 해당 변수 또는 함수가 어디서부터 어디까지 유효한지 나타내는 범위. - Global, Function, Block이란 3가지 종류가 있음. - Global : 코드의 모든 범위에서 사용 가능함 - Function: 특정 함수 내부에서만 사용 가능함 - Block : if / for / switch문에서 사용 가능함 const value = "hello"; function myFunction() { console.log("myFunction : "); console.log(value); } function otherFunction() { console.log("otherFunction : "); const value = "bye"; co..

function sum(...rest) { return rest.reduce((acc, current) => acc + current, 0); } console.log(sum(1, 2, 3, 4, 5, 6)); function subtract(x, y) { return x - y; } const numbers = [1, 2]; // const result = subtract(numbers[0], numbers[1]); const result = subtract(...numbers); console.log(result); function sum(...rest) { return rest.reduce((acc, current) => acc + current, 0); } const numbers = [1, 2,..

function sum(...rest) { // 기본 값을 0으로 셋팅한 배열 내장함수 reduce사용하여, 배열의 누적합을 구한다. return rest.reduce((acc, current) => acc + current, 0); } console.log(sum(1, 2, 3, 4, 5, 6)); - ...rest를 사용하여 인수를 배열로 받아서, 파라미터에 셋팅해줄 수 있음.

객체에서 사용하는 Rest const purpleCuteSlime = { name: "슬라임", attribute: "cute", color: "purple" }; const { color, ...cuteSlime } = purpleCuteSlime; console.log(color); console.log(cuteSlime); const { attriubte, ...slime } = cuteSlime; console.log(slime); ...rest 연산자를 이용해서 남은 값들을 모두 할당해줄 수 있다. ...rest 혹은 ...특정 이름으로 변수를 할당하여 나머지 값들을 할당하는 방식이다. 배열에서 사용하는 Rest const numbers = [0, 1, 2, 3, 4, 5, 6]; const [..

객체에서의 Spread const slime = { name: "슬라임" }; const cuteSlime = { name: "슬라임", attribute: "cute" }; const purpleCuteSlime = { name: "슬라임", attribute: "cute", color: "purple" }; console.log(slime); console.log(cuteSlime); console.log(purpleCuteSlime); - 위와 같은 코드를, ... 이 스프레드 연산자를 활용하여 배열, 문자열, 반복객체를 다른 배열, 문자열, 반복 객체로 빠르게 복사할 수 있음. const slime = { name: "슬라임" }; const cuteSlime = { ...slime, attrib..