Kay's devlog

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

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

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

0. 들어가기 전 지난번에 HTML파일을 tag 별로 분리하는 방법을 게재했다. 그러나 각 섹션(section)별로 라우팅(routing)해 본문(article)에 보여주는 작업은 하지 않았다. 오늘은 그 방법을 소개한다. 이것이 적용된 곳은 여기를 참고하면 된다. 1. 섹션별로 라우팅해 본문에 보여주는 작업? 들어가기 전에 '섹션별로 라우팅해 본문에 보여주는 작업'을 하지 않았다고 말했는데 이게 무슨 말인지, 왜 해야하는지 간단히 말하고 시작하려고 한다. 우선 아래 웹 페이지 그림을 보자. 웹 페이지를 만들 때 속 'section n'을 클릭하면 그 내용이 { `section n의 내용` }내에 나오게하고 싶다. 다시 말해 내에 를 달아서 각 section의 제목을 나열하고 내에는 section에 해당..

0. 들어가기 전 얼마 전 개인적으로 웹 프로젝트를 진행하던 중 'HTML파일을 분리할 수 없을까' 라는 궁금한 점이 한 가지 생겼다. 웹 프로젝트 경험이 풍부하지는 않지만 직감적으로 HTML파일을 분리할 수 있다면 분명 개발&수정이 쉽고 협업하기 좋을 것이 때문이다. 개인적인 생각이지만 웹 프론트엔드 프레임워크가 요즘 유행하는 이유도 이와 같이 웹 페이지를 모듈처럼 분리하려는 시도에서 유래됐을 것이라 생각한다. 다른 프론트엔드 프레임워크를 사용하지 않고도 생각보다 쉽게 HTML 파일을 분리할 수 있었고 그 방법과 장점에 대해 포스팅한다. 1. 웹 페이지를 하나 만들어 보자 예를 들어 아래와 같은 웹 하나 만든다 가정해 보자. 2. HTML 파일을 분리하지 않으면? 코드로 보자. index.html이 h..

얼마전 집에 있는 오래된 랩톱에 리눅스 서버를 올릴 일이 있어, 우분투(18.04.1 LTS)를 올렸다. 그런데 IP address가 바뀔 수 있으니 공유기(iptime)내에서 고정 ip를 갖도록 설정할 필요가 있었다. 고정 IP설정 정도는 어려운 것도 아닌데... 서버 세팅을 매일 하지 않고 가끔 하다 보니 기억이 잘 나지 않아 기록한다. 일단 랩톱에 유선 LAN은 연결된 상태이다. 일단 현재 네트워크 상태를 볼까? 네트워크 확인을 하기 위해 다음 명령어를 입력하면 아래와 같이 결과가 나온다. $ ip a 2: enp4s0의 inet 192.168.0.7이 랩톱의 현재 유선 LAN IP이다. 이것을 192.168.0.101로 고정할 예정이다. 얼마 전 라즈베리파이 라즈비안의 네트워크 설정을 볼 일이 있..

이벤트 루프(Event Loop)에서 많이 나왔던 함수인 setImmediate( )와 setTimeout( ) 그리고 process.nextTick( )에 대해 더 알아보고자 한다. setImmediate( )와 setTimeout( ) setImmediate( )와 setTimeout( )은 비슷하지만, 언제 호출되느냐에 따라 다르게 행동한다. setImmediate( )는 현재 poll phase가 끝났을 때 실행된다. setTimeout( )은 최소 임계점이 지난 후 스크립트가 실행되도록 스케줄한다. 타이머가 실행되는 순서는 호출되는 콘텍스트 시점에 따라 다르다. 만약 둘 다 메인 모듈에서 호출되면, 프로세스의 성능에 따라 호출되는 시점이 다르다. (이것은 머신의 다른 애플리케이션에 의해 영향을 ..

이번에는 이벤트 루프란 무엇이고 어떻게 동작 하는지를 다뤄보고자 한다. 내용이 조금 어렵다면 이벤트 루프가 무엇인지만 알고 넘어가도 될 것 처럼 보인다. 이벤트 루프란 무엇인가? Node.js가 단일 쓰레드(sigle thread)로 구성된다고 흔히 들어본 적이 있을 것이지만 이것은 착각이다. 정확히는 메인 쓰레드(main thread), 워커 쓰레드(worker threads) 이렇게 두 가지의 쓰레드(thread) 종류로 구성된다. 메인 쓰레드는 단일 쓰레드로 구성되지만 워커 쓰레드는 여러 쓰레드로 구성된 쓰레드 풀(thread pool)이다. 이번에 게재할 주제인 이벤트 루프는 단지 메인 쓰레드의 별명일 뿐이다. 이벤트 루프는 싱글 스레드로 구성되어 있지만, 블로킹(blocking) 될 만한 작업들..

NodeJS에서 블로킹(Blocking)과 넌블로킹(Non-Blocking) 호출(call)을 할 때 차이점을 살펴보자. 블로킹(Blocking)과 넌블로킹(Non-Blocking) 어떤 task가 블로킹, 넌블로킹인지를 따지는 것은 쉽지 않은 주제라고 생각한다. 관점에 따라 다를 수 있기 때문이다. 나는 블로킹(Blocking)이란, 현재 컨텍스트에서 다음의 Javascript 코드가 수행되기 위해 현재의 Javascript 연산, 혹은 non-Javascript 연산이 끝날 때 까지 기다려야 하는 상황이라고 생각한다. 다시 말해, 블로킹은 이벤트 루프(event loop)가 계속해서 다음의 Javascript 코드를 수행할 수 없게 되는 현상이라고 본다. 반면, 넌블로킹은 다음의 Javascipt 코..

들어가며 NodeJS의 장점은 러닝 커브가 낮아 애플리케이션을 구현하기 쉽고 사용되는 자원대비 비교적 좋은 성능을 내는 점이라고 생각한다. 정말 NodeJS는 방금 말했던 장점을 가졌을까? 그리고 실제 프로젝트에 사용해도 안전할까? 어떤 프로젝트에 적용하면 좋을까? 나는 NodeJS를 얼마나 알고 있을까? 부끄럽게도 나는 NodeJS를 거의 모르는 것 같다. 사실 Java기반의 프레임워크인 스프링부트도 러닝 커브가 낮아 사용하기 쉽다고 생각한다. NodeJS가 어떻게 구동되는지 깊게 고민한 적이 없으므로 다른 언어에 비해 왜 그리고 어떤점이 좋은지 당장 설명할 수가 없다. 이러한 내가 어떻게 NodeJS가 좋은 언어라고 다른 사람들에게 말할 수 있을까? NodeJS 공식 사이트에 들어가면 NodeJS를 ..