JavaScript Tutorial/Object Oriented/Member Function
Содержание
- 1 Adding method to a class using prototype
- 2 <SCRIPT> // constructor function function Rectangle(height, width){ this.height = height; this.width = width; } function getArea () { return this.height * this.width; } // turn the function into an object method Rectangle.prototype.calcArea = getArea; var theRectangle = new Rectangle (3, 5); theRectangle.width = 10; document.write("The rectangle instance height is: " + theRectangle.height + ""); document.write("The rectangle instance width is: " + theRectangle.width + ""); document.write ("The calcArea method returns: " + theRectangle.calcArea()); </SCRIPT>
- 3 <SCRIPT> function Rectangle(height, width){ this.height = height; this.width = width; } function calc_Area () { return this.height * this.width; } function to_String() { return this.height + " by " +this.width; } Rectangle.prototype.calcArea = calc_Area; Rectangle.prototype.toString = to_String; var theRectangle = new Rectangle (2, 42); document.write(theRectangle); </SCRIPT>
Adding method to a class using prototype
<source lang="javascript">
<HTML> <HEAD> <TITLE>Instance method demo</TITLE> </HEAD>
<BODY>
<SCRIPT>
// constructor function
function Rectangle(height, width){
this.height = height;
this.width = width;
}
function getArea () {
return this.height * this.width;
}
// turn the function into an object method
Rectangle.prototype.calcArea = getArea;
var theRectangle = new Rectangle (3, 5);
theRectangle.width = 10;
document.write("The rectangle instance height is: " + theRectangle.height + "
");
document.write("The rectangle instance width is: " + theRectangle.width + "
");
document.write ("The calcArea method returns: " + theRectangle.calcArea());
</SCRIPT>
</BODY>
</HTML></source>
Add member function
<source lang="javascript">
<html> <head> <title>Example</title> </head> <body> <script type="text/javascript"> function myObj() {
alert("hi");
} myObj.alternate = function() {
alert("hola");
}; myObj(); myObj.alternate(); </script> </body> </html></source>
Call object member function
<source lang="javascript">
<html> <head> <title>Example</title> </head> <body> <script type="text/javascript"> function createCar(color, doors, mpg) {
var tempcar = new Object; tempcar.color = color; tempcar.doors = doors; tempcar.mpg = mpg; tempcar.showColor = function () { alert(this.color) }; return tempcar;
} var car1 = createCar("red", 4, 23); var car2 = createCar("blue", 3, 25); car1.showColor(); car2.showColor();
</script> </body> </html></source>
Create an Object with member method
<source lang="javascript">
<html> <head> <script language="Javascript" type = "text/javascript">
</script> </head> <body> </body> </html></source>
Custom objects and associative object arrays
<source lang="javascript">
<HTML> <HEAD>
<TITLE>Custom objects and associative object arrays</TITLE>
<SCRIPT> function showProperties (theObject){
for (i in theObject) { if (theObject[i] != null) { document.write(i + " : " + theObject[i] + "
"); } else { document.write(i + "
"); } } return;
} </SCRIPT> </HEAD> <BODY> <SCRIPT> // constructor function function Rectangle(height, width){
this.height = height; this.width = width;
} function calc_Area () {
return this.height * this.width;
} // turn the function into an object method Rectangle.prototype.calcArea = calc_Area; var theRectangle = new Rectangle (3, 5); theRectangle.width = 10; showProperties (theRectangle); </SCRIPT> </BODY> </HTML></source>
Defining the object methods outside of the factory functions and then pointing to them
<source lang="javascript">
function showColor() {
alert(this.color);
} function createObject(sColor, iDoors) {
var bufObject = new Object; bufObject.color = sColor; bufObject.doors = iDoors; bufObject.showColor = showColor; return bufObject;
} var myHourse1 = createObject("red", 4); var myHourse2 = createObject("blue",3); myHourse1.showColor(); myHourse2.showColor();</source>
Instance method
<source lang="javascript">
<HTML> <HEAD> <TITLE>Instance method demo</TITLE> </HEAD>
<BODY>
<SCRIPT> function Rectangle(height, width){ this.height = height; this.width = width; } function calc_Area () { return this.height * this.width; } function to_String() { return this.height + " by " +this.width; } Rectangle.prototype.calcArea = calc_Area; Rectangle.prototype.toString = to_String; var theRectangle = new Rectangle (2, 42); document.write(theRectangle); </SCRIPT>
</BODY>
</HTML></source>