Web Design Leaves

function printId(id: string | number) {
  console.log(id.toUpperCase());  // コンパイルエラー
  /* Property 'toUpperCase' does not exist on type 'string | number'.
     Property 'toUpperCase' does not exist on type 'number'. */
}

function printId(id: number | string) {
  // typeof を使って型を判定
  if (typeof id === "string") {
    // ここでは id は string 型に絞り込まれている
    console.log(id.toUpperCase());
  } else {
    // ここでは id は number 型になる
    console.log(id);
  }
}

type Size = 'small' | 'medium' | 'large';

const setSize = (size: Size) => {
  console.log(`The size is ${size}`)
}

setSize('small'); // OK
setSize('M'); //
// Argument of type '"M"' is not assignable to parameter of type 'Size'.

// 色のリテラル型のユニオン型を定義
type Color = 'red' | 'blue' | 'green';

// サイズのリテラル型のユニオン型を定義
type Size = 'small' | 'medium' | 'large';

// 商品の型を定義（ユニオン型を使用）
type Product = {
  name: string;
  color: Color;
  size: Size;
};

// 商品の配列を作成
const products: Product[] = [
  { name: 'Shirt', color: 'blue', size: 'medium' },
  { name: 'Dress', color: 'red', size: 'large' },
  { name: 'Shoes', color: 'green', size: 'small' },
];

// 特定の条件に合致する商品をフィルタリングする関数
function filterProducts(products: Product[], color: Color, size: Size): Product[] {
  return products.filter(product => product.color === color && product.size === size);
}

// フィルタリングの例
const filteredProducts = filterProducts(products, 'blue', 'medium');
console.log(filteredProducts);  //{ name: 'Shirt', color: 'blue', size: 'medium' }

type Greeting = `Hello, ${string}!`;

const hello1: Greeting = 'Hello, world!'; // OK
const hello2: Greeting = 'Hello, Foo!'; // OK
const hello3: Greeting = 'Hello, Bar'; // コンパイルエラー（! がないので代入できない）
// Type '"Hello, Bar"' is not assignable to type '`Hello, ${string}!`'.

type Color = 'red' | 'green' | 'blue';
type RGBColor = `${Color}(${number}, ${number}, ${number})`;

const myColor1: RGBColor = 'red(255, 0, 0)';
const myColor2: RGBColor = 'green(0, 128, 0)';

// 文字列リテラル型（ユニオン型）
type Greeting = "Hello," | "Hi," | "Hey,";

// テンプレートリテラル型
type GreetingToPerson<T extends string> = `${T} ${string}!`;

// 使用例
const greetingToFoo: GreetingToPerson<Greeting> = "Hello, Foo!";
const greetingToBar: GreetingToPerson<Greeting> = "Hi, Bar!";

function hello(name: string): `Hello, ${string}!` {
  return `Hello, ${name}!`;
}

let helloFoo = hello('Foo');
helloFoo = "Hello, Bar!"; // OK
helloFoo = "Hello!" // コンパイルエラー（Hello, ${string}! の形ではない）
// Type '"Hello!"' is not assignable to type '`Hello, ${string}!`'.

function hello(name: string) {
  return `Hello, ${name}!` as const;
}

function hello<T extends string>(name: T): `Hello, ${T}!` {
  return `Hello, ${name}!`;
}

let helloFoo = hello('Foo');
helloFoo = "Hello, Foo!"; // OK
helloFoo = "Hello, Bar!" // コンパイルエラー（Hello, Foo! 型ではない）
// Type '"Hello, Bar!"' is not assignable to type '"Hello, Foo!"'.

const x = "hello"; // x は hello 型（リテラル型）となる
let y = "hello"; // y は string 型となる
let z: "hello" = "hello"; // z は hello 型（リテラル型）となる

const obj = { prop: "hello" };
obj.prop = "world"; 

const obj: { prop: "hello" } = { prop: "hello" };
obj.prop = "world";  // コンパイルエラー（"world" は "hello" 型に代入できない）

type Obj = {
  prop: "hello";
};

const obj: Obj = { prop: "hello" };
obj.prop = "world";  // コンパイルエラー（"world" は "hello" 型に代入できない）

const x = "hello";  // widening されるリテラル型
let hello1 = x;  // hello1 は string 型
hello1 = "world";  // OK

const y : "hello" = "hello";  // widening されないリテラル型
let hello2 = y;  // hello1 は hello 型（リテラル型）
hello2 =  "world";  // コンパイルエラー（"hello" 以外は代入できない）

console.log(typeof "foo"); // "string"
const num = 5;
console.log(typeof num);; // "number"
console.log(typeof (num === num)); // "boolean"
console.log(typeof {foo: 'bar'});; // "object"
console.log(typeof ["foo","bar"]); // "object"（配列もオブジェクト）
function foo():string {return "foo"};
console.log(typeof foo); // "function"
console.log(typeof undefined); // "undefined"
console.log(typeof null); // "object"

