原型和原型鏈

題目（答案見每題下方空白處）

　　1.如何準確判斷一個變量是數組類型

　　用instanceof Array，返回爲true就說明是

　　2.寫一個原型鏈繼承的例子

function Animal(){
    this.eat = function(){
        console.log('animal eat');
    }
}
function Cat(){
    this.say = function(){
        console.log('cat miao');
    }
}
Cat.prototype = new Animal();
       
var mimi = new Cat();
mimi.eat();

原型繼承1

function Elem(id){
    this.elem = document.getElementById(id);
}
Elem.prototype.html = function(val){
    var elem = this.elem;
    if(val){
        elem.innerHTML = val;
        return this;//爲了鏈式操做
    }
    else{
        return elem.innerHTML;
    }
}
Elem.prototype.on = function(type,fn){
    var elem = this.elem;
    elem.addEventListener(type,fn);
    return this;//爲了鏈式調用
}

var div1 = new Elem('detail-page');
div1.html('<p>hello imooc</p>').on('click',function(){
    alert('clicked');
}).html('<p>javascript</p>');

原型繼承2（實際開發會用）

 

　　3.描述new一個對象的過程

　　分三步，假定該對象名爲xm，則先是xm={}，即xm爲一個空對象，而後xm.__proto__ = object.prototype，最後調用call方法，xm.call()

　　或者另外一種理解分四步，先是建立一個新對象，而後this指向這個新對象，以後執行代碼，對this賦值，最後返回this

　　4.zepto（或其餘框架）源碼中如何使用原型鏈

 　　（未完待續）

 

知識點

構造函數

　　先舉一個構造函數的例子

　　

　　構造函數通常函數名開頭大寫（約定俗成），函數內部用this指向來給對象賦值

　　整個過程以下：

　　1.this指向一個空對象

　　2.經過構造函數裏的賦值，this獲得衆多屬性值，賦值完成後，默認返回this

　　3.把這個對象賦值給f（也就是f.call()）

構造函數擴展

　　var a = {}爲var a = new Object()的語法糖（即功能上沒有改變，只是改變了語法，使得代碼更易閱讀）

　　var a = []爲var a = new Array()的語法糖

　　function Foo(){}爲var Foo = new Function()的語法糖

原型規則

　　1.全部的引用類型都有對象特性，便可以自由擴展屬性（null除外）

　　

　　2.全部引用類型都有一個__proto__屬性（隱式原型），屬性值爲一個普通對象

　　

　　（這裏一個問題，object的__proto用instanceof判斷，返回的是false）

　　3.全部的函數都有一個prototype屬性（顯式原型），屬性值爲一個普通對象

　　

　　4.全部引用類型的__proto__屬性值指向其構造函數的prototype屬性值

　　

　　5.當試圖獲得一個對象的某個屬性時，若是這個對象自己沒有這個屬性，就會去其__proto__（即其構造函數的prototype）中尋找（原型鏈的原理）

　　

　　這裏alertName這個屬性（方法）在f實例中沒有，因此就去其原型上查找，也就是Foo.prototype上查找，最後調用

其餘注意點

　　若是遍歷對象上的屬性，for-in會遍歷其對象自己以及原型上的全部屬性（輸出的是屬性名）

　　

　　而for-of只會遍歷其對象自己的屬性值（但必須是可遍歷的，即iterable）

　　若是須要限制遍歷對象自己的屬性，則用Object對象的hasOwnProperty方法（for-of方法在新瀏覽器中基本解決了這一問題，但爲了以防萬一，仍是加上爲好）

　　

原型鏈

　　每一個函數都有一個prototype屬性，而全部引用類型都有一個__proto__屬性，指向其構造函數的prototype屬性

　　這樣一來就造成了一條以對象的__proto__屬性（隱式屬性）和函數的prototype屬性（顯式屬性）構成的一條無形的鏈子，即原型鏈

　　

　　但須要注意的是，Object這個構造函數的顯式屬性的隱式屬性爲null（即Object.prototype.__proto__爲null）

　　這是JS的一個機制，爲了不原型鏈的死循環

instanceof

　　該方法用來判斷引用類型的變量屬於哪一個構造函數

　　實際上的判斷邏輯爲原型鏈，也就是該實例的__proto__屬性層層往上，可否對應上構造函數的prototype屬性

　　也就能夠回答了爲何Object實例的__proto__屬性不是Object的實例（obj.__proto__.__proto__實際上爲Object.prototype.__proto__，指向null，天然不等於Object.prototype）