Skip to main content

classes in typescript


classes and object is more of the most imported part of any object oriented programming language so how to use classes in typescript i am trying to figure it out.

as we know classes are blueprints which holds all properties and methods and using instance we can access those properties and methods.

so lets try to create a class in typescript

working link->https://stackblitz.com/edit/typescript-yh1fpu



//create a class with keyword class following class name
class species
{
//
public orign:string;
//declare a class property
private specType:string;
//define constructor for your class if you don't define it typescript automatically create it for you
constructor()
{

}
//this is how you can define a function in typescipt
getSpecType():string
{
return this.specType;
}
//this is how you can define a function in typescipt
setSpecType(type:string)
{
this.specType=type;
}   
}
//now lets try to extend species class
class human extends species
{
//private keyboard helps us to encapsulate data with in class means no other class access it directlty 
private CallSpeak:boolean;
private CallEat:boolean;
private CanRun:boolean;
constructor()
{
super();
//because orign is a public type you can access it in derived class
console.log(this.orign)
}
//set all human ablities
getCallSpeak():boolean
{
return this.CallSpeak;
}
getCallEat():boolean
{
return this.CallEat;
}
getCanRun():boolean
{
return this.CanRun;
}
//set all ------------------
setCallSpeak(_CallSpeak:boolean)
{
this.CallSpeak=_CallSpeak;
}
setCallEat(_CallEat:boolean)
{
this.CallEat=_CallEat;
}
setCanRun(_CanRun:boolean)
{
this.CanRun=_CanRun;
}
}
//create instance of class
var manish=new human();
manish.setCallEat(true);
manish.setCallSpeak(true);
manish.setCanRun(true);

console.log(manish.getCallSpeak());

//A generic type is a generic class or interface that is parameterized over types. means its works based on type rather than value's and its a killer features for example you can declare class only once that handle all type of similar operation for all type of data for example
//combine class where T is a generic type
class combine<T>
{
add:(x:T,y:T)=>T
}
//create a new  instance of our generic class.
//<number> our class is number type
var n=new combine<number>();
n.add=(x,y)=>
{
return x+y;
}
console.log(n.add(10,25))
//create a new  instance of our generic class.
//<string> our class is string type
var n=new combine<number>();
var s=new combine<string>();
s.add=(a,b)=>{

return a+" "+b;
}
//=================static class ==========================
//staic class does not required to create a instance to access properties or method
//but it'f follow some rules
class MathOP
{
//staic keyword required to access a method without creating a instance of that class
static addTwoNumber(a:number,b:number):number
{
return a+b;
}
static randomNumber():number
{
return Math.round(Math.random()*100);
}
}
//now we can access all method like this

console.log(MathOP.addTwoNumber(10,20))
console.log(MathOP.randomNumber())
//singleton class means a class which contain only one instance through out the application does not matter how many time you create a instance of it
class SoundManager {
private static instance: SoundManager;
private constructor() {
}
static getInstance() {
if (!SoundManager.instance) {
SoundManager.instance = new SoundManager();
}
return SoundManager.instance;
}
playsound()
{
console.log("sound is playing");
}
stopSound()
{
console.log("sound is stoped");
}
}
const newsound=SoundManager.getInstance();
console.log(newsound.playsound());
console.log(newsound.stopSound());

so in details

1. classes are blueprints which define properties and methods
2. you can create multiple instance of a class where every instance holds
different data 
3. each instance allocated in different memory
4. classes have different types for example dynamic classes static classes and
Singleton





Comments

Popular posts from this blog

Creating a word Scramble game where you can drag and drop the word and create a complete word. (drag and drop word Scramble game).

Creating a word game using  phaser game engine which is a javascript based gaming engine  where u can drag and drop world like Word Scramble Game and complete a given word. your index.html file look like below < html > < head > < script src = "src/phaser.min.js" ></ script > < script src = "src/wordGame.js" ></ script > < script src = "src/main.js" ></ script > </ head > < body > </ body > </ html > 1.    <script src="src/phaser.min.js"></script> required to run the  phaser game engine. 2. rest of the two files deals with game logics      <script src="src/wordGame.js"></script>       <script src="src/main.js"></script> you can download whole project from https://github.com/manishchauhan/wordgame/tree/master just copy and paste the project in your local server and run ...

A simple binary search tree with generic approach tree can store any type of data. (DFS and BFS)

 1. a binary search tree in c++ using a generic approach with both BFS and DFS approach    working tree    https://www.onlinegdb.com/edit/HkuQLdA-w code=> some properties of binary search tree-> 1. binary search tree is not always a balanced tree.  2. Inorder, traversing gives you sorted data.  3.  best is o(log n) and worst is O(n).  4. left node data is always less than root data and right node data always be greater than root data.  5. red-black tree STL map is a balanced binary search tree. *******************************************************************************/ #include <stdio.h> #include<iostream> #include<queue> using namespace std; template < typename T > class Node {   //can store any type of data private:   //genric data or store any type of data   T data;   //reference of left pointer   Node *left = nullptr;   //reference of right pointer   Node *rig...

starting with three.js and react with a very simple example

 1. three.js is undoubtedly the best library to create interactive content for the web in 3d. link https://threejs.org/ a working sample of three with react can be found below https://stackblitz.com/edit/react-7n5qf9?file=src%2FApp.js why choose threejs 1. lightweight  2.fast 3.big community  https://discourse.threejs.org/ 4. even you can use unity or unreal to publish html5 content but i don't think that would be acceptable in many cases. 5. open-source project. i created a running sample with React  https://stackblitz.com/edit/react-7n5qf9?file=src%2FApp.js