function func(value: number | string) {
  if (typeof value === 'number') {
    // ここでは value は number 型に絞り込まれる
    console.log(value.toFixed(2));
  } else {
    // ここでは value は string 型に絞り込まれる
    console.log(value.toUpperCase());
  }
}

function func(value: number | string) {
  console.log(
    typeof value === 'number' ? value.toFixed(2): value.toUpperCase()
  );
}

function hello(x: string[] | string) {
  if (Array.isArray(x)) {
    // ここでは x は string[]
    console.log(`Hello, ${ x.join(" and ")}!`);
  } else {
    // ここでは x は string
    console.log(`Hello, ${x}!`);
  }
}

hello(['Foo', 'Bar', 'Baz']);  // Hello, Foo and Bar and Baz!
hello('Foo');  // Hello, Foo!

function hello(x: string[] | string) {
  if (x instanceof Array) {
    console.log(`Hello, ${ x.join(" and ")}!`);
  } else {
    console.log(`Hello, ${x}!`);
  }
}

class Animal {
  move() {
    console.log("Moving...");
  }
}

class Bird extends Animal {
  fly() {
    console.log("Flying...");
  }
}

function moveAnimal(animal: Animal): void {
  if (animal instanceof Bird) {
    // animal は Bird クラスのインスタンスとして絞り込まれる
    animal.fly();
  } else {
    // animal は Animal クラスのインスタンスとして絞り込まれる
    animal.move();
  }
}

const animal = new Animal(); // Animal クラスのインスタンス
const bird = new Bird(); // Bird クラスのインスタンス

moveAnimal(animal);  // Moving...
moveAnimal(bird);  // Flying...

type Human = {
  name: string;
  age: number;
}

type Pet = {
  name: string;
}

type FamilyMember = Human | Pet;

function getAge(member: FamilyMember): number | string {
  if('age' in member) {
    // age プロパティを持っているので member は Human
    return member.age;
  }else{
    return 'age is unknown';
  }
}

const foo: FamilyMember = {
  name: 'Foo',
  age: 25,
}
const tama: FamilyMember = {
  name: 'Tama'
}

console.log(getAge(foo));  // 25
console.log(getAge(tama));  // age is unknown

function printLength(value: string | string[] | null | undefined) {
  if (value !== null && value !== undefined) {
    // value は null でも undefined でもない（value は 文字列または配列に絞り込まれる）
    console.log(value.length); // length は文字列にも配列にもある
  } else {
    console.log('値が存在しません');
  }
}

printLength('foo'); // 3
printLength(['foo', 'bar']); // 2
printLength(null); // 値が存在しません
printLength(undefined); // 値が存在しません

function func(value: number | null | undefined) {
  // value が null または undefined でない場合に絞り込まれる
  const result = value ?? 0;
  // result は引数に与えられた数値または 0
  console.log(result.toFixed(2));
}

func(12.345); // 12.35
func(0); // 0.00
func(null); // 0.00
func(undefined); // 0.00

function func(value: number | null | undefined) {
  // value が null または undefined でない場合に絞り込まれる
  value ??= 0;
  // value は引数に与えられた数値または 0
  console.log(value.toFixed(2));
}

func(12.345); // 12.35
func(0); // 0.00
func(null); // 0.00
func(undefined); // 0.00

type Circle = {
  kind: 'circle'; // タグとしての役割を果たすプロパティ（文字列リテラル型）
  radius: number;
}

type Square = {
  kind: 'square'; // タグとしての役割を果たすプロパティ（文字列リテラル型）
  sideLength: number;
}

type Shape = Circle | Square;

function getArea(shape: Shape): number {
  if(shape.kind === 'circle') {
    // shape は Circle クラスのインスタンスとして絞り込まれる
    return Math.PI * shape.radius ** 2;
  } else {
    // shape は Square クラスのインスタンスとして絞り込まれる
    return shape.sideLength ** 2;
  }
}

const circle1: Shape = {
  kind: 'circle',
  radius: 10
}

const square1: Shape = {
  kind: 'square',
  sideLength: 20
}

console.log(getArea(circle1));  // 314.1592653589793
console.log(getArea(square1));  // 400

function getArea(shape: Shape): number {
  switch (shape.kind) {
    case 'circle':
      return Math.PI * shape.radius ** 2;
    case 'square':
      return shape.sideLength ** 2;
  }
}

const obj = {
  name: 'foo', // name プロパティは string 型と推論される
  value: 123 // value プロパティは number 型と推論される
};

type ObjectName = typeof obj.name; // typeof obj.name は string 型
const propName: ObjectName = 'abc'; // string 型
const propValue: typeof obj.value = 777; // number 型

const obj = {
  name: 'foo',
  value: 123
};

// obj の型を取得
type Obj = typeof obj; // { name: string; value: number; }

// lookup 型（Obj は obj の型）
type ObjectName = Obj['name']; // string

const propName: ObjectName = 'abc'; // string 型
const propValue: Obj['value'] = 777; // number 型

const obj = {
  name: 'foo',
  value: 123
};

