JavaScript prototype 疑惑

Half 發(fā)布于2019-08-21 17:25 / 2391人閱讀

摘要：看了高級程序設(shè)計(jì)中關(guān)于對象的介紹，記錄一下對于其中有些地方的疑惑。

看了《JavaScript高級程序設(shè)計(jì)》中關(guān)于對象的介紹，記錄一下對于其中有些地方的疑惑。

使用構(gòu)造函數(shù)創(chuàng)建對象時，prototype中如果定義一個屬性指向函數(shù)，在函數(shù)中引用this，為什么this是指向構(gòu)造函數(shù)而不是prototype對象？

試驗(yàn)：

function SuperType() {
    this.property = "value in SuperType"
    this.obj = {
        testThis: function() {
            console.log(this)
            console.log(this.testValue)
            console.log(this.property)
        },
        testValue: "value in SuperType.obj",
    }
}

SuperType.prototype.getSuperValue = function() {
    console.log(this)
    return this.property
}

const test = new SuperType()

test.obj.testThis()
// output:
// { testThis: [Function: testThis], testValue: "test" }
// value in SuperType.obj
// undefined

r = test.getSuperValue()
console.log(r)
// output:
// SuperType {
//  property: true,
//  obj: { testThis: [Function: testThis], testValue: "value in SuperType.obj" }
// }
// value in SuperType

按照書上的講解，test實(shí)例的結(jié)構(gòu)應(yīng)該是如下的（偽代碼）：

person = {
    __proto__: {
        constructor: SuperType,
        getSuperValue: function() { ... },
    },
    obj: {
        testThis: function() { ... },
        testValue: "value in SuperType.obj",
    },
    property: "value in SuperType",
}

__proto__既然和obj同一層級的，那getSuperValue應(yīng)該就和testValue是有同樣的表現(xiàn)才對呀，為什么getSuperValue可以讀取到property的值呢？

云服務(wù)器 GPU云服務(wù)器 javascript_prototype PROTOTYPING Prototypal Prototypes

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/89488.html

相關(guān)文章

JavaScript之原型解析（上）

摘要：前言原型這個概念在這門語言中是一個核心關(guān)鍵的知識點(diǎn)，但是你是否真的已經(jīng)完全理解透徹了呢可能我個人的理解能力較差，因此經(jīng)過多次翻閱書籍和實(shí)踐我才真正了解原型，所以記錄下來以加深理解，也以便日后深入探討。前言原型這個概念在JavaScript這門語言中是一個核心關(guān)鍵的知識點(diǎn)，但是你是否真的已經(jīng)完全理解透徹了呢?可能我個人的理解能力較差，因此經(jīng)過多次翻閱書籍和實(shí)踐我才真正了解原型，所以記...

lushan 2019-08-21 17:03 評論0 收藏0
JavaScript this 從此不再疑惑

摘要：是的，始終指向調(diào)用對象，調(diào)用對象，這個很重要，的靜態(tài)成員是沒有的概念的。所以和，的區(qū)別是返回一個明確的新函數(shù)，和立即執(zhí)行了。 1. 問題引入 function A() {} A.prototype.fna = function() { console.log(this); } 我的問題是 fna 的 this 是指向哪里的？ var a = new A(); a.fna(); ...

Barrior 2019-08-20 17:52 評論0 收藏0
JavaScript 原型中的哲學(xué)思想

摘要：而作為構(gòu)造函數(shù)，需要有個屬性用來作為以該構(gòu)造函數(shù)創(chuàng)造的實(shí)例的繼承。歡迎來我的博客閱讀：「JavaScript 原型中的哲學(xué)思想」記得當(dāng)年初試前端的時候，學(xué)習(xí)JavaScript過程中，原型問題一直讓我疑惑許久，那時候捧著那本著名的紅皮書，看到有關(guān)原型的講解時，總是心存疑慮。當(dāng)在JavaScript世界中走過不少旅程之后，再次萌發(fā)起研究這部分知識的欲望，翻閱了不少書籍和資料，才搞懂...

sugarmo 2019-08-19 18:38 評論0 收藏0
JavaScript設(shè)計(jì)模式（一）

摘要：聲明設(shè)計(jì)模式系列是來自設(shè)計(jì)模式與開發(fā)這本書的讀書筆記，會結(jié)合自身的理解和一些項(xiàng)目經(jīng)驗(yàn)做筆記，原書作者曾探前言什么是設(shè)計(jì)模式，設(shè)計(jì)模式就是在某種場合下對某個問題的一種解決方案。聲明：【JavaScript設(shè)計(jì)模式】系列是來自《JavaScript設(shè)計(jì)模式與開發(fā)》這本書的讀書筆記，會結(jié)合自身的理解和一些項(xiàng)目經(jīng)驗(yàn)做筆記，原書作者曾探前言什么是設(shè)計(jì)模式，設(shè)計(jì)模式就是在某種場合下對...

dreamtecher 2019-08-21 16:47 評論0 收藏0
聽飛狐聊JavaScript設(shè)計(jì)模式系列07

摘要：本回內(nèi)容介紹上一回聊到單例模式，做了一道題，內(nèi)容不多，比較容易理解。這里其實(shí)還可以進(jìn)一步優(yōu)化，達(dá)到高聚類低耦合，這里工廠模式就告一段落了。本回內(nèi)容介紹上一回聊到JS單例模式(singleton)，做了一道題，內(nèi)容不多，比較容易理解。介一回嘞，聊聊工廠模式，之前聊到過工廠模式，這回聊深入點(diǎn)兒，可能會比較抽象，不過好在實(shí)際開發(fā)中使用還算廣泛，理解起來會比較容易，開始咯： 1. 簡單工廠...

BetaRabbit 2019-08-21 10:46 評論0 收藏0