Microsoft AJAX Library Tutorial: Inheritance

Exercise Explanations

This is a OOP with Microsoft AJAX Library exercise from Chapter 5 of Microsoft AJAX Library Essentials: JavaScript in ASP.NET AJAX 1.0 Explained.

You're already familiar with the concept of inheritance. As an ASP.NET developer you know how inheritance works with C#, and you've learned about inheritance with JavaScript in Chapter 3.

The Microsoft AJAX Library implements a more involved mechanism for achieving inheritance. The Type class contains five register methods (registerBaseMethod(), registerClass(), registerInterface(), registerNamespace(), registerEnum()), which are used to initialize several fields such as the type name, the list of interfaces it implements, and the list of base classes.

When registering a class we can specify a base class and also an array of interfaces it implements. This additional information is stored inside the registered class's __baseType and __interfaces fields, and is used to implement the inheritance mechanism and to check for the correct use of base classes and interfaces.

The initializeBase() method is responsible for creating the impression of inheritance. You usually call this method in the fi rst line of the constructor of your class, and it executes the constructor of the base class and loads all the members of the base class. This mechanism, as implemented by the Microsoft AJAX Library, provides some improvements on the default JavaScript approach for inheritance.

The isInstanceOfType() and inheritsFrom() methods that your classes inherit from Type can be used to test if an object is of a specified type, or if a class derives from another (this is where the __baseType and __interfaces fields are used). For example, Person.isInstanceOfType(myObject) will return true if myObject is a Person object.

In the following exercise we'll create a new class named SmartPerson that inherits from Person, and adds a property named iq, which stores the person's IQ. The relationship between Person and SmartPerson is described in the class diagram in this figure:

Person-SmartPerson JavaScript Inheritance Diagram
Figure. Diagram representing SmartPerson inheriting from Person

We will also use inheritance to create a class named PersonPropertyChangedEventArgs, which derives from Sys. PropertyChangedEventArgs, and contains the old and new values of a change event. This class is created before calling _raiseEvent() in Person and will be passed as the second parameter when fi ring the change event. The class exposes three read-only properties:

This new class is presented below in this figure:

PersonPropertyChangedEventArgs JavaScript Class Diagram
Figure. Diagram representing AjaxTutorial.PersonPropertyChangedEventArgs inheriting from Sys.PropertyChangedEventArgs

In this exercise you create the PersonPropertyChangedEventArgs and SmartPerson classes.

Implement the exercise step by step and find detailed explanations in our book, Microsoft AJAX Library Essentials: JavaScript in ASP.NET AJAX 1.0 Explained.