小編給大家分享一下javascript構造函數(shù)有什么用,相信大部分人都還不怎么了解,因此分享這篇文章給大家參考一下,希望大家閱讀完這篇文章后大有收獲,下面讓我們一起去了解一下吧!
10年積累的成都網(wǎng)站設計、網(wǎng)站建設、外貿(mào)網(wǎng)站建設經(jīng)驗,可以快速應對客戶對網(wǎng)站的新想法和需求。提供各種問題對應的解決方案。讓選擇我們的客戶得到更好、更有力的網(wǎng)絡服務。我雖然不認識你,你也不認識我。但先制作網(wǎng)站后付款的網(wǎng)站建設流程,更有米東免費網(wǎng)站建設讓你可以放心的選擇與我們合作。
constructor是原型對象上的一個屬性,默認指向這個原型的構造函數(shù)
這個結論貌似對我們平時的工作中似乎并沒有什么用處,那構造函數(shù),就真的沒什么用處嗎?
JS中的函數(shù)即可以是構造函數(shù)又可以當作普通函數(shù)來調(diào)用,當使用new來創(chuàng)建對象時,對應的函數(shù)就是構造函數(shù),通過對象來調(diào)用時就是普通函數(shù)。
在我們平時工作中,經(jīng)常會需要我們創(chuàng)建一個對象,而我們更多的是使用對像直接量,直接創(chuàng)建,舉個栗子,代碼如下
var person = { name:'postbird', address:'earth', sayHello:function(){console.log('Hello,I am ' + this.name);} };
如果只是一個單獨的對象,對象的屬性和方法基本不會變了,這么玩完全可以,但是如果你的對象有很多實例,或者涉及繼承或者構造函數(shù)傳參,留意代碼注釋
//創(chuàng)建了一個構造函數(shù) function Person(name,address){ this.name = name; this.address = address; } //為構造函數(shù)的原型對象添加一個方法sayHello Person.prototype.sayHello = function(){ console.log('Hi I am ' + this.name); } //通過構造函數(shù)Person實例化一個p1,并傳參 var p1 = new Person('postbird','earth'); //通過構造函數(shù)Person實例化一個p2,并傳參 var p2 = new Person('ptbird','month'); console.log(p1);//{name: "postbird", address: "earth"} console.log(p2);//{name: "ptbird", address: "month"} // p1和p2 繼承了Person的sayHello方法 p1.sayHello()//Hi I am ptbird p2.sayHello()//Hi I am postbird
耐心品位上面的代碼,這樣的可擴展性就會更好,可以創(chuàng)N個實例,實現(xiàn)代碼復用
關于js的constructor構造函數(shù),有一個很經(jīng)典的demo
function Person(area){ this.type = 'person'; this.area = area; } Person.prototype.sayArea = function(){ console.log(this.area); } var Father = function(age){ this.age = age; } Father.prototype = new Person('Beijin'); console.log(Person.prototype.constructor===Person) //true console.log(Father.prototype.constructor===Person); //true Father.prototype.constructor = Father;//修正 console.log(Father.prototype.constructor===Father); //true var one = new father(25); console.log(one.constructor===Father) // true
注意這一行代碼
Father.prototype.constructor = Father;//修正
為什么要修正?不是說constructor是原型對象上的一個屬性,默認指向這個原型的構造函數(shù)?
我們把這一行打碼注釋掉
function Person(area){ this.type = 'person'; this.area = area; } Person.prototype.sayArea = function(){ console.log(this.area); } var Father = function(age){ this.age = age; } Father.prototype = new Person('Beijin'); console.log(Person.prototype.constructor===Person) //true console.log(Father.prototype.constructor===Person); //true //Father.prototype.constructor = Father;//修正 console.log(Father.prototype.constructor===Father); //false var one = new Father(25); console.log(one.constructor===Person) // true
聰明如你,相信你已經(jīng)發(fā)行了問題所在
Father.prototype = new Person('Beijin');
這一步的時候,原型指向了一個新對象,這個新對象的constructor指向的是Person。
console.log((new Person('Beijin')).__proto__ === Person.prototype) //true
前面我們說過new Person('Beijin')對象是沒有prototype的,prototype只有函數(shù)才有;Father.prototype.constructor將會沿著new Person('Beijin')的原型鏈向下查找constructor,new Person('Beijin')沒有constructor就去它的__proto__找,因為(new Person('Beijin'))._proto_ === Person.prototype而Person.prototype.constructor == function Person(),所以 Father.prototype.constructor == Person.prototype.constructor //function Person()當我們var one = new Father(25) 時 ,one.constructor = Father.prototype.constructor,所以one.constructor指向function Person(),所以,一定要進行修正,否則原型鏈會亂
以上是“javascript構造函數(shù)有什么用”這篇文章的所有內(nèi)容,感謝各位的閱讀!相信大家都有了一定的了解,希望分享的內(nèi)容對大家有所幫助,如果還想學習更多知識,歡迎關注創(chuàng)新互聯(lián)行業(yè)資訊頻道!