- 1995: Mocha becomes LiveScript, written in 10 days
- 1997: ECMAScript 1 sets standards
- 1999: ECMAScript 3
- 2005: jQuery "Normalize the DOM"
- 2009: Node.js, ECMAScript 5
- 2012: TypeScript (and there was much rejoicing)
- 2015: ECMAScript 2015 ("Harmony")
git checkout d65aed6
Transform to TypeScript
git checkout 08f09e3
npm install --save-dev typescript
Add two build scripts to the
package.json file for compiling and compiling on a watch:
The repository contains documentation paired with several commits to walk through the process. If you’re a hands-on person and want to dive in, visit the repository and get started right now! I recorded a companion video series to guide you through each step.
Each video is only a few minutes long so feel free to bookmark this page and come back often. You may have already found these videos from my Twitter thread.
index.js file to
Note: an alternative way to initialize TypeScript’s configuration file is to use the
npxcommand, like this:
npx tsc --init
A major benefit of using TypeScript, as you may be able to guess from the name, is the ability to use classes and types. I refactor the code to use classes instead of function constructors and annotate the properties with types. This immediately uncovers another bug for us that will be easy to fix in the next step.
The class refactoring revealed a property that wasn’t named consistently. This is fixed by updating the constructor function to match the names use in other code. Next, a custom type is defined that declares the two possible string values for
home. This reveals a defect that, when fixed, corrects the phone display logic.
this is. By default, scope is at a function level, so
this.x has a different meaning in a nested function. Lambda expressions not only simplify the definition of functions, but also capture outer scope for a consistent hierarchy of variable access.
To simplify the code, a custom type is created that uses generics to define a predicate. You can think of a predicate as a test. Given an item
T it returns either
false. This type can then be used to define the second parameter in the