JavaScript面向对象编程

JavaScript面向对象编程

面向对象可以把程序中的关键模块都视为对象，而模块拥有属性及方法。这样我们如果把一些属性及方法封装起来，日后使用将非常方便，也可以避免繁琐重复的工作。
例如：

<script>
function people(name,sex){
var obj=new Object;
 obj.name=name;
 obj.sex=sex;
 obj.showName=function(){
 console.log(obj.name);
 }
 obj.showSex=function(){
 console.log(obj.sex);
 }
return obj;
 }
var u1=addElement('名字','性别');
var u2=addElement('张','女');
 u1.showName();
 u2.showName();
 u2.showSex();
</script>

面向对象编程（OOP）的特点

• 抽象：抓住核心问题
• 封装：不考虑内部实现，只考虑功能使用
• 继承：从已有的对象上，继承出新的对象

对象的组成

• 方法——函数：过程、动态的
• 属性——变量：状态、静态的

注意

• 不能在系统对象中随意附加方法和属性，否则会覆盖原有的方法和属性。
  例如系统原有的Array中，不可以给它附加push()等方法以及length等属性。

工厂模式

什么是工厂模式

• 原料
• 加工
• 出厂

工厂模式

• 用构造函数创建一个类

<script>
function people(name,sex){//构造函数
//原料
var obj=new Object;

//加工（属性）
 obj.name=name;
 obj.sex=sex;
//加工（方法）
 obj.showName=function(){
 console.log(obj.name);
 }
 obj.showSex=function(){
 console.log(obj.sex);
 }
//出厂
return obj;
 }
//使用
var u1=addElement('名字','性别');
var u2=addElement('张','女');
 u1.showName();
 u2.showName();
 u2.showSex();
</script>

工厂模式的问题

• 没有new
• 函数重复定义

解决

使用new来创建对象，系统会自动创建一个空对象

var this=new Object;//原料

//加工
……
……
……

return this;//出厂

原型——prototype

使用prototype给原料加工

function People(name,sex,age){
this.name=name;
this.sex=sex;
this.age=age;
this.showname=function(){
        console.log(this.name);
    }
this.showsex=function(){
        console.log(this.sex);
    }
}
People.prototype.showage=function(){
    console.log(this.age);
}
var pp=new People('我','男','20');
pp.showage();//20

构造函数和原型一起

function People(name,sex,age){
this.name=name;
this.sex=sex;
this.age=age;
}
People.prototype.showname=function(){
    console.log(this.name);
}
People.prototype.showsex=function(){
    console.log(this.sex);
}
People.prototype.showage=function(){
    console.log(this.age);
}
var pp=new People('我','男','20');
pp.showname();//我
pp.showsex();//男
pp.showage();//20

• 用混合方式构造对象
  
  1. 混合的的构造函数/原型方式
  2. Mixed Constructor Function/Prototype Method
• 原则
  
  1. 构造函数：加属性
  2. 原型：加方法
• 对象命名规范
  
  1. 类名首字母大写