230330_TIL

majungha·2023년 3월 30일
1

TIL

목록 보기
28/68

앞으로의 목표 👍


  1. javascript 능력 및 고난도 알고리즘 풀이 능력
  2. Nest, Graphql등 최신 기술 스택 활용 능력
  3. 기초 미니프로젝트 포트폴리오
  4. 로그인, 결제기반 심화프로젝트 포트폴리오
  5. 배포를 위한 네트워크 및 CI/CD 배포자동화 능력
  6. 120% 백엔드 개발 지식

오늘부터 꾸준히 해야할 일 👍


  • 영타실력 늘리기
  • 단축키 사용 익숙해지기
  • 코드리딩 실력 키우기
  • 데일리 퀴즈
  • 포트폴리오 작성
  • 독스에 친숙해지기
  • MDN 보는 연습하기

오늘의 수업 👍



📝 Generic Types


  • Generic Type은 우리가 함수를 만들어서 제공해 줄 때 안전하고 확장성 높은 코드 사용을 위해 많이 사용합니다.
  1. 배포할 라이브러리 개발시
  2. 사내 라이브러리 사용시

▷ Generic Types 실습

▶ 1. 문자/ 숫자/ 불린 기본타입

const getPrimitive = (arg1: string, arg2: number, arg3: boolean): [boolean, number, string] => {
  return [arg3, arg2, arg1];
};
const result1 = getPrimitive("철수", 123, true);
// typeof result1[0] // boolean
// typeof result1[1] // number
// typeof result1[2] // string

▶ 2. any 타입 (그냥 JS와 같음, 사용 지양)

const getAny = (arg1: any, arg2: any, arg3: any): [any, any, any] => {
  console.log(arg1 + 100); // any는 아무거나 다 됨
  return [arg3, arg2, arg1];
};
const result2 = getAny("철수", 123, true);

▶ 3. unknown 타입 (any보다는 안전함, 알려지지 않은 아이니까 정확하게 알고 써야한다.)

const getUnknown = (arg1: unknown, arg2: unknown, arg3: unknown): [unknown, unknown, unknown] => {
  //   console.log(arg1 + 100); // 사용할 수 없음
  if (typeof arg1 === "number") console.log(arg1 + 100);
  return [arg3, arg2, arg1]; // any는 아무거나 다 된다
};
const result3 = getUnknown("철수", 123, true);

▶ 4. generic 타입 - 1 (비교적 안전한 any)

function getGeneric1<MyType1, MyType2, MyType3>(arg1: MyType1, arg2: MyType2, arg3: MyType3): [MyType3, MyType2, MyType1] {
  return [arg3, arg2, arg1]; // any는 아무거나 다 된다
}
const result4 = getGeneric1("철수", 123, true);
// typeof result4[0] // string
// typeof result4[1] // number
// typeof result4[2] // boolean

▶ 5. generic 타입 - 2 (비교적 안전한 any)

function getGeneric2<T1, T2, T3>(arg1: T1, arg2: T2, arg3: T3): [T3, T2, T1] {
  return [arg3, arg2, arg1]; // any는 아무거나 다 된다
}
const result5 = getGeneric2("철수", 123, true);
// typeof result4[0] // string
// typeof result4[1] // number
// typeof result4[2] // boolean

▶ 6. generic 타입 - 3 (비교적 안전한 any)

function getGeneric3<T, U, V>(arg1: T, arg2: U, arg3: V): [V, U, T] {
  return [arg3, arg2, arg1]; // any는 아무거나 다 된다
}
const result6 = getGeneric3("철수", 123, true); // 타입을 추론해준다
// typeof result4[0] // string
// typeof result4[1] // number
// typeof result4[2] // boolean

▶ 7. generic 타입 - 4 (화살표 함수)

const getGeneric4 = <T, U, V>(arg1: T, arg2: U, arg3: V): [V, U, T] => {
  return [arg3, arg2, arg1];
};
const result7 = getGeneric4<string, number, boolean>("철수", 123, true); // generic에서 미리 타입 명시하기 < >
// typeof result4[0] // string
// typeof result4[1] // number
// typeof result4[2] // boolean

📝 Utility Types


interface IProfile {
  name: string;
  age: number;
  school: string;
  hobby?: string;
}

▷ 1. Partial 타입

type aaa = Partial<IProfile>;

▷ 2. Required 타입

type bbb = Partial<IProfile>;

▷ 3. Pick 타입

type ccc = Pick<IProfile, "name" | "age">;

▷ 4. Omit 타입

type ddd = Omit<IProfile, "school">;

▷ 5. Record 타입

type eee = "철수" | "영희" | "훈이"; // Union 타입
let child1: eee = "영희"; // 철수, 영희, 훈이만 가능
let child2: string = "사과"; // 철수, 영희, 훈이, 사과, 바나나 등 모두 가능
type fff = Record<eee, IProfile>; //     철수: boolean; 영희: boolean; 훈이: boolean;

▷ 6. 객체의 key들로 Union타입 만들기

type ggg = keyof IProfile;
let myprofile: ggg = "hobby";

▷ 7. type vs interface 차이

interface IProfile {
  candy: number; // 선언병합으로 추가됨
}

▷ 8. 배운 것 응용

let profile: Partial<IProfile> = {
  candy: 10,
};

📝 몽구스와 타입ORM의 차이


  • 몽고DB는 유연하지만 안정성은 떨어진다.

  • MYSQL은 안정적이지만 유연성은 떨어진다.

오늘의 마무리 👍



  • 복습
  • github 공부
  • 블로그 포스팅
  • 데일리 퀴즈
  • 알고리즘 문제 풀기

항상 겸손한 자세로 배우면서 성장하자, 할 수 있다!! 💪


출처 : 코드캠프

profile
개발자 블로그 / 항상 겸손한 자세로 배우면서 성장하자 할 수 있다!

0개의 댓글