Converting from JavaScript to TypeScript

Osha Groetz
2 min readMay 17, 2021

--

First step — Changing Javascript Files to TypeScript Files

Compile project in ‘loose mode’ and get tests to pass. [Rename all .js files to .ts ???] ← so scary! In the tsconfig.json file, add “noImplicitAny”: false, under “compilerOptions”.

Say no to implicit any

In configuration , change— “noImplicitAny: true”. If this is set to true, it will provide errors on any arguments or variables where type has not been explicitly set, and you can work back from there to set types. Use type ‘any’ in the rare cases where you can not use basic types or union types.

DefinitelyTyped — open source project providing ambient type information, npm packages to bring in type information to lay ontop of your code implementation (for example if you used Javascript as your apps programming language).

SideNote: In TS, the flow of inference does not flow up. If the argument of a function is not explicitly coded, the argument has an implicit type ‘any’, if you later infer that value as a string in the body, the argument type will always remain ‘any’.

Start enabling Strict mode

In the tsconfig.json file, start commenting in, or adding in, these values one by one and getting tests to pass for each before moving on to the next:
- “strictNullChecks”: true,
- “strict”: true,
- “strictFunctionTypes”: true,
- “strictBindCallApply”: true,

strictNullChecks — when set to false, null is a valid value in any type, which it SHOULD NOT be, null should not be allowed just anywhere. The only thing that should hold a null is null. The intersection operator will need to come into play here → this operation returns a string | null ← (| === or).

strictFunctionTypes — validates arguments and return types of callback types.

strictBindCallApply — makes sure that the arguments passed to bind, call, apply functions (and lexical scope) all type check correctly.

Avoid unsafe casting: forcing TypeScript to regard something as a particular type, done with the ‘as’ keyword.

--

--

Osha Groetz

Software Engineer. React, Javascript, Typescript, HTML, CSS, Ruby, Ruby On Rails