흰둥씨의 개발장

npm install typescript @types/node @types/react @types/react-dom @types/jest ㄴreact 모듈 설치후 위 명령어 입력 js 파일 => .ts jsx파일 => .tsx interface IProps { word : IWord; } export interface IWord { //export하면 다른 파일에서도 IWord사용가능 day: string; eng: string; kor: stirng; isDone: boolean; id:number; } export default function Word ({word : w} : IProps) { //{word:w}의 타입을 IProp로 정의 (...) } import Word, {IWord} from..

Partial interface User{ id:number; name:string; age:number; gender: "m" | "f"; } /* let admin :User = { id:1, name:"bob", } 위와 같이 입력하면 age와 gender 속성을 입력하지 않아서 에러뜸 아래와 같이 partial을 이용하면 interface의 속성에 ?: (optional)로 지정한것 과 같음 */ //interface User{ //id?:number; //name?:string; //age?:number; //gender?: "m" | "f"; //} let admin : Partial = { id:1, name:"bob", //age랑 gender가 없어도 에러 안뜸 } Required int..

함수 function getSize (arr:T[]) :number{ //으로 구성된 배열을 매개변수로 받고, //리턴값은 항상 number로 함 return arr.length } const arr1 = [1,2,3]; getSize(arr1); //3 const arr2 = ["a","b","c"]; getSize(arr2); //3 const arr3 = [true, false, true]; getSize(arr3); const arr4 = [{name:"Hyo"}, {key:"1"}, {cat:"jr"}]; getSize(arr4); 객체 interface Mobile { name:string; price:number; option:T; } const m1 :Mobile = { name:"uni1..

접근제한자 (Access modifier) - public ㄴ자식클래스나 클래스 인스턴스에서 접근가능 ㄴ아무것도 안적혀있으면 모두 public으로 간주됨 -private ㄴ본인 클래스 내부 에서만 접근가능 ㄴ자식클래스 내부에서 사용할 수 없음 ㄴ변수앞에 #붙이면 private으로 처리됨 -protected ㄴ자식클래스에서 접근가능 ㄴ클래스 인스턴스에서 접근 불가 class Car { protected cat:string = "lovely"; private price : string = '1million'; #path : string = ''; //#은 private과 동일한 표기 readonly middlename : string = "hyo"; readonly lastname : string = "su..

리터럴 //리터럴 const userName1 = "Bob"; //username1은 "Bob" let userName2 = "tom"; //username2는 string으로 뜸 // userName2 = 1; // let으로 선언된 변수임에도 에러남 : 초기에 할당된 값이 string이어서 //숫자넣고 싶으면 아래와 같이 명시적 작성 해야함 let userName3: string | number = "Jane"; userName3 = 1; userName3 + 1 ;// 불가 string | number + 1은 허용 안되고 있음 (Narrowing으로 해결가능 : 함수 포스트참고) type Job = "police" | "developer" | "teacher"; //Job은 3가지로만 입력가능 i..

"변수 ?: 타입" 의 의미 ㄴ> 변수 : 타입 | undefined와 같음 string + number (가능) number + number (가능) (string | number) + number (불가능) => 유니온 타입은 타입이 확실하지 않다고 처리해서 더하기 연산 불가 function add (x :number | string) { if(typeof x === 'number'){ //narrowing : 애매한 유니온타입의 연산시 미리 검사해줘야 함 console.log(x + 1); } } 매개변수, 리턴값에 대한 타입지정 / 매개변수를 옵셔널하게 지정할 때 //함수 function addCalc (num1:number, num2:number):number {//():타입은 리턴값에 대한 타..

타입시스템 - 정적 타입시스템 : C, JAVA, 코드 실행이전 변수의 타입을 고정적으로 결정함 - 동적타입 시스템 : python, Javascript, 코드 실행하고 나서 그때마다 유동적으로 변수의 타입을 결정함 https://www.typescriptlang.org/ Javascript는 동적언어로 런타임에 타입이 결정됨 / 런타임에 오류를 발견함 => 사용자가 오류같은 걸 고스란히 볼수 있음 변수의 타입이 하나로만 고정되지 않음 => 오류를 좀 내줘야 하는데 그냥 실행되어 버림(예기치 못한 오류) Java는 정적언어로 컴파일 타임에 타입 결정함 / 컴파일 타임에 오류를 발견함 => 실행전 에러인지하기 좋음 코드 실행 전 모든 변수의 타입을 결정함 (유연하지 못함) Typescript는 동적타입 시..