본문 바로가기

개발/ES6

(11)
[ES6]Arrow Function Arrow Function? 1. 화살표 함수란 ...? 화살표 함수란 기존에 사용하던 function 키워드 대신 ' ⇒ ' 를 사용하여 함수를 표현하는 방식. 2. 사용방법은 ? 기존의 함수 호출 방식인 // 함수 선언식 function Hello() { // Something... } // 함수 표현식 let Hello = function () { // Something ... } 요 위의 두가지 방식과 다르게 // 기본적으로 let something = () => { ... } 의 구조 // ex) let Hello = () => { // Something ... } 이와 같이 function 키워드 대신 ' ⇒ ' 를 사용하여 함수를 나타낼 수 있다. 3. 사용 시의 유의사항 // 1. 매개변수..
[ES6]let, const 등장 배경 이전의 Execution Context 글에서 정리한 내용 중 실행 컨텍스트 생성 시에 조금은 독특한 움직임이 하나 있었다. 그것은 바로 호이스팅(Hoisting) 이다. 이전 글에 있던 내용의 일부분을 가져와보면 더보기 var 키워드로 선언된 변수는 선언 단계와 초기화 단계가 한번에 이루어진다. 따라서 변수 선언문 이전에 변수에 접근하여도 Variable Object에 변수가 존재하기 때문에 에러가 발생하지 않는다. 다만 undefined를 반환한다. 이러한 현상을 변수 호이스팅(Variable Hoisting)이라한다. 아직 변수 x는 ‘xxx’로 초기화되지 않았다. 이후 변수 할당문에 도달하면 비로소 값의 할당이 이루어진다. 이라는 내용이 나온다. ( 추후 비교를 위해 여기서 var로 선..
[ES6] Promise, async/await Promise? ++) 자바스크립트 엔진은 하나의 코드 조각을 하나씩 실행하는 일을 하고, 비동기적으로 이벤트를 처리하거나 Ajax 통신을 하는 작업은 사실상 Web API에서 모두 처리된다. js의 기본 동작은 'Run to Complete' , 즉 하나의 task가 끝나면 다음 task를 실행하는 동기식 처리방식인데, 이보다 더 많은 동작을 하기 위해서는 다른 동작을 하면서 동시에 실행할 수 있는 비동기식 처리방식을 선호할 수 밖에 없다. JS에는 이를 구현하기 위한 패턴으로 보통 Callback 함수를 사용하였다. 하지만 Callback을 구현하게 된다면 프로젝트의 규모가 예전에 비해 많이 커진 지금의 프로젝트들에서는 콜백 함수가 엄청난 deps를 가지게 되어 코드 자체가 거대한 > 와 같은 모양을..