type ObjectName = typeof obj['name'];
const propName: ObjectName = 'abc'; // string 型
const propValue: typeof obj['value'] = 777; // number 型

const obj = {
  name: 'foo',
  value: 123
};

type ObjUnion = typeof obj.name | typeof obj.value;  // string | number
const foo: ObjUnion = 'abc';
const bar: ObjUnion = 123;

type ObjUnion = typeof obj['name'|'value'];  // string | number

const user = {
  name: 'Foo',
  id: 1,
  age: 22,
  email: 'foo@example.com'
};

type UserUnion = typeof user['name'|'id'|'age'|'email'];  // string | number

const user = {
  name: 'Foo',
  id: 1,
  age: 22,
  email: 'foo@example.com'
} as const;

type UserUnion = typeof user['name'|'id'|'age'|'email'];
// type UserUnion = "Foo" | 1 | 22 | "foo@example.com"

type UserUnion = typeof user[keyof typeof user];
// UserUnion は "Foo" | 1 | 22 | "foo@example.com"

type UserKeys = keyof typeof user
// UserKeys は "name" | "id" | "age" | "email"

type UserUnion = typeof user[UserKeys];
// UserUnion は "Foo" | 1 | 22 | "foo@example.com"

const arr =['abc', 123, true];

type ArrUnion = typeof arr[number];  // または (typeof arr)[number]
// type ArrUnion = string | number | boolean

type Arr = typeof arr[1]; // これでも同じユニオン型が取得される
// type Arr = string | number | boolean

const directions = ['north', 'south', 'east', 'west'] as const;

type Direction = typeof directions[number]; // または (typeof directions)[number]
// type Direction = "north" | "south" | "east" | "west"

const animals = [
  { species: 'cat', name: 'Tama' },
  { species: 'dog', name: 'Pochi' },
  { species: 'mouse', name: 'Chutaro' }
] as const;

type Animal = typeof animals[number]['species'];
// type Animal = "cat" | "dog" | "mouse"
type AnimalName = typeof animals[number]['name'];
// type AnimalName = "Tama" | "Pochi" | "Chutaro"

const user = {
  name: 'foo',
  id: 1
}

type UserKeys = keyof user; // コンパイルエラー
// 'user' refers to a value, but is being used as a type here. Did you mean 'typeof user'?

type UserKeys = keyof typeof user;  // "name" | "id"

type User = typeof user; // {name: string; id: number;}
type UserKeys = keyof User;  // "name" | "id" 

const unit = {
  mm: 1,
  cm: 10,
  m: 1000,
  km: 1000000
}

type UnitKey = keyof typeof unit; // 単位の型 "mm" | "cm" | "m" | "km"

function convertUnit(value: number, from: UnitKey, to: UnitKey) {
  const converted = value * unit[from] / unit[to];
  console.log( `${value}${from} は ${converted}${to} です。`);
}

convertUnit(5000, 'cm', 'km'); // 5000cm は 0.05km です。
convertUnit(1, 'km', 'mm'); // 1km は 1000000mm です。

const unit = {
  mm: 1,
  cm: 10,
  feet: 304.8,  // 追加
  m: 1000,
  km: 1000000
}

type UnitKey = keyof typeof unit;
// 自動的に "mm" | "cm" | "feet" | "m" | "km" になる

function convertUnit(value: number, from: UnitKey, to: UnitKey) {
  const converted = value * unit[from] / unit[to];
  console.log( `${value}${from} は ${converted}${to} です。`);
}

convertUnit(300, 'feet', 'm');  // 300feet は 91.44m です。

type User = {
  name: string;
  age: number;
  address: {
    street: string;
    city: string;
  }
};

// User 型のプロパティ名（の文字列リテラル型）のユニオン型
type UserKeys = keyof User;  //  "name" | "age" | "address"
// User 型の各プロパティの値の型のユニオン型
type UserPropValue = User[UserKeys]; // 以下と同じこと
// type UserPropValue = User[ "name" | "age" | "address" ];
// type UserPropValue = string | number | {street: string; city: string};

let userProp : UserPropValue = 'foo';
userProp = 123;
userProp =  {
  street: '1 Mercer st',
  city: 'New York'
};
// true は User 型のプロパティの型と異なるので代入できない
userProp = true; // コンパイルエラー 

type UserPropValue = User[keyof User];

type AnimalAction = {
  dog: string;
  bird: string;
  fish: string;
};

// AnimalAction のプロパティ名（リテラル型）のユニオン型
type AnimalTypes = keyof AnimalAction; // 'dog' | 'bird' | 'fish'

// 引数としてAnimalTypes 型の type を受け取り、それに基づいて AnimalAction 型の値を返す
function getAction(type: AnimalTypes): AnimalAction[AnimalTypes] {
  const animalAction: AnimalAction = {
    dog: 'bark and run',
    bird: 'fly and sing',
    fish: 'swim and dance',
  }
  // 戻り値の型 AnimalAction[AnimalTypes] は Lookup 型
  return animalAction[type]
}

