By 06/07/2015 13 Comments

Create Classes And Objects In TypeScript

Class Definition:

A class just is a template, the blue print, the definition, the logical abstraction, an idea that only defines the form of an object. It is also a set of plans which specifies how an object will be created. Example of classes (Mark sheet, User, Bank account, Button, Date, Media player etc.). It is like a wrapper which defines the attributes and behavior inside it. A class is a user defined type.

Attribute And Behavior:

An attribute is a characteristic of each object in real world examples. Suppose we have a Mark sheet class, a mark sheet class defines each subject names, subject marks, student name, student address etc. as its attributes and percentage, total marks, obtain marks, grade etc. as its behavior. In C# the attributes are called properties and behaviors are called functions. In classes Attributes are data, a fields or a variables of different types and behaviors are methods or functions, these functions operates or modifies the properties. Some classes defines only properties in this case these properties are called data members of a class. Some classes defines only functions which is called function member of a class. In real world object oriented programing a class contains both functions and properties which are collectively called class members. A class also contains other members such as delegates, auto properties etc. as its members.

Syntax Of A Class Declaration:


class ClassName{
  Members (any class member)
}

class ClassName

  • A class declaration with class keyword and its name.

{

  • A class definition starting scope.

Members (any class member)

  • This statement is called class members. The class members can be properties, functions, anything else etc.

}

  • A class definition closing scope.

Example – 1, A Class Declaration:

class MarkSheet { // declare a class MarkSheet, start its scope.

/* Following is the initialization of string and number type class attributes/properties, here these attributes are called fields. */
    studentName: string = "Abc";
    address: string = "Xyz";
    tsMarks: number = 95;
    aspMarks: number = 80;

} // End class definition scope.
  • At this point, above you have created a class, which describes only definition of a Mark sheet not a Mark sheet itself. Remember this class does not have physical existence and cannot do anything, this is just a blue print, template or a logical abstraction until its object will be created.
  • It is just an idea about how an actual Mark sheet will be created. At this point this Mark sheet has no any specific information until its object will be created.
  • Many objects can be created from this Mark sheet template.

Object Definition:

  • The object is a thing which is a real creation or implementation of a class (means physical creation of a class), which has physical existence.
  • It is an instance of a class.
  • Programmatically an object is a block of memory which has been allocated and configured according to a class during runtime.
  • According to above Mark sheet class, when we create its object it means we are creating or implementing an actual or real mark sheet object which will have physical reality.
  • We can create multiple different types of objects from that Mark sheet class or multiple Mark sheets can be created from same Mark sheet template or blueprint, each Mark sheet will have its own information, attributes and behavior.

 Syntax Of an Object Creation:

var refVariable :  ClassName  = new ClassName();

Suppose we create the object of an above Mark sheet class as following:

var markSheet: MarkSheet = new MarkSheet();

Following is the description of above code:

/* Declare a reference local variable which is used to hold the reference returned by the object MarkSheet after creation.*/
var markSheet:

/* This is the Mark sheet class name which can be described as “It is a user defined type (a class type) declared”.*/
MarkSheet

/* The assignment operator which assigns the reference to reference variable (var markSheet).*/
=

/* The new operator dynamically allocates a block of memory space (at run time) for an object and returns a reference to it, at this point the actual object (MarkSheet) is created*/
new MarkSheet();

/* This statement defines the constructor for that class (MarkSheet).*/
MarkSheet();

Example – 2, Complete Example Of A MarkSheet Class:

class MarkSheet { // declare a class MarkSheet, start its scope.

/* Following is the initialization of string and number type class attributes/properties, here these attributes are called fields. */
    studentName: string = "Abc";
    address: string = "Xyz";
    tsMarks: number = 95;
    aspMarks: number = 80;

} // End class definition scope.

/* Following statement creates the object of a class MarkSheet or creates an actual mark sheet. */
var markSheet: MarkSheet = new MarkSheet();

/* Following statements print the different kind of information of a Mark sheet by using the reference variable (markSheet) of type MarkSheet class followed by dot operator (.), dot operator links a class member with a reference variable. */
document.write("Mark sheet object: <br/>");

document.write("Student name: " + markSheet.studentName + "<br/>");
document.write("Address: " + markSheet.address + "<br/>");
document.write("TypeScript marks: " + markSheet.tsMarks + "<br/>");
document.write("Asp.net marks: " + markSheet.aspMarks);

Above Program Can Also Be Written As Bellow:

class MarkSheet { // declare a class MarkSheet, start its scope.

/* Notice, in this example we do not initialize properties in this class, we just declared these properties. */
    studentName: string;
    address: string;
    tsMarks: number;
    aspMarks: number;

} // End class definition scope.

/* Following statement creates the object of a class MarkSheet or creates an actual mark sheet. */
var markSheet: MarkSheet = new MarkSheet();

/* Notice, following class properties are initialized outside a class method (not in class itself) with different kind of values. */
markSheet.studentName = "Abc";
markSheet.address = "Xyz";
markSheet.tsMarks = 95;
markSheet.aspMarks = 80;

/* Following statements print the different kind of information of a Mark sheet by using the reference variable (markSheet) of type MarkSheet class followed by dot operator (.), dot operator links a class member with a reference variable. */
document.write("Mark sheet object: <br/>");

document.write("Student name: " + markSheet.studentName + "<br/>");
document.write("Address: " + markSheet.address + "<br/>");
document.write("TypeScript marks: " + markSheet.tsMarks + "<br/>");
document.write("Asp.net marks: " + markSheet.aspMarks);






← Previous Tutorial


Leave your valuable Comment

Have a natural attraction for women cosmetics and replica watches uk clothes, no
more than two for men the most attractive one, is to make their own driving experience, happy and can serve as the facade of the car, another is to highlight the taste edify sentiment rolex replica watch. The replica rolex is undoubtedly the most fashionable accessories, wear a suit to attend the activities, but also get a decent match on the replica watches .