Javascript对象创建

原创 2016年06月01日 15:47:16

一、单一方式创建

1、new形式

var person=new Object();
person.name=”Leo”;

如果直接new完就了事,那没什么问题。如果new完还需要扩展属性,可以考虑使用工厂进行封装。工厂的使用下面有叙述。


2、字面量形式
var person={name:”Leo”};
在构建函数参数,或者配置参数等场合中很是常见。


3、工厂模式、寄生构造函数模式与稳妥构造函数模式

function cratePerson(name,age){
               var o=new Object;
               o.name=name;
               o.age=age;
               o.sayName=function(){alert(this.name)}
               return o;
}
var person=createPerson(“Leo”,18);/*此时创建了一个对象,这种方式叫工厂创建,或者稳妥构造函数模式。所谓稳妥构造函数模式就是不使用new和this创建对象*/
var person2=new createPerson(“Leo”,18);//跟上面的效果一样,这样叫寄生构造
//函数模式创建

优点:
封装了对象的创建过程,对具体的对象创建进行了隐藏,整个创建过程都在工厂之内,解除了对象创建的耦合,符合开放封闭原则。从而使对象的创建更加灵活,内部创建过程也很方便改进和扩展。而且可以定义私有变量。

缺点:
工厂模式没有解决对象的识别问题(即怎样知道一个对象的类型)。因为你创建的对象是Object的,而不会是person等其他类型。当然,这不是大问题,因为可以使用专用工厂进行创建。例如把var o=new Object换为var o=new Person();或者var o=new Person的子类();

使用场合:
此种模式常用于对现有对象进行扩展以及一些不能使用new跟this的安
全环境中,例如我希望获取一个具有新值和新方法的数组对象,则可以
这样:

function MyArray(){
               var values=new Array();
               values.push(“Leo”);
               values.sayHi=function(){alert(“Hi”);}
}  
var specialArray=new MyArray();

于是就获取到了具备sayHi方法的特殊的数组对象了

工厂方法典型应用:
假设有Person类,Author与Writer类继承于Person

function personFactory(condition){
    switch condition
    case1:return new Author;break;
    case2:return new Writer;break; 
}

4、构造函数模式

function Person(name,age){
               this.name=name;
               this.age=age;
               this.sayName=function(){alert(this.name)}
} 
var person1=new Person(“Leo”,18);

这里new Person(“Leo”,18),其实就是调用Person函数。不过调用new比较特殊,
它会使Person的this等于等号左边的person1。所以这里new Person其实就相
当于调用

function Person(name,age){
    person1.name=name;
    person1.age=age;
    person1.sayName=function(){alert(this.name)}
}

于是person1就有了name,age和sayName属性。
再废话一句,构造函数跟一般函数,其实没什么不同,这取决于你怎么去使用这个函数。如果你用new去调用,那这函数就可以视为构造函数,如:new Person();如果直接调用,那么就是普通函数,如:Person()。不同的是,new会使构造函数里面的this指向等号左边的对象。

优点:
解决了前面工厂模式未解决的对象识别问题。并且无法定义私有变量

缺点:
所有对象都会单独持有自己的属性。例如sayName函数,所有new Person创建出来的对象都会有这个属性。而实际上,sayName是没必要重复被创建的,应当所有对象共享一个sayName


5、原型创建

function Person(){}
Person.prototype.name=”Leo”;
Person.prototype.sayName=function(){console.log(this.name);}
var p1=new Person();
p1.sayName();//输出Leo
var p2=new Person();
p2.name=”Linda”
p2.sayName();//输出Linda
p1.sayName();//也是输出Linda

优点:
弥补了构造函数重复创建sayName函数的缺点,但仍然无法定义私有变量

缺点:
原型的优点是由于共享,而其缺点也正是由于共享。共享函数通常是正确的,但是如果共享属性则会出问题。所以如果类有除了函数之外的其他属性的话,建议不要单独使用原型创建


二、组合方式创建

1、构造函数和原型方式组合
示例如下:

