Javascript-基础-Object创建对象

Posted talkbear

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了Javascript-基础-Object创建对象相关的知识,希望对你有一定的参考价值。

创建单个对象——字面量方式

创建多个对象

使用字面量方式创建多个对象时,会产生大量的重复代码。开发者在寻找创建多个对象方法的过程中,基本经历了一下集中方法:

工厂模式 > 构造函数模式 > 原型模式 > 构造函数与原型组合 > 寄生构造函数 > 稳妥构造函数模式

工厂模式

function CreatePerson(name, age, job){
var o = new Object();

o.name = name;
o.age = age;
o.job = job;
o.sayName = function(){
    alert(this.name);
}
return o;
}

构造函数模式

function Person(name, age, job){
    this.name = name;
    this.age = age;
    this.job = job;
    this.ageName = sayName;
}

function sayName(){
    alert(this.name);
}

原型模式

function Person(){
}

Person.prototype.name = "xiong";
Person.prototype.age = "26";
Person.prototype.job = "FE";
Person.prototype.sayName = function(){
    alert(this.name)
};

问题:当原型上包含引用类型的值得情况下,所有实例会共享该引用类型值。即任何一个实例修改该引用类型值,其他所有的实例也会反映出来。所以很少使用这种方式。

(常用)构造函数模式与原型模式组合

构造函数与原型混成的模式,是目前在ECMAScript中使用最广泛、认同度最高的一种创建自定义类型的方法。可以说是定义引用类型的默认模式。

function Person(name, age, job){
    this.name = name;
    this.age = age;
    this.job = job;
    this.ageName = sayName;
    this.friends = ["Shelby","Court"];
}
// prototype 上共享方法
Person.prototype = {
    constructor: Persion,
    sayName: function(){
        alert(this.name)
    }
}

动态原型模式

function Person(name, age, job){
    this.name = name;
    this.age = age;
    this.job = job;
    this.ageName = sayName;
    this.friends = ["Shelby","Court"];
    
    if(typeof this.sayName != "function"){
        Person.prototype.sayName = function(){
            alert(this.name);
        }
    }
}

寄生构造函数模式

function Person(name, age, job){
    var o = new Object();
    o.name = name;
    o.age = age;
    o.job = job;
    o.ageName = sayName;
    o.friends = ["Shelby","Court"];
    
    return o;
}

var person = new Person("fd",34,"FE");

稳妥构造函数模式

function Person(name, age, job ){
    var o = new Object();
    
    o.sayName = function(){
        alert(name)
    }
    return o;
}
var friend = new Person("t", 23, "fe");
friend.sayName();

以上是关于Javascript-基础-Object创建对象的主要内容,如果未能解决你的问题,请参考以下文章

网站前端_JavaScript-基础入门.0009.JavaScript对象类型

Javascript中的Object对象

详解Javascript中的Object对象

JavaScript基础概念之----面向对象----理解对象

JavaScript基础知识整理(ES5创建对象)

ExtJs 基础框架Ext对JavaScript原生对象的扩展