js高级程序设计笔记13

面向对象

1.工厂模式

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;
}

缺点: 无法识别对象的类型,全部为Object的实例

2.构造模式

function Person(name,age,job){
  this.name = name;
  this.age = age;
  this.job = job;
  this.sayName = function(){
    alert(this.name);
  }
}
var person1 = new Person('Tom','19','Student');
var person2 = new Person('Lily','25','Teacher');

person1.constructor == Person //true
person1 instanceof Person //true
person1.constructor == person2.constructor //true

#person1 和 person2 都是person的原型的实例
#构造函数能够当做普通函数使用

缺点:每次构造对象都要生成新的方法，不同实例的同名函数不相等

person1.sayName == person2.sayName //
false 

可以做如下修改

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

function person(name,age,obj){
  ...
  this.sayName = sayName;
}

这样解决了上述问题，但缺点是需要在全局中定义过多函数，且这样做不太符合‘全局’概念

3.原型模式

function Person(){
  
}
Person.prototype.name = 'Tom';
Person.prototype.age = 18;
Person.prototype.job = 'Teacher';

person1 = new Person();
#name,age,job为原型属性

person1.name = 'Green';

#name为实例属性，原型属性仍旧存在但被覆盖了

person1.name //Green

delete person1.name 
person1.name // Tom

判断是原型属性还是实例属性

使用hasOwnProperty()方法

person1.hasOwnProperty('name') //false,来自原型

person1.name = 'Green';

person1.hasOwnProperty('name')//true,来自实例

in 操作符

name in person1 //true

只要能够访问到的属性都会返回true，无论在原型中还是在实例中

hasPrototypeProperty()

hasPrototypeProperty(person1,'name') //false 存在于实例中，返回false
hasPrototypePropertye(person1,'age') //true 存在于原型中，返回true

keys()

var keys = Object.keys(peson1)

返回一个数组name,age,job

var keys = Object.keys(Person.prototype)

#Object.keys()会返回对象或原型的所有属性,无论他是否可枚举

原型模式的问题

#缺点： 改变了实例中的原型属性，其他实例的该属性也会被改变

4.构造模式和原型模式组合使用

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

Person.prototype = {
  constructor: Person,
  sayName: function(){
    alert(this.name);
  }
}

5.动态原型模式

//通过检查某个量是否有效来决定初始化模型

function Person(){
  ...
  if(typeof this.sayName != 'function'){
    Person.prototype.sayName = function(){
      alert(this.name);
    }
  }
}

6.