개발일지

사실! 한 해의 회고록을 적는ㄱ ㅔ 처음이다 !! ( 두둥탁 ) 왜 그동안 회고록을 작성해보지 않았을까에 대해 조금 생각해보다가, 2023년도의 얘기도 아닐 뿐더러 그 이유에 대해 생각하고 정리하는 데에 시간을 쓰기보다는 왜 2023년은 다른 해와 달랐을까를 고민해보는 게 더 알맞다고 생각했다. 나에게 2023년이란? 역시 가장 큰 차이는 내가 꿈을 찾았고 하고자 하는 일을 찾았다는 것이 아닐까 물론 정확히 따지자면 찾은 건 2022년 하반기이지만 바빴다. 아무튼 바빴다... 또한 올해에도 감사한 분들을 여럿 만나게 되었고 그분들은 내가 꺾이지 않고 버틸 수 있는 버팀목이 되어 주셨다. 거창하게 얘기했지만 사실 개발을 시작하고서 만나게 된 모든 관련 사람들을 포함한다. ( 이제는 더 이상 개발자의 길을 ..

클래스 Class 타입스크립트에서는 클래스의 필드를 선언할 때 타입 주석으로 타입을 함께 정의해주어야 한다. 그렇지 않으면 함수 매개변수와 동일하게 암시적 any 타입으로 추론된다 => stric : true에서 오류 발생 ! + 생성자에서 각 필드의 값을 초기화 하지 않을 경우 초기값도 함께 명시 필요 class Student { // 필드 name: string = ""; age: number = 0; position: string = ""; // 메서드 work() { console.log("공부함"); } } 만약 아래와 같이 생성자 함수에서 필드의 값들을 잘 초기화해뒀다면 필드 선언 시의 초기값은 생략 가능하다 class Student { // 필드 name: string = ""; age: n..

인터페이스 ( Interface ) 인터페이스란 타입 별칭과 동일하게 타입에 이름을 지어주는 또 다른 문법이다. 정의한 인터페이스를 타입 주석과 함께 사용하여 변수의 타입을 정의할 수 있다. 인터페이스는 일반적으로 타입 체크를 위해 사용되며 변수, 함수, 클래스에 사용할 수 있다. 인터페이스는 여러가지 타입을 갖는 프로퍼티로 이루어진 새로운 타입을 정의하는 것과 유사하다. 인터페이스에 선언된 프로퍼티 또는 메소드의 구현을 강제하여 일관성을 유지할 수 있도록 한다. // 이렇게 인터페이스로 간단하게 Person객체 정의를 해두면 interface Person { name: string; age: number; } // 정의한 인터페이스를 타입 주석과 함께 사용하여 변수 타입 정의 가능 const perso..

함수 오버로딩 함수 오버로딩이란 하나의 함수를 매개변수의 개수나 타입에 따라 다르게 동작하도록 만드는 문법 파라미터의 형태가 다양한 여러 케이스에 대응하는 같은 이름을 가진 함수를 만드는 것 ! function 키워드로만 함수 오버로딩을 할 수 있으며 arrow function으로는 오버로딩을 할 수 없다. ! 타입스크립트에서 함수 오버로딩을 구현하려면 먼저 다음과 같이 버전별 오버로드 시그니쳐를 만들어 줘야 한다. 선언부에서는 가능한 매개변수 타입만 지정해주고 함수 구현은 구현부에서만 이루어진다. // 버전들 -> 오버로드 시그니쳐 : 구현부 없이 선언부만 만들어둔 함수 function func(a: number): void;// 매개변수를 1개만 받는 버전 function func(a: number,..

함수 타입의 호환성이란? 함수 타입의 호환성이란 특정 함수 타입을 다른 함수 타입으로 할당이 가능한지를 나타내는 것이다. 함수 타입의 호환성 판단 기준 두 함수의 반환값 타입이 호환되는가? 두 함수의 매개변수의 타입이 호환되는가? 1. 반환값 타입의 호환 가능 여부 A 반환값 타입이 B 반환값 타입의 슈퍼타입이라면 두 타입은 호환된다. type A = () => number;// Number type B = () => 10;// Number Literal let a: A = () => 10; let b: B = () => 10; a = b; // ✅ b = a; // ❌ 2. 매개변수 타입의 호환 가능 여부 a. 매개변수의 개수가 같을 때 두 함수 타입 C와 D가 있다고 가정할 때 C 매개변수의 타입이 ..

함수 타입 표현식 함수 타입을 타입 별칭과 함께 별도로 정의 가능한데, 이것을 함수 타입 표현식( Function Type Expression ) 이라고 부른다. 함수 타입 표현식을 이용하면 선언 및 구현 코드와 타입 선언 분리가 가능하여 유용하다 type Add = (a: number, b: number) => number; const add: Add = (a, b) => a + b; 만약 여러 개의 함수가 존재하는데 동일한 타입을 갖고 있다면? const add = (a: number, b: number) => a + b; const sub = (a: number, b: number) => a - b; const multiply = (a: number, b: number) => a * b; const..

함수의 타입을 정의하는 방법 JS에서 함수를 사용할 때에는 어떠한 매개변수를 받고 어떤 결과값을 반환하는지 알려준다 function func(a, b) { return a + b; } TS에서도 동일하게 함수를 사용한다. 어떤 타입의 매개변수를 받고 어떤 타입의 값을 반환하는지만 추가해주면 된다 function func(a: number, b: number): number { //function func(a: number, b: number) 이렇게 생략도 가능 ( 자동타입추론 ) return a + b; } 화살표 함수도 동일하게 사용 const add = (a: number, b: number): number => a + b; // const add = (a: number, b: number) => ..

TS의 모든 타입들은 집합으로써 서로 포함하고 포함되는 관계를 갖는다. 이러한 관계에서 다음의 그림과 같이 다른 타입을 포함하는 타입을 Spuer Type ( 부모 타입 ) 이라고 하고 반대로 다른 타입에 포함되는 타입을 Sub Type ( 자식 타입 ) 이라고 한다. 이전 글(Typescript의 기본 타입.https://puringles.tistory.com/636)에서 봤던 타입 계층도가 결국 이러한 집합 관계에 있는 타입들을 계층도 형식으로 나타낸 것이다. 그래서 우리는 이러한 관계들을 어떻게 이용할 수 있을까? 타입 호환성 ( Type Compatibility ) A와 B타입이 있을 때 A타입의 값을 B타입으로 취급해도 괜찮은지 판단하는 것 EX) Number 타입과 Number Literal ..