본문 바로가기

Today I Learned

[TIL] 220419 (화) | I/O 논블로킹 | 동기, 비동기 등 공부 기록

728x90

 

2022.04.19 (화)

노드타운 스프린터스 스터디 2일차 


To do

브라우저에서 서버 응답까지의 흐름

 

https://develaniper-devpage.tistory.com/88

로컬 DNS에 해당 도메인의 ip주소가 있는지 묻는다. 그럼 먼저 root 서버로 간다. 여기서 ip 주소를 요청한 결과 .com라는 응답을 얻는다. 그럼 TL 서버로 가서.com을 가지고 가서 .naver.com 을 다시 요청해보고 naver.com의 ip 주소 응답을 받는다. 그렇다면 여기서 name 서버로 가서 naver.com로 www.naver.com을 요청해보고 www.naver.com ip주소를 받는다. 그렇다면 이제부터는 로컬 dns에 캐시로 저장해 놓을 수 있다. 그럼 이 ip로캐시로 저장한 걸 바로 찾아서 이 ip주소로 서버컴퓨터에 요청하고 내 컴퓨터로 응답을 받을 수 있다.

 

 

더 이해가 필요한 내용들

tcp

3way handshaking

http프로토콜에 대한 이해.

7계층.

 


OOP는 무엇인가

 

객체지향프로그래밍(Object-Oriented Programming)이란?

Object(객체)들을 마치 레고 블럭처럼 조립해서 하나의 프로그램을 만드는 것 추상화하여 객체를 만들고 객체들간의 상호작용을 통해 로직을 구성하는 것.

 

자바스크립트에서의 객체지향 프로그래밍

-> 클래스 기반, 프로토타입 기반

 

장점 :

코드 재사용 용이 (다른 사람이 만든 클래스 활용 가능, 상속을 통한 확장 가능)

유지보수가 쉬움 (일일히 찾지 않고 클래스 내부를 들여다보면 되기 때문에)

대형프로젝트에 적합 (클래스 단위로 모듈화해서 개발 가능)

 

단점 :

설계시 많은 고민이 필요

규모가 커지면 속도가 느리다

 

 


I/O 논블로킹

 

블로킹, 논블로킹, async, sync에 대해서 혼용해서 쓰고 있었던 것 같다.

원래 이해하고 있는 정도는 다음과 같다.

동시에 실행할 수 있는 것은 논블로킹, async. (이전 작업이 끝나지 않더라도 다음 작업을 실행할 수 있는 것 정도로 이해)

동시에 실행할 수 없는 것은 블로킹, sync. (이전 작업이 끝나야만 다음 작업을 수행할 수 있는 정도로 이해)

 

좀 더 파보니 blocking/non-blocking, async,sync의 개념은 달랐다.

블로킹 논블로킹은 제어권을 누가 가지고 있느냐의 차이.

async, sync는 리턴값을 기다리고 있느냐 신경을 쓰고 있지 않느냐의 차이였다.

 

 

  • 제어권
    • 제어권은 자신(함수)의 코드를 실행할 권리 같은 것이다. 제어권을 가진 함수는 자신의 코드를 끝까지 실행한 후, 자신을 호출한 함수에게 돌려준다.

 

Blocking

A함수가 B함수를 호출하면, 제어권을 B함수한테 넘겨줌.

A함수는 제어권이 없어서 실행을 멈추고 제어권이 올 때까지 기다린다.

 

https://velog.io/@nittre/%EB%B8%94%EB%A1%9C%ED%82%B9-Vs.-%EB%85%BC%EB%B8%94%EB%A1%9C%ED%82%B9-%EB%8F%99%EA%B8%B0-Vs.-%EB%B9%84%EB%8F%99%EA%B8%B0

 

Non-blocking

A함수가 B함수를 호출해도 A함수가 제어권을 그대로 가지고 있음.

A함수는 제어권을 가지고 있기 때문에 B함수가 호출되고 실행되는 순간에도 A함수도 여전히 실행되고 있음.

https://velog.io/@nittre/%EB%B8%94%EB%A1%9C%ED%82%B9-Vs.-%EB%85%BC%EB%B8%94%EB%A1%9C%ED%82%B9-%EB%8F%99%EA%B8%B0-Vs.-%EB%B9%84%EB%8F%99%EA%B8%B0


동기와 비동기의 차이점

 

  • 결과값을 기다린다는 것
    • A 함수에서 B 함수를 호출했을 때, A 함수가 B 함수의 결과값을 기다리느냐의 여부를 의미한다.

sync(동기)

함수 A가 함수 B를 호출한 뒤, 함수 B의 리턴값을 계속 확인하면서 신경쓰는 것

 

async(비동기)

함수 A가 함수 B를 호출할 때 콜백 함수를 함께 전달해서, 함수 B의 작업이 완료되면 함께 보낸 콜백 함수를 실행한다.

함수 A는 함수 B를 호출한 후로 함수 B의 작업 완료 여부에는 신경쓰지 않는다.

 

sync-blocking

blocking이기 때문에 b함수에게 제어권을 넘겨주고 제어권이 있는 동안 기다린다.

또한 동기이기 때문에 A함수는 B함수의 리턴값이 필요해서 기다린다.

제어권 + 리턴값이 오면 다시 A함수를 실행한다.

https://velog.io/@nittre/%EB%B8%94%EB%A1%9C%ED%82%B9-Vs.-%EB%85%BC%EB%B8%94%EB%A1%9C%ED%82%B9-%EB%8F%99%EA%B8%B0-Vs.-%EB%B9%84%EB%8F%99%EA%B8%B0

 

