개발/Javascript (4) 썸네일형 리스트형 [Javascript] Async와 Promise 최근 ES8부터 적용된 Async의 MDN 문서를 읽다가 예제로 첨부되어 있는 Promise와의 비교 코드가 정말 잘 작성되어 있는 것 같다고 생각했다. 이미 많은 사람들이 읽어 본 문서겠지만 아직 Async와 Promise가 어려운 사람들 (사실 본인)도 쉽게 이해할 수 있도록 해당 문서의 코드를 조금 수정하여 Async와 Promise의 차이, 그리고 서로 동일한 동작을 위해서는 어떻게 할 수 있는지 적어보려 한다. 1. Async Async Function은 AsyncFunction 객체를 반환하는 비동기 함수이다. NodeJS와 마찬가지로 JS 역시 이벤트 루프를 통해 비동기 함수를 동작시키며, Async Function은 반드시 Promise를 반환한다. 먼저 Async를 사용해봤다면 Await.. [Javascript] const와 Object.freeze()를 이용하여 Immutable한 Object 만들기 프로그래밍을 하다보면 개발자의 실력과는 별개로 언제나 "Human Error"가 발생할 수 있다. 특히 개발자의 실수로 인해 의도치 않게 전역 공간이나 외부 스코프의 값이나 상태가 변경되는 “Human Error”는 언제든지 일어날 수 있으며, 추적이 어렵고, 프로그램에 치명적이다. 그래서 오늘은 Javascript에서 const와 Object.freeze를 사용하며 객체를 Immutable하게 만듦으로서 객체를 "Human Error'로 부터 보호하는 방법을 소개한다. const 자바스크립트는 ES6(ECMA 2015)부터 let과 const 키워드를 제공한다. 이 중 const 키워드를 사용하면 상수 변수 선언을 할 수 있다. 그리고 const는 상수로 취급되기 때문에 다음과 같이 값을 변경하려고 시.. [Javascript] var, let, const의 차이점 Javascript에서 변수는 var, let, const 세 가지 키워드를 통해 선언할 수 있다. 지금부터 var, let, const 세 가지 키워드의 차이점을 알아보자. var var는 ES6 이전에 주로 사용되던 변수 선언 키워드로서 Function Scope로 동작한다는 특징을 가지고 있다. 먼저 Function Scope가 무엇인지 다음 두 코드를 비교해보자. // Code 1 var name = "Yorr"; function setName() { var name = "John"; console.log(`My name is ${name}`); } setName(); // My name is John console.log(`My name is ${name}`); // My name is Yorr.. [ES6] computed property name 최근 Vuex를 공부하다 Mutation 부분에서 다음과 같은 코드를 보게 되었다. const SOME_MUTATION = 'SOME_MUTATION'; export default { [SOME_MUTATION]() { ... } } 대문자와 대괄호라니 어딘가 이상해보인다. 먼저 상수로 선언된 Mutation 이름이 대문자인 이유부터 알아보자. Vuex 공식 문서를 확인해보니 일반적으로 Flux 패턴에서 Mutation의 이름을 상수로 표현한다고 한다. Mutation과 Action이 많아질 경우 전체적인 흐름을 파악하기 힘들어 진다. 이 때 상수로 정의된 Mutation을 별도의 파일에 모두 분리할 수 있다면 Import 하는 방식을 통해 Mutation의 흐름을 한 눈에 파악할 수 있다. 또한 오타로.. 이전 1 다음
