객체지향

1. 객체(object)

객체란 key와 value로 구성된 프로퍼티(property)의 정렬되지 않은 집합이다.
※ 프로퍼티란, 객체 안에 선언된 key, value의 한 쌍

const person1 = {
  name : 'Jeong',
  age : 29,
  department : 'sparta'
}

const person2 = {
  name : 'Park',
  age : 26,
  department : 'sparta'
  sum : function() {
  			return 2 + 3
      }
}

person1은 객체이고, name은 프로퍼티(key), 'Jeong'은 프로퍼티(value)

person2에 프로퍼티 값으로 함수가 온 경우에 일반 함수와 구분하기 위해

메소드(Method)라고 부른다.

• 인스턴스(Instance) : 생성자 함수에 의해 생성된 객체를 인스턴스라고 한다.
  생성자 함수(Constructor)란 new연산자와 함께 호출하여 객체(인스턴스)를 생성하는 함수를 말한다.

2. 추상화

기존 코드

io.on("connection", (sock) => { // socketIo on 로그인 한 유저 정보
  console.log('새로운 소켓이 연결되었습니다.')

  sock.on('BUY', data => {
    console.log(data)
    const emitData = {
      nickname : data.nickname,
      goodsId : data.goodsId,
      goodsName : data.goodsName,
      date : new Date().toISOString() // date 객체를 String으로 가공
    }
    io.emit('BUY_GOODS', emitData)
  })

  sock.on('disconnect', () => {
    console.log(sock.id, '해당하는 사용자가 연결이 끊어졌어요!')
  })
});

추상화한 코드

io.on('connection', (sock) => {
  const { watchBuying, watchByebye } = initSocket(sock);

  watchBuying();

  watchByebye();
});

1. 서버에 소켓이 연결 되면, io.on('connection', ~~~)
   안에 코드를 실행

2. initSocket(sock) 객체에
   두 개의 함수 watchBuying, watchByebye를 객체 구조 분해 할당을 한다.

3. watchBuying 함수에 구매 시, 실행할 코드를 코딩
   (구매를 감시)

4. watchByebye 함수에 물품을 구매 하고 메인 페이지로 이동 했을 때, 소켓으로 => 클라이언트로 데이터 전달하는 코드를 코딩
   (나가는지 감시)

5. 기능에 따라 파일을 분리함

socket.js

const socketIo = require("socket.io");
const http = require('./app.js')

const io = socketIo(http);

io.on("connection", (sock) => { // socketIo on 로그인 한 유저 정보
  const {watchBuying, watchByeBye} = initSocket(sock)

  watchBuying()

  watchByeBye()
});

function initSocket(sock) {
  console.log('새로운 소켓이 연결되었습니다.')

  // sock.on을 대신해서, 어떤 역활을 하는지 추상화 한 함수
  function watchEvent(eventName, func) {
    sock.on(eventName, func)
  }

  // 현재 접속한 모든 클라이언트 들에게 메세지를 전송하는 함수
  function sendMessageAll(eventName, data) {
    io.emit(eventName, data)
  }

  return {
    watchBuying : () => {
      watchEvent('BUY', data => {
        console.log(data)
        const emitData = {
          nickname : data.nickname,
          goodsId : data.goodsId,
          goodsName : data.goodsName,
          date : new Date().toISOString() // date 객체를 String으로 가공
        }
        sendMessageAll('BUY_GOODS', emitData)
      })
    },
    watchByeBye : () => {
      watchEvent('disconnect', () => {
        console.log(sock.id, '해당하는 사용자가 연결이 끊어졌어요!')
      })
    }
  }
}

• initSocket() 함수 안에 기존 코드들을 삽입

• watchEvent(), sendMessageAll() 함수를 만들어서 코드를 더 직관적이게 함

• 소켓이 연결 됐을 때 watchBuying(), watchByebye() 함수들을 실행

server.js

const http = require('./app.js')
require('./socket.js')

http.listen(8080, () => {
  console.log("서버가 요청을 받을 준비가 됐어요");
});

• 이제 nodemon server.js 파일을 실행시켜 서버를 열기

• http 변수 안에 app.js 파일의 코드들을 대입

• 그리고 변수 선언 없이 socket.js 파일들도 실행이 됨
  순차적으로 파일이 열린다.