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 is 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 Electronics Engineers) 754 format floating-point values. The number keyword is used to represent number type values.
Syntax
  1. var variablename:number;
  2. var q=anyNumericValue;
Example of Number Type

NumberType.ts

  1. class NumberTypeOfTypeScript {
  2. MyFunction() {
  3. var p: number;
  4. p = 1;
  5. var q = 2;
  6. var r = 3.33;
  7. alert("Value of P=" + p + " Value of q=" + q + " Value of r=" + r);
  8. }
  9. }
  10. window.onload = () => {
  11. var value = new NumberTypeOfTypeScript();
  12. value.MyFunction();
  13. }

default.html

  1. <!DOCTYPE html>
  2. <html lang="en"
  3. xmlns="http://www.w3.org/1999/xhtml">
  4. <head>
  5. <meta charset="utf-8" />
  6. <title>TypeScript HTML App</title>
  7. <link rel="stylesheet" href="app.css" type="text/css" />
  8. <script src="app.js"></script>
  9. </head>
  10. <body>
  11. <h1>Number Type in TypeScript</h1>
  12. <div id="content"/>
  13. </body>
  14. </html>

app.js

  1. var NumberTypeOfTypeScript = (function() {
  2. function NumberTypeOfTypeScript() {}
  3. NumberTypeOfTypeScript.prototype.MyFunction = function() {
  4. var p;
  5. p = 1;
  6. var q = 2;
  7. var r = 3.33;
  8. alert("Value of P=" + p + " Value of q=" + q + " Value of r=" + r);
  9. };
  10. return NumberTypeOfTypeScript;
  11. })();
  12. window.onload = function() {
  13. var value = new NumberTypeOfTypeScript();
  14. value.MyFunction();
  15. };
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
  1. var variable:string;
  2. var q="someString";
Example of String Type

StringType.ts

  1. class StringTypeOfTypeScript {
  2. Myfunction() {
  3. var s: string;
  4. s = "TypeScript"
  5. var empty = "";
  6. var abc = "abc";
  7. alert("Value of s=" + s + " Empty string=" + empty + " Value of abc =" + abc);
  8. }
  9. }
  10. window.onload = () => {
  11. var value = new StringTypeOfTypeScript();
  12. value.Myfunction();
  13. }

default.html

  1. <!DOCTYPE html>
  2. <html lang="en"
  3. xmlns="http://www.w3.org/1999/xhtml">
  4. <head>
  5. <meta charset="utf-8" />
  6. <title>TypeScript HTML App</title>
  7. <link rel="stylesheet" href="app.css" type="text/css" />
  8. <script src="app.js"></script>
  9. </head>
  10. <body>
  11. <h1>String Type in TypeScript</h1>
  12. <div id="content"/>
  13. </body>
  14. </html>

app.js

  1. var StringTypeOfTypeScript = (function() {
  2. function StringTypeOfTypeScript() {}
  3. StringTypeOfTypeScript.prototype.Myfunction = function() {
  4. var s;
  5. s = "TypeScript";
  6. var empty = "";
  7. var abc = "abc";
  8. alert("Value of s=" + s + " Empty string=" + empty + " Value of abc =" + abc);
  9. };
  10. return StringTypeOfTypeScript;
  11. })();
  12. window.onload = function() {
  13. var value = new StringTypeOfTypeScript();
  14. value.Myfunction();
  15. };
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
  1. var p:bool;
  2. var q=true;
Example of Boolean Type

BooleanType.ts

  1. class booleanTypeofTypeScript {
  2. MyFunction() {
  3. var lie: bool;
  4. lie = false;
  5. var a = 12;
  6. if (typeof(lie) == "boolean" && typeof(a) == "boolean") {
  7. alert("Both is boolean type");
  8. }
  9. if (typeof(lie) == "boolean" && typeof(a) != "boolean") {
  10. alert("lie is boolean type and a is not!")
  11. } else {
  12. alert("a is boolean type and lie is not!");
  13. }
  14. }
  15. }
  16. window.onload = () => {
  17. var access = new booleanTypeofTypeScript();
  18. access.MyFunction();
  19. }

