`
xwood
  • 浏览: 103410 次
  • 性别: Icon_minigender_1
  • 来自: 成都
社区版块
存档分类
最新评论

JS类的创建

 
阅读更多
1、工厂方式:创建能创建并返回特定类型的工厂函数creator:
  如:
function createCar(sColor,iDoors,iMpg){
    var oTempCar = new Object();
    oTmepCar.color = sColor;
    oTmepCar.doors= iDoors;
    oTmepCar.mpg= iMpg;
    oTmepCar.showColor = funtion (){
        alert (this.color);
    };
    return oTempCar;
}

var oCar1 = createCar('red',4,23);
var oCar1 = createCar('blue',3,25);
oCar1.showColor();
oCar2.showColor();


2、构造函数方式:创建一个构造函数(构造函数的首字母大写)
  如:
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',3,25);
var oCar2 = new Car('blue',5,25);


注:以上两种方式在创建对象时,对于可以共享的showColor()方法均进行了创建,也即有多少个对象便创建了多少个方法;

3、原型方式:该方式利用了对象的prototype属性,可以把它看成是创建新对象所依赖的原型。这种可以削除了上述不足,但是它只能在对象创建完成之后才能更改对象的属性,并且由于所创建的对象中的属性对于对象的引用,使得改变其中一个由对象创建的属性,其它的由此方法创建的对象的属性也会发生改变。如下例中的drivers,是Array对象的引用,所以当oCar1的drivers改变时,oCar2的drivers也会发生改变;
如:
function Car(){}
Car.prototype.color = 'red';
Car.prototype.doors = '4';
Car.prototype.mpg = '25';
Car.prototype.drivers = new Array('a','b');
Car.prototype.showColor = function (){
    alert(this.color);
};
var oCar1 = new Car();
var oCar2 = new Car();


4、混合的构造函数/原型方式:该方法结合了构造函数和原型方式的优点;
  如:
function Car(sColor,iDoors,iMpg){
    this.color = sColor;
    this.doors = iDoors;
    this.mpg = iMpg;
    this.drivers = new Array('a','b');
}
Car.prototype.showColor = function (){
    alert(this.color);
}
var oCar1 = new Car('red',3,25);
var oCar2 = new Car('blue',5,25);


5、动态原型方法(推荐方法):该方法通过检测对象否已经被创建决定是否创建相应函数。
如:
function Car(sColor,iDoors,iMpg){
    this.color = sColor;
    this.doors = iDoors;
    this.mpg = iMpg;
    this.drivers = new Array('a','b');
    if(typeof Car._initialized == "undefined"){
        Car.prototype.showColor = function (){
            alert(this.color);
        }
        Car._initialized = true;
    }
}
分享到:
评论

相关推荐

    在js中创建类和对象

    在JavaScript中,创建类和对象是面向对象编程的基础。本文将详细介绍几种常见的创建对象的方法,包括它们的特点和优缺点。 5.1 工厂方法 工厂方法是一种创建对象的模式,通过一个函数来创建具有特定属性和行为的...

    jstree创建无限分级树的方法【基于ajax动态创建子节点】.docx

    jstree 是一个基于 JavaScript 的树形控件,可以用来创建复杂的树形结构。今天,我们将讨论如何使用 jstree 创建无限分级树,并基于 AJAX 动态创建子节点。 创建无限分级树的步骤 1. 首先,我们需要定义一个 Menu...

    js对象创建,事件委托测试

    js对象创建,事件委托测试,this apply call

    js动态条目添加

    "js动态条目添加"这个主题聚焦于如何利用JavaScript来实现网页内容的动态添加,而CSS则扮演着为这些动态元素提供美观架构的角色。这里我们将深入探讨这两个技术的核心概念、相互配合的方式以及实际应用。 ...

    ThreeJS创建天空盒的几种方法

    - **Three.js**:Three.js是WebGL的一个高级封装库,提供了一系列方便的类和方法,简化了3D图形编程。 ### 2. 创建天空盒的方法 #### 方法一:使用CubeGeometry和CubeMaterial 1. **创建CubeGeometry**:首先,...

    js如何创建类和对象(10分钟的收益)

    JavaScript 是一种基于原型的面向对象编程语言,它允许开发者创建自定义的类和对象,以实现更加灵活和可复用的代码结构。在JavaScript中,类的概念是通过构造函数和原型链来模拟的。以下是对JavaScript创建类和对象...

    el.js, 本机javascript类和创建dom对象的方法.zip

    el.js, 本机javascript类和创建dom对象的方法 el.js用于创建元素的简单Javascript库,不需要其他库示例:元素的创建创建一个没有属性的简单元素el('div')=> <div></div>一些vanity方

    java 创建系统菜单 Dtree.js

    `Dtree.js`是一个JavaScript组件,专为创建树形菜单而设计。本文将详细介绍如何利用`Dtree.js`在Java环境中构建动态的、交互式的树型菜单,以及这个组件的一些关键特性。 首先,`Dtree.js`是一个轻量级的JavaScript...

    javascript对象创建

    本文将深入探讨JavaScript中的对象创建方式,包括类和继承的概念。 首先,让我们从最基础的创建对象的方式开始。在JavaScript中,可以使用字面量语法来创建一个简单的对象: ```javascript var obj = { name: '...

    js 创建 div层

    在JavaScript中创建动态的div层是一项常见的任务,特别是在构建交互式网页或动态用户界面时。div元素是HTML中的一种块级元素,常被用来组织页面布局。本篇将详细介绍如何利用JavaScript来创建、操作和关闭div层,并...

    javascript div弹出窗口 可封装为JS类

    在本案例中,"可封装为JS类"意味着开发者创建了一个可复用的JavaScript对象,该对象可以方便地管理和控制这些弹出窗口。 首先,让我们了解`div`元素。在HTML中,`<div>`是“division”(分隔)的缩写,是一个通用的...

    javascript后台调用的工具类

    通过C#,开发者可以创建JavaScript库或包装JavaScript函数,以便在C#环境中调用。 在实际应用中,这个工具类可能会包含以下功能: 1. **数据类型转换**:JavaScript的数据类型灵活多变,工具类可能提供将...

    自定义JS类框架

    "自定义JS类框架"指的是开发者根据自身需求,利用JavaScript语言特性(如原型链、闭包、模块化等)和jQuery库,构建的一种自定义的框架。这个框架可能是为了简化DOM操作、提供更高级别的API、优化性能或者实现特定的...

    一个JS类(收藏)

    Prototype.js利用这一点,让JavaScript具备了类的特性,允许开发者定义类并创建实例。 在Prototype.js中,我们可以使用`Class.create()`来创建一个新的类,这个类具有一个默认的构造函数。例如: ```javascript ...

    JavaScript模仿当当网首页剥离的36类商品分类JS菜单demo

    本示例中的“JavaScript模仿当当网首页剥离的36类商品分类JS菜单demo”旨在帮助开发者理解如何用JavaScript实现一个功能完备、用户体验良好的商品分类导航系统。 首先,这个项目的核心在于利用JavaScript的DOM操作...

    创建js日志对象代替alert函数进行调试的例子

    此例子展示了如何使用面向对象的方式创建一个JS日志对象,它允许开发者在不中断页面执行的情况下收集和查看日志信息。这种做法不仅提高了调试效率,还改善了用户在调试过程中的体验。此外,你可以根据需求扩展这个...

    WebGL/ThreeJS创建立体文字TextGeometry

    在Three.js中,`TextGeometry`是用于创建3D文字的一个类,它可以让我们轻松地在3D场景中生成具有立体效果的文字。下面将详细介绍如何使用Three.js的`TextGeometry`来创建立体文字。 首先,我们需要引入Three.js库。...

    通用不间断滚动JS封装类

    在这个场景下,"通用不间断滚动JS封装类"可能是一个自定义的JavaScript类,它包含了实现滚动效果所需的所有方法和属性。 描述中提到的博文链接(https://aina5626.iteye.com/blog/1201724)是深入理解这个封装类的...

    javascript写类方式之六

    尽管没有具体的代码,但可以想象它可能包含了一个使用上述类方式实现的JavaScript类。通过分析这个文件,我们可以学习到实际编程中类的运用,以及如何将理论知识应用到实践中。 总结起来,JavaScript的类方式多种...

Global site tag (gtag.js) - Google Analytics