오묘한

https://youtu.be/aoQSOZfz3vQ Promise 를 조금 더 간결하고, 동기적으로 보이게 만들어주는 것이 async, await! 기존에 존재하는 기능을 더 좋아보이게 만드는 Syntatic sugar 로 볼 수 있다. // async & await // clear style of using promise :) //1. async async function fetchUser() { // do network request in 10 secs... return 'ellie'; } const user = fetchUser(); user.then(console.log); console.log(user); // 2. await ✨ function delay(ms) { return new Prom..

https://youtu.be/JB_yU6Oe2eE 'use strict'; // Promise is a javascript object for asynchronous operation. // 학슾 포인트: 1. state / 2.Producer vs Consumer // State: pending -> fulfilled or rejected // Producer vs Consumer // 1. Producer // when new Promise is created, the executor runs automatically. // Promise는 만드는 즉시 execute 함수 실행된다. // 따라서 가령 네트워크 요청을 사용자가 요구할 때만 하고자 한다면, 사용자 요구하지도 않았는데 불필요한 통신 일어..

https://youtu.be/s1vpVCrT8f4 'use strict'; // JavaScript is synchronous. // Execute the code block by order after hoisting. // hoisting : var, function declaration console.log('1'); setTimeout(() => console.log('2'), 1000); console.log('3'); // Synchronous callback function printImmediately(print) { print(); } printImmediately(() => console.log('hello')); // Asynchronous callback function printW..

https://youtu.be/FN_D4Ihs3LE HTTP란? Hypertext Trasfer protocol의 약자. 하이퍼텍스트 문자를 클라이언트와 서버 간 주고받기 위한 프로토콜 규약. client는 서버에 request를 주고, 서버가 이에 맞는 response를 전달한다. 여기서 하이퍼텍스트는 단순히 링크를 말할 뿐 아니라, 브라우저에 렌더링돼야 하는 이미지나 문서 등을 포함하는 개념이다. AJAX란? Asynchronous JavaScript And XML의 약자. 동적으로 클라이언트와 서버가 데이터를 주고 받을 수 있는 기술을 의미한다. 대표적으로 XHR(XMLHttpRequest) 객체를 사용하는 방법이 있다. 이 XHR 객체는 브라우저에서 제공하는 객체(object) 중에 하나로, 이를..

https://youtu.be/3CUjtKJ7PJg // Q1. make a string out of an array { const fruits = ['apple', 'banana', 'orange']; console.log(fruits.join(',')); } // Q2. make an array out of a string { const fruits = '🍎, 🥝, 🍌, 🍒'; const result = fruits.split(','); //구분자 전달 안하면 length 1개 console.log(result); } // Q3. make this array look like this: [5, 4, 3, 2, 1] { const array = [1, 2, 3, 4, 5]; const reverseAr..

https://youtu.be/yOdAVDuHUKQ 배열과 리스트의 차이? : 배열은 인덱스가 존재하고(즉, 저장할 공간의 크기가 미리 지정되어 있고) 맨 앞과 중간에 삽입/삭제 작업에 O(n) 시간이 걸리나, 탐색에는 O(1) 시간이 걸린다. 리스트는 인덱스가 없으며, 저장할 공간의 크기가 가변적이다. 맨 앞과 맨 뒤에 삽입/삭제하는 시간은 O(1)이나 중간에 삽입/삭제하거나 탐색하는 작업에 시간 복잡도가 O(n)이 소요된다(인덱스가 없으므로) 'use strict'; // Array // 1. Declaration const arr1 = new Array(); const arr2 = [1, 2]; // 2. Index position const fruits = ['🍧','🧀'] console.log(..

https://youtu.be/1Lbr29tzAA8 참고하기 https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Object Object - JavaScript | MDN Object 클래스는 JavaScript의 데이터 유형 중 하나를 나타냅니다. 다양한 키 모음 및 더 복잡한 엔티티들을 저장하는 데 사용됩니다. 객체는 Object() 생성자 또는 객체 초기자 / 리터럴 구문를 통해 생 developer.mozilla.org // Objects // one of the JavaScript's data types. // a collection of related data and/or functionality // 1...

https://youtu.be/_DLhUBWsRtw class 내에 속성(fields, property)만 있고 method 없는 경우는 데이터 class라 부른다. 1. class(틀, 자체에 데이터는 없다 => 메모리에 안올라간다.) - template - declare once - no data in 2. object(객체, 인스턴스. 실제 데이터 있음 => 메모리에 올라감) - instance of a class - created many times - data in https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference JavaScript reference - JavaScript | MDN The JavaScript reference..

https://youtu.be/e_lU39U-5bQ Function은 sub-program이라고도 불린다. 그만큼 function은 프로그램의 작동에 있어 중요하다! //Function // - fundamental building block in the program // - subprogram can be used multiple times // - performs a task or calculate a value // 1. Function declaration // function name(param1, param2) {body ... return; } // one function === one thing // naming: doSomething, command, verb // e.g. create..

https://youtu.be/YBjufjBaxHo // 1. string concatenation console.log('my' + ' cat'); console.log('1' + 2); console.log(`string literals: 1 + 2 = ${1 + 2}`); console.log('ellie\'s book'); // 2. Numeric operators console.log(1 + 1); // add console.log(1 - 1); // substract console.log(1 / 1); // divide console.log(1 * 1); // multiply console.log(5 % 2); // remainder console.log(2 ** 3); // exponenti..