TypeScriptのNonNullable型でnullableを排除する徹底解説

type Nullable = string | null | undefined;
type NonNullableType = NonNullable<Nullable>;
// NonNullableTypeはstringになります

function greet(name: string | null): string {
  return `Hello, ${name}`;
}
// 引数がnullの場合、実行時エラーが発生する可能性があります

type OptionalString = string | undefined;
type RequiredString = NonNullable<OptionalString>;
// RequiredStringはstringになります

type Mixed = number | null | undefined | boolean;
type Filtered = NonNullable<Mixed>;
// Filteredはnumber | booleanになります

function ensureValue<T>(value: T): NonNullable<T> {
  if (value == null) {
    throw new Error("Value cannot be null or undefined");
  }
  return value;
}

const result = ensureValue("Hello");
// resultはstring型になります

const values: (number | null | undefined)[] = [1, null, 2, undefined, 3];
const filteredValues: NonNullable<typeof values[number]>[] = values.filter(
  (v): v is NonNullable<typeof v> => v != null
);
// filteredValuesは[1, 2, 3]になります

type Conditional<T> = T extends null | undefined ? never : T;
type Result = Conditional<string | null>;
// Resultはstringになります

function fetchData(): string | undefined {
return "data";
}

const data: NonNullable<ReturnType<typeof fetchData>> = fetchData()!;
// dataはstring型になります

type User = {
  id: number | undefined;
  name: string | null;
};

type SafeUser = {
  [K in keyof User]: NonNullable<User[K]>;
};
// SafeUserは{id: number; name: string}になります

type ApiResponse = {
  data: string | null;
  error: string | undefined;
};

type ValidResponse = {
  [K in keyof ApiResponse]: NonNullable<ApiResponse[K]>;
};
// ValidResponseは{data: string; error: string}になりま

type Props = {
  title: string | undefined;
  description: string | null;
};

type SafeProps = {
  [K in keyof Props]: NonNullable<Props[K]>;
};
// SafePropsは{title: string; description: string}になります