console.log(getAction('dog')); // bark and run
console.log(getAction('bird')); // fly and sing
console.log(getAction('fish')); // swim and dance

function getProperty<T, K extends keyof T>(obj: T, key: K) {
  return obj[key];  // 戻り値の型は T[K] と推論される
}

function setProperty<T, K extends keyof T>(obj: T, key: K, value: T[K]) {
  obj[key] = value;  // value は T[K] 型
}

type User = {
  name: string;
  age: number;
  address: {
    street: string;
    city: string;
  }
};

const foo: User = {
  name: 'Foo',
  age: 22,const catAction =
  address: {
    street: '1 Broadway',
    city: 'New York'
  }
}

const fooName = getProperty(foo, 'name'); // "Foo" (string)
const fooAge = getProperty(foo, 'age'); // 22 (number)
const fooAddress = getProperty(foo, 'address'); // {street: '1 Broadway', city: 'New York'}
const fooCity = getProperty(foo.address, 'city'); // "New York" (string)
setProperty(foo,'name', 'FOO'); // OK
setProperty(foo,'age', '25');  // コンパイルエラー （'25'は文字列なのでエラー）
// Argument of type 'string' is not assignable to parameter of type 'number'.

const animalAction = {
  dog: 'bark and run',
  bird: 'fly and sing',
  fish: 'swim and dance',
};

console.log(getProperty(animalAction, 'dog'));  // bark and run
setProperty(animalAction,'dog', 'sit and eat');
console.log(getProperty(animalAction, 'dog'));  // sit and eat
// 以下は存在しないプロパティ名を指定しているのでコンパイルエラーになる
const catAction = getProperty(animalAction, 'cat');  // コンパイルエラー
// Argument of type '"cat"' is not assignable to parameter of type '"dog" | "bird" | "fish"'.

type PropValueType<T, K extends keyof T> = T[K];

type User = {
  name: string;
  age: number;
  address: {
    street: string;
    city: string;
  }
};

type UserName = PropValueType<User, "name">; // string
type UserAge = PropValueType<User, "age">; // number
type UserAddress = PropValueType<User,"address">; //{street:string; city:string}
// ネストしたプロパティの値の型も取得可能
type UserAddressCity = PropValueType<UserAddress, "city">; //string（以下でも同じ）
type UserAddressCity2 = PropValueType<PropValueType<User,"address">, "city">;

type StringArr = string[];  // string 型の要素を持つ配列の型
type SA = StringArr[number];  // string
type SA2 = StringArr[0];  // string

type Colors = ['red', 'green', 'blue'];
type ColorUnion = Colors[number];  // "red" | "green" | "blue"
type Color0 = Colors[0];  // "red"
type Color1or2 = Colors[1 | 2]; // "green" | "blue"

type StrNumArray = (string | number)[];
type SN = StrNumArray[number];  // string | number

const arr = ['foo', 1, null];
type Arr = typeof arr[number];  // string | number | null

type Point = [number, string, boolean];
type PointUnion = Point[number];  // string | number | boolean
type PointFirst = Point[0]  // number

let str: string;
console.log(str); // コンパイルエラー
// Variable 'str' is used before being assigned.

let str: string;
str = 'foo'; // 変数を参照する前に初期化
console.log(str); // OK

let str: string;
// 変数 str を初期化する関数
function initStr() {
  str = 'foo';
}

initStr();  // 関数で変数を初期化（値を代入）
console.log(str); // それでもコンパイルエラーになる

const value: unknown = 10;
let int: number;
// 変数 int を初期化する処理
if(typeof value === 'number'){
  // この場合、value は number 型なので初期化されるはず
  int = value;
}
console.log(int); // それでもコンパイルエラーになる

let str!: string; // 明確な割り当てアサーション
function initStr() {
  str = 'foo';
}

initStr();
console.log(str); // OK（コンパイルエラーにならない）

const value: unknown = 10;
let int!: number;  // 明確な割り当てアサーション
if(typeof value === 'number'){
  int = value;
}
console.log(int); // OK

let str: string;
function initStr() {
  str = 'foo';
}
initStr();
// 非 null アサーション
console.log(str!); // OK

const value: unknown = 10;
let int: number;
if(typeof value === 'number'){
  int = value;
}
// 非 null アサーション
console.log(int!); // OK

const fruits = ['apple', 'banana', 'orange'] as const;

type Fruit = (typeof fruits)[number];
// Fruit は "apple" | "banana" | "orange"

let myFruit: Fruit = 'apple'; // OK
myFruit = 'banana'; // OK
myFruit = 'orange'; // OK
myFruit = 'melon'; // コンパイルエラー

const foo = {
  name: 'Foo',
  age: 23
} as const;

type FooProps = typeof foo[keyof typeof foo];
// FooProps は "Foo" | 23

let fooProp: FooProps = 'Foo'; // OK
fooProp = 23; // OK
fooProp = 'Bar';  // コンパイルエラー

