JavaScript中定义类或对象
来源:互联网 发布:exec php 不阻塞执行 编辑:程序博客网 时间:2024/06/10 04:14
1,对象的构成
对象有特性构成(attribute),可以是原始值,也可以是引用值。如果特性存放的是函数,它将被看做对象的方法(method),否则该特性被看做属性(property)。
2,定义类或对象
(1)工厂方式
Code
function createCar(sColor,iDoors) {
var oTempCar = new Object;
oTempCar.color = sColor;
oTempCar.doors = iDoors;
oTempCar.showColor = function() {
alert(this.color);
};
return oTempCar;
}
var oCar1 = createCar("red",4);
var oCar2 = createCar("blue", 3);
oCar1.showColor(); //Output "red"
oCar2.showColor(); //Output "blue"
function createCar(sColor,iDoors) {
var oTempCar = new Object;
oTempCar.color = sColor;
oTempCar.doors = iDoors;
oTempCar.showColor = function() {
alert(this.color);
};
return oTempCar;
}
var oCar1 = createCar("red",4);
var oCar2 = createCar("blue", 3);
oCar1.showColor(); //Output "red"
oCar2.showColor(); //Output "blue"
缺点:
每次调用函数createCar()时,都要创建新函数showColor(),意味着每个对象都有自己的showColor()版本。
改进:
function showColor() {
alert(this.color);
}
function createCar(sColor,iDoors) {
var oTempCar = new Object;
oTempCar.color = sColor;
oTempCar.doors = iDoors;
oTempCar.showColor = showColor;
return oTempCar;
}
var oCar1 = createCar("red",4);
var oCar2 = createCar("blue", 3);
oCar1.showColor();
oCar2.showColor();
alert(this.color);
}
function createCar(sColor,iDoors) {
var oTempCar = new Object;
oTempCar.color = sColor;
oTempCar.doors = iDoors;
oTempCar.showColor = showColor;
return oTempCar;
}
var oCar1 = createCar("red",4);
var oCar2 = createCar("blue", 3);
oCar1.showColor();
oCar2.showColor();
但是该函数看起来不像对象的方法。所以就有了构造函数的出现。
(2)构造函数方式
function Car(sColor, iDoors) {
this.color = sColor;
this.doors = iDoors;
this.showColor = function() {
alert(this.color);
};
}
var oCar1 = new Car("red", 4);
var oCar2 = new Car("blue", 3);
this.color = sColor;
this.doors = iDoors;
this.showColor = function() {
alert(this.color);
};
}
var oCar1 = new Car("red", 4);
var oCar2 = new Car("blue", 3);
通常构造函数的首字母要大写。
就想工厂函数一样,构造函数也会同样重复生成函数,为每个对象创建独立的函数版本。
(3)原型方式
function Car() {
}
Car.prototype.color = "red";
Car.prototype.doors = 4;
Car.prototype.showColor = function() {
alert(this.color);
};
var oCar1 = new Car();
var oCar2 = new Car();
}
Car.prototype.color = "red";
Car.prototype.doors = 4;
Car.prototype.showColor = function() {
alert(this.color);
};
var oCar1 = new Car();
var oCar2 = new Car();
缺点:
原型方式的构造函数没有参数。他不能通过传参来初始化属性的值。还有,当属性指向的是对象时,还会造成对象共享。如下:
function Car() {
}
Car.prototype.color = "red";
Car.prototype.doors = 4;
Car.prototype.drivers = new Array("Mike", "Sue");
Car.prototype.showColor = function() {
alert(this.color);
};
var oCar1 = new Car();
var oCar2 = new Car();
oCar1.drivers.push("Matt");
alert(oCar1.drivers); //output "Mike,Sue,Matt"
alert(oCar2.drivers); //output "Mike,Sue,Matt"
}
Car.prototype.color = "red";
Car.prototype.doors = 4;
Car.prototype.drivers = new Array("Mike", "Sue");
Car.prototype.showColor = function() {
alert(this.color);
};
var oCar1 = new Car();
var oCar2 = new Car();
oCar1.drivers.push("Matt");
alert(oCar1.drivers); //output "Mike,Sue,Matt"
alert(oCar2.drivers); //output "Mike,Sue,Matt"
(4)混合的构造函数/原型方式
function Car(sColor, iDoors) {
this.color = sColor;
this.doors = iDoors;
this.drivers = new Array("Mike", "Sue");
}
Car.prototype.showColor = function() {
alert(this.color);
};
var oCar1 = new Car("red", 4);
var oCar2 = new Car("blue", 3);
oCar1.drivers.push("Matt");
alert(oCar1.drivers); //output "Mike,Sue,Matt"
alert(oCar2.drivers); //output "Mike,Sue
this.color = sColor;
this.doors = iDoors;
this.drivers = new Array("Mike", "Sue");
}
Car.prototype.showColor = function() {
alert(this.color);
};
var oCar1 = new Car("red", 4);
var oCar2 = new Car("blue", 3);
oCar1.drivers.push("Matt");
alert(oCar1.drivers); //output "Mike,Sue,Matt"
alert(oCar2.drivers); //output "Mike,Sue
现在就响创建一般对象一样,所有的非函数属性都在构造函数中创建,而且只创建一个showColor()函数。此外,给oCar1的drivers数组添加“Matt”值,不会影响oCar2的数组。
因此这种方式是ECMAScript采用的主要方式。它具有其他方式的特性,却没有它们的副作用。
(5)动态原型方式
function Car(sColor, iDoors) {
this.color = sColor;
this.doors = iDoors;
this.drivers = new Array("Mike", "Sue");
if (typeof Car._initialized == "undefined") {
Car.prototype.showColor = function() {
alert(this.color);
};
Car._initialized = true;
};
}
this.color = sColor;
this.doors = iDoors;
this.drivers = new Array("Mike", "Sue");
if (typeof Car._initialized == "undefined") {
Car.prototype.showColor = function() {
alert(this.color);
};
Car._initialized = true;
};
}
目前使用最广泛的是混合的构造函数/原型方式。此外,动态原型方式也很流行。
- JavaScript中定义类或对象
- JavaScript中定义类或对象
- JavaScript中定义类或对象
- JavaScript 定义类或对象
- javascript定义类或对象
- JavaScript 定义类或对象
- JavaScript定义类或对象
- javaScript中定义类或对象的五种方式
- javaScript中定义类或对象的五种方式
- javaScript中定义类或对象的五种方式
- JavaScript如何定义类或对象
- ECMAScript(JavaScript) 定义类或对象
- javascript初学者记录--定义类或对象
- ECMAScript(JavaScript) 定义类或对象
- JS中类或对象的定义
- javascript定义类或对象的四种方式
- Javascript定义类或对象之动态原型法
- JavaScript之定义类或对象六种方式
- Enterprise Library Library Logging Application Block 记录日志到数据库中
- 看源代码
- Linq 入门
- Enterprise Library Library Data Access Application Block Step By Step
- mysql基本命令
- JavaScript中定义类或对象
- 苹果电脑以及iPhone上截屏的方法介绍
- ASP.NET MVC 中的View介绍(1)
- 苹果把创新用到了极致: 最新触摸式鼠标,帅呆了
- XSL EXAMPLE
- 利用JNative调用MediaInfo.dll
- Oracle命令1
- C primer plus 一到五章
- CE找基址及偏移教程