TypeScript union types, intersection types and type guards

// Define the union type through the | symbol let value: number | boolean | string = '一碗周'
value = 18

// Define three common interface types interface Name {
  name: string
}
interface Age {
  age: number
}
interface Hobby {
  hobby: string
}
// Define an object that is a union type of the above three objects let person: Name & Age & Hobby = {
  // If one type is not allocated, an exception will be thrown name: '一碗周',
  age: 18,
  hobby: 'coding',
}

// Define an array containing number or string const arr: (number | string)[] = [1, 'number']
// Traverse the array and return the first number const getValue: (arr: (number | string)[]) => number = (
  arr: (number | string)[],
): number => {
  for (let i = 0; i < arr.length; i++) {
    // If the current value is not a NaN when converted to a number, return if (!isNaN(Number(arr[i]))) {
      return arr[i] // Type 'string | number' cannot be assigned to type 'number'.
    }
  }
}

const getValue: (arr: (number | string)[]) => number = (
  arr: (number | string)[],
): number => {
  for (let i = 0; i < arr.length; i++) {
    // If the current value is not a NaN when converted to a number, return if (!isNaN(Number(arr[i]))) {
      return arr[i] as number // Tell the compiler that I am returning a number
    }
  }
}

// Use custom type protection // 1. Define a function whose return value is a type predicate, that is, parameterName is Type, which is the form of parameter name is type function isNumber(value: number | string): value is number {
  // If true is returned, it means the value passed in is the type after is
  return !isNaN(Number(value))
}
// 2. Define a function to get a number const getNumber: (value: number | string) => number = (
  value: number | string,
): number => {
  // If the value of calling isNumber is true, it means value is a number, so return the number if (isNumber(value)) {
    return value
  }
}
// 3. Call to get the final value const getValue: (arr: (number | string)[]) => number = (
  arr: (number | string)[],
): number => {
  for (let i = 0; i < arr.length; i++) {
    // If a number is returned, convert it to a boolean value of true
    if (getNumber(arr[i]) || getNumber(arr[i]) === 0) {
      return getNumber(arr[i])
    }
  }
}

// 1. Define a function to get a number const getNumber: (value: number | string) => number = (
  value: number | string,
): number => {
  // Check if the current value is a string, if so return the current value if (typeof value === 'number') {
    return value
  }
}
// 2. Call to get the final value const getValue: (arr: (number | string)[]) => number = (
  arr: (number | string)[],
): number => {
  for (let i = 0; i < arr.length; i++) {
    // If a number is returned, convert it to a boolean value of true
    if (getNumber(arr[i]) || getNumber(arr[i]) === 0) {
      return getNumber(arr[i])
    }
  }
}

/**
 * Since instanceof only supports reference types and not primitive types, we need to make some changes here and modify the array to the following:
 */
const arr2: (Number | String)[] = [new String('彼岸繁华'), new Number(10)]
// 1. Define a function to get a number const getNumber: (value) => number = (value): number => {
  // Determine whether the current value is of Number type and convert the current value into a string and return if (value instanceof Number) {
    return Number(value)
  }
}
// 2. Call to get the final value const getValue: (arr: (Number | String)[]) => number = (
  arr: (Number | String)[],
): number => {
  for (let i = 0; i < arr.length; i++) {
    // If a number is returned, convert it to a boolean value of true
    if (getNumber(arr[i]) || getNumber(arr[i]) === 0) {
      return getNumber(arr[i])
    }
  }
}