`

JS中定义类的方法

 
阅读更多

JS中定义类的方式有很多种:
1、工厂方式

function Car(){
var ocar = new Object;
ocar.color = "blue";
ocar.doors = 4;
ocar.showColor = function(){
document.write(this.color)
};
return ocar;
}
var car1 = Car();
var car2 = Car(); 调用此函数时将创建新对象,并赋予它所有的属性和方法。使用此函数可以创建2个属性完全相同的对象。当然我妹可以通过给它传递参数来改版这种方式。


function Car(color,door){
var ocar = new Object;
ocar.color = color;
ocar.doors = door;
ocar.showColor = function(){
document.write(this.color)
};
return ocar;
}
var car1 = Car("red",4);
var car2 = Car("blue",4);
car1.showColor() //output:"red"
car2.showColor() //output:"blue" 现在可以通过给函数传递不同的参数来得到具有不同值的对象。
在前面的例子中,每次调用函数Car(),都要创建showcolor(),意味着每个对象都有一个自己的showcolor()方法。

但是事实上,每个对象斗共享了同一个函数。
虽然可以在函数外定义方法,然后通过将函数的属性指向该方法。

function showColor(){
alert(this.color);
}
function Car(){
var ocar = new Object();
ocar.color = color;
ocar.doors = door;
ocar.showColor = showColor;
return ocar;
}
但是这样看起来不像是函数的方法。
2、构造函数方式
构造函数方式同工厂方式一样简单,如下所示:

function Car(color,door)...{
this.color = color;
this.doors = door;
this.showColor = function()...{
alert(this.color)
};
}
var car1 = new Car("red",4);
var car2 = new Car("blue",4);
可以看到构造函数方式在函数内部没有创建对象,是用this关键字。因为在调用构造函数时已经创建了对象,而在函数内部只能用this来访问对象属性。
现在用new来创建对象,看起来像那么回事了!但是它同工厂方式一样。每次调用都会为对象创建自己的方法。
3、原型方式
该方式利用了对象的prototype属性。首先用空函数创建类名,然后所有的属性和方法都被赋予prototype属性。

function Car()...{
}
Car.prototype.color = "red";
Car.prototype.doors = 4;
Car.prototype.showColor = function()...{
alert(this.color);
}
var car1 = new Car();
var car2 = new Car();
在这段代码中,首先定义了一个空函数,然后通过prototype属性来定义对象的属性。调用该函数时,原型的所有属性都会立即赋予要创建的对象,所有该函数的对象存放的都是指向showColor()的指针,语法上看起来都属于同一个对象。
但是这个函数没有参数,不能通过传递参数来初始化属性,必须要在对象创建后才能改变属性的默认值。
原型方式有个很严重的问题就是当属性指向的是对象时,如数组。

function Car(){
}
Car.prototype.color = "red";
Car.prototype.doors = 4;
Car.prototype.arr = new Array("a","b");
Car.prototype.showColor = function(){
alert(this.color);
}
var car1 = new Car();
var car2 = new Car();
car1.arr.push("cc");
alert(car1.arr); //output:aa,bb,cc
alert(car2.arr); //output:aa,bb,cc 这里由于数组的引用值,Car的两个对象指向的都是同一个数组,所以当在car1添加值后,在car2中也可以看到。
联合是用构造函数/原型方式就可以像其他程序设计语言一样创建对象,是用构造函数定义对象的非函数属性,用原型方式定义对象的方法。

function Car(color,door){
this.color = color;
this.doors = door;
this.arr = new Array("aa","bb");
}
Car.prototype.showColor(){
alert(this.color);
}
var car1 = new Car("red",4);
var car2 = new Car("blue",4);
car1.arr.push("cc");
alert(car1.arr); //output:aa,bb,cc
alert(car2.arr); //output:aa,bb
5、动态原型方式
动态原型的方式同混合的构造函数/原型方式原理相似。唯一的区别就是赋予对象方法的位置。

function Car(color,door){
this.color = color;
this.doors = door;
this.arr = new Array("aa","bb");
if(typeof Car._initialized == "undefined"){
Car.prototype.showColor = function(){
alert(this.color);
};
Car._initialized = true;
}
} 动态原型方式是使用一个标志来判断是否已经给原型赋予了方法。这样可以保证该方法只创建一次
6、混合工厂方式
它的目的师创建假构造函数,只返回另一种对象的新实例。

function Car(){
var ocar = new Object();
ocar.color = "red";
ocar.doors = 4;
ocar.showColor = function(){
alert(this.color)
};
return ocar;
}
与工厂方式所不同的是,这种方式使用new运算符。

以上就是全部的创建对象方法。目前使用最广泛的就是混合构造函数/原型方式,此外,动态原型方式也很流行。在功能上与构造函数/原型方式等价。

本文来自CSDN博客,转载请标明出处:http://blog.csdn.net/sdlfx/archive/2007/10/24/1842218.aspx

分享到:
评论

相关推荐

    JS定义类或对象

    ### JS定义类或对象 #### 一、JavaScript与对象概念 JavaScript是一种基于对象的脚本语言,这意味着在JavaScript中,对象扮演着非常重要的角色。在实际项目开发中,开发者经常通过`function fnname{…}`的方式直接...

    JS定义静态类

    不过,这里的代码示例看起来更像是模拟静态方法和属性的方式,并非现代JavaScript中标准的类定义方式。 ### 静态方法与属性的基本概念 在面向对象编程中,静态方法和属性通常与类而不是实例相关联。这意味着它们...

    js定义类 对象 构造函数,类的继承

    在提供的`ClassDefineAndExtends.js`文件中,可能包含了关于类定义和继承的示例代码。通过分析这个文件,我们可以看到实际应用中的类定义和继承实践,包括如何定义类,如何使用构造函数初始化对象,以及如何通过`...

    c# winform webbrowser页面中js调用winform类方法

    这个过程通常涉及到JavaScript(js)调用WinForm类的方法,以实现一些特定功能或者获取数据。本文将深入探讨如何实现这一功能,并基于提供的"jsInWebBrowserCallCSharpMethod"示例进行详细解释。 首先,我们需要...

    JS类中定义原型方法的两种实现的区别

    ### JS类中定义原型方法的两种实现的区别 #### 引言 在JavaScript中,通过类的形式定义对象是一种常见的做法。为了扩展类的功能或为类添加新的行为,开发者常常需要向类的原型(`prototype`)添加方法。在...

    JavaScript定义类的几种方式总结

    JavaScript定义类的几种方式包括工厂方式、构造函数和原型方式,每种方法都有其特点和适用场景,接下来我们将详细探讨。 工厂方式是最早期的面向对象编程在JavaScript中的实践之一。使用工厂方式定义类,本质上就是...

    javascript中定义类的方法汇总

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

    JS中自定义类和对象.doc

    ### JS中自定义类和对象知识点详解 #### 一、工厂方法 在JavaScript中,**工厂方法**是一种创建对象的模式。它通过定义一个函数来返回一个特定类型的对象,这种方式可以使代码更加简洁和通用。 ##### 示例 ```...

    Javascript定义类(class)的三种方法详解

    本文将详细解释三种在JavaScript中定义类的方法:构造函数法、Object.create()法以及极简主义法。 1. 构造函数法 构造函数法是最常见的模拟类的方式,通过使用函数作为类的模板。构造函数通常以大写字母开头,表示...

    requirejs实现的简单的类定义

    总结起来,RequireJS为我们提供了一种优雅的方式来组织和加载JavaScript代码,而结合类的定义和继承,我们可以构建复杂的面向对象应用程序。在实际项目中,我们还可以利用RequireJS的优化工具进行代码压缩和合并,...

    javascript 类方法定义还是有点区别

    JavaScript 是一种广泛应用于 Web 开发的动态编程语言,它的灵活性使得开发者有多种方式来定义和使用函数,包括作为类方法。在 JavaScript 中,类的概念是通过原型链和构造函数模拟实现的,而不是像其他面向对象语言...

    Javascript中定义方法的另类写法(批量定义js对象的方法)

    总之,Javascript中批量定义对象的方法提供了一种高效、简洁的替代传统方法的方式,能够简化代码并提高性能,但也需要注意代码可读性和维护性的潜在下降。在实际的项目开发中,我们可以根据具体的需求和环境来权衡...

    JavaScript定义类和对象的方法

    在JavaScript中定义类和对象的方法大致可以分为两类,一种是使用函数方式定义,另一种是先实例化Object类的方式定义。下面详细介绍这两种方法的实现和使用。 首先,函数方式定义类是最直观和常用的方法,它基于函数...

    js定义类的方法示例【ES5与ES6】

    在JavaScript中,定义类的方法主要有两种方式:ES5和ES6。这两种方式都是为了实现面向对象编程中的类的概念,使得代码更加模块化和易于管理。 ### ES5 定义类 在ES5中,我们通常使用构造函数和原型对象来模拟类的...

    android webview中使用Java调用JavaScript方法并获取返回值

    3. 在Java类中定义接收JavaScript回调的方法。 4. 在JavaScript代码中通过接口名字调用Java方法并传回数据。 5. 加载HTML内容至WebView,无论是通过URL还是直接加载本地HTML数据。 需要注意的是,为了确保应用的...

    Javascirpt定义类详细介绍

    在JavaScript中,`private`和`protected`主要影响类的静态属性和方法,以及类实例的属性和方法,但不会阻止直接访问它们。 - **getter和setter**:类允许定义访问器方法(getter和setter),用于控制属性的读取和...

    js调用java类的方法

    在Servlet中,你可以定义Java类及其方法,然后在JS中通过Ajax请求调用这些方法。Ajax(异步JavaScript和XML)允许页面在不重新加载整个网页的情况下与服务器交换数据并更新部分网页内容。 ```java // Java Servlet...

Global site tag (gtag.js) - Google Analytics