`
yiyu
  • 浏览: 187011 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

javascript中定义类的几种方法

阅读更多

在javascript中有几种定义类的方式,以下分别列出并说明了其存在的问题,其中Hybrid constructor/prototype方式是推荐采用的方式。

1. Factory

定义一个工厂函数,函数中创建新的对象,定义属性及方法,然后返回该对象。
以下是一个工厂函数的例子:
function createCar() {
	var oTempCar = new Object;
	oTempCar.color = "red";
	oTempCar.doors = 4;
	oTempCar.mpg = 23;
	oTempCar.showColor = function () {
		alert(this.color)
	};
	
	return oTempCar;
}

创建新对象的代码是这样的:
var oCar1 = createCar();
var oCar2 = createCar();

这样存在一个问题,就是每次创建新对象时,都会产生一个新的方法showColor的副本,因此可以这样写:
function showColor() {
	alert(this.color);
}

function createCar(sColor, iDoors, iMpg) {
	var oTempCar = new Object;
	oTempCar.color = sColor;
	oTempCar.doors = iDoors;
	oTempCar.mpg = iMpg;
	oTempCar.showColor = showColor;
	return oTempCar;
}

2. Constructor

构造器的写法与工厂方法类似,但是可以使用new创建对象,示例代码如下:
function Car(sColor, iDoors, iMpg) {
	this.color = sColor;
	this.doors = iDoors;
	this.mpg = iMpg;
	this.showColor = function () {
		alert(this.color)
	};
}

var oCar1 = new Car("red", 4, 23);
var oCar2 = new Car("blue", 3, 25);

对于方法showColor存在同样的问题,也可以用同样的方法解决该问题。

3. Prototype

可以利用Object的prototype属性定义类,以下是示例代码:
function Car() {
}

Car.prototype.color = "red";
Car.prototype.doors = 4;
Car.prototype.mpg = 23;
Car.prototype.showColor = function () {
	alert(this.color);
};

var oCar1 = new Car();
var oCar2 = new Car();

使用这种方式新创建的对象的属性和方法指向相同的实例,对于方法这解决了创建不同副本的问题,但是对于属性,这是一个严重问题,因为修改一个对象的属性就会同时影响其他对象的属性。所以要使用constructor/prototype的混合方法。

4. Hybrid constructor/prototype

这种方式是使用prototype方式定义方法,方法以外的元素用构造器的方式定义,示例代码如下:
function Car(sColor, iDoors, iMpg) {
	this.color = sColor;
	this.doors = iDoors;
	this.mpg = iMpg;
	this.drivers = new Array("Mike", "Sue");
}

Car.prototype.showColor = function () {
	alert(this.color);
};

var oCar1 = new Car("red", 4, 23);
var oCar2 = new Car("blue", 3, 25);

5. Dynamic prototype

这种方式与java很相似,示例代码如下:
function Car(sColor, iDoors, iMpg) {
	this.color = sColor;
	this.doors = iDoors;
	this.mpg = iMpg;
	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中定义类或函数,主要有以下几种方式: 1. 工厂方式 工厂方式是JavaScript中创建对象的一种模式,它通过一个工厂函数来封装创建对象的代码。通过工厂函数,我们可以创建多个具有相同属性和方法的对象实例...

    JAVASCRIPT中定义对象的几种方式.pdf

    了解了JavaScript中定义对象的几种方式之后,我们可以根据实际的应用场景和需求选择最合适的方法。例如,对于简单对象的创建,对象字面量最为合适;对于复杂对象,如需继承或有明确构造逻辑时,构造函数或类则更为...

    javascript中定义类的方法汇总

    在JavaScript中,定义类的方法多种多样,这使得开发者可以根据需求选择最合适的方式来创建对象。以下是几种主要的方法: 1. **工厂方式**: 工厂模式是一种创建对象的模式,通过函数来模拟类的概念。在JavaScript...

    javascript数组定义的几种方法

    主要介绍了javascript数组定义的几种方法,一般来说分为隐式创建、直接实例化、创建数组并指定长度、后来为了方便直接使用json格式定义数组,这里脚本之家小编就为大家介绍一下,需要的朋友可以参考一下

    javascript中定义类的方法详解

    在JavaScript中定义类的方法主要有以下几种方式: 1. 工厂方式: 工厂方式是一种创建对象的模式,这种模式中,定义了一个函数用于返回一个新对象,这个对象具有预设的属性和方法。这种方式的好处是不需要直接使用...

    JavaScript中定义类的方式详解

    以上就是JavaScript中定义类的几种常见方式,虽然它们没有像其他面向对象语言那样提供显式的`class`关键字,但JavaScript的灵活性使得开发者可以通过这些技巧实现面向对象编程的需求。在实际开发中,随着ES6的引入,...

    在JavaScript中实现类的方式探讨

    在JavaScript中实现类的方式主要有几种,包括对象字面量(Object Literal)、构造函数(Constructor)、原型链(Prototype Chain)以及ES6引入的类语法。每种方式都有其适用的场景和特点,理解它们有助于我们更好地...

    关于JavaScript定义类和对象的几种方式

    本文将详细介绍在JavaScript中定义类和对象的几种主要方式,包括直接量方式、工厂方式以及原型方式,并探讨与之相关的变量声明提升(hoisting)机制和对象属性绑定机制。 首先,我们来看JavaScript中的一个有趣现象...

    javascript面向对象编程的几种模式详解

    以下是对标题和描述中提到的几种JavaScript面向对象编程模式的详细解释: 1. **构造函数与字面量结合模式** 在JavaScript中,我们可以通过构造函数和字面量语法来创建对象。构造函数用于定义对象的类型,而字面量...

    aspnet操作javascript类

    在ASP.NET中,我们可以通过以下几种方式使用JavaScript类: 1. **定义和实例化JavaScript对象**:在HTML或者JavaScript代码中,可以定义一个函数构造器,通过new关键字来创建对象实例。例如,定义一个名为Person的...

    04 React事件 方法、 React定义方法的几种方式 获取数据 改变数据 执行方法传值

    接下来,我们讨论React中定义方法的几种方式。主要有以下三种: 1. **类组件的方法**:在类组件中,我们可以直接在类的定义中定义方法。这些方法是组件实例的一部分,可以通过`this`关键字访问。例如: ```jsx ...

    在XHTML中嵌入JavaScript的方法

    在XHTML文档中嵌入JavaScript主要有以下几种方法: 1. **内部脚本**:可以直接在HTML文档的`<head>`或`<body>`标签内编写`<script>`标签来包含JavaScript代码。例如: ```html <script type="text/javascript"> ...

    javascript中创建对象的几种方法总结

    在JavaScript中,有几种常见的创建对象的方法,这里我们将详细探讨这些方法。 1. **对象字面量**:这是最简单且直观的创建对象的方式。通过大括号 `{}` 创建一个空对象,然后通过点`.`或方括号`[]`来添加属性和方法...

Global site tag (gtag.js) - Google Analytics