티스토리툴바

Front End/JavaScript

Node.js API (fs, fetch)

Node.js는 비동기적 런타임

"Node.js는 비동기 이벤트 기반 JavaScript 런타임이다.”

위의 인용문은 Node.js 소개 문서의 첫 문장이다. 대표적으로 사용하는 JavaScript 런타임인 브라우저에서는 비동기와 관련해 타이머, DOM 이벤트 등 다소 한정적으로 사용하지만 Node.js의 경우 많은 API가 비동기로 작성되어 있다.

Node.js 내장 모듈 사용법

모든 모듈은 모듈을 사용하기 위해 불러오는 과정이 필요하다. 브라우저에서는 아래와 같은 <script>태그를 이용해 JS 파일을 불러왔다.

<script src="주소.js"></script>

Node.js에서는 JavaScript 코드 최상단에 require구문을 이용해 다른 파일을 불러온다.

const fs = require('fs'); // 파일 시스템 모듈 불러오기
const dns = require('dns'); // DNS 모듈 불러오기

서드 파티(3rd-party) 모듈 사용법

서드 파티 모듈(3rd-party module)은 해당 언어에서 공식적으로 제공하는 빌트인 모듈(built-in module)이 아닌 모든 외부 모듈을 일컫는다. 예를 들어, Node.js에서 underscore 모듈은 Node.js 공식 문서에 등재되어 있지 않기 때문에 서드 파티 모듈이다. 서드파티 모듈을 다운받기 위해서는 터미널에서 npm을 사용해야한다.

npm install underscore

npm을 통해 모듈을 설치하고 나면 내장 모듈을 사용하듯 require구문을 통해 underscore를 사용할 수 있다.

const _ = require('underscore');

Node.js 공식문서를 fs.readFile로 알아보자

메서드 fs.readFile은 로컬에 존재하는 파일을 읽어온다. 16.x 버전 기준으로 fs.readFile의 공식 API 문서에 안내된 항목을 통해 공식 문서의 구성을 이해해보자.

fs.readFile(path[, options], callback)

메서드 fs.readFile는 비동기적으로 파일 내용 전체를 읽는다. 해당 메서드는 전달인자로 다음과 같은 요소를 받는다.

path : \<string> | \<Buffer> | \<URL> | \<integer>

path에는 파일 이름을 전달인자로 받는다. 네 종류의 타입을 넘길 수 있지만 일반적으로 문자열의 타입을 받는다.

options : \<Object> | \<string>

대괄호는 선택적 전달인자를 의미하므로, 두 번째 전달인자 options는 선택사항이다. 문자열이나 객체 형태를 받을 수 있으며 문자열의 경우 인코딩(ex. 'utf8')을, 객체의 경우는 퍼미션(권한) 등 다양한 옵션을 전달하기 위해 사용한다.

callback : \<Function>

콜백 함수를 전달한다. 파일을 읽고 난 후에 비동기적으로 실행되는 함수이며, 두 가지 매개변수가 존재한다.

  • err : 에러. 에러가 없으면 null이 된다.
  • data : 파일의 내용. 인코딩 방식이 지정되면 문자열을, 그렇지 않으면 Buffer라는 객체가 전달된다. 
// hi.txt 안에는 이메일 주소가 담겨있다.

fs.readFile('hi.txt', 'utf8', (err, data) => {
  if (err) {
    throw err; // 에러를 던진다.
  }
  console.log(data);
});

위의 예제를 실제로 Node.js를 이용해 실행하면 아래와 같은 결과를 보여준다. 만약 주소 등의 에러가 발생하면 콜백함수에 작성된 매개변수 err에 의해 에러메세지를 출력해준다.

fetch API

fatch API는 특정 URL로부터 정보를 받아오는 역할을 한다. 이 과정은 비동기로 이루어지기 때문에 경우에 따라 다소 시간이 걸릴 수 있다. 이렇게 시간이 소요되는 작업은 blocking이 발생하면 안되므로, 특정 DOM에 정보가 표시될 때 까지 로딩창을 대신 띄우기도 한다.

let url =
  "https://koreanjson.com/posts/1";
fetch(url)
  .then((response) => response.json())
  .then((json) => console.log(json))
  .catch((error) => console.log(error));

Uploaded by N2T

티스토리툴바