let value: unknown;
value = "hello";
if (typeof value === "string") {
  // ここでは value は string 型に絞り込まれる
  console.log(value.toUpperCase()); //"HELLO"
} else {
  // ここでは value は string 型以外
  console.log("value is not a string");
}

value = 123;
if (typeof value === "number") {
  // ここでは value は number 型に絞り込まれる
  console.log(value * 10); //  1230
} else {
  // ここでは value は number 型以外
  console.log("value is not a number");
}

function useUnknownValue(value: unknown) {
  switch (typeof value) {
    case 'string':
      // ここでは value は string 型に絞り込まれる
      console.log(value.toUpperCase());
      break;
    case 'number':
      // ここでは value は number 型に絞り込まれる
      console.log(value * 10);
      break;
    case 'boolean':
      // ここでは value は boolean 型に絞り込まれる
      console.log(value ? 'yes': 'no');
      break;
    default:
      // 上記以外
      console.log("value is not a string nor number nor boolean");
  }
}

let value: unknown;
value = "hello";
useUnknownValue(value);  // HELLO
value = 123;
useUnknownValue(value);  // 1230
value = true;
useUnknownValue(value);  // yes
useUnknownValue(null);  //value is not a string nor number nor boolean

class User {
  name: string;
  age?: number;
  constructor(name: string, age?: number) {
    this.name = name;
    this.age = age;
  }
}

let data: unknown;
data = new User("John Doe");

if (data instanceof User) {
  // ここでは data は User のインスタンス
  data.age = 23; // age プロパティにアクセスできる
  console.log(data.name, data.age); // John Doe 23
} else {
  console.log("Data is not an instance of User");
}

type Car = {
  brand: string;
  model: string;
}

type Bike = {
  brand: string;
  type: string;
}

// ユーザー定義型ガード
function isCar(vehicle: Car | Bike): vehicle is Car {
  // model プロパティを持っていれば Car 型
  return "model" in vehicle;
}

// ユーザー定義型ガード
function isCar(vehicle: Car | Bike): vehicle is Car {
  return (vehicle as Car).model !== undefined;
}

function displayVehicleInfo(vehicle: Car | Bike) {
  if (isCar(vehicle)) {
    // ここでは vehicle が Car 型として扱われる
    console.log(`Car - Brand: ${vehicle.brand}, Model: ${vehicle.model}`);
  } else {
    // ここでは vehicle が Bike 型として扱われる
    console.log(`Bike - Brand: ${vehicle.brand}, Type: ${vehicle.type}`);
  }
}

type User = {
  type: "User";
  name: string;
  id: number;
  age?: number;
}

// ユーザー定義型ガード
function isUser(value: any): value is User {
  // null や undefined の場合はプロパティアクセスできないので false を返して終了
  if(value == null) return false;

  // 各プロパティの型を判定
  return (
    value.type === "User" &&
    typeof value.name === "string" &&
    typeof value.id === "number" &&
    (typeof value.age === "number" || typeof value.age === "undefined")
  );
}

function printUserInfo(user: unknown) {
  // ユーザー定義型ガードを使用
  if(isUser(user))  {
    // ここでは user は User 型
    console.log(user.type, user.name, user.id, user.age? user.age: 'no age');
  }else{
    console.log(`${user} is not User Type.`)
  }
}

const foo = {
  type: "User",
  name: 'Foo',
  id: 1,
  age: 22
}

printUserInfo(foo); // User Foo 1 22
printUserInfo("hello");  // hello is not User Type

// ユーザー定義型ガード
function isUser(value: any): value is User {
  if (value == null) return false;

  // 各プロパティの型をチェック
  if (
    value.type !== "User" ||
    typeof value.name !== "string" ||
    typeof value.id !== "number" ||
    value.age && typeof value.age !== "number"
    ) {
    return false;
  }
  return true;
}

type User = {
  type: "User";
  name: string;
  id: number;
  age?: number;
}

// User 型であるかどうかを判定するユーザー定義型ガード
function isUser(value: any): value is User {
  if(value == null) return false;
  return (
    value.type === "User" &&
    typeof value.name === "string" &&
    typeof value.id === "number" &&
    (typeof value.age === "number" || typeof value.age === "undefined")
  );
}

// 受け取った値が User 型であればそのプロパティを出力する関数
function printUserInfo(user: unknown) {
  if(isUser(user))  {
    console.log(user.type, user.name, user.id, user.age? user.age: 'no age');
  }else{
    console.log(`${user} is not User Type.`)
  }
}

const foo = {
  type: "User",
  name: 'Foo',
  id: 1,
  age: 22
}
const bar = {
  type: "User",
  name: "Bar",
  id: 2
}
const foobar = [foo, bar];

// Array.isArray() と every() にユーザー定義型ガード isUser を渡して判定
if (Array.isArray(foobar) && foobar.every(isUser)) {
  // 配列の要素のすべてが User 型の場合にのみ、以下を実行
  foobar.forEach((user) => printUserInfo(user));
}

