TypeScript_ 5. タイプスクリプトタイプ

13364 ワード
テキストリンク
◼ Typescript Type
  • number => 100, 0.3 , -2
  • string => 'hello', "hello", ` hello``
  • boolean => true, false
  • object => {name:string,age:number}
  • array => Array , [] , Array, (string|number)[]
  • tuple => [string,number,undefined]
  • enum => enum Role {ADMIN,READ_ONLY,AUTHOR} // 0,1,2
  • any=>すべてのタイプ
    ✔タイプ例
    ◾ number
    //변수 number 정의 
const num : number =10 ;
//함수로서 number 정의
const add =(a:number,b:number) => a+b
const result1 = add(10,50) //60
const result2 = add('hello',10) // Type error
    ◾ string
    let str: string = 'hi';
const strFunc=(name :string) => `hello ${name}`
    ◾ boolean
    let str: boolean = 'hi';
const strFunc=(name :string) => `hello ${name}`
    ◾ object
    const user :{
	name : string, 
    age:number,
    hobbies:string[]
} = {
   name: "john",
    age: 30,
    hobby: ["sports", "surf"]}
    最初の変数はタイプを指定する必要はありませんが、JavaScriptが独自に決定します.
    ◾ array
    配列はジェニーリックと定義することもできます.
    const arr1 : string[] = [];
const arr2 :Array<string> = [];
//string타입으로 이루어진 배열이고 기본값은 []임.
const arr1 : (string | numner)[] =[1,'hello'];
const arr2 : Array<string |number> = [1,'hello'];
//string or number로 이루어진 배열이고 기본값은 [1,'hello']
let arr3 : (string | number)[] | undefined;
//string or number로 이루어진 배열이거나 undefined
    ◾ tuple
    tupleは배열의 길이가 고정であり、各要素に指定されたタイプの配列フォーマットがあることを意味する.
    let arrType : ['string',number] = ['hello',2]
// 첫번째 배열 index에는 무조건 string, 두번째에는 number가 들어가야 함. 
// 기본 배열도 type에 맞게 지정해줘야 함.
    タイプが指定されていないと悲しいです
    arrType[2] = 'add items';
//Type error
    ◾ enum
    これは他の言語でよく見られるタイプです.특정 값의 집합です.
      enum Role {ADMIN, AUTHOR, USER}
const user =  {
  name:'john',
  age:30,
  hobbies:['surf','cooking'],
  role:Role.USER
  }
  console.log(user.role) // 2
    インデックスは、アクセスまたは変更することもできます.
     enum Role {ADMIN=4, AUTHOR=5, USER=6}
 const role = Role[0]
 console.log(role) // 4
    ◾ any어떤 타입이던지 모두 허용한다는 의미를 갖고 있는 타입.厳格に使用されるタイプのスクリプトでは、乱用するとタイプスクリプトの意味は消えますが、javascriptによって実現される웹 서비스 코드에 타입스크립트를 점진적으로 적용할 때 활용하면 좋은 타입です.
    ◾ void
    変数はundefinedとnullのみが割り当てられ、関数は戻り値を設定できません.
      const unUseful:void = undefined;
  const testFunc= (s : string):void => {
  	if(typeof s === string){
  	console.log('s is string')
  }
  }
  //반환값이 없는 함수의 return 타입을 지정할 때 사용한다.
    ✔Type scriptフィーチャー
  • 静的タイプTypescript
    • タイプスクリプトはstatic scriptです.タイプスクリプトをコンパイルしてjsに変換すると、タイプがすべて失われ、es 5 jsに変換されていることがわかります.
    これは、開発中に終了する変数とパラメータのタイプを定義することを意味します.
    JavaScriptオブジェクトを作成するのではなく、処理中のオブジェクトをタイプスクリプトに理解させるタイプスクリプトの表現にすぎません.
    ✔Type scriptのメリット
  • タイプを決定することによって、拡張された関数およびコードを作成することができる.
    • タイプスクリプトは、変数と関数のタイプを指定することでコードの作成を支援します.このタイプを使用すると、条件文で他のリターンを得ることができます.
    次の位置は、深化したTypescriptに位置付けられます.
    [アルゴリズム/標準]9009号:フィボナッチ(python)
    nvl COALESCE ifnull用法(転載)