[Node.js] map에 객체 담기, express 구조와 generator 사용법

깡뉴·2025년 2월 14일
post-thumbnail

(이전 시간에 String만 담던)

✅ Map에 객체를 담아보자!

const express = require("express");
const app = express();
//포트 연결
app.listen(3000);
//맵 생성
let db = new Map();	
//객체 생성
let notebook = {
  productName: "Notebook",
  price: 20000,
};
let cup = {
  productName: "Cup",
  price: 3000,
};
let chair = {
  productName: "Chair",
  price: 100000,
};
let poster = {
  productName: "Poster",
  price: 5000,
};
//객체 불러오기
db.set(1, notebook);
db.set(2, cup);
db.set(3, chair);
db.set(4, poster);
//서버 화면에 띄우기
app.get("/:id", function (req, res) {
  let { id } = req.params;
  id = parseInt(id);
  if (db.get(id) == undefined) {
    res.json({
      message: "찾으시는 상품이 없습니다.",
    });
  } else {
    res.json({
      id: id,
      product: db.get(id),
    });
  }
});

- map은 어떻게 생겼을까?

console.log(db)를 입력하면
map의 생김새를 콘솔창에서 확인할 수 있다.

- 이미 json 형태인 객체, 바로 쏘자

객체 형태인 db.get(id)를 굳이 다시 '{}'로 감싸줄 필요가 없다.
한 번 바로 쏴보자.

정상 작동됨을 알 수 있다.

✅ 참고사항

product.id = id;
product["id"] = id;

요 둘은 같은 코드이다.
따라서 실행시, 같은 결과를 볼 수 있다.

✅ 유튜버 예제

🌟 객체 생성 및 맵핑

const express = require("express");
const app = express();
app.listen(3000);
//객체 생성
let youTuberA = {
  channelTitle: "유진캉",
  subscribers: "50만명",
  videoNum: "100개",
};
let youTuberB = {
  channelTitle: "앨리스 인 원더랜드",
  subscribers: "100만명",
  videoNum: "377개",
};
let youTuberC = {
  channelTitle: "인어공주",
  subscribers: "1000만명",
  videoNum: "1000개",
};
//맵핑
let db = new Map();
db.set(1, youTuberA);
db.set(2, youTuberB);
db.set(3, youTuberC);
//서버 연결
app.get("/youtuber/:id", function (req, res) {
  let { id } = req.params;
  id = parseInt(id);
  res.json(db.get(id));
});

결과 화면은 다음과 같다.

🌟 예외사항 처리

if (db.get(id) === undefined) {
    res.json({
      message: "유튜버 정보를 찾을 수 없습니다.",
    });
  } else {
    res.json(db.get(id));
  }

id 값이 없을 경우,
다음과 같은 화면이 출력된다.

⭐️ 코드 단순화하기

const youtuber = db.get(id);
반복되는 부분을 간단한 단어로 호출하자.

app.get("/youtuber/:id", function (req, res) {
  let { id } = req.params;
  id = parseInt(id);
  const youtuber = db.get(id);
  if (youtuber === undefined) {
    res.json({
      message: "유튜버 정보를 찾을 수 없습니다.",
    });
  } else {
    res.json(youtuber);
  }
});

✅ express generator 사용법

express는 express만의 웹사이트가 따로 있다.

암튼 하단의 주소에 express generator에 관한 설명이 있는데,
스타터팩이라고 생각하면 될 거 같다.

https://expressjs.com/en/starter/generator.html

사용방법은 다음과 같다.
🔻

🧃설치 방법

npx express-generator
npm install express
npm install
npm start

npx express-generator 명령어로
예전 버전과는 다르게 무조건 전역 설치를 하지 않아도 되는 거 같다.
또한 express 명령어 없이도 바로 설치됨을 확인할 수 있다.

npx express-generator만 입력하고 실행한 경우에는
콘솔창에 Error: Cannot find module 'express'가 뜰 수 있다.
(껍데기만 있는 상태)

이는 express generator만 설치해 문제가 생긴 것으로,
따라서 express 설치가 필요하다.

뿐만 아니라 캡처에 나와있는
dependencies 객체의모든 항목 설치가 필요하다.

모두 설치를 한 후 실행을 한 화면이다.

참고로 화면에 뿌려지는 내용은 'views' 폴더에 있는 파일들이다.

종료는 mac 기준 ctrl + c로 가능하다.

✅ 자바스크립트 함수: 네 가지 종류

function add1(x, y) {
  return x + y;
}
let add2 = function (x, y) {
  return x + y;
};
//화살표 함수 (arrow function)
const add3 = (x, y) => {
  return x + y;
};
var add4 = (x, y) => x + y;
//콘솔창에 뿌려지는 내용 비교해보기
console.log(add1(1, 2));
console.log(add2(1, 2));
console.log(add3(1, 2));
console.log(add4(1, 2));


오늘은 여기까지!

express에 대해 배울 때마다
새로운 세상이 계속 열리는 기분이 든다.

그리고 만든 사람들
진짜 천재같다...

profile
🐰🍎

0개의 댓글