首页 > 编程语言 > 详细

【Javascript-基础-Object】创建对象

时间:2018-10-13 14:10:34      阅读:121      评论:0      收藏:0      [点我收藏+]

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

创建多个对象

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

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

工厂模式

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】创建对象

原文:https://www.cnblogs.com/wanxiong/p/js-basic-Object-new.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!