default.html

  1. <!DOCTYPE html>
  2. <html lang="en"
  3. xmlns="http://www.w3.org/1999/xhtml">
  4. <head>
  5. <meta charset="utf-8" />
  6. <title>TypeScript HTML App</title>
  7. <link rel="stylesheet" href="app.css" type="text/css" />
  8. <script src="app.js"></script>
  9. </head>
  10. <body>
  11. <h1>Boolean Type in TypeScript</h1>
  12. <div id="content"/>
  13. </body>
  14. </html>

app.js

  1. var booleanTypeofTypeScript = (function() {
  2. function booleanTypeofTypeScript() {}
  3. booleanTypeofTypeScript.prototype.MyFunction = function() {
  4. var lie;
  5. lie = false;
  6. var a = 12;
  7. if (typeof(lie) == "boolean" && typeof(a) == "boolean") {
  8. alert("Both is boolean type");
  9. }
  10. if (typeof(lie) == "boolean" && typeof(a) != "boolean") {
  11. alert("lie is boolean type and a is not!");
  12. } else {
  13. alert("a is boolean type and lie is not!");
  14. }
  15. };
  16. return booleanTypeofTypeScript;
  17. })();
  18. window.onload = function() {
  19. var access = new booleanTypeofTypeScript();
  20. access.MyFunction();
  21. };
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
  1. var vaiablename:number=null;
  2. var q=null;
Example of Null Type

NullType.ts

  1. class NullTypeinTypeScript {
  2. MyFunction() {
  3. var p: number = null;
  4. var x = null;
  5. if (p == null) {
  6. alert("p has null value!");
  7. } else {
  8. alert("p has a value");
  9. }
  10. }
  11. }
  12. window.onload = () => {
  13. var value = new NullTypeinTypeScript();
  14. value.MyFunction();
  15. }

default.html

  1. <!DOCTYPE html>
  2. <html lang="en"
  3. xmlns="http://www.w3.org/1999/xhtml">
  4. <head>
  5. <meta charset="utf-8" />
  6. <title>TypeScript HTML App</title>
  7. <link rel="stylesheet" href="app.css" type="text/css" />
  8. <script src="app.js"></script>
  9. </head>
  10. <body>
  11. <h1>Null Type in TypeScript</h1>
  12. <div id="content"/>
  13. </body>
  14. </html>

app.js

  1. var NullTypeinTypeScript = (function() {
  2. function NullTypeinTypeScript() {}
  3. NullTypeinTypeScript.prototype.MyFunction = function() {
  4. var p = null;
  5. var x = null;
  6. if (p == null) {
  7. alert("p has null value!");
  8. } else {
  9. alert("p has a value");
  10. }
  11. };
  12. return NullTypeinTypeScript;
  13. })();
  14. window.onload = function() {
  15. var value = new NullTypeinTypeScript();
  16. value.MyFunction();
  17. };
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
  1. var p:number=undefined;
  2. var q=undefined;
Example of Undefined Type

UndefinedType.ts

  1. class UndefinedTypeOfTypeScript {
  2. Myfunction() {
  3. var p: number;
  4. var x = undefined;
  5. if (p == undefined && x == undefined) {
  6. alert("p and x is undefined");
  7. } else {
  8. alert("p and c cannot undefined");
  9. }
  10. }
  11. }
  12. window.onload = () => {
  13. var value = new UndefinedTypeOfTypeScript();
  14. value.Myfunction();
  15. }

default.html

  1. <!DOCTYPE html>
  2. <html lang="en"
  3. xmlns="http://www.w3.org/1999/xhtml">
  4. <head>
  5. <meta charset="utf-8" />
  6. <title>TypeScript HTML App</title>
  7. <link rel="stylesheet" href="app.css" type="text/css" />
  8. <script src="app.js"></script>
  9. </head>
  10. <body>
  11. <h1>Default Type in TypeScript</h1>
  12. <div id="content"/>
  13. </body>
  14. </html>

app.js

  1. var UndefinedTypeOfTypeScript = (function() {
  2. function UndefinedTypeOfTypeScript() {}
  3. UndefinedTypeOfTypeScript.prototype.Myfunction = function() {
  4. var p;
  5. var x = undefined;
  6. if (p == undefined && x == undefined) {
  7. alert("p and x is undefined");
  8. } else {
  9. alert("p and c cannot undefined");
  10. }
  11. };
  12. return UndefinedTypeOfTypeScript;
  13. })();
  14. window.onload = function() {
  15. var value = new UndefinedTypeOfTypeScript();
  16. value.Myfunction();
  17. };
Output:
undefind-type-in-typescript.jpg