전체 글

인터페이스 상속인터페이스 상속으로 인한 타입 정의를 확장하는 방법.javascript 에서 클래스로도 상속을 구현할 수 있다// ClassClass Person { constructor(name, age) { this.name = name; this.age = age; } logAge() { console.log(age); }}Class Developer extends Person { constructor(name, age, skill) { super(name, age); this.skill = skill; } logDeveloperInfo() { this.logAge(); ..

협업 중 커밋 메시지는 어떠한 기능을 만들고 무엇을 수정하였는지 쉽게 알아보고 찾을 수 있도록 커밋 메시지 컨벤션이 중요하다고 생각합니다. Commit TypeTag NameDescriptionFeat새로운 기능을 추가Fix버그 수정DesignCSS 등 UI 디자인 변경Style코드 포맷 변경, 세미 클론 누락, 코드 수정이 없는 경우Docs문서 수정Refactor코드 리팩토링Comment필요한 주석 추가 및 변경Test테스트 코드, 리팩토링 테스트 코드 추가Chore빌드 업무 수정, 패키지 매니저 수정, 패키지 관리자 구성 등 업데이트, Production Code 변경 없음Rename파일 혹은 폴더명을 수정하거나 옮기는 작업의 경우Remove파일을 삭제하는 작업만 하는 경우예시[Feat] 로그인 기능..

타입스크립트에서 인터페이스란?객체의 타입을 정의할 때 사용하는 문법인터페이스로 타입을 정의할 수 있는 것객체의 속성과 속성 타입함수의 파라미터와 반환 타입함수의 스펙 (파라미터 개수와 반환값 여부 등)배열과 객체를 접근하는 방식클래스객체타입 정의let minki = { name: "민기", age: 29};interface User { name: string, age: number}let minki: User = { name: "민기", age: 29};// 인터페이스에 정의하지 않은 속성이 있거나 속성의 타입이 다른 경우 에러let minki: User = { name: "민기", age: "29"};let minki: User = { name: "민기", age: 29, hobby: "음악..

개요vue 에서 쉽게 세션을 저장하고 가져오는 라이브러리인 vue-sessionstorage를 사용하였는데 구동방식을 보니 초기 진입시 sessionKey라는 난수를 설정하고 해당 난수로 data 들을 오브젝트 형태로 저장하는 구조였다. 하지만 가끔 sessionKey 값을 초기에 세팅하지 않는 오류가 발생하여 해당 세션 data에 정상적으로 접근을 못하여 라이브러리를 걷어내고 web에서 자체 지원하는 web api 를 사용해 비슷한 구조를 만들기로 했다.전역함수로 만들 js 파일 만들기// session.jsexport default { install(Vue) { Vue.prototype.$sessionSet = (key, value) => { const payload..

:을 이용하여 자바스크립트 코드에 타입을 정의하는 방식을 타입 표기(Type Annotation) 이라고 한다.String타입이 문자열인 경우 아래와 같이 선언// 변수const str: string = "hello";// 함수function getStr(str: string): string { return str;}console.log(getStr("hi"));Number타입이 숫자인 경우 아래와 같이 선언// 변수const num: number = 1;// 함수function sumNumber(num1: number, num2: number): number { return num1 + num2;}console.log(sumNumber(1,2));Boolean진위 값인 경우 아래와 같이 선언let ..

Typescript (Type System + Javascript)자바스크립트의 superset 언어예측가능하고 안전하다 (에러사전 방지)브라우저에서 실행하기 위해서는 ts 파일을 js 파일로 변환해줘야 한다 (compile)// jsfunction sumNumber(fistNumber, secondNumber) { return fistNumber + secondNumber;}console.log(sumNumber(1,2); // 3 (number)console.log(sumNumber("1","2"); // "12" (string)// tsfunction sumNumber(firstNumber: number, secondNumber: number): number { return fistNum..