面向物件object與constructor
阿新 • • 發佈:2018-11-09
什麼是constructor屬性?它來自哪裡?又將會指向何處?
什麼是constructor屬性?
constructor是建構函式屬性。
它來自哪裡?
其實constructor屬性是來自 prototy原型屬性 所指向的那個物件的屬性,如果不明白這裡的“那個物件”具體指的是哪個物件,可以看看我上一章講的javascript面向物件——prototype屬性(原型屬性),裡面有著詳細的講解。
又將指向何處?
從constructor屬性的字面意思我們就不難看出,它指向的永遠都是建構函式。
例如:
我們看看下面程式碼:
function myfile(name,age){
this.webname = name;
this.age = age;
}
myfile.prototype.getname = function () {
return this.age;
}
var myfile1 = new myfile("zhang",3);
console.info(myfile1.constructor);
console.info(myfile.constructor);
console.info(myfile.prototype.constructor);
這裡我列印了在3種不同情況下所輸出的constructor建構函式屬性的內容,我將谷歌瀏覽器控制檯打印出的結果截圖如下:
是的正如我們看見的為什麼console.info(myfile1.constructor);打印出的結果與console.info(myfile.prototype.constructor);打印出的結果會是一樣的,而console.info(myfile.constructor);打印出的結果卻是ƒ
Function() { [native code] },其實這個很好理解,如果你看了我的上一章講解的javascript面向物件——prototype屬性(原型屬性)那麼我相信這個地方就會很容易理解,其實我們首先要清楚constructor建構函式屬性,它是誰的屬性?它是原型屬性prototype所指向的那個物件的屬性。那麼在這個物件中這個屬性它又指向誰呢!?它指向的是建構函式也就是上面程式碼中的function
myfile(name,age){this.webname = name; this.age = age;}這一部分,其值就是這個建構函式中的物件。
那麼肯定會有人疑問,既然
constructor建構函式屬性 指向的是是建構函式,那麼打印出的結果是建構函式這個可以理解但是為什麼console.info(myfile.prototype.constructor);列印的也是建構函式呢!?它指向的可不是建構函式,是的我們知道例項化物件指向的一直都是prototype原型屬性所指向的物件。如果想解決這個問題,那麼我們首先應該弄明白兩個問題。
1、例項化物件到底指向的是誰?
2、例項化物件到底繼承的是誰?
首先我們還是用一個例項來引入,用圖片看結果然後在總結:
程式碼部分:
function myfile(name,age){
this.webname = name;
this.age = age;
}
myfile.prototype.getname = function () {
return this.age;
}
var myfile1 = new myfile("zhang",3);
console.info(myfile1.constructor);
列印結果圖片如下: 總結:程式碼執行的結果在控制檯上顯示的內容如上圖,打印出的是建構函式的程式碼也就是程式碼部分 function myfile(name,age){
this.webname = name;
this.age = age;
}
的的內容,有人肯定會想,哎!!!這不很明顯嘛,例項化物件指向的就是建構函式啊!繼承的也是建構函式。
那麼我們來執行另外一句程式碼:console.info(myfile1.getname());打印出的結果卻是3。 什麼情況在上面的建構函式中並沒有getname()這個函式物件啊!為什麼會打印出結果3呢!我們可以仔細看看getname()這個物件是在什麼地方出現的,是的它是通過原型屬性直接定義的,通過上面的兩次列印我們可以很明顯的發現例項化物件不僅能夠打印出建構函式還能夠打印出通過原型鏈來建立的屬性以及屬性值,換句話說,也就是實力化的物件繼承的物件並不全是建構函式,而是指向了一個我們看不見的物件,這個物件裡面包含的有建構函式,還有通過原型鏈來建立的屬性,那麼這個物件是什麼呢!其實我們在建立建構函式的時候,每個建構函式都會有一個prototype原型屬性,這個原型屬性會指向一個我們看不見的物件,我們可以通過原型屬性來建立固定不變的屬性並賦值,如:myfile.prototype.getname
= function () {return this.age;}這個時候原型屬性所指向的物件不僅包含了建構函式還包含了通過原型屬性所創建出來的一些屬性。 上面兩個問題的答案就出來了: 1、例項化物件到底指向的是誰? 答:例項化物件指向的永遠是prototype原型屬性所指向的那個物件,是通過例項化物件的內部屬性[[prototype]]來實現的。
2、例項化物件到底繼承的是誰? 答:其實例項化物件繼承的還是prototype原型所指向的那個虛擬的物件。 總結constructor(建構函式屬性): 這個時候我們在來看看 console.info(myfile1.constructor); console.info(myfile.constructor); console.info(myfile.prototype.constructor);三個為什麼第一個跟第三個的值是一樣的但是第二個會出現
ƒ Function() { [native code] } 。 console.info(myfile.prototype.constructor);其實就是在告訴計算機我們要的結果是prototype原型屬性所指向的那個物件中的建構函式,而因為console.info(myfile1.constructor);本來就是直接繼承的就是prototype原型屬性所指的物件所以這兩個命令打印出的結果自然也都是來之那個虛擬的物件中,這就是為什麼這兩個程式碼所執行出來的結果是一樣的原因。至於console.info(myfile.constructor);執行出來的結果是ƒ
Function() { [native code] } 就更好理解了,native code
的意思就是 本機程式碼 其實意思就是告訴我們,我們所執行的console.info(myfile.constructor);程式碼就是建構函式它自己本身,不能所執行這條程式碼會報錯,只是控制檯會更智慧一些的告訴我們,我們需要列印的就是它自己而已。 現在你知道了constructor建構函式屬性是屬於誰的屬性嗎? 答: 1、它是prototype原型屬性所指向的那個虛擬物件的屬性。 2、它是例項化物件的屬性。 從上面的例子中我們也能推斷出上面的兩條答案是成立的。
---------------------
作者:待歸魔帝
來源:CSDN
原文:https://blog.csdn.net/zhj145236/article/details/77477057
版權宣告:本文為博主原創文章,轉載請附上博文連結!
this.webname = name;
this.age = age;
}
myfile.prototype.getname = function () {
return this.age;
}
var myfile1 = new myfile("zhang",3);
console.info(myfile1.constructor);
console.info(myfile.constructor);
console.info(myfile.prototype.constructor);
這裡我列印了在3種不同情況下所輸出的constructor建構函式屬性的內容,我將谷歌瀏覽器控制檯打印出的結果截圖如下:
是的正如我們看見的為什麼console.info(myfile1.constructor);打印出的結果與console.info(myfile.prototype.constructor);打印出的結果會是一樣的,而console.info(myfile.constructor);打印出的結果卻是ƒ
Function() { [native code] },其實這個很好理解,如果你看了我的上一章講解的javascript面向物件——prototype屬性(原型屬性)那麼我相信這個地方就會很容易理解,其實我們首先要清楚constructor建構函式屬性,它是誰的屬性?它是原型屬性prototype所指向的那個物件的屬性。那麼在這個物件中這個屬性它又指向誰呢!?它指向的是建構函式也就是上面程式碼中的function
myfile(name,age){this.webname = name; this.age = age;}這一部分,其值就是這個建構函式中的物件。
那麼肯定會有人疑問,既然
constructor建構函式屬性 指向的是是建構函式,那麼打印出的結果是建構函式這個可以理解但是為什麼console.info(myfile.prototype.constructor);列印的也是建構函式呢!?它指向的可不是建構函式,是的我們知道例項化物件指向的一直都是prototype原型屬性所指向的物件。如果想解決這個問題,那麼我們首先應該弄明白兩個問題。
1、例項化物件到底指向的是誰?
2、例項化物件到底繼承的是誰?
首先我們還是用一個例項來引入,用圖片看結果然後在總結:
程式碼部分:
function myfile(name,age){
this.webname = name;
this.age = age;
}
myfile.prototype.getname = function () {
return this.age;
}
var myfile1 = new myfile("zhang",3);
console.info(myfile1.constructor);
列印結果圖片如下: 總結:程式碼執行的結果在控制檯上顯示的內容如上圖,打印出的是建構函式的程式碼也就是程式碼部分 function myfile(name,age){
this.webname = name;
this.age = age;
}
的的內容,有人肯定會想,哎!!!這不很明顯嘛,例項化物件指向的就是建構函式啊!繼承的也是建構函式。
那麼我們來執行另外一句程式碼:console.info(myfile1.getname());打印出的結果卻是3。 什麼情況在上面的建構函式中並沒有getname()這個函式物件啊!為什麼會打印出結果3呢!我們可以仔細看看getname()這個物件是在什麼地方出現的,是的它是通過原型屬性直接定義的,通過上面的兩次列印我們可以很明顯的發現例項化物件不僅能夠打印出建構函式還能夠打印出通過原型鏈來建立的屬性以及屬性值,換句話說,也就是實力化的物件繼承的物件並不全是建構函式,而是指向了一個我們看不見的物件,這個物件裡面包含的有建構函式,還有通過原型鏈來建立的屬性,那麼這個物件是什麼呢!其實我們在建立建構函式的時候,每個建構函式都會有一個prototype原型屬性,這個原型屬性會指向一個我們看不見的物件,我們可以通過原型屬性來建立固定不變的屬性並賦值,如:myfile.prototype.getname
= function () {return this.age;}這個時候原型屬性所指向的物件不僅包含了建構函式還包含了通過原型屬性所創建出來的一些屬性。 上面兩個問題的答案就出來了: 1、例項化物件到底指向的是誰? 答:例項化物件指向的永遠是prototype原型屬性所指向的那個物件,是通過例項化物件的內部屬性[[prototype]]來實現的。
2、例項化物件到底繼承的是誰? 答:其實例項化物件繼承的還是prototype原型所指向的那個虛擬的物件。 總結constructor(建構函式屬性): 這個時候我們在來看看 console.info(myfile1.constructor); console.info(myfile.constructor); console.info(myfile.prototype.constructor);三個為什麼第一個跟第三個的值是一樣的但是第二個會出現
ƒ Function() { [native code] } 。 console.info(myfile.prototype.constructor);其實就是在告訴計算機我們要的結果是prototype原型屬性所指向的那個物件中的建構函式,而因為console.info(myfile1.constructor);本來就是直接繼承的就是prototype原型屬性所指的物件所以這兩個命令打印出的結果自然也都是來之那個虛擬的物件中,這就是為什麼這兩個程式碼所執行出來的結果是一樣的原因。至於console.info(myfile.constructor);執行出來的結果是ƒ
Function() { [native code] } 就更好理解了,native code
的意思就是 本機程式碼 其實意思就是告訴我們,我們所執行的console.info(myfile.constructor);程式碼就是建構函式它自己本身,不能所執行這條程式碼會報錯,只是控制檯會更智慧一些的告訴我們,我們需要列印的就是它自己而已。 現在你知道了constructor建構函式屬性是屬於誰的屬性嗎? 答: 1、它是prototype原型屬性所指向的那個虛擬物件的屬性。 2、它是例項化物件的屬性。 從上面的例子中我們也能推斷出上面的兩條答案是成立的。
---------------------
作者:待歸魔帝
來源:CSDN
原文:https://blog.csdn.net/zhj145236/article/details/77477057
版權宣告:本文為博主原創文章,轉載請附上博文連結!