210618 - TIL

• 에어비앤비 자바스크립트 스타일 가이드

let users = ['Tom', 'Andy', 'Jessica', 'Paul'];

let server = http.createServer(function (request, response) {
    
  if(request.url === '/') {
    response.end('<h1>Welcome!</h1>');
  } else if (request.url === '/users') {
    response.end('<h1>' + users + '</h1>');
  } else if (request.url.split('/')[1] === 'users') {
    //url : /users/1, /users/2, ..
    let userIdx = request.url.split('/')[2];
    let userName = users[userIdx-1];
    
    response.end('<h1>' + userName + '</h1>');     
  } else {
    response.end('<h1>Page Not Available</h1>');
  }
});

server.listen(3000);

• url에 어떤 값이 들어가냐에 따라 다른 h1태그를 리턴해주는 간단한 서버.

1. 함수를 Arrow Function형태로 바꾸기

http.createServer((request, response) => { // Arrow Function
  if (request.url === '/') {

2. 변수는 가능하다면 최대한 상수로 바꾸기

const http = require("http");
const users = ['Tom', 'Andy', 'Jessica', 'Paul']; // const
const server = http.createServer((request, response) => { 
 (중략)
    const userIdx = request.url.split('/')[2]; // const
    const userName = users[userIdx-1]; // const

3. 변수가 섞인 문자열은 + 기호보다는 템플릿 문자열 사용하기

response.end(`<h1>${userName}</h1>`);

4. 기타
   문자열은 double-quote(")가 아닌 single-quote(')로 나타내야 함 : "http" -> 'http'로 수정
   주석 내용은 스페이스 하나를 두고 시작해야 함 : //url : ~ -> // url : ~ 로 수정

• 기호 앞 뒤로 스페이스가 필요함 : users[userIdx-1] -> users[userIdx - 1] 로 수정

최종 수정 코드

const http = require('http'); // etc

const users = ['Tom', 'Andy', 'Jessica', 'Paul']; // const

const server = http.createServer((request, response) => { // Arrow Function, const
  if (request.url === '/') {
    response.end('<h1>Welcome!</h1>');
  } else if (request.url === '/users') {
    response.end(`<h1>${users}/h1>`); // Template String
  } else if (request.url.split('/')[1] === 'users') {
    // url : /users/1, /users/2, .. // etc
    const userIdx = request.url.split('/')[2];
    const userName = users[userIdx - 1]; // etc

    response.end(`<h1>${userName}</h1>`); // Template String
  } else {
    response.end('<h1>Page Not Available</h1>');
  }
});

server.listen(3000);