以下是我整理的三種物件表現方式:
一、
bike = new Object();
bike.maker = '光陽';
bike.year = 2007;
bike.color = '紅色';
bike.draw = function(){document.write(this.maker + this.year + this.color);}
bike.draw();
二、
bike = {
maker: '光陽',
year: 2007,
color: '紅色',
draw: function(){document.write(this.maker + this.year + this.color);}
}
bike.draw();
三、
function bike(maker, year, color){
this.maker = maker;
this.year = year;
this.color = color;
this.draw = function(){document.write(this.maker + this.year + this.color);}
}
John = new bike('SYM',2008,'紅色');
Tom = new bike('Kymco'2010,'黑色');
John.draw();
Tom.draw();
如果要另外在某個物件加入屬性或方法,就直接以動態增加的方式進行
拿第三個方式來舉例
John.cc = '125';
John.hello = function(){document.write('123');}
John.hello(); //但是Tom.hello無法去使用hello()這個Method
另外也可以使用prototype的方式來增加物件屬性和方法,如下:
bike.prototype.cc = 0;
bike.prototype.change_cc = function(cc){this.cc = cc;}
bike.prototype.showall = function(){document.write(this.maker + this.year + this.color + this.cc);}
John.cc = 125;
Tom.change_cc(500);
John.showall();
Tom.showall();
再舉三個範例作參考:
面積計算:
function shape(x, y){
this.x = x;
this.y = y;
}
shape.prototype = {
getcoordinates: function(){
return "(" + this.x + "," + this.y +")";
}
};
function Rectangle(x, y, width, height){
shape.call(this,x,y);
this.width = width;
this.height = height;
}
Rectangle.prototype = new shape(); //跟extends一樣的功能
Rectangle.prototype.getArea = function(){
return this.width * this.height;
}
var obj = new Rectangle(100,200,5,10);
alert(obj.getcoordinates());
alert(obj.getArea());
裡面第五行到第九行,一般是不太建議這種寫法!!
人員類別:
function Person(name, age){
this.name = name;
this.age = age;
this.tostr = function(){
return .........
}
}
function Student(name, age, grade){
this.prototype = Person; //跟extends一樣的功能
this.prototype(name, age);
this.grade = grade;
圓面積計算:
function round(r){
var pi = 3.14159;
this.radius = r;
this.diameter = 2 * r;
function round_diameter(d){
return d * pi;
}
this.circumference = round_diameter(this.diameter);
var round_area = function(r){
return pi * Math.pow(r, 2);
};
this.area = round_area(this.radius);
沒有留言:
張貼留言