国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

學習JavaScript的原型筆記

Nino / 1999人閱讀

摘要:通過同一個構造函數實例化的多個對象具有相同的原型對象。構造函數的原型對象是實例對象通過屬性也指向原型對象。如果把函數當成實例對象的話,其構造函數是,其原型對象是類似地,函數的構造函數也是,其原型對象是。

JavaScript的原型(prototype、__proto__、constructor)
構造函數:function Foo() {};
實例對象: let f1 = new Foo;
let o1 = new Foo;

(全文的proto指兩個下劃線中間proto)

一般函數都有prototype屬性,除了window.MathFunction.prototype.bind()(該屬性指向原型)等

一般對象都有proto屬性,除了Object.create(null)等,該屬性指向了創建該對象的構造函數的原型。其實這個屬性指向了[[prototype],但是[[prototype]]是內部屬性,我們并不能訪問到,所有采用proto來訪問。總之,對象可以通過proto來訪問不屬于該對象的屬性,proto將對象連接起來組成了原型鏈。

概念:

構造函數:用來初始化新創建的對象的函數是構造函數。上例中,Foo()函數是構造函數。

實例對象:通過構造函數的new操作創建的對象是實例對象。(可以用一個構造函數,構造多個實例對象)

function Foo(){};
var f1 = new Foo;
var f2 = new Foo;
console.log(f1 === f2);//false

3.原型對象及prototype:構造函數有一個prototype屬性,指向對應實例對象的原型對象。通過同一個構造函數實例化的多個對象具有相同的原型對象。這個屬性可以用來實現繼承。

function Foo(){};
Foo.prototype.a = 1;
var f1 = new Foo;
var f2 = new Foo;

console.log(Foo.prototype.a);//1
console.log(f1.a);//1
console.log(f2.a);//1

4.constructor:原型對象有一個constructor屬性,指向該原型對象對應的構造函數。由于實例對象可以繼承原型對象的屬性,所以實例對象也擁有constructor屬性,同樣指向原型對象對應的構造函數。

console.log(Foo.prototype.constructor === Foo);//true
console.log(f1.constructor === Foo);//true

5.ptoto:實例對象有一個proto屬性,指向該實例對象對應的原型對象。

console.log(f1.__proto__ === Foo.prototype);//true
第一部分:Foo

1、實例對象f1是通過構造函數Foo()new操作創建的。構造函數Foo()的原型對象是Foo.prototype;實例對象f1通過proto屬性也指向原型對象Foo.prototype

console.log(f1.__proto === Foo.prototype);//true

2、實例對象f1本身并沒有constructor屬性,但它可以繼承原型對象Foo.prototypeconstructor屬性

console.log(Foo.prototype.constructor === Foo);//true
console.log(f1.constructor === Foo);//true
console.log(f1.hasOwnProperty("constructor"));//false

實例對象f1的控制臺效果

第二部分:Object

1、Foo.prototypef1的原型對象,同時它也是實例對象。實際上,任何對象都可以看做是通過Object()構造函數的new操作實例化的對象 所以,Foo.prototype作為實例對象,它的構造函數是Object(),原型對象是Object.prototype。相應地,構造函數Object()prototype屬性指向原型對象Object.prototype;實例對象Foo.prototypeproto屬性同樣指向原型對象Object.prototype

console.log(Foo.prototype.__proto__ === Object.prototype);//true

2、實例對象Foo.prototype本身具有constructor屬性,所以它會覆蓋繼承自原型對象Object.prototypeconstructor屬性。

console.log(Foo.prototype.constructor === Foo);//true
console.log(Object.prototype.constructor === Object);//true
console.log(Foo.prototype.hasOwnProperty("constructor"));//true

下圖是實例對象Foo.prototype的控制臺效果

3、Object.prototype作為實例對象的話,其原型對象是null。

console.log(Object.prototype.__proto__ === null);//true
第三部分:Function

1、前面已經介紹過,函數也是對象,只不過是具有特殊功能的對象而已。任何函數都可以看做是通過Function()構造函數的new操作實例化的結果。如果把函數Foo當成實例對象的話,其構造函數是Function(),其原型對象是Function.prototype;類似地,函數Object的構造函數也是Function(),其原型對象是Function.prototype

console.log(Foo.__proto__ === Function.prototype);//true
console.log(Object.__proto__ === Function.prototype);//true

2、原型對象Function.prototypeconstructor屬性指向構造函數Function();實例對象ObjectFoo本身沒有constructor屬性,需要繼承原型對象Function.prototypeconstructor屬性。

console.log(Function.prototype.constructor === Function);//true
console.log(Foo.constructor === Function);//true
console.log(Foo.hasOwnProperty("constructor"));//false
console.log(Object.constructor === Function);//true
console.log(Object.hasOwnProperty("constructor"));//false

3、所有的函數都可以看成是構造函數Function()new操作的實例化對象。那么,Function可以看成是調用其自身的new操作的實例化的結果。所以,如果Function作為實例對象,其構造函數是Function,其原型對象是Function.prototype

console.log(Function.__proto__ === Function.prototype);//true
console.log(Function.prototype.constructor === Function);//true
console.log(Function.prototype === Function.prototype);//true

4、如果Function.prototype作為實例對象的話,其原型對象是什么呢?和前面一樣,所有的對象都可以看成是Object()構造函數的new操作的實例化結果。所以,Function.prototype的原型對象是Object.prototype,其原型函數是Object()

console.log(Function.prototype.__proto__ === Object.prototype);//true
總結:

1、函數(Function也是函數)是new Function的結果,所以函數可以作為實例對象,其構造函數是Function(),原型對象是Function.prototype
2、對象(函數也是對象)是new Object的結果,所以對象可以作為實例對象,其構造函數是Object(),原型對象是Object.prototype
3、Object.prototype的原型對象是ull

文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。

轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/108863.html

相關文章

  • 重學前端學習筆記(八)--JavaScript原型和類

    摘要:用構造器模擬類的兩種方法在構造器中修改,給添加屬性修改構造器的屬性指向的對象,它是從這個構造器構造出來的所有對象的原型。 筆記說明 重學前端是程劭非(winter)【前手機淘寶前端負責人】在極客時間開的一個專欄,每天10分鐘,重構你的前端知識體系,筆者主要整理學習過程的一些要點筆記以及感悟,完整的可以加入winter的專欄學習【原文有winter的語音】,如有侵權請聯系我,郵箱:kai...

    nanfeiyan 評論0 收藏0
  • 重學前端學習筆記(八)--JavaScript原型和類

    摘要:用構造器模擬類的兩種方法在構造器中修改,給添加屬性修改構造器的屬性指向的對象,它是從這個構造器構造出來的所有對象的原型。 筆記說明 重學前端是程劭非(winter)【前手機淘寶前端負責人】在極客時間開的一個專欄,每天10分鐘,重構你的前端知識體系,筆者主要整理學習過程的一些要點筆記以及感悟,完整的可以加入winter的專欄學習【原文有winter的語音】,如有侵權請聯系我,郵箱:kai...

    k00baa 評論0 收藏0
  • 重學前端學習筆記(八)--JavaScript原型和類

    摘要:用構造器模擬類的兩種方法在構造器中修改,給添加屬性修改構造器的屬性指向的對象,它是從這個構造器構造出來的所有對象的原型。 筆記說明 重學前端是程劭非(winter)【前手機淘寶前端負責人】在極客時間開的一個專欄,每天10分鐘,重構你的前端知識體系,筆者主要整理學習過程的一些要點筆記以及感悟,完整的可以加入winter的專欄學習【原文有winter的語音】,如有侵權請聯系我,郵箱:kai...

    Render 評論0 收藏0
  • javascript對象和原型對象學習筆記

    摘要:例例通過原型鏈來檢測對象所調用的方法是否存在,存在在哪個原型對象上除了在對象對象中存在外,其他方法都是通過原型鏈的方法在上找到并調用。 前言 學習了解JavaScript對象的繼承機制 JavaScript Object 概念 Object是js的基本數據結構的一種,屬于引用類型。 對象的創建方法 對象字面量寫法 構造函數,通過構造函數來創建對象實例 Object()構造函數 cre...

    niceforbear 評論0 收藏0
  • JavaScript學習第十天筆記(繼承)

    摘要:繼承原型鏈如果構造函數或對象的原型指向構造函數或對象,的原型再指向構造函數或對象,以此類推,最終的構造函數或對象的原型指向的原型。 繼承 原型鏈 如果構造函數或對象A的原型指向構造函數或對象B,B的原型再指向構造函數或對象C,以此類推,最終的構造函數或對象的原型指向Object的原型。由此形成了一條鏈狀結構,被稱之為原型鏈。按照上述的描述,在B中定義的屬性或方法,可以在A中使用并不需要...

    baiy 評論0 收藏0

發表評論

0條評論

Nino

|高級講師

TA的文章

閱讀更多
最新活動
閱讀需要支付1元查看
<