Monday, 17 April 2017

what is typescript ?

It is an open-source programming language from Microsoft. It's announced on October 2012. It comes with powerful type checking abilities and object-oriented features.All of the proposed features of ES 2015 and ES 2016 are implemented by TypeScript, or are in the process of being implemented.These features are converted into their ES5 equivalent when the TypeScript files are transpiled, making it possible to use the latest features of JavaScript even when the browsers have not implemented them natively. Angular 2 uses TypeScript as its primary language for application development.

wantcode typescript


Important points of typescript:
  • TypeScript is a typed superset of JavaScript and compiles to plain JavaScript.
  • TypeScript files have the extension .ts.
  • Since TypeScript supports types, it looks very familiar to any other typed OOP's languages like C# and Java.
  • TypeScript is not executed on the browser. Instead, the transpiled code gets executed in the browser.


Example of typescript:


class Greeter {
    greeting: string;
    constructor (message: string) {
        this.greeting = message;
    }
    greet() {
        return "Hello, " + this.greeting;
    }
}  

that gets transpiled into plain JavaScript.


var Greeter = (function () {
    function Greeter(message) {
        this.greeting = message;
    }
    Greeter.prototype.greet = function () {
        return "Hello, " + this.greeting;
    };
    return Greeter;
})();

You can also use the online transpiler here .In which you can convert your .ts code to .js.

How the TypeScript defines the type of member variables and class method parameters.  This is removed when translating to JavaScript, but used by the IDE and compiler to spot errors, like passing a numeric type to the constructor.

Typescript introduction :

Boolean : The most basic datatype is the simple true/false value, which JavaScript and TypeScript call a boolean value.


let isDone: boolean = false;

Number : As in JavaScript, all numbers in TypeScript are floating point values. These floating point numbers get the type number. In addition to hexadecimal and decimal literals, TypeScript also supports binary and octal literals introduced in ECMAScript 2015.


let decimal: number = 6;
let hex: number = 0xf00d;
let binary: number = 0b1010;
let octal: number = 0o744;

String : we use the type string to refer to these textual datatypes. Just like JavaScript, TypeScript also uses double quotes (") or single quotes (') to surround string data.


let color: string = "blue";
color = 'red';

Array :  Array types can be written in one of two ways. In the first, you use the type of the elements followed by [] to denote an array of that element type.


let list: number[] = [1, 2, 3];

The second way uses a generic array type, Array<elemType>:


let list: Array<number> = [1, 2, 3];

Tuple : Tuple types allow you to express an array where the type of a fixed number of elements is known, but need not be the same.For example, you may want to represent a value as a pair of a string and a number.


// Declare a tuple type
let x: [string, number];
// Initialize it
x = ["hello", 10]; // OK
// Initialize it incorrectly
x = [10, "hello"]; // Error

Enum : A helpful addition to the standard set of datatypes from JavaScript is the enum.


enum Color {Red, Green, Blue}
let c: Color = Color.Green;

ANY : If you are declaring a variable without using a type and without assigning any value to it, the TLS assigns it the any type. Think of any as a supertype of all types, which is used whenever TypeScript is unable to infer a type.You can also assign the any type explicitly, which allows it to assume any value—from a simple string, number, Boolean, or even a complex object.


var x; //implicitly assigned type any 

var y : any; // explicitly assigned type any

VOID : Void signifies that a method does not have a return value.


function showmsg(msg):void {
alert(msg)
}

TypeScript has a number of useful features.To dive deeper into TypeScript, refer to doc

Featured post

How to create dynamic schema in mongodb

Sometime what we need in our application is to create mongodb schema for collection and some of our collection schema are same but names are...

Popular Posts