keyof, typeof and const assertions

keyof P
P = Type

// Predefined Types
type KeyofAny = keyof any; // string | number | symbol 🤔

// You don't see these everyday 😬
type KeyofBoolean = keyof boolean; // "valueOf"
type KeyofString = keyof string; //  number | "charAt" |  ...Union of Object.getOwnPropertyNames(String.prototype)
type KeyofNumber = keyof number; //  "toFixed" |  ...Union of Object.getOwnPropertyNames(Number.prototype)
type KeyofSymbol = keyof symbol; // "toString" |  "valueOf"
type KeyofVoid = keyof void; // never
type KeyofNull = keyof null; // never
type KeyofUndefined = keyof undefined; // never

//Enums
enum Preference {
  TYPESCRIPT,
  JAVASCRIPT,
}
type KeyofEnum = keyof Preference; // "toString" | "toFixed" ...Object.getOwnPropertyNames(Number.prototype)

// String literal type
type KeyofString = keyof 'Literal'; // Same as string. String literal types are subtypes of String primitive types.

// Array literal type
type KeyofArray = keyof []; // number | Union of Object.getOwnPropertyNames(Array.prototype)

//Tuple literal type
type KeyofTuple = keyof [number, number]; // number | number | Union of Object.getOwnPropertyNames(Array.prototype)

// Very important 🔥🔥!!

// object literal type
interface Rectangle {
  type: 'Quadrilateral';
  length: number;
  width: number;
}

type keyofInterface = keyof Rectangle; // 'type' | 'length' | 'width'

type Omit<T, K extends keyof any> = Pick<T, Exclude<keyof T, K>>;

type Omit<T, K extends string | number | symbol> = Pick<T, Exclude<keyof T, K>>;

import { AxiosRequestConfig } from 'axios';

function isMatch(requestConfig: AxiosRequestConfig, path: string): boolean {
  // object requestConfig.url is possibly undefined
  return requestConfig.url.endsWith(path); //Ops
}

isMatch({}, '/users'); // Why is this okay axios :(

import { AxiosRequestConfig } from 'axios';

// we obtain all permitted property names with `keyof` and exclude the url property name
type ConfigKeys = Exclude<keyof AxiosRequestConfig, 'url'>; // Great url is gone

// lets reconstruct now 🔨
type CustomRequestConfiguration = {
  url: string;
} & { [property in ConfigKeys]: AxiosRequestConfig[property] };

function isMatch(
  requestConfig: CustomRequestConfiguration,
  path: string,
): boolean {
  return requestConfig.url.endsWith(path); // Everyone is happy
}

isMatch({}, '/users'); // No !
isMatch({ url: 'https://mrgregory.dev/users' }, '/users'); // Okay we are friends now !

interface FormFields {
  firstName: string;
  lastName: string;
  email: string;
  password: string;
  birthDay: string;
  birthMonth: string;
  birthYear: string;
  consented: boolean;
  confirmationPassword: string;
}

// Create a union of string literal types
type FieldNames = keyof FormFields; // "firstName" | "lastName" .... | "consented"

type FieldErrors = { [field in FieldNames]: boolean }; // { firstName: boolean; lastName: boolean; .... consented: boolean; }

declare function stringify<Input extends object>(
  source: Input,
  replacer?: (
    key: keyof Input,
    value: Input[keyof Input],
  ) => string | boolean | number,
  spacer?: string | number,
): string;

interface Person {
  name: string;
  age: number;
  beard: boolean;
}

const pawel: Person = { name: 'Pawel', age: 1, beard: true };

// ok
stringify(pawel, (key, value) => (key === 'age' ? 23 : value));

// ops Error, this condition will always return 'false'
// since the types '"name" | "age" | "beard"' and '"height"' have no overlap.
stringify(pawel, (key, value) => (key === 'height' ? 23 : value));

// Error {} is not assignable to `string | number | boolean`
stringify(pawel, (key, value) => (key === 'age' ? {} : value));

interface Person {
  name: string;
  age: number;
  beard: boolean;
}

type Values = Person[keyof Person]; // string | number | boolean

// How ?
// Person[keyof Person] =
//        Person["name" | "age" | "beard" ] =
//            Person["name"] | Person["age"] | Person["beard"] = string | boolean | number;

const x = 42;
const y = typeof x; // Use in an expression

typeof undefined; // "undefined"
typeof true; // "boolean"
typeof 1337; // "number"
typeof 'foo'; // "string"
typeof {}; // "object"
typeof Number.parseInt; // "function"
typeof Symbol(); // "symbol"

interface FormFields {
  firstName: string;
  lastName: string;
  email: string;
  password: string;
  birthDay: string;
  birthMonth: string;
  birthYear: string;
  consented: boolean;
  confirmationPassword: string;
}

type FieldNames = keyof FormFields;

type FieldErrors = { [field in FieldNames]: boolean };

const defaultFormFieldValues: FormFields = {
  firstName: '',
  lastName: '',
  //....
}

const defaultFieldErrors = { //.... }

const formFields = {
  firstName: '',
  lastName: '',
  email: '',
  password: '',
  confirmationPassword: '',
  consented: false,
};

type FormFields = typeof formFields; // { firstName: string; lastName: string; ... consented: boolean}
type FieldErrors = Record<keyof FormFields, boolean>; // { firstName: boolean; ... consented: boolean}

declare function useState<T>(defaultState: T);

function RegisterForm() {
  const [formFields, setFormFields] = useState<FormFields>(formFields);
  //...
}

const formFields = {
  firstName: '',
  lastName: '',
  email: '',
  password: '',
  confirmationPassword: '',
  consented: false,
};

type LooseFormFields = typeof formFields;

type FormFields = {
  readonly [property in keyof LooseFormFields]: LooseFormFields[property]
}; // { readonly firstName: string ... }

declare let formFields;

type FormFields = Readonly<typeof formFields>;

// typeof a is the literal type 42 and cannot be widened.
const a = 42;

// This is quite redundant as it is indicative that b cannot be reassigned and or widened ❌
// This is not idiomatic javascript
// for semantic clarity use a const declaration
let b = 'Hello' as const;
b = 'Hi'; // Nope

declare let fs: any;

const flags =  [
  {action: 'delete', files: [ 'Pedro.txt', 'Sharkey.txt' ] },
  {action: 'create', file: 'Dan.txt' },
] as const;

for (const flag of flags) {
  if(flag.action === 'create') {
      // sweet sweet narrowing
      fs.writeFileSync(flag.file)
      fs.writeFileSync(flag.files) // Error, Did you mean 'files'.
   }
  }
}

const NOTIFICATIONPREFERENCE = {
  email: 'EMAIL',
  text: 'TEXT',
  both: 'BOTH'
} as const

NOTIFICATIONPREFERENCE.email // ok
NOTIFICATIONPREFERENCE.test // ❌
// Property 'test' does not exist on type '{ readonly email: "EMAIL"; readonly text: "TEXT"; readonly both: "BOTH"; }'.
// Did you mean 'text' ? ✅