Web Dev/1. JS 문법 관련
-
JavaScript modules, defer, async 메모Web Dev/1. JS 문법 관련 2021. 8. 31. 23:29
JavaScript 생태계는 아무리 봐도 카오스다. - module 소개: https://ko.javascript.info/modules-intro 모듈 소개 ko.javascript.info - defer, async: https://ko.javascript.info/script-async-defer defer, async 스크립트 ko.javascript.info 여러본 본 내용인데도, 역시나 혼란스러워서 자주 아리까리하다. Three.js 쪽 공부를 하는데, module script를 사용해서 오랜만에 위의 문서를 다시 읽었다. 요약 1. defer, async script를 로드하는게 html 파싱을 블락킹한다. 그래서 주로 듣는 해결책은 script 태그를 가장 하단에 포함시키는 것이다. - d..
-
제너레이터와 프로미스, Generator와 PromiseWeb Dev/1. JS 문법 관련 2021. 6. 14. 01:19
https://davidwalsh.name/async-generators Going Async With ES6 Generators ES6 JavaScript generators can be used async tutorial. davidwalsh.name Generator와 Promise가 같이 쓰이면 갑자기 가슴이 답답해지면서 머리가 일을 안하겠다고 해서, 찾다보니 설명이 정말 잘되어있는 글을 드디어 만났다! function request(url) { // this is where we're hiding the asynchronicity, // away from the main code of our generator // `it.next(..)` is the generator's iterator-res..
-
Generator와 비동기처리Web Dev/1. JS 문법 관련 2021. 6. 2. 10:12
redux saga를 사용하다보니 내부가 다 Generator였다. 대강 어떻게 굴러가는진 알겠지만 Generator와 Promise가 처리되는 흐름이 영 매끄럽게 이해가 되지 않아서 Modern JavaScript Deepdive 46장을 읽어보았다. 제너레이터란 function* test(array) { for(let i = 0; i < array.length; i++){ yield array[i] } } const getArray = test([1,2,3,4,5]) getArray.next(); getArray.next(); getArray.next(); getArray.next(); getArray.next(); getArray.next(); 이렇게 나온다. 제너레이터 함수를 호출하면 함수를 실행..
-
Object.assign() - 열거가능한 모든 프로퍼티 복사Web Dev/1. JS 문법 관련 2021. 5. 21. 21:49
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/assign Object.assign() - JavaScript | MDN The Object.assign() method copies all enumerable own properties from one or more source objects to a target object. It returns the target object. developer.mozilla.org Immutable.js같은걸 항상 도입할 수 있는 것은 아니다. 그렇기때문에 그런걸 쓰지 않고도 Data를 copy해야할때가 있는데 열거가능한 모든 프로퍼티를 복사할때 Object..
-
ES6의 스코프Web Dev/1. JS 문법 관련 2021. 5. 20. 21:02
https://stackoverflow.com/questions/30287977/es6-module-scope ES6 module scope I have the code: // lib.js var a = "a"; export var b = "b"; // main.js console.log(a); // "a" variable is not available in a global scope import {b} from "lib"; console.log(a); // is "a" variable stackoverflow.com ES6의 스코프에 대해서간략한 정리 기존에는 var 키워드를 사용하면 전역에 등록되고 그랬는데, 이제는 ES6 모듈내에서는 var키워드를 사용한다고 해도 모듈 스코프에 등록된다. 하지만 v..
-
ModulesWeb Dev/1. JS 문법 관련 2021. 5. 19. 23:57
내가 내용을 따로 정리할건 없는데, 매번 https://javascript.info/modules-intro Modules, introduction javascript.info 이글을 보고있다. 그런데 돌아서면 까먹고 까먹고 그렇군. 여하튼 요지는 require등등의 다양한 모듈화 방법이 역사속으로 사라지고 있다는 것이다. 이런 모듈 시스템들은 기존에 JavaScript 언어자체에서 모듈화를 지원하는 기능이 없었어서, 사람들이 고안해놓은건데 이제는 Import/export로 가능하다. CommonJS말고는 써본적이 없는것 같은데, 오래된 코드를 보게될때 있으면 그때 보면 될것 같다.
-
블록 스코프와 지역스코프Web Dev/1. JS 문법 관련 2021. 3. 28. 16:37
function test() { for (var i = 0; i console.log(v), 100); })(); for (let i = 0; i < 10; i++) { // let 키워드는 블록스코프 단위로 돌아가기때문에 block스코프에 포함 console.log("i", i); } } } test(); 스코프는 식별자가 유효한 범위를 말한다 - var키워드는 함수가 실행되면서 생성된 실행컨텍스트의 지역스코프에 등록되고, - let, const는 블록 스코프를 단위로 동작해서 블록 내에 있을때는 블록스코프에 등록이된다. 아니면 L..
-
Spread vs RestWeb Dev/1. JS 문법 관련 2021. 3. 16. 15:00
spread는 [a, b, c]처럼 묶여있던 값을 꺼내서 a, b, c 이런식으로 펼치는 것 Rest는 a, b, c이런 값을 하나로 [a, b, c] 이런식으로 묶는 것 learnjs.vlpt.us/useful/07-spread-and-rest.html 07. spread 와 rest 문법 · GitBook 07. spread 와 rest 이번에는 ES6 에서 도입된 spread 와 rest 문법에 대해서 알아보겠습니다. 서로 완전히 다른 문법인데요, 은근히 좀 비슷합니다. spread 일단 spread 문법부터 알아봅시다. spread 라는 단어 learnjs.vlpt.us https://velog.io/@chlwlsdn0828/Js-Spread-%EC%97%B0%EC%82%B0%EC%9E%90-Re..