반응형

Programming language/JavaScript 5

JavaScript, Prototype

서론 ES6+ 이후 class 문법이 지원되면서 prototype을 직접 사용할 일이 드물겠지만, JavaScript 객체를 더 잘 이해하기 위해서는 prototype이 무엇인지 어떻게 동작하는지 어느정도 이해할 필요가 있다. 그래서 이번에는 JavaScript의 prototype에 대해 정리해보고자 한다. Prototype이란? JavaScript에서 prototype은 함수를 정의하자 말자 사용할 수 있는 속성이다. 이 만약 foo라는 함수를 생성하는 경우, foo라는 함수의 속성으로 prototype 이라는 이름의 속성도 함께 생성된다. 이 prototpye 속성은 함수 자체에는 아무런 영향을 미치지 않고, foo를 생성자로 호출(new foo())할 때 생성된 객체는 함수 foo의 속싱인 prot..

자바스크립트, 호출 패턴에 따른 this

this라는 매개변수는 객체지향 프로그래밍 관점에서 중요한 역할을 차지한다고 생각한다. JavaScript에서도 함수, 클래스를 호출할 때 this 매개변수를 사용할 수 있다. 그런데 호출하는 패턴에 따라 각기 this가 다르게 동작한다. 오늘은 각 경우에 따라 this가 어떻게 되는지 살펴본다. this가 호출되는 패턴은 다음과 같이 네 가지가 있는 것 같다 메소드 호출 패턴 함수 호출 패턴 클래스 호출 패턴 apply 호출 패턴 각각의 경우에 대해 this가 어떻게 다른지 자세히 살펴보자. 1. 메소드 호출 패턴 함수를 객체의 속성에 저장하는 경우 이 함수를 메소드라고 부른다. 이 경우는 메소드를 호출할 때, this는 메소드를 포함하고 있는 객체에 바인딩된다. 즉, 흔히 예상하는 것 처럼 this는..

JavaScript Promise의 all( )과 race( )

JavaScript는 싱글쓰레드 이벤트 루프 방식으로 동작하기 때문에 동시성을 높이기 위해 최대한 비동기적으로 처리하는 것이 좋다. 시간이 오래 걸리는 어떤 I/O 연산에 의해 코드가 블록되면 그 이후 연산은 수행될 수 없기 때문이다. 웹 브라우저에서 사진을 받기 위해 몇 초를 기다리는 동안 다른 것을 할 수 없는 것을 경험한 적이 있을 것이다. 코드가 블록 되었기 때문이고 이런 부분은 가능하다면 비동기적으로 처리해주는 것이 좋다. 비동기 방식이 보통 더 효율적이지만 동기 방식에 비해 처리가 결코 쉽지않다. 처리 결과가 언제 어떻게 오는지 예측하기 힘들기 때문이다. 이제까지 JavaScript 코드에서 비동기 처리를 위한 여러가지 시도가 있는데 근래 들어서 Promise가 흔히 사용되는 것 같다. 아니 ..

자바스크립트, Promise로 요청실패시 retry 처리하기

JavaScript로 코딩을 하다보면 I/O 연산은 논블로킹 방식으로 처리되기 때문에 비동기 처리를 반드시 적절하게 해야 한다. I/O함수에 콜백함수를 등록해 콜백함수 내에서 I/O 이후 로직을 처리하면 되지만 콜백이 중첩되다보면 콜백 지옥(callback hell)에 빠지게 된다. 뿐만 아니라 콜백방식을 사용하게 되면 중첩된 콜백함수 중 하나에서 에러가 발생했을 때 예외 처리가 꽤 까다롭다. 아래 순서도와 같이 데이터를 처리 한다고 가정해보자. 콜백 방식으로 처리 위 순서도를 처리하기 위한 콜백 방식의 코드를 보자. 아래 코드는 남자의 키 데이터를 요청하고, 그 후 여자의 키 데이터를 요청한다. 이 때 여자의 키 데이터를 요청 후 응답은 50% 확률로 실패하고 실패하면 null을 반환한다고 가정하자. ..

JavaScript callback hell과 async-await

JavaScript를 사용하면서 성가신 것 중 하나가 I/O가 일어날 때 비동기 방식으로 동작한다는 점이다. 빈번한 I/O 처리 때문에 때문에, 코딩을 하다 보면 가끔 끔직한 결과를 만나게 될 때가 있는 것 같다. 특히, 연속적인 read, save 할때 말이다. 이를 해결하기 위해서 callback, async module(waterfall), promise 그리고 최근 async-await 까지 나왔다. async-await 방식이 기존에 방식에 비해 코드 가독성이 높아 쓰인다고 했지만 callback만 써왔기 때문에 async-await 코딩 방식에 익숙하지 않아 연습겸 글을 쓴다. Node.js로 모바일 앱 서버를 하나 구축하고 있다고 가정하자. 한 회원이 내가 쓴 글 목록을 보는 부분을 구현하고..

반응형