JS 面向对像编程（归纳与总结）

今天又看了一个阮一峰阮大神的前端面向对象编程，其实我看过好几遍了，总是记不住，今天在此做一些自我总结：

一、封装

Javascript规定，每一个构造函数都有一个prototype属性，指向另一个对象。这个对象的所有属性和方法，都会被构造函数的实例继承。
这意味着，我们可以把那些不变的属性和方法，直接定义在prototype对象上。

function Cat(name,color){
　　this.name = name;
　　this.color = color;
}
Cat.prototype.type = "猫科动物";
Cat.prototype.eat = function(){alert("吃老鼠")};

 

具体细节可参考原文链接

二、继承

以下面两个对象进行说明

 

function Animal(){
　　this.species = "动物";
}

function Cat(name,color){
　　this.name = name;
　　this.color = color;
}

 

 

1、构造函数继承（原文链接）

A、构造函数绑定

第一种方法也是最简单的方法，使用call或apply方法，将父对象的构造函数绑定在子对象上，即在子对象构造函数中加一行：

function Cat(name,color){
　　Animal.apply(this, arguments);
　　this.name = name;
    this.color = color;
}
var cat1 = new Cat("大毛","黄色");
alert(cat1.species); // 动物

 

B、prototype模式

Cat.prototype = new Animal();
Cat.prototype.constructor = Cat;
var cat1 = new Cat("大毛","黄色");
alert(cat1.species); // 动物

 

C、直接继承prototype

Cat.prototype = Animal.prototype;
Cat.prototype.constructor = Cat;
var cat1 = new Cat("大毛","黄色");
alert(cat1.species); // 动物

D、利用空对象作为中介（YUI实现方法）

function extend(Child, Parent) {
    var F = function(){};
　　F.prototype = Parent.prototype;
　　Child.prototype = new F();
　　Child.prototype.constructor = Child;
    Child.uber = Parent.prototype;
}
extend(Cat,Animal);
var cat1 = new Cat("大毛","黄色");
alert(cat1.species); // 动物

 

E、拷贝继承

将父对象的prototype对象中的属性，一一拷贝给Child对象的prototype对象

function extend2(Child, Parent) {
    var p = Parent.prototype;
    var c = Child.prototype;
　　for (var i in p) {
　　　  c[i] = p[i];
　　}
　　c.uber = p;
}

 

二、非构造函数继承

以下面对象为例：

var Chinese = {nation:'中国'};
var Doctor = {career:'医生'}

A、object()方法

function object(o) {
    function F() {}
    F.prototype = o;
    return new F();
} 
var Doctor = object(Chinese);
Doctor.career = '医生';

 

 

B、浅拷贝

function extendCopy(p) {
    var c = {};
　　for (var i in p) { 
　　　　c[i] = p[i];
　　}
　　c.uber = p;
　　return c;
}
var Doctor = extendCopy(Chinese);
Doctor.career = '医生';
alert(Doctor.nation); // 中国

 

C、深拷贝（针对属性为Object或Array）

function deepCopy(p, c) {
    var c = c || {};
　　for (var i in p) {
　　　　if (typeof p[i] === 'object') {
　　　　　　c[i] = (p[i].constructor === Array) ? [] : {};
　　　　　　deepCopy(p[i], c[i]);
　　　　} else {
　　　     c[i] = p[i];
　　　　}
　　}
　　return c;
}