Reader Level:
ARTICLE

Primitive Types in TypeScript

Posted by Sharad Gupta Articles | TypeScript October 30, 2012
In this article I explain what a primitive type is and how to use them in TypeScript.
  • 0
  • 0
  • 5288

Primitive Types in TypeScript

Simple types are also called the primitive types and they belong to built-in predefined types found in TypeScript. The primitive data type are number, string, boolean, null type and undefined types. There are the following primitive or built-in types in TypeScript, which are described below.

Number Type

The number primitive type is the same as the JavaScript primitive type and represents double-precision 64-bit IEEE (Institute of Electrical and Electronic Engineers) 754 format floating point values. The number keyword is used to represent number type values.

Syntax

var variablename:number;
var q=anyNumericValue;

Example of Number Type

NumberType.ts

class
NumberTypeOfTypeScript {

    MyFunction()

    {

        var p: number;

        p = 1;

        var q = 2;

        var r = 3.33;

        alert("Value of P=" + p + "  Value of q=" + q + " Value of r=" + r);

     

       

    }

 

}

window.onload = () =>{

    var value = new NumberTypeOfTypeScript();

    value.MyFunction();
}

default.html

<!
DOCTYPE html>

 

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">

<head>

    <meta charset="utf-8" />

    <title>TypeScript HTML App</title>

    <link rel="stylesheet" href="app.css" type="text/css" />

    <script src="app.js"></script>

</head>

<body>

    <h1>Number Type in TypeScript</h1>

 

    <div id="content"/>

</body>

</html>


app.js
 

var NumberTypeOfTypeScript = (function () {

    function NumberTypeOfTypeScript() { }

    NumberTypeOfTypeScript.prototype.MyFunction = function () {

        var p;

        p = 1;

        var q = 2;

        var r = 3.33;

        alert("Value of P=" + p + "  Value of q=" + q + " Value of r=" + r);

    };

    return NumberTypeOfTypeScript;

})();

window.onload = function () {

    var value = new NumberTypeOfTypeScript();

    value.MyFunction();

};


Output

number-type-in-typescript.jpg

String Type


The string primitive type is the same as the JavaScript primitive type and it represents a sequence of characters stored as Unicode UTF-16 code.


Syntax
 

var variable:string;

var q="someString";


Example of String Type

StringType.ts
 

class StringTypeOfTypeScript {

    Myfunction() {

      var  s: string;

      s="TypeScript"

      var empty = "";

      var abc = "abc";

      alert("Value of s="+ s+" Empty string="+ empty+" Value of abc ="+abc) ;    

    }

}

window.onload = () =>{

    var value = new StringTypeOfTypeScript();

    value.Myfunction();

}

default.html
 

<!DOCTYPE html>

 

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">

<head>

    <meta charset="utf-8" />

    <title>TypeScript HTML App</title>

    <link rel="stylesheet" href="app.css" type="text/css" />

    <script src="app.js"></script>

</head>

<body>

    <h1>String Type in TypeScript</h1>

 

    <div id="content"/>

</body>
</
html>


app.js
 

var StringTypeOfTypeScript = (function () {

    function StringTypeOfTypeScript() { }

    StringTypeOfTypeScript.prototype.Myfunction = function () {

        var s;

        s = "TypeScript";

        var empty = "";

        var abc = "abc";

        alert("Value of s=" + s + " Empty string=" + empty + " Value of abc =" + abc);

    };

    return StringTypeOfTypeScript;

})();

window.onload = function () {

    var value = new StringTypeOfTypeScript();

    value.Myfunction();
};
 


Output:

 string-type-in-typescript.jpg


Boolean Type

The boolean primitive type is the same as the JavaScript primitive type and represents a logical value; either true or false.

Syntax
 

var p:bool;

var q=true;


Example of Boolean Type

BooleanType.ts
 

class booleanTypeofTypeScript {

    MyFunction() {

        var lie: bool;

       

        lie = false;

        var a = 12;

        if (typeof (lie) == "boolean" && typeof (a) == "boolean") {

            alert("Both is boolean type");

        }

        if (typeof (lie) == "boolean" && typeof (a) != "boolean") {

            alert("lie is boolean type and a is not!")

 

        }

        else {

            alert("a is boolean type and lie is not!");

        }

    }    

}

