js 建構函式(construction)與原型（prototype）

標籤：www.   問題   2.4   ==   using   .com   size   它的   on()   

1.物件導向：js原型

java有class和instance，js僅僅有建構函式（function Cat(name,age){this.name=name;this.age=age}）,為了實現資料共用和抽象出通用的屬性，加了一個原型prototype

     eg:

function Cat(name,age){

this.name = name;//這裡的this相當於java裡面的instance

this.age = age;

this.work = function(){

alert("I am working");

}

}

var cat1 = new Cat("cat1",13);

var cat2 = new Cat("cat2",15);

cat1和cat2的都有work屬性，可是一樣的屬性，明顯是多餘的，造成浪費。能夠抽象出原型出來

function Dog(name,age){

this.name = name;

this.age = age;

}

Dog.prototype = {work:function(){alert("I am working!")}}或者

Dog.prototype.work = function(){

alert("I am working");

}

2.封裝：

原始模式：var cat = {};cat.name = "cat1";cat.id = "id1";

原始模式改進：var cat = function cat(name,id){return {name:name,id:id}}，相當於調用函數

建構函式模式：function(name,id){this.name = name;this.id=id}

js中建構函式在初始化的時候加new和不加new的差別

function Dog(name,age){

this.name = name;

this.age = age;

}

Dog.prototype = {work:function(){alert("I am working!")}}

var dog1 = Dog("dog1",12);//這僅僅是相當於調用普通函數。原型work不會產生，調用work屬性會報錯

var dog2 = new Dog("dog2",13);//這裡是調用建構函式，初始化原型work

var dog3 = new Dog("dog3",14);

dog2.constructor == Dog;   dog3.constructor == Dog

為瞭解決從原型對象產生執行個體的問題，Javascript提供了一個建構函式（Constructor）模式。

所謂"建構函式"，事實上就是一個普通函數，可是內部使用了this變數。對建構函式使用new運算子，就能產生執行個體。而且this變數會綁定在執行個體對象上。

3.繼承

（1）對象冒充

function ClassA(sColor) {    this.color = sColor;    this.sayColor = function () {        alert(this.color);    };}function ClassB(sColor) {}

function ClassB(sColor) {    this.newMethod = ClassA;    this.newMethod(sColor);    delete this.newMethod;}

在這段代碼中，為 ClassA 賦予了方法 newMethod（請記住。函數名僅僅是指向它的指標）。然後調用該方法。傳遞給它的是 ClassB 建構函式的參數 sColor。最後一行代碼刪除了對 ClassA 的引用，這樣以後就不能再調用它。

全部新屬性和新方法都必須在刪除了新方法的程式碼後定義。否則。可能會覆蓋超類的相關屬性和方法：

function ClassB(sColor, sName) {    this.newMethod = ClassA;    this.newMethod(sColor);    delete this.newMethod;    this.name = sName;    this.sayName = function () {        alert(this.name);    };}

var objA = new ClassA("blue");var objB = new ClassB("red", "John");objA.sayColor();//輸出 "blue"objB.sayColor();//輸出 "red"objB.sayName();//輸出 "John"

js 建構函式(construction)與原型（prototype）