@2023/09/19 안녕하세요 lika-7입니다이번 시간에는 TypeScript의 함수 작성에 this 키워드 명시 방법에 대하여 정리 하겠습니다명시적 this란💡함수나 메서드 내에서 this 키워드가 어떤 객체를 가리키는지를 명시적으로 지정하는 것을의미합니다✅JavaScript에서 this는 실행 컨텍스트에 따라 동적으로 결정되기 때문에 때로는 예측하기 어려울 수 있습니다 그러나 TypeScript에서는 명시적으로 this를 사용하여 코드를 더 예측 가능하게 만들 수 있습니다.명시적 this를 사용하는 주요 방법//TypeScript interface Cat { name: string age: number } const cat:Cat= { name: 'Lay', age: 25 } function he..

@2023/09/19 안녕하세요 lika-7입니다이번 시간에는 TypeScript의 객체 선언에 “type”을 쓸지 “interface”를 쓸지 정리하였습니다질문객체 데이터 타입을 지정 할 때 type을 쓸지 interface를 쓸지 모르겠습니다!문법의 차이✅1. type에는 할당 연산자 를 사용하고 괄호 입력 합니다 2. interface에는 할당연산자 안쓰고 괄호 입력 합니다type//TypeScript type TypeUser = { name: string age: number isValid: boolean }type을 썼을 때//TypeScript type TypeUser = { name: string age: number isValid: boolean } const heropy: TypeUser..

@2023/09/19 안녕하세요 lika-7입니다이번 시간에는 TypeScript의 타입 별칭(alias)에 대하여 정리하겠습니다 type alias - 타입 별칭💡타입 별칭은 특정 타입이나 인터페이스를 참조할 수 있는 타입 변수를 의미 합니다. 타입의 별명 정도로 생각하면 좋습니다 키워드 type 언제 사용하면 되나?//typescript type TypeA = string type TypeB = string | number | boolean💡TypeA 같은 단일 타입에 별칭을 사용하는 것 보다 TypeB 같은 복합 타입에 별칭을 사용하는것이 적합합니다. 유니온(OR, “|”), 인터렉션(AND, “&”)된 타입에 사용하기 적합합니다💡원하는 타입에 이름을 부여할수 있고, 재사용이 가능합니다사용 예제 1..

@2023/09/18 안녕하세요 lika-7입니다이번시간에는 저번시간에 이어 Interface의 확장(상속) 대해 정리하겠습니다 Interface extends💡클래스를 상속하는 클래스가 있듯이, 인터페이스 또한 extends 키워드를 사용해 인터페이스를 확장 할 수 있습니다 키워드 extends 사용 예제패턴 1//TypeScript //인터페이스 확장(상속) interface UserA { name: string age: number } interface UserB extends UserA { //extends 키워드를 통해서 내용을 상속 받음 isValid: boolean } const heropy: UserA = { name: 'heropy', age: 28, isValid:true // 에러가 ..

@2023/09/18 안녕하세요 lika-7입니다오늘은 저번시간에 이어 Interface의 Index Signature 에 대해 정리합니다Interface - 함수 이후의 내용을 다룹니다인덱스 시그니처💡객체의 속성을 동적으로 정의하는 인덱스 시그니처 키워드 [ ] { [인덱스_이름: 인덱스_타입]: 값_타입; } 왜 쓰나요?객체가 key, value 형식이며 key와 value의 타입을 정확하게 명시해야 하는 경우 사용할수 있습니다.사용 예제배열에서 사용법//TypeScript // 인터페이스 // 인덱스 기능 타입 - 인덱스 시그니처(Index Signature) //배열 interface Fruits{ [item: number]: string // 인덱스 시그니처 부분 } const fruits: F..

@2023/09/18 안녕하세요 lika-7입니다이번시간에는 this가 무엇인지 정리하겠습니다this를 볼때마다 내 표정this가 들어간 코드를 볼 때마다 이게 무엇인지 모르겠습니다.이에 관련한 내용을 찾아봐도 이해하기 어렵더군요…나름 이해하기 쉽게 정리해보겠습니다JavaScript에서 this는JavaScript에서 this는 현재 실행중인 코드에서 참조하는 객체를 나타냅니다. this는 다양한 상황에서 동적으로 결정되어 다른 값을 가질 수 있습니다💡this 값은 호출한 코드 블럭 또는 함수와 호출 컨텍스트에 의존합니다.전역 컨텍스트(Global Context)에서 this컨텍스트란💡실행 컨택스트란 코드가 실행되는 환경으로 이해 할 수 있습니다//JavaScript console.log("전역 컨텍스트..

@2023/09/18 안녕하세요 lika-7입니다이번시간에는 스코프가 무엇인지 정리하겠습니다스코프란💡스코프(scope)란 우리말로 번역하면 ‘범위’라는 뜻을 가지고 있습니다. 즉, 스코프란 ‘변수에 접근 할 수 있는 범위’ 라고 할수 있습니다스코프 스코프 타입은 2가지가 있습니다전역(global) 타입전역 스코프(Global Scope)는 전역에 선언되어 있어서 어느 곳에서든 해당 변수에 접근 할 수 있다는 의미 입니다.//JavaScript const globalVariable = 'I am a global variable'; function globalFunction() { console.log(globalVariable); // 전역 스코프에서의 변수 접근 } globalFunction();glob..

@2023/09/17 안녕하세요 lika-7입니다오늘은 저번시간에 이어 Interface의 함수에 대해 정리하겠습니다Interface - 기본 이후의 내용을 다룹니다호출 시그니처💡인터페이스에서 소괄호를 작성해서 내용을 시작하는 것을 호출 시그니처라고 합니다✅1. 소괄호를 통해 함수의 타입을 지정 할 수 있습니다 2. 이를 이용해 함수 타입의 인터페이스를 만듭니다//TypeScript interface GetName{ (message:string): string //message라는 매개변수의 타입은 string이고, 반환타입도 string이다 }GetName의 호출 시그니처를 만들고message라는 매개변수의 타입은 string이고, 반환타입도 string이다는 의미왜 씀?나중에 같은 모양의 함수가 나오..