構造函數和原型以及實例之間的關系

一、構造函數和普通函數的區別：如下圖所示

1. 構造函數的函數名首字母大寫 來與普通函數進行區分
2. 構造函數 通過new來調用
3. 構造函數中的this指向這個構造函數　　而普通函數中的this指向window

        var dog = function(){                       //普通函數的定義
            console.log("我是一個普通函數");
        }
        dog();                                      //普通函數的調用
        
        ///////////////////////////////分割線////////////////////////////////////
        var Dog =function(){                        //構造函數的定義
            console.log("我是一個構造函數");
        }
        var dog = new Dog();                        //構造函數的調用

 

二、構造函數的原型：我們可以通過 console.log(Dog.prototype);    來查看Dog這個構造函數的原型

　　1.當我們還沒有給Dog添加其他方法時，我們會發現控制台輸出了{constructor: ƒ}

　　而constructor是每個構造函數都具有的方法 通過輸出我們發現這個constructor 指向Dog這個構造函數

        console.log(Dog.prototype);                 //輸出：{constructor: ƒ}
        console.log(Dog.prototype.constructor);      //指向Dog這個構造函數   

　　輸出如下圖

　

 

　　2.當我們通過Dog.prototype.添加方法后再查看原型以及constructor

        Dog.prototype.newStyle = function(){
            console.log("我是通過Dog原型添加的新方法");
        }   

        console.log(Dog.prototype);                     //{newStyle: ƒ, constructor: ƒ} 
        console.log(Dog.prototype.constructor);         //指向Dog這個構造函數

　　控制台輸出如下圖，我們會發現此時Dog的prototype（原型）多了這個新添加的方法，constructor與原本相同

　　由此我們可得知構造函數的原型包括掛載在原型身上的方法以及構造函數本身（constructor）

　　

 

 三、構造函數的實例

　　上述代碼中 dog即為Dog的實例

 　　且實例可以有多個 但他們的內容都相同。都是指向這個構造函數

　　如何判斷某個實例是不是屬於某個構造函數

        console.log(dog instanceof Dog);   //true   //查看實例dog是不是屬於構造函數Dog
        console.log(dog3 instanceof Dog);   //flase