Creating the Hierarchy
There are several ways to define appropriate constructor functions to implement the Employee hierarchy. How you choose to define them depends largely on what you want to be able to do in your application.
This section shows how to use very simple (and comparatively inflexible) definitions to demonstrate how to get the inheritance to work. In these definitions, you cannot specify any property values when you create an object. The newly-created object simply gets the default values, which you can change at a later time. Figure 8.2 illustrates the hierarchy with these simple definitions.
In a real application, you would probably define constructors that allow you to provide property values at object creation time (see More Flexible Constructors for information). For now, these simple definitions demonstrate how the inheritance occurs.
Figure 8.2: The Employee object definitions
The following Java and JavaScript Employee
definitions are similar. The only differences are that you need to specify the type for each property in Java but not in JavaScript, and you need to create an explicit constructor method for the Java class.
JavaScript | Java |
---|---|
function Employee () { this.name = ""; this.dept = "general"; } | public class Employee { public String name; public String dept; public Employee () { this.name = ""; this.dept = "general"; } } |
The Manager
and WorkerBee
definitions show the difference in how to specify the next object higher in the inheritance chain. In JavaScript, you add a prototypical instance as the value of the prototype
property of the constructor function. You can do so at any time after you define the constructor. In Java, you specify the superclass within the class definition. You cannot change the superclass outside the class definition.
JavaScript | Java |
---|---|
function Manager () { this.reports = []; } Manager.prototype = new Employee; function WorkerBee () { this.projects = []; } WorkerBee.prototype = new Employee; | public class Manager extends Employee { public Employee[] reports; public Manager () { this.reports = new Employee[0]; } } public class WorkerBee extends Employee { public String[] projects; public WorkerBee () { this.projects = new String[0]; } } |
The Engineer
and SalesPerson
definitions create objects that descend from WorkerBee
and hence from Employee
. An object of these types has properties of all the objects above it in the chain. In addition, these definitions override the inherited value of the dept
property with new values specific to these objects.
JavaScript | Java |
---|---|
function SalesPerson () { this.dept = "sales"; this.quota = 100; } SalesPerson.prototype = new WorkerBee; function Engineer () { this.dept = "engineering"; this.machine = ""; } Engineer.prototype = new WorkerBee; | public class SalesPerson extends WorkerBee { public double quota; public SalesPerson () { this.dept = "sales"; this.quota = 100.0; } } public class Engineer extends WorkerBee { public String machine; public Engineer () { this.dept = "engineering"; this.machine = ""; } } |
Using these definitions, you can create instances of these objects that get the default values for their properties. Figure 8.3 illustrates using these JavaScript definitions to create new objects and shows the property values for the new objects.
Note: The term instance has a specific technical meaning in class-based languages. In these languages, an instance is an individual member of a class and is fundamentally different from a class. In JavaScript, "instance" does not have this technical meaning because JavaScript does not have this difference between classes and instances. However, in talking about JavaScript, "instance" can be used informally to mean an object created using a particular constructor function. So, in this example, you could informally say that jane
is an instance of Engineer
. Similarly, although the terms parent, child, ancestor, and descendant do not have formal meanings in JavaScript; you can use them informally to refer to objects higher or lower in the prototype chain.
Figure 8.3: Creating objects with simple definitions
{{ PreviousNext("Core_JavaScript_1.5_Guide:The_Employee_Example", "Core_JavaScript_1.5_Guide:The_Employee_Example:Object_Properties") }}
{{ languages( { "zh-tw": "zh_tw/Core_JavaScript_1.5_教學/職員的例子/階層的建立", "es": "es/Gu\u00eda_JavaScript_1.5/El_ejemplo_Employee/Creando_la_jerarqu\u00eda", "fr": "fr/Guide_JavaScript_1.5/L\'exemple_de_l\'employ\u00e9/Cr\u00e9ation_de_la_hi\u00e9rarchie", "ja": "ja/Core_JavaScript_1.5_Guide/The_Employee_Example/Creating_the_Hierarchy", "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Praca_z_przyk\u0142adem/Tworzenie_hierarchii" } ) }}