2023-07-13 TIL (JavaScript 기초 및 JWT 개념 정리)

오준석·2023년 7월 13일
0

TIL (Today I Learned)

목록 보기
43/105

TIL

자바스크립트 문법을 복습하고자 종합반 강의를 다시 들었다. 자바스크립트와 노드 모두 중요한 기초다.

<JavaScript 문법 종합반>

UX = User Experience . 사용자 경험

동적 타이핑
자바스크립트는 동적 타이핑을 지원하는 언어로서, 변수를 선언할 때 타입을 지정하지 않음. 이것은 런타임 시점에 변수에 할당되는 값에 따라 자동으로 데이터 타입이 결정된다는 것을 의미.

객체와 객체 메서드 코드

// 객체
// key -value pair
// 하나의 변수에 여러 개의 값을 넣을 수 있다.

// 생성자 함수를 이용한 객체 생성 방법 (중요요)
function Person(name, age, gender) {
  this.name = name;
  this.age = age;
  this.gender = gender;
}

let person1 = new Person("홍길동", 30, "남자");
let person2 = new Person("홍길순", 25, "여자");

// 접근하는 방법
let person = {
  name: "홍길동",
  age: 30,
  gender: "남자",
};

console.log(person.name); // "홍길동"
console.log(person.age); // 30
console.log(person.gender); // "남자"

// 객체 메소드 (객체가 가진 여러가지 기능 : Object.~~)
// Object.key() : key를 가져오는 메소드
let personA = {
  name: "홍길동",
  age: 30,
  gender: "남자",
};

let keys = Object.keys(personA);

console.log(keys); // ["name", "age", "gender"]

// Object.values() : values를 가져오는 메소드
let personB = {
  name: "홍길동",
  age: 30,
  gender: "남자",
};

let ggg = Object.values(personB);

console.log("ggg :", ggg); // ["홍길동", 30, "남자"]

// entries
// key와 value를 묶어서 배열로 만든 배열 (2차원 배열)
let personC = {
  name: "홍길동",
  age: 30,
  gender: "남자",
};

let entries = Object.entries(personC);

console.log(entries);

// assing
// 객체 복사를 하는 메소드. (복사할 위치, 뭘 복사할래, 중괄호 열고 추가 및 수정할래)
let personD = {
  name: "홍길동",
  age: 30,
  gender: "남자",
};

let newPerson = Object.assign({}, personD, { age2: 35 });

console.log("assing : ", newPerson); // { name: "홍길동", age: 35, gender: "남자" }

// 객체 병합
let personE = {
  name: "홍길동",
  age: 30,
};

let personF = {
  gender: "남자",
};

console.log("뭐가 나올까 : ", { ...personE });

// ... : spread operator. 중괄호를 없애고 다 풀어 헤쳐줘
let mergedPerson = { ...personE, ...personF };

console.log(mergedPerson); // { name: "홍길동", age: 30, gender: "남자" }

<정예반 7회차 복습>

토큰을 안전하게 사용자에게 전달하기 위해선 어떻게 해야 하나?
: 암호화를 해야한다.

암호화 - 단방향, 양방향

  • 단방향 : 암호화 O, 복호화 X
    양방향 : 암호화 O, 복호화 O

단방향은 왜 쓰는가
: 패스워드에 사용하기 위해 쓴다.
ex) SHA256. 어떤 길이의 값을 입력하더라도 256비트의 고정된 결과값을 출력하는 암호 알고리즘

복호화가 된 암호를 쓰는 이유
: 회원정보 등을 찾기 위해 (ID 등은 복호화가 가능하게 만든다. )

암호화 키와 복호화 키는 같아야 한다.

jwt의 기본 로직 설명

const jwt = require("jsonwebtoken");

const user = {
  name: "오준석",
  id: "OJS123",
};

const 임시출입증 = jwt.sign(user, "12234");

console.log("임시출입증 : ", 임시출입증);

const 입장하려는사람의정보 = jwt.verify(임시출입증, "12234");
console.log("입장하려는사람의정보 : ", 입장하려는사람의정보);

토큰을 쿠키에 보내는 이유 및 활용
res.cookie(token) 과 같은 코드
token을 쿠키로 본인 컴퓨터에 저장한다. 헤더에 저장해서 활용하는 방법도 있다.

하지만 백엔드는 프론트엔드에 관여하지 않는다. 우리(백엔드)는 body로 넘겨준다. body로 넘겨받은 token은 프론트엔드가 결정한다.
즉, 프론트엔드에서 저장해야 할 사항은 프론트엔드가 한다. 쿠키는 브라우저 기능이니까

모든 요청에 대해 동일한 처리를 할 때는 미들웨어를 쓴다.
공통 로직은 함수로 만든다.
즉, 함수로 바꿔 놓고 함수를 또 미들웨어 이용하면 보기도 좋고 편하다.

profile
개발자를 목표로 열심히 하려고 합니다.

0개의 댓글