// asserts 型述語を使ったユーザー定義型ガード
function assertIsString(value: unknown): asserts value is string {
  // 引数 value の型を typeof でチェックし、string でなければ例外を発生させる
  if (typeof value !== "string") {
    throw new Error("value is not string");
  }
}

// foo は unknown 型
const foo: unknown = 'Hello Foo!';

assertIsString(foo);
// assertIsString() が正常終了すれば（例外が発生しなければ）、ここでは foo は string 型
console.log(foo.length);

// asserts 型述語を使ったユーザー定義型ガード
function assertIsUser(value: any): asserts value is User {
  if(value == null){
    throw new Error('value is null or undefined.');
  }
  if(
    value.type !== "User" ||
    typeof value.name !== "string" ||
    typeof value.id !== "number" ||
    value.age && typeof value.age !== "number"
  ) {
    throw new Error('value is not User.')
  }
}

function printUserInfo(value: unknown) {
  assertIsUser(value);
  // 以降は value は User 型
  console.log(value.name, value.id);
  if(value.age) {
    console.log(value.age);
  }
}

function printUserInfo(value: unknown) {
  try {
    assertIsUser(value);
    // 以降は value は User 型
    console.log(value.name, value.id);
    if (value.age) {
      console.log(value.age);
    }
  } catch (error) {
    // error は unknown 型なので型の絞り込みが必要
    if (error instanceof Error) {
      console.error(error.message);
    }
  }
}

type User = {
  type: "User";
  name: string;
  id: number;
  age?: number;
}

// any 型の引数を受け取るユーザー定義型ガード
function isUser(value: any): value is User {
  if(value == null) return false;

  return (
    value.type === "User" &&
    typeof value.name === "string" &&
    typeof value.id === "number" &&
    (typeof value.age === "number" || typeof value.age === "undefined")
  );
}

// unknown 型の引数を受け取るユーザー定義型ガード
function isUser(value: unknown): value is User {
  if(value == null) return false;

  const user = value as Record<keyof User, unknown>;  //型アサーション
  // または const user = value as  User;

  // 各プロパティの型を判定
  return (
    user.type === "User" &&
    typeof user.name === "string" &&
    typeof user.id === "number" &&
    (typeof user.age === "number" || typeof user.age === "undefined")
  );
}

type UserUnknown = Record<keyof User, unknown>;

// 上記は以下のような型になります
type UserUnknown = {
  type: unknown;
  name: unknown;
  id: unknown;
  age: unknown;
}

type CreateReadOnly<T> = {
  readonly [P in keyof T]: T[P];  // または +readonly [P in keyof T]: T[P];
};

type MyObj = {
  name: string;
  age: number;
};

type ReadOnlyMyObj = CreateReadOnly<MyObj>;

type ReadOnlyMyObj = {
  readonly name: string;
  readonly age: number;
}

type CreateMutable<T> = {
  // - を readonly に付けて readonly を削除
  -readonly [P in keyof T]: T[P];
};

type LockedAccount = {
  readonly id: string;
  readonly name: string;
};

type UnlockedAccount = CreateMutable<LockedAccount>;

/* 上記 UnlockedAccount は readonly が削除され、以下のような型を表します
type UnlockedAccount = {
  id: string;
  name: string;
}
*/

type MakeOptional<T> = {
  [P in keyof T]?: T[P];
};

type MyObj = {
  name: string;
  id: string;
};

type OtionalMyObj = MakeOptional<MyObj>;

type OtionalMyObj = {
  name?: string | undefined;
  id?: string | undefined;
}

type MakeRequired<T> = {
  [P in keyof T]-?: T[P];
};

type MaybeUser = {
  id: string;
  name?: string;
  age?: number;
};

type User = MakeRequired<MaybeUser>;

/* 上記 User は ? が削除され、以下のような型を表します
type User = {
  id: string;
  name: string;
  age: number;
}
*/

type OriginalType = {
  key1: string;
  key2: number;
  key3: boolean;
};

type NewType = {
  [P in keyof OriginalType as `new_${P}`]: OriginalType[P];
};

/* 以下のような型を生成します
type NewType = {
  new_key1: string;
  new_key2: number;
  new_key3: boolean;
}
*/

const newTypeObj: NewType = {
  new_key1: "value1",
  new_key2: 34,
  new_key3: true,
};

type NewType<T> = {
  [P in keyof T as `new_${P & string}`]: T[P];
};

type OriginalType = {
  key1: string;
  key2: number;
  key3: boolean;
};

const newTypeObj: NewType<OriginalType> = {
  new_key1: "value1",
  new_key2: 34,
  new_key3: true,
};

type GetterType<T> = {
  [P in keyof T as `get${Capitalize<string & P>}`]: () => T[P]
};

type Person = {
  name: string;
  age: number;
  location: string;
}

type GetterPerson = GetterType<Person>;

/*以下のような型を生成します
type GetterPerson = {
  getName: () => string;
  getAge: () => number;
  getLocation: () => string;
}
*/

