本文通过一个具体的例子展示了如何在JavaScript中实现继承。定义了一个基础对象Machine，并创建了一个子对象CashRegister来继承Machine的部分属性。CashRegister不仅继承了Machine的属性，还定义了自身特有的属性。
这是一个HTML文件 ，我们可以看到JavaScript的继承使用了原型链的方式，一环又一环的继承了子类的一些属性。
<!-- ------ OBJECTIVES ---- 1. Illustrate Inerhitance using JavaScript 2. Define a base object called Machine 3. Create sub object called CashRegister that inherits attributes from Machine --> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>JavaScript - Inheritance Exercise</title> </head> <body> <p> <mce:script language="JavaScript" type="text/JavaScript"><!-- // ************************************************************************ //Define a Machine object // ************************************************************************ function Machine() { //Add attributes to the Machine this.startingCash = 0; this.usedByEmployee = "Employee has not be assigned"; } // ************************************************************************ // Define a CashRegister object // ************************************************************************ function CashRegister() { //Add attributes to the CashRegister this.startingCash = 1000; this.tax = .07; } // ************************************************************************ // Use the CashRegister prototype to inherit from Machine // ************************************************************************ CashRegister.prototype = new Machine(); //Use the CashRegister prototype to inherit from Machine CashRegister.prototype.getStartingCash = function() { return this.startingCash; } // ************************************************************************ // Use the CashRegister prototype to access Machine attributes // ************************************************************************ CashRegister.prototype.getUsedByEmployee = function() { return this.usedByEmployee; } // ************************************************************************ // Define a JavaScript function to drive the test // ************************************************************************ function performTest() { // ************************************************************************ // Create an instance of myCashRegister // ************************************************************************ var myCashRegister= new CashRegister(); // ************************************************************************ // Access the redifined attribute of CashRegister // ************************************************************************ alert("The Starting Cash is: " + myCashRegister.getStartingCash() ); // ************************************************************************ // Access the base attribute of CashRegister // ************************************************************************ alert("The Used By Employee Cash is: " + myCashRegister.getUsedByEmployee() ); } // --></mce:script> </p> <p align="center"><font size="+3" face="Arial, Helvetica, sans-serif">Inheritance Example</font></p> <p align="center"></p> <form name="form1" method="post" action=""> <div align="center"> <!-- Add button to call JavaScript function --> <input type="button" name="peformTest" value="Perform Test" onclick="javascript:performTest()"> </div> </form> </body> </html>
扫一扫
358
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
