Your browser doesn't support the features required by impress.js, so you are presented with a simplified version of this presentation.

For the best experience please use the latest Chrome, Safari or Firefox browser.

TypeScript 入坑介绍

What is TypeScript?

  1. 1、TypeScript is a typed superset of JavaScript that compiles to plain JavaScript.
  2. 2、Includes all features of ES6 and much more: types, interfaces, generics, etc...
  3. 3、Its main goal is to simplify the development and maintenance of large scale JS applications.

FEATURE?

  1. 1、Type annotations
  2. 2、Interfaces
  3. 3、Generics
  4. 4、Enums
  5. 5、Modules
  6. 6、ECMAScript features
  7. 7、Many more

Who is using TypeScript?

Why TypeScript?

  1. 1、Types prevents bugs
  2. 2、Makes code more readable
  3. 3、TS aims at supporting the most of the new ES features.
  4. 4、Support of most of the major IDEs makes code navigation and refactoring much easier.
  5. 5、TS 1.8 announced JSX support which means it can be effectively used for React development. If you’re into these sort of things
  6. 6、Created & maintained by Anders Hejlsberg GitHub
Go To Playground

Basic Example

          
    let size: number = 3
    let list: number[] = [1, 2, 3]
    let person: string = "Marco"
    size = 'Polo' //Type 'string' is not assignable to type 'number'.

    enum Color {Red = 1, Green, Blue}
    let c: Color = Color.Green
    let colorName: string = Color[2]

Special "any" type allow all kinds of values

          
    let foo: any
    foo = 2
    foo = 'Paris'
    foo = [1, 2, 3]

Complex types can be defined inline

          
    let user: {
      name: string,
      age: number,
      address: {
        city: string,
        country: string
      }
    }

    user = { name: 'Marco', age: 20 } // Property 'address' is missing

Properties can be optional if followed by "?"

          
    let user: {
      name: string,
      age: number,
      address?: {
        city: string,
        country: string
      }
    }

    user = { name: 'Marco', age: 20 } // OK

Interface

          
    interface User {
      name: string
      age: number
      address: Address
    }
    interface Address {
      city: string
      country: string
    }

    let user: User

Public, private, and protected

          
    class Person {
      title: string
      protected name: string
      private lastname: string
    }
    const user = new Person()
    user.title = 'MR'
    user.name = 'Rob' // Error
    user.lastname = 'Willson' // Error

Installation

          
    npm i typescript@next -g

    tsc hello.ts

References

Think You!