type RemoveField<T, U> = {
  [P in keyof T as Exclude<P, U>]: T[P]
};

interface Circle {
  kind: "circle";
  radius: number;
  color: string;
}

type KindlessCircle = RemoveField<Circle, "kind">;

/* 以下のような プロパティ kind を除外した型を生成します
type KindlessCircle = {
  radius: number;
  color: string;
}
*/

type MyConditionalType<T> = T extends SomeType<infer U> ? U : DefaultType;

type ExtractIdType<T> = T extends { id: infer U } ? U : never;

type StrId = {
  id: string;
}
type NumberId = {
  id: number;
  name: string;
}
type NoId = {
  name: string;
}

type StrIdType = ExtractIdType<StrId>; // string
type NumIdType = ExtractIdType<NumberId>; // number
type NoIdType = ExtractIdType<NoId>;  // never

type Flatten<T> = T extends unknown[] ? T[number] : T;

type Flatten<T> = T extends (infer Item)[] ? Item : T;

// Array<型>の記法を使って以下でも同じ
type Flatten<T> = T extends Array<infer Item> ? Item : T;

type ExtractReturnType<T> = T extends (...args: never[]) => infer R ? R : never;

// 関数型
type MyFunction = (x: number) => string;

// ExtractReturnType<MyFunction> の型は string になります
type ResultType = ExtractReturnType<MyFunction>; // string

type ExtractParamType<T> = T extends (value:infer Arg) => number ? Arg : never;

const func = (value: number) => {
  return value * 2;
}

type FuncParam = ExtractParamType<typeof func>; // number

type ExtractParamTypes<T> = T extends (...args: infer Args) => unknown ? Args : never;

type func1 = (x: number, y: boolean) => void;
type func2 = (x: string) => string;
type func3= ()=> void;

type FuncParam1 = ExtractParamTypes<func1>; // [x: number, y: boolean]
type FuncParam2 = ExtractParamTypes<func2>; // [x: string]
type FuncParam3 = ExtractParamTypes<func3>; // []

type ValueTypeOf<T> = T[keyof T];

type A = { a: number };
type B = { b: string };
type AorB = A | B;
type UnionValueType = ValueTypeOf<AorB>;  // never
type AorBType = ValueTypeOf<A> | ValueTypeOf<B> // string | number

type ValueTypeOf<T> = T extends unknown ? T[keyof T] : never;

type A = { a: number };
type B = { b: string };
type AorB = A | B;
type AorBType = ValueTypeOf<AorB>;  // string | number

// Union distribution により上記は以下と同じこと
type AorBType2 = ValueTypeOf<A> | ValueTypeOf<B> // string | number
// 以下と同じこと
type AorBType3 = (A extends unknown ? number: never) | (B extends unknown ? string: never);

// extends キーワードの両側を角括弧 [] で囲むと Union distribution されない
type ValueTypeOf<T> = [T] extends [unknown] ? T[keyof T] : never;

type A = { a: number };
type B = { b: string };
type AorB = A | B;
type AorBType = ValueTypeOf<AorB>; // never

type ToArray<T> = T extends unknown ? T[] : never;
type StrArrOrNumArr = ToArray<string | number>;  // string[] | number[]

type ToArray2<T> = [T] extends [unknown] ? T[] : never;
type StrOrNumArr = ToArray2<string | number>; //  (string | number)[]

/**
 * Make all properties in T optional
 */
type Partial<T> = {
    [P in keyof T]?: T[P];
};

type User = {
  name: string;
  id: string;
  age?: number;
}

type PartialUser = Partial<User>;

type PartialUser = {
  name?: string | undefined; // オプショナル
  id?: string | undefined; // オプショナル
  age?: number | undefined; // オプショナル
}

/**
 * Make all properties in T required
 */
type Required<T> = {
    [P in keyof T]-?: T[P];
};

type User = {
  name: string;
  id?: string;
  age?: number;
}

type StrictUser = Required<User>;

type StrictUser = {
  name: string; // 必須
  id: string; // 必須
  age: number; // 必須
}

/**
 * Make all properties in T readonly
 */
type Readonly<T> = {
    readonly [P in keyof T]: T[P];
};

type User = {
  name: string;
  id: string;
  age: number;
}

type ReadonlyUser = Readonly<User>;

type ReadonlyUser = {
  readonly name: string; // 読み取り専用
  readonly id: string; // 読み取り専用
  readonly age: number; // 読み取り専用
}

/**
 * From T, pick a set of properties whose keys are in the union K
 */
type Pick<T, K extends keyof T> = {
    [P in K]: T[P];
};

type User = {
  name: string;
  id: string;
  age: number;
}

// User 型から name プロパティのみを持つ型を作成
type User1 = Pick<User, "name">;
// User 型から name と age プロパティを持つ型を作成
type User2 = Pick<User, "name" | "age">;

type User1 = {
  name: string;
}

type User2 = {
  name: string;
  age: number;
}

/**
 * Construct a type with a set of properties K of type T
 */
