javascript(js)创建对象的模式与继承的几种方式

1.js创建对象的几种方式

工厂模式

为什么会产生工厂模式，原因是使用同一个接口创建很多对象，会产生大量的重复代码，为了解决这个问题，产生了工厂模式。

function createPerson(name,age,job){

var o=new Object();

o.name=name;

o.age=age;

o.job=job;

o.sayName=function(){

console.log(this.name);

}

return o;

}

var person1=createPerson("kobe","34","player");

var person2=createPerosn("patty","32","singer");

构造函数模式

与工厂模式不同的是，没有显示的创建对象,直接将属性和方法赋值this对象，没有return语句。

function Person(name,age,job){

this.name=name;

this.age=age;

this.job=job;

this.sayName=function(){

console.log(this.name);

};

}

var person1=new Person();

var person2=new Person();

console.log(person1.sayName==person2.sayName)//false 说明不同实例的同名函数是不相等的

如果我们想要的结果是两者相等，可以这样实现

function  Person(name,age,job){

this.name=name;

this.age=age;

this.job=job;

this.sayName=sayName;

}

function sayName(){

console.log(this.name);

}

var person1=new Person();

var person2=new Person();

console.log(person1.sayName==person2.sayName);//true

创建Person的新实例，需要用到new操作符，这种方式下调用构造函数会经历四个阶段，分别是：

创建一个新对象

将构造函数的作用域赋值给这个新的对象

执行构造函数中的代码

返回新对象

person1和person2这两个对象都有一个constructor属性，该属性指向Person

console.log(person1.constructor==Person);//true

console.log(person2.constructor==Person);//true

原型模式

特点：新对象的这些属性和方法是所有实例共享的

function Person(){

}

Person.prototype.name="kobe";

Person.prototype.age=38;

Person.prototype.sayName=function(){

console.log(this.name);

}

var person1=new Person();

var person2=new Person();

console.log(person1.sayName==person2.sayName);//true

有时候我们想知道该属性到底是存在对象中还是存在原型中，可以使用以下方法

我们使用in操作符和hasOwnProperty结合判断

"name" in object无论该属性到底存在原型中还是对象中，都会返回true

而hasOwnProperty只有存在实例中才返回true

so：只有in操作符返回true，而hasOwnProperty返回false，能确定属性是原型中的属性。

function hasPrototypeProperty(object,name){

return !object.hasOwnProperty(name)&&(name in object);

}

原型对象存在问题，牵一发而动全身

function Person(){

}

Perosn.prototype=function(){

constructor;Person,

name:"kobe",

age:"29",

job:"player",

friends:["shely","count"],

sayName:function(){

console.log(this.name);

}

};

var person1=new Person();

var person2=new Person();

person1.friends.push("ann");

console.log(person1.friends===person2.friends);//true

解决的方法：是使用构造函数模式和原型模式

function Person(name,age,job){

this.name=name;

this.age=age;

this.job=job;

this.friends=["she","ya"];

}

Person.prototype={

constructor:Person,

sayName:function(){

console.log(this.name);

}

};

var person1=new Person();

var person2=new Person();

person1.friends.push("VAN");

console.log(person1.friends===person2.friends);//false

动态原型模式

function Person(name,age,job){

this.name=name;

this.age=age;

this.job=job;

if(typeof this.sayName!="function"){

Person.prototype.sayName=function(){

console.log(this.name);

}

};

}

寄生构造函数模式

function Person(name,age,job){

var o=new Object();

o.name=name;

o.age=age;

o.job=job;

o.sayName=function(){

console.log(this.name);

};

return o;

}

var friend=new Person();//此模式与工厂模式十分类似

2.js实现继承的几种方式

原型链继承:原型对象属性共享

function Parent2(){

this.name="kobe";

this.play=[1,2,3];

}

function Child2(){

this.type="children";

}

Child2.prototype=new Parent2();

var say1=new Child2();

var say2=new Child2();

say1.play.push("van");

console.log(say1.play==say2.play);//true

借用构造函数实现继承：无法实现继承原型对象

function Parent1(){

this.name="kobe";

}

Parent1.prototype.age=90;

function Child(){

Parent1.call(this);

this.type="service";

}

var say=new Child();

console.log();//error

组合式继承

function Parent4(name){

this.name="kobe";

this.play=[1,2,3];

}

Parent4.prototype.sayName=function(){

}

function Child4(name,age){

Parent3.call(this,name);

this.age=age;

}

Child4.prototype=new Parent4();

Child4.prototype.constructor=Child4;

Child4.prototype.sayAge=function(){

console.log(this.age);

};

var ins1=new Child4();

var ins2=new Child4();

ins1.push.push(4);

console.log(ins1.play==ins2.play);//false

原型式继承

function object(){

function F(){}

F.prototype=o;

return new F();

}

var person={

name:"kobe",

friends;["yang","du","geng"]

};

var onePerson=object(person);

var twoPerson=object(person);

寄生式继承

function object(o){

function F(){}

F.prototype=o;

return new F();

}

function create(o){

var clone=object(o);

clone.sayHi=function(){

console.log("hi");

};

return clone;

}

var person={

name:"kobe",

friends:["james","waston","sun"]

};

var anotherPerson=creat(person);

anotherPerson.sayHi();//hi

寄生式组合继承

function inheritPrototype(Child5,Parent5){
    var prototype=Object(Parent5.prototype);
    prototype.constructor=Child5;
    Child5.prototype=prototype;
}
function Parent5(name){
    this.name=name;
    this.colors=["red","blue","green"];
}
Parent5.prototype.sayName=function(){
    console.log(this.name);
};
function Child5(name,age){
    Parent5.call(this.name);
    this.age=age;
}
inheritPrototype(Child5,Parent5);
Child5.prototype.sayAge=function(){
     console.log(this.age);
};