본문 바로가기

Programming

 (477)
2. Javascript ES2015 (7) - async/awiat [1/2] async/await는 노드 7.6 버전부터(ES2017) 추가된 기능입니다. 노드와 같이 비동기 중심의 코드를 작성하는 데 있어서 코드를 간소화하는데 큰 도움을 주는 문법이죠. 우선은 기본적으로 프로미스를 이해하고 있어야 합니다. async/await는 근본적으로 프로미스 문법을 간소화시켜주는 기능을 갖고 있기 때문입니다. 기본 콜백 지옥을 프로미스로 간소화하였지만, 앞선 아티클들에서 살펴보았듯이 then과 catch가 여전히 장황하게 반복됩니다. 앞서 살펴보았던 findAndSaveUser( ) 예제를 통해서 알아보겠습니다. 2. Javascript ES2015 (6) - 프로미스 [4/5] 앞선 아티클에서 우리는 3개의 뎁스를 가진 콜백 함수 예제를 살펴보았습니다. function findAndSa..
2. Javascript ES2015 (6) - 프로미스 [5/5] 앞선 아티클까지 우리는 프로미스 여러 개를 순차적으로 실행하는 방법까지 살펴보았습니다. 그런데, 순차적인 실행뿐만 아니라 여러 개를 한 번에 실행할 수 있는 방법도 존재합니다. 지금부터 그 방법을 하나씩 살펴보겠습니다. ○ Promise.all과 Promise.resolve / Promise.reject 아래 코드를 보겠습니다. Promise.all을 이용해서 여러개의 프로미스를 한 번에 실행하는 예제입니다. const promise1 = Promise.resolve('SUCCESS 1'); const promise2 = Promise.resolve('SUCCESS 2'); Promise.all( [promise1, promise2] ) .then( (result) => { console.log(resu..
2. Javascript ES2015 (6) - 프로미스 [4/5] 앞선 아티클에서 우리는 3개의 뎁스를 가진 콜백 함수 예제를 살펴보았습니다. function findAndSaveUser(Users){ Users.findOne( {}, (err, user) => { // 첫 번째 콜백 if(err){ return console.error(err); } user.name = 'zero'; user.save( (err) => { // 두 번째 콜백 if(err){ return console.error(err); } Users.findOne( { gender: 'm' }, (err, user) => { // 세 번째 콜백 /* 내용 생략*/ } ); } ); } ); } 위 예제에 대한 설명이 기억나지 않는다면, 아티클을 다시 복습해 보시기 바랍니다. 2. Javascrip..
2. Javascript ES2015 (6) - 프로미스 [3/5] 앞선 아티클에서 프로미스를 사용하는 기본적인 패턴에 대해서 살펴보았습니다. 2. Javascript ES2015 (6) - 프로미스 [2/3] 우리는 앞선 아티클에서, 프로미스를 생성해 then, catch, finally를 출력하는 과정을 살펴보았습니다. 그런데 여기서 드는 한 가지 의문, then이나 catch는 딱 '한 개만' 실행이 가능한 것일까요? 결론만 nozeroslope.tistory.com 이번 아티클에서는 프로미스를 이용해서, 통상적으로 사용하는 콜백 함수를 좀 더 가독성 있게 바꿔보도록 하겠습니다. 참고로 여기에는 전제조건이 있습니다. 아래 예제에서 사용하는 메서드 중, findOne과 save에는 내부에 new Promise가 함수 내부에 구현이 되어 있는 상황이라고 가정해야 합니다..
2. Javascript ES2015 (6) - 프로미스 [2/5] 우리는 앞선 아티클에서, 프로미스를 생성해 then, catch, finally를 출력하는 과정을 살펴보았습니다. 그런데 여기서 드는 한 가지 의문, then이나 catch는 딱 '한 개만' 실행이 가능한 것일까요? 결론만 얘기하자면 그렇지 않습니다. then이나 catch 선언문에서 다시 다른 then이나 catch를 붙일 수 있습니다. 앞선 아티클에서 살펴본 코드를 살짝 수정해 보겠습니다. 2. Javascript ES2015 (6) - 프로미스 [1/3] 당연한 이야기이지만, Javascript와 Node에서는 비동기를 주로 사용하게 되고, 이벤트 리스너에서 콜백 함수에 대한 정의를 자주 쓰게 됩니다. 그러나, 이 콜백 함수들의 사용은 꽤나 코드를 복잡하 nozeroslope.tistory.com ..
2. Javascript ES2015 (6) - 프로미스 [1/5] 당연한 이야기이지만, Javascript와 Node에서는 비동기를 주로 사용하게 되고, 이벤트 리스너에서 콜백 함수에 대한 정의를 자주 쓰게 됩니다. 그러나, 이 콜백 함수들의 사용은 꽤나 코드를 복잡하게 만드는 원인이 되기도 합니다. ES2015부터는 이러한 API에서의 콜백 사용이 프로미스(Promise)를 기반으로 변경되어 복잡한 콜백 문법을 간소화시키고 있습니다. ES2015부터 사용되는 이 프로미스는 특히 노드 학습에 있어서 중요한 부분을 차지하니, 잘 공부하시기 바랍니다. 프로미스 객체를 통한 실행 과정을 간단하게 요약해 보겠습니다. · new Promise 인스턴스를 선언합니다. 이 때, new Promise 파라미터에는 'resolve'와 'reject'를 파라미터로 갖는 콜백 함수를 전달..
2. Javascript ES2015 (5) - 클래스 [2/2] 앞서 살펴본 클래스 관련 내용을 이어서 계속 알아보도록 하겠습니다. 앞선 내용에서는 새로운 클래스 문법이 아닌 기존 프로토타입 문법을 살펴보고 있었습니다. 이 중, 부모 클래스의 생성자를 호출하는 내용까지 살펴보았죠. var Human = function(type){ this.type = type || 'human'; }; Human.isHuman = function(human){ return human instanceof Human; }; Human.prototype.breathe = function(){ alert('h-a-a-m'); }; var Zero = function(type, firstName, lastName){ Human.apply(this, arguments); this.firstNa..
2. Javascript ES2015 (5) - 클래스 [1/2] 자바스크립트에서도 클래스와 관련된 문법이 추가되었습니다. 물론, 근본적으로 자바스크립트에서의 프로토타입 기반의 상속 구조는 크게 변하지 않습니다. 다만, 기존의 상속 구조의 복잡함을 해결하기 위한 것이라는 점을 명심하고 아래 내용을 살펴봐주세요. 기본적인 방식으로 프로토타입 기반의 상속 과정을 나타낸 것입니다. var Human = function(type){ this.type = type || 'human'; }; Human.isHuman = function(human){ return human instanceof Human; }; Human.prototype.breathe = function(){ alert('h-a-a-m'); }; var Zero = function(type, firstName, ..

티스토리툴바