type Record<K extends keyof any, T> = {
    [P in K]: T;
};

type StringBoolean = Record<string, boolean>;

/* 上記は以下のような型を表します。
type StringBoolean = {
  [x: string]: boolean;  // インデックスシグネチャ
}
*/

// キーが string 型で値が boolean 型のオブジェクト
const obj: StringBoolean = {
  a: true,
  b: false
};

type Person = {
  name: string;
  age: number;
}
// 文字列リテラル型のユニオン型
type Names = "foo" | "bar" | "baz";

// キーが Names 型で値が User 型のオブジェクト型
type FooBarBaz = Record<Names, Person>;

/* 上記は以下のような型を表します。
type FooBarBaz = {
  foo: Person;
  bar: Person;
  baz: Person;
} */

const users: FooBarBaz = {
  foo: {name: "Foo", age: 18 },
  bar: {name: "Bar", age: 22 },
  baz: {name: "Baz", age: 36 },
}

type MyObj = {
  foo: string;
  bar: string;
  baz: string;
}
// キーが MyObj のプロパティで値が string | number 型のオブジェクト
type StringOrNumberMyObj = Record<keyof MyObj, string | number>;

/* 上記は以下のような型を表します。
type StringOrNumberMyObj = {
  foo: string | number;
  bar: string | number;
  baz: string | number;
} */

/**
 * Exclude from T those types that are assignable to U
 */
type Exclude<T, U> = T extends U ? never : T;

type MyUnion = "foo" | 123 | true;

type NumExcluded = Exclude<MyUnion, number>;  // "foo" | true

type NumExcluded = ("foo" extends number ? never : "foo") | (123 extends number ? never : 123) | (true extends number ? never : true);

// 以下は number | boolean
type Excluded1 = Exclude<string | number | boolean, string>;
// 以下は boolean
type Excluded2 = Exclude<string | number | boolean, string | number>;
// 以下は never
type Excluded3 = Exclude<string | number | boolean, string | number | boolean>;
// 以下は string | number | boolean
type Excluded4 = Exclude<string | number | boolean, object>;

type A = {
  name: string
  id: number
}
type B = {
  name: string
  age: number
}

type Excluded1 = Exclude<keyof A, keyof B>; // "id"
// keyof A は "name"|"id"、keyof B は "name"|"age" なので以下と同じ
type Excluded2 = Exclude<"name"|"id", "name"|"age">; // "id"
// Union distribution が働き、以下と同じこと
type Excludedy3 = ("name" extends "name"|"age" ? never : "name") | ("id" extends "name"|"age" ? never : "id"); // "id"

/**
 * Extract from T those types that are assignable to U
 */
type Extract<T, U> = T extends U ? T : never;

type MyUnion = "foo" | 123 | true;

type NumStrExtracted = Extract<MyUnion, number | string>;  // "foo" | 123 

// 以下は string
type Extracted1 = Extract<string | number | boolean, string>;
// 以下は string | number
type Extracted2 = Extract<string | number | boolean, string | number>;
// 以下は string | number | boolean
type Extracted3 = Extract<string | number | boolean, string | number | boolean>;
// 以下は never
type Extracted4 = Extract<string | number | boolean, object>;

type A = {
  name: string
  id: number
}
type B = {
  name: string
  age: number
}
type Extracted5 = Extract<keyof A, keyof B>; // "name"

/**
 * Construct a type with the properties of T except for those in type K.
 */
type Omit<T, K extends keyof any> = Pick<T, Exclude<keyof T, K>>;

type User = {
  name: string;
  age: number;
  id: string;
  isActive: boolean;
}

type UserNameAge = Omit<User, 'id' | 'isActive'>;

/* UserNameAge は以下のようになります
type UserNameAge = {
  name: string;
  age: number;
}
*/

/**
 * Exclude null and undefined from T
 */
type NonNullable<T> = T & {};

// 以前の古い NonNullable<T> の定義
type NonNullable<T> = T extends null | undefined ? never : T;

type T1 = NonNullable<string | number | undefined>; // T1 は string | number

type T2 = NonNullable<string[] | null | undefined>; // T2 は string[]

/**
 * Obtain the parameters of a function type in a tuple
 */
type Parameters<T extends (...args: any) => any> = T extends (...args: infer P) => any ? P : never;

type func1 = (x: number, y: boolean) => void;
type func2 = (x: string) => string;
type func3= ()=> void;

type Param1 = Parameters<func1>; // [x: number, y: boolean] （ラベル付きタプル型）
type Param2 = Parameters<func2>; // [x: string]
type Param3 = Parameters<func3>; // []

/**
 * Obtain the return type of a function type
 */
type ReturnType<T extends (...args: any) => any> = T extends (...args: any) => infer R ? R : any;

type func1 = (x: number, y: boolean) => void;
type func2 = (x: string) => string;
type func3= ()=> boolean;

type Return1 = ReturnType<func1>; // void
type Return2 = ReturnType<func2>; // string
type Return3 = ReturnType<func3>; // boolean