on
[NestJS] Typescript와Javascript 차이점 + 의존성주입
[NestJS] Typescript와Javascript 차이점 + 의존성주입
사내에서 Typescript로 챗봇 개발 프로젝트를 앞두고 이전에 공부했던 내용을 조금이나마 정리하여 지속적으로 올리도록 하겠습니다.
NestJS를 시작하기 앞서서 알아두면 좋은것을 포스팅하겠습니다.
* JavaScript 와 TypeScript
: JavaScript는 프론트엔드 공부중이거나 NodeJS를 다루어보신분들은 알고 있을거라고 생각합니다.
TypeScript는 JavaScript 기반으로 나온 언어이기에 JavaScript의 상위 집합으로 JavaScript의 모든 기능이 있습니다.
JavaScript
웹 개발에 주로 사용됨
웹 페이지를 대화식으로 만드는 프로그래밍 언어
폼 유효성 검사, 애니메이션 적용 및 이벤트 생성을 수행
클라이언트 측 스크립팅 언어
- 사용자가 웹 브라우저를 열고 웹 페이지를 요청하면 해당 요청이 웹 서버로 이동함
- 사용자가 웹 브라우저를 열고 웹 페이지를 요청하면 해당 요청이 웹 서버로 이동함 멀티 스레딩, 멀티 프로세싱 기능이 없음
TypeScript
JavaScript의 상위 집합으로 JavaScript의 모든 기능이 있음
TypeScript 컴파일러를 사용하여 ts(TypeScript)파일을 js(JavaScript) 파일로 변환, 쉽게 통합
정적 유형 검사 제공
클래스 기반 객체를 만들 수 있음
클래스 기반이므로 객체 지향 프로그래밍 언어로 상속, 캡슐화 및 생성자를 지원할 수 있음
TypeScript가 좋은 이유는 NestJS의 주요핵심인 의존성주입 입니다. (NestJS는 프레임워크입니다.)
* 의존성 주입(Dependency Injection)
# users.controller.ts import { Controller, Get, Post, Body } from "@nestjs/common"; import { CreateUserDto } from "./dto/create-user.dto"; import { UserService } from "./user.service"; import { User } from "./interfaces/user.interface"; @Controller("user") export class UserController { constructor(private userService: UserService) {} @Post() async create(@Body() createUserDto: CreateUserDto) { this.userService.create(createUserDto); } @Get() async findAll(): Promise { return this.userService.findAll(); } }
Controller 파일은 라우팅을 처리하는 파일입니다.
constructor(private userService: UserService) {} 는 클래스의 생성자로써 userService 의 타입만 지정했습니다.
userService는 create라는 함수를 호출하고 있습니다.
이게 가능한 이유는 바로 Nest 의 훌륭한 DI 시스템 때문입니다.
DI 는 간단하게 NestJS 의 틀에 맞게 우리가 어떤 값을 지정해주면 NestJS 가 알아서 컨트롤 해주는 기능입니다.
우리 UserService 부분에서 Injectable 데코레이터를 통해 UserService 를 Injectable 한 provider 로 지정했습니다.
따라서 UserController 클래스 내의 constructor 에서 단순히 userService 의 타입을 UserService 로 지정해줌으로서
NestJS가 알아서 this.userService 의 생성과 소멸을 관리 하게 됩니다.
NodeJS환경에서 Javascript는 타입을 명시할 수 없기때문에 Typescript를 사용하게 됩니다.
Javascript와 Typescript를 모르신다면 노마드코더님, 드림코딩 엘리님 등에서 수많은 강의들이 있으니 꼭 들어보시길 바랍니다.
의존성 주입에 대해 좀더 알고 싶으시다면 아래를 참고해주세요.
https://velog.io/@wlsdud2194/what-is-di
반응형
from http://choseongho93.tistory.com/316 by ccl(A) rewrite - 2021-09-07 20:26:04