function Person(){ this.name=”Leo”; }
Person.prototype.sayName=function(){console.log(this.name;)}
var p=new Person();
p.sayName();//打出Leo,如果把this.name改为var name则这里会打出空字符,//也就是说,无法定义私有变量

优点:结合了构造函数跟原型创建两种方式之所长
缺点:仍然无法定义私有变量


2、完美的动态原型模式
示例:

function Person(){
    var name="Leo";
    if(typeof this.getName != "function"){
    /*这里只判断一个getName就可以知道Person的prototype是否有初始化了,如果已经初始化就没必要往下执   
      行,如果没有初始化就需要往下执行将prototype初始化
    */
        Person.prototype.getName=function(){
            console.log(name);
        };
        Person.prototype.setName=function(n){
              name=n;
        }
    }
}

这个动态原型基本可以说非常完美了。既有构造函数和原型的优势,该共享的
属性共享,不该共享的属性不共享,同时还可以定义私有变量。不过这里仍然
有一个小小的遗憾,如果在其他对象里面调用Person,Person还是会对其原型
再初始化一次,例如直接调用,也就是在window调用,即直接Person(),当然
这种情况通常是误用此构造函数的情况。不过还是可以对这种情况进行改进。
只需要对Person构造函数加一个判断,再为Person增加一个静态工厂即可。
完整示例代码如下:

function Person(){
    var name="Leo";
    if(this.constructor!=Person)
       throw new Error("只能通过Person的getInstance方法调用此构造函数");

    if(typeof this.getName != "function"){ 
        Person.prototype.getName=function(){
            console.log(name);
        };
        Person.prototype.setName=function(n){
             name=n;
        }
    }
}
Person.getInstance=function(){return new Person();}//此时只能通过getInstance方法获取
//到Person的对象实例,至此,问题完美解决

javascript对象创建

  • 2014年03月19日 09:26
  • 9KB
  • 下载

JavaScript创建对象的几种方法

参考的几篇文章: http://www.cnblogs.com/FromSnatch/archive/2012/05/20/2510682.html http://www.jb51.net/arti...

Javascript之二(2):js6种创建类/对象的方法

// 第一种:对象 var person = {};// 或者var obj = new Object(); person.name = "king"; person.age = 20; person...

JavaScript红宝书笔记:创建对象

JavaScript包含三部分:ECMAScript、DOM、BOM ECMAScript提供了核心语言功能,面向对象,但是没有类的概念。本篇文章要总结一下创建对象的几种方式。如果面试官问你如果创建...

JavaScript中创建对象方法总结

最简单的方式就是创建一个Object对象,并为其添加属性和方法。//示例代码 var person=new Object() person.name="yumi" person.age=18 pers...

javascript对象的几种创建方式

javascript对象的几种创建方式 1,工厂模式 2,构造函数模式 3,原型模式 4,混合构造函数和原型模式 5,动态原型模式 6,寄生构造函数模式 7,稳妥构造函数模式 javascript继承...
  • zxxvip
  • zxxvip
  • 2017年06月16日 00:39
  • 291

javascript中 对象创建的三种方式及其调用方法

JavaScript中有以下三种方法创建对象 使用内置的对象 : var 对象名 = new Object(); 使用JSON格式 : var 对象名 = {key : value, key : v...

JavaScript对象的创建方式

在JavaScript中,创建对象的方式包括两种:对象字面量和使用new表达式。对象字面量是一种灵活方便的书写方式,例如:   1 2 3 4 5 6 var o1...
  • ml0106
  • ml0106
  • 2017年07月04日 09:18
  • 55

JavaScript面向对象之----各种方法的创建以及使用以及介绍

/** * 对象是神马? */ /* 对象是JavaScript的基础,在Jav...

JavaScript 创建类/对象的几种方式 (经典)

JavaScript 创建类/对象的几种方式 Posted on 2009-03-17 09:37 LucasYang 阅读(3426)评论(2) 编辑 收藏 在JS中,创建对象(C...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:Javascript对象创建
举报原因:
原因补充:

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