Typescript

Introduction

TypeScript is a typed language which produces javascript.

e.g.

let myString = "fred";
let myBoolean = true;

function createMessage(name:string) {

}

Typescript supports classes and access modifiers

class Person {
   
   name: string
   lastName: string
   
   public Person(name:string) {
       this.name = name;
   }

   public void setLastName(lastName: string) {
       this.lastName = lastName;
   }
}

Configuration

tsconfig

You can set the options for the compiler you can specify a tsconfig.json file. By using

tsc --init

you get a default file.

You can inherit tsconfigs from parent directories. This compiles all *.ts files in this directory and child directories.

{
  "extends": "../tsconfig.base",
  "compilerOptions": {
    "removeComments": true
  },
  "include": [
    "./**/*.ts"
  ]
}

Webpack Configuration

The ts-loader module allows recompiling of the type script and you need to install it if using.

module.exports = {
  entry: './app/app.ts',
  devtool: 'inline-source-map'
  module: {
    rules: [
      {
        test: /\.tsx?$/,
        use: 'ts-loader',
        exclude: /node_modules/
      }
    ]
  },
  resolve: {
    extensions: ['.tsx', '.ts', 'js']
  },
  output: {
    filename: 'bundle.js'
  },
  devServer: {
    inline: false
  }
};

Data Types

The following types are available

• Boolean
• Number
• String
• Array
• Enum (not in javascript)

Other types

• void
• null
• undefined
• Never (e.g. for infinite loop return types)
• Any (e.g. for when using types not guaranteed from other libraries)

Union types This allows more than type e.g.

let number_string : string | number

Not good if you ask me. However maybe useful for strings e.g.

let null_string : string | null

By default the null is not allowed to be assigned without a union declaration.

Don't use var but instead use

let

or

const