window.onload =()=> {

    var access = new booleanTypeofTypeScript();

    access.MyFunction();

 }


default.html
 

<!DOCTYPE html>

 

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">

<head>

    <meta charset="utf-8" />

    <title>TypeScript HTML App</title>

    <link rel="stylesheet" href="app.css" type="text/css" />

    <script src="app.js"></script>

</head>

<body>

    <h1>Boolean Type in TypeScript</h1>

 

    <div id="content"/>

</body>
</
html>


app.js

 

var booleanTypeofTypeScript = (function () {

    function booleanTypeofTypeScript() { }

    booleanTypeofTypeScript.prototype.MyFunction = function () {

        var lie;

        lie = false;

        var a = 12;

        if(typeof (lie) == "boolean" && typeof (a) == "boolean") {

            alert("Both is boolean type");

        }

        if(typeof (lie) == "boolean" && typeof (a) != "boolean") {

            alert("lie is boolean type and a is not!");

        } else {

            alert("a is boolean type and lie is not!");

        }

    };

    return booleanTypeofTypeScript;

})();

window.onload = function () {

    var access = new booleanTypeofTypeScript();

    access.MyFunction();
};

 

Output:

boolean-type-in-typescript.jpg 


Null Type

The Null primitive type is the same as the JavaScript primitive type and represents a null literal and it is not possible to directly reference the null type value itself.

Syntax
 

var vaiablename:number=null;

var q=null;


Example of Null Type

NullType.ts
 

class NullTypeinTypeScript {

    MyFunction() {

        var p: number = null;

        var x = null;

        if (p== null) {

            alert("p has null value!");

        }

        else { alert("p has a value"); }

    }

}

window.onload = () =>{

    var value = new NullTypeinTypeScript();

    value.MyFunction();

}

default.html

<!
DOCTYPE html>

 

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">

<head>

    <meta charset="utf-8" />

    <title>TypeScript HTML App</title>

    <link rel="stylesheet" href="app.css" type="text/css" />

    <script src="app.js"></script>

</head>

<body>

    <h1>Null Type in TypeScript</h1>

 

    <div id="content"/>

</body>

</html>


app.js

 

var NullTypeinTypeScript = (function () {

    function NullTypeinTypeScript() { }

    NullTypeinTypeScript.prototype.MyFunction = function () {

        var p = null;

        var x = null;

        if(p == null) {

            alert("p has null value!");

        } else {

            alert("p has a value");

        }

    };

    return NullTypeinTypeScript;

})();

window.onload = function () {

    var value = new NullTypeinTypeScript();

    value.MyFunction();
};

 

Output:

null-type-in-typescript.jpg

Undefined Type

The Undefined type is the same as the JavaScript primitive type and is the type of the undefined literal. The undefined type is a sub-type of all types.

Syntax
 

var p:number=undefined;

var q=undefined;


Example of Undefined Type

UndefinedType.ts
 

class UndefinedTypeOfTypeScript {

    Myfunction() {

        var p: number;

        var x = undefined;

        if (p == undefined && x == undefined) {

            alert("p and x is undefined");

        }

        else { alert("p and c cannot undefined"); }

    }

}

window.onload = () =>{

    var value = new UndefinedTypeOfTypeScript();

    value.Myfunction();
}


default.html
 

<!DOCTYPE html>

 

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">

<head>

    <meta charset="utf-8" />

    <title>TypeScript HTML App</title>

    <link rel="stylesheet" href="app.css" type="text/css" />

    <script src="app.js"></script>

</head>

<body>

    <h1>Default Type in TypeScript</h1>

 

    <div id="content"/>

</body>
</
html>


app.js

 

var UndefinedTypeOfTypeScript = (function () {

    function UndefinedTypeOfTypeScript() { }

    UndefinedTypeOfTypeScript.prototype.Myfunction = function () {

        var p;

        var x = undefined;

        if(p == undefined && x == undefined) {

            alert("p and x is undefined");

        } else {

            alert("p and c cannot undefined");

        }

    };

    return UndefinedTypeOfTypeScript;

})();

window.onload = function () {

    var value = new UndefinedTypeOfTypeScript();

    value.Myfunction();
};

 

Output:

undefind-type-in-typescript.jpg

COMMENT USING

Trending up