Javascript对象定义的几种方式

转载 2016年06月01日 21:36:35
Javascript对象定义的几种方式
一.工厂方式:先创建对象,再向对象添加方法和属性,封闭后调用不要使用new操作符创建对象。使用这种方法有很多弊端,把方法定义在工厂函数内部的时候,每次调用的时候都会产生新的函数
function factory(name,person,address,time){
    var tmp=new Object;
    tmp.name=name;
    tmp.person=person;
    tmp.address=address;
    tmp.workTime=function(){
        alert("we start to work at" + time);
    }
    return tmp;
}
var factory1=factory("drugs",100,"huashan Rd",10);
var factory2=factory("TCMdrugs",100,"hongqiao Rd",11);
factory1.workTime();
factory2.workTime();//Here,factory1 and factory2 have different method
对这种问题虽然可以用下面的方式改进,但是缺乏很好的封装性
function factory(name,person,address,time){
    var tmp=new Object;
    tmp.name=name;
    tmp.person=person;
    tmp.address=address;
    tmp.workTime=workTime();
    return tmp;
}
function workTime(){
    alert("we start to work at" + this.time);
}

二,构造函数方式,在构造函数内部不创建对象,使用this关键字,使用时候用new操作符,存在和工厂方式相同的问题,重复创建函数。
function counstruct(name,person,address,time){
    this.name=name;
    this.person=person;
    this.address=address;
    this.workTime=function(){
        alert("we start to work at" + this.time);
    };
}

三.原型方式:利用prototype属性来实现属性和方法,可以通过instanceof 检查对象类型,解决了重复创建函数的问题,但不能通过传递参数初始化属性
function Car(){
 
}
Car.prototype.color = "red";
Car.prototype.doors = 4;
Car.prototype.mpg = 23;
Car.prototype.showColor = function(){
    alert(this.color);
};
var car1 = new Car();
var car2 = new Car();
但是如果遇到下面的情况,又出问题了
Car.prototype.drivers = new Array("mike", "sue");
car1.drivers.push("matt");
alert(car1.drivers);  //outputs "mike,sue,matt"
alert(car2.drivers);  //outputs "mike,sue,matt"
drivers是指向Array对象的指针,Car的两个实例都指向同一个数组。
四.混合的构造函数/原型方式:针对原型方式的解决方案
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 car1 = new Car("red", 4, 23);
var car2 = new Car("blue", 3, 25);
car1.drivers.push("matt");
alert(car1.drivers);
alert(car2.drivers);
五.动态原型方式:这种方式是极力推荐的方式,避免了前面几种方式所出现的问题,提供了更友好的编码风格
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;
    }
}
 
var car1 = new Car("red", 4, 23);
var car2 = new Car("blue", 3, 25);
 
car1.drivers.push("matt");
alert(car1.drivers);
alert(car2.drivers);

六.混合工厂方式:和工厂方式有些相似,但采用new关键字实例化,具有和工厂方式相同的弊端,不推荐使用

简要描述 JavaScript 中定义函数的几种方式

JavaScript 中,有三种定义函数的方式: 1、函数语句:即使用 function 关键字显式定义函数。如:function f(x){ return x+1; }2、函数定义表达式:也称为“...
  • u012396955
  • u012396955
  • 2016年12月29日 16:39
  • 221

javaScript定义函数的三种方式

1,正常方法 function print(msg){     document.write(msg); } 对函数进行调用的几种方式:  函数名(传递给函数的参数1,传递给函数的参数2,…...
  • wk843620202
  • wk843620202
  • 2016年10月09日 16:10
  • 643

JavaScript基础——面向对象的程序设计(一)创建对象的几种方式总结

简介 面向对象(Object-Oriented, OO)的语言有一个标志,那就是它们都有类的概念,而通过类可以创建任意多个具有相同属性和方法的对象。前面提到过,ECMAScript中没有类的概念,因...
  • Goskalrie
  • Goskalrie
  • 2016年06月03日 13:09
  • 3469

JavaScript中的对象,如何创建对象,创建对象的7种模式

ECMA-262把对象定义为:”无需属性的集合,其属性可以包含基本值、对象或者函数。”严格来讲,这就相当于说明对象是一组没有特定顺序的值。对象的每个属性或方法都有一个名字,而每个名字都映射到一个值。正...
  • u014346301
  • u014346301
  • 2016年08月14日 16:33
  • 9618

JavaScript中定义对象的几种方式(JavaScript中没有类的概念,只有对象)

1)基于已有对象扩充其属性和方法 var object = new Object(); object.name = "kyle"; //添加属性name object.sayName = f...
  • silianlinyi
  • silianlinyi
  • 2012年05月28日 20:38
  • 2614

JS创建对象几种不同方法详解

1、工厂模式弊端:没有解决对象的识别问题,即怎么知道一个对象的类型。 2、构造函数模式 与工厂模式相比: 1、没有显式的创建对象 2、直接将属性和方法赋给了this对象 3、没有return...
  • liuyan19891230
  • liuyan19891230
  • 2016年02月29日 14:28
  • 6830

JavaScript中定义对象的几种方式

JavaScript中没有类的概念,只有对象。 在JavaScript中定义对象可以采用以下5种方式(附加改进方式): 1.基于已有对象扩充其属性和方法 2.工厂方式 3.构造函数方式 4.原型(“p...
  • zhangq0123
  • zhangq0123
  • 2016年10月22日 16:58
  • 172

Javascript笔记-定义对象的几种方式

JavaScript中定义对象的几种方式(JavaScript中没有类的概念,只有对象): 1) 基于已有对象扩充其属性和方法: var object = new Object(); ...
  • ZKLxuankai
  • ZKLxuankai
  • 2012年05月12日 18:03
  • 315

Javascript中的几种继承方式比较

开篇 从’严格’意义上说,javascript并不是一门真正的面向对象语言。这种说法原因一般都是觉得javascript作为一门弱类型语言与类似java或c#之类的强型语言的继承方式有很大的区别,...
  • kkkkkxiaofei
  • kkkkkxiaofei
  • 2015年06月12日 17:32
  • 10953

JavaScript四种函数调用方式

JavaScript四种函数调用方式
  • woaijianjiandandande
  • woaijianjiandandande
  • 2016年10月19日 12:21
  • 1322
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:Javascript对象定义的几种方式
举报原因:
原因补充:

(最多只允许输入30个字)