async-Nonblocking

https://velog.io/@nittre/%EB%B8%94%EB%A1%9C%ED%82%B9-Vs.-%EB%85%BC%EB%B8%94%EB%A1%9C%ED%82%B9-%EB%8F%99%EA%B8%B0-Vs.-%EB%B9%84%EB%8F%99%EA%B8%B0

A함수는 B함수를 호출한다.

non-blocking이기 때문에 A함수가 제어권을 가지고 있고 계속 A함수는 하던 것을 실행한다.

또한 비동기이기때문에 B함수를 호출할 때 콜백함수도 같이 주면서 호출한다.

그럼 B함수는 B함수가 완료되면 콜백함수를 실행한다.

 


URL과 URI의 차이

 

url은 위치값

: 내 파일의 실제 위치를 나타냄 

/index.html이 실제로 내 서버에 있다.

 

url는 식별자 (url을 포함)

: /index는 실제 웹서버에 없지만 결국 서버에서 처리해서 index.html을 가리킨다. (index는 index.html을 가리키는 식별자)

 

https://www.charlezz.com/?p=44767

 

 

https://velog.io/@jch9537/URI-URL

 


Promise를 사용한 비동기 통신과 async, await 를 사용한 비동기 통신의 차이

 

callback → promise → async

프로미스.

이벤트 리스너를 사용할 때 콜백함수를 자주 사용.

콜백 지옥을 극복하기 위해서 프로미스 사용.

new promise로 프로미스를 생성하고 내부에 resolve, reject를 매개변수로 갖는 콜백함수를 넣는다.

여기에 then catch 메서드를 붙이고

프로미스 내부에서 resolve가 호출되면 then이 실행되고

reject가 호출되면 catch가 실행된다

 

실행은 바로하고 결과값은 then catch로 받는 객체.

then과 catch가 계속 반복 될 수 있기 때문에 장황해질 수 있다는 단점.

 

async await문법을 사용하면 코드가 짧아지고 자주 보던 익숙한 형태에 await이 붙는다.

 

 

promise에 대해서 더 자세히 찾아봐야함.

 


NPM

 

npm은 Node Packaged Manager의 약자입니다

내 패키지 공유하기

패키지 설치, 버전관리

 

더 자세히 정리하기.


TCP 4계층

 

 

+ 네트워크 관련 공부 더 필요

 

 

 

 

 

 

 

 

 

 

 

 

참고자료

주소창에 www.naver.com을 쳤을 때 생기는 일 https://develaniper-devpage.tistory.com/88  

자바스크립트 객체지향 프로그래밍 https://poiemaweb.com/js-object-oriented-programming

객체지향 프로그래밍 https://selina-park.tistory.com/63

객체지향 프로그래밍 https://likelionsungguk.github.io/20-12-24/%EA%B0%9D%EC%B2%B4%EC%A7%80%ED%96%A5-%ED%94%84%EB%A1%9C%EA%B7%B8%EB%9E%98%EB%B0%8D(OOP)%EC%9D%B4%EB%9E%80 

동기 & 비동기 / 블로킹&논 블로킹 완벽 이해하기 https://inpa.tistory.com/entry/%F0%9F%91%A9%E2%80%8D%F0%9F%92%BB-%EB%8F%99%EA%B8%B0%EB%B9%84%EB%8F%99%EA%B8%B0-%EB%B8%94%EB%A1%9C%ED%82%B9%EB%85%BC%EB%B8%94%EB%A1%9C%ED%82%B9-%EA%B0%9C%EB%85%90-%EC%A0%95%EB%A6%AC  

IO모델 (동기vs비동기vs블로킹vs논블로킹) https://sjh836.tistory.com/109  

Blocking, Non-blocking, Sync, Async 의 차이 https://jh-7.tistory.com/25 

블로킹 vs 논블로킹, 동기 vs 비동기 https://velog.io/@nittre/%EB%B8%94%EB%A1%9C%ED%82%B9-Vs.-%EB%85%BC%EB%B8%94%EB%A1%9C%ED%82%B9-%EB%8F%99%EA%B8%B0-Vs.-%EB%B9%84%EB%8F%99%EA%B8%B0 

await은 정말 non-blocking 일까? https://yorr.tistory.com/20  

URI랑 URL 차이점이 뭔데? https://www.charlezz.com/?p=44767  

URI & URL https://velog.io/@jch9537/URI-URL  

프로미스를 제대로 알고 사용하기 https://medium.com/%EC%98%A4%EB%8A%98%EC%9D%98-%ED%94%84%EB%A1%9C%EA%B7%B8%EB%9E%98%EB%B0%8D/%ED%94%84%EB%A1%9C%EB%AF%B8%EC%8A%A4%EB%A5%BC-%EC%A0%9C%EB%8C%80%EB%A1%9C-%EC%95%8C%EA%B3%A0-%EC%82%AC%EC%9A%A9%ED%95%98%EA%B8%B0-8fece85d741d  

what is npm https://nodejs.org/en/knowledge/getting-started/npm/what-is-npm/

nvm 이란? : 노드 버전 관리하는 법 https://velog.io/@mayinjanuary/NVM-%EC%9D%B4%EB%9E%80-%EB%85%B8%EB%93%9CNode.js-%EB%B2%84%EC%A0%84-%EA%B4%80%EB%A6%AC%ED%95%98%EB%8A%94-%EB%B2%95

728x90