[TS]基本文法練習(1)

15865 ワード


optional Properties

interface Config {
  color: string,
  width?: number
}

function createSqure(config: Config): { color: string; area: number } {
  return {
    color: config.color,
    area: 100 * (config.width ? config.width : 1), 
  }
}

const config = {
  color : 'red'
};

createSqure(config);
width propertyをoptional propertyに変更したため、configオブジェクトの作成時にcolor propertyのみを定義してもエラーは発生しません.

拡張インタフェース

interface Animal {
  makeSound(): void
}

interface Dog extends Animal {  
  run(): void
}

class BullDog implements Dog {
    makeSound(): void {
        console.log('멍멍');
    }
    
    run(): void {
        console.log('달리기');
    }
}

const bullDog = new BullDog();
bullDog.makeSound(); // 멍멍 출력
bullDog.run(); // 달리기 출력
DogインタフェースにはAnimalインタフェースが拡張され,BullDogクラスでDogが実装されているため,クラス内部ではmakeSound(),run()メソッドを実装しなければならない.

Generic class

class Stack<T> {
  private data: Array<T> = [];
  
  push(item: T) {
    this.data.push(item);
  }
  
  pop(): T | undefined {
    return this.data.pop();
  }
}

const numberStack = new Stack<number>();

numberStack.push(100);
console.log(numberStack.pop());
Genericを使用すると、コンパイル時にタイプを適用し、番号または他のタイプのみを許可するスタックを生成できます.
popメソッドの戻りタイプにundefinedが追加され、スタックが空の場合を考慮します.

Generic制約


Genericを使用して特定のプロパティのみを許可することもできます.
const printMessage = <T extends string | number | boolean>(message: T): void => {
    console.log(message);  
}

printMessage<number>(5);

printMessage<boolean>(true);
// [Errors in code]
// Type 'boolean' does not satisfy the constraint 'string | number'.
extendsキーワードはstringおよびnumberタイプに制限できます.
booleanタイプは許可されていないためエラーです.
基本タイプに加えて、インタフェースを使用して制限することもできます.
interface Lengthwise {
  length: number;
}

function loggingIdentity<T extends Lengthwise>(arg: T): T {
  console.log(arg.length);
  return arg;
}

loggingIdentity(3);
c
// Argument of type 'number' is not assignable to parameter of type 'Lengthwise'
loggingIdentity({ length: 10, value: 3 });

Using Type Parameters in Generic Constraints


keyofキーワードを使用すると、以下のように制限されたタイプパラメータを他のタイプパラメータで宣言できます.
一例として、オブジェクトタイプパラメータを使用して制限されたタイプパラメータを宣言する例を以下に示します.
function getProperty<Type, Key extends keyof Type>(obj: Type, key: Key) {
  return obj[key];
}
 
let x = { a: 1, b: 2, c: 3, d: 4 };
 
getProperty(x, "a");


getProperty(x, "m");
// [Errors in code]
// Argument of type '"m"' is not assignable to parameter of type '"a" | "b" | "c" | "d"'.
変数xタイプの場合、mというpropertyは存在しないため、エラーが発生します.

Reference

  • https://www.typescriptlang.org/docs/handbook/2/generics.html