Speaker: Orlando Valdez
@orlandovaldez_
Link to table of contents
———————
Typescript
- All JavaScript is legal Typescript
- Developed/maintained by Microsoft. Other contributors like Google
- tsc – like javac – transplies to Javascript
- tsserver – for IDE and editor support language services. Standalone server
- .ts extension
- Type analysis system
Installing
- Install from VS Studio or npm
- npm install -g typescript
Commands
- Version: tsc –version
- Create project: tsc –init (creates tsconfig.json file)
tsconfig.json
- target – JS language version
- module – module name
- rootDir
- outDir
- sourceMap – whether to create a source map for emitted JS
- strict – whether to enable strict type checking. Recommended for new projects. If migrating from JS, can use more fine grained flags as make more typescript like
Notes
- Can define same class twice.
- Can create “any” type – discouraged for new projects. Used for migration. Prefer “unknown” type instead. Can’t use until type is known. Ex, casting: x as {a : boolean}
- null is different than undefined
- never determines a value is unreachable so can’t use
- can use linter to follow team standard on semicolons (inconsistent in the talk and notes below)
- Some unexpected things because valid JavaScript still works
- If can return null show return type as X | null
- flow analysis for determining if a type is known
- Tag/discriminating property – constant literal with same name and unique value across types. Use tag if own object/API
Sample code
class Foo {
x: String;
y: number = 12; // type is optional (can infer based on value)
}
let bar = new Foo()
const a - 40
const arr = ["hi", "hello"]
const tuple = { x: "y"}
function error(message: string | number): never { // never returns
}
if (typeof stringOrNumber === "string") {}
enum Foo {
Up = "UP";
}
type ID = number // alias - lets use domain language. can use for more complex entities like a tuple. can be alternative to create a class
type Bird = Animal & { flights: boolean } // intersection
interface Foo {
name: string
hi: () -> void /// function that takes nothing and returns void
}
interface Sub extends Foo {}
interface Foo { // can add properties to an interface that already exists by redefining it (even if don't have access. can also extend an enum
color? : String // optional property
readonly id: number
status : "new" | "done"
}
type K - string | number | null //union type. can only use if shared properties. otherwise we need type guards (typeof check)
if ('id' in result) // checks if property is defined. also narrows down type so might be able to determine real time and not just that has id
obj.prop
obj['prop'] // don't know type or even if exists
function genericGetProperty<T, K extends keyof T>(obj:T, propName: K) { //keyof returns keys of all props in object. the generic function won't allow you to pass invalid property name. return type is known so variable assigned to is also correct type
return obj[propName]
}
let str = `Template: ${language} // multiline and interpolations
more``
type messages = // can use to generate all combinations of a parmeterized message
| "learn X"
| "learn Y"
My take
This was cool. A lot of info, but easy to follow. It built up in a way that I was able to read the code as more things got added. This was a great session!