js原型鏈編程,js原型鏈概念

本文目錄一覽:

javascript 原型,原型鏈是什麼?有什麼特點

原型是JS的一個引用對象,就是說prototype本身就是一個對象,和OBJECT沒什麼不同

所有的屬性中都會包含一個屬性__proto__來指向你的原型對象

例如

function ROOT(){}

ROOT.A = 1

ROOT.prototype.B = 2;

//object對象是默認指向OBJECT直到你指定一個proto指針

//這裡由於child本身是已經實例化的OBJECT,所以會複製一份指定的root的prototype指針引用到child

var child = {__proto__:ROOT.prototype}

//這裡是child1原__proto__是指向空的object

//這裡對child1的prototype指針進行了替換

var child1 = function (){};

child1.prototype = ROOT.prototype

//剩下的結果就不說了

var chd = new child1;

console.log(child.B)

console.log(chd.B)

//你會發現除了child無法實例化,其他的特性都繼承了

console.log(chd.constructor)

console.log(chd.__proto__)

console.log(child.constructor)

console.log(child.__proto__)

所以這裡面

__proto__是指向的創建者的原型對象

constructor是指向的創建者

prototype是當前對象的原型對象

實例化的對象會先從實例化對象里查找屬性,如果找不到會在__proto__裡面查找指向的prototype的屬性

js原型和原型鏈的理解是什麼?

講原型和原型鏈,如果是講定義,那很是晦澀難懂,今天我們就通俗易懂的說說原型與原型鏈。還需要藉助阮老師的“Javascript繼承機制的設計思想”。

1,比如我們還要針對學生統計每個人的總分是多少,我們改造構造函數Person,構造函數上有個 prototype屬性,這個屬性就是這個構造函數的原型(顯式原型),這個原型是函數特有,prototype對象默認有兩個屬性,constructor屬性和__proto__屬性。

2,constructor,這個屬性包含了一個指針,指回原構造函數。通過控制台輸出,我們可以看到我們實例化的對象,有個__proto__屬性,這個屬性就是隱式原型,這個__proto__是所有對象都有的屬性。

3,由於JavaScript的一切都是對象(除undefined),又由於所有對象都有__proto__屬性,__proto__又指向構造函數的prototype,當我們訪問一個對象的屬性時。

4,如果這個對象內部不存在這個屬性,那麼他就會去__proto__里找這個屬性,這個__proto__又會有自己的__proto__,於是就這樣 一直找下去,也就是我們平時所說的原型鏈的概念。原型鏈,說明是鏈式,而不是環,說明有終點,它的終點是null。

js原型鏈和繼承的理解

Object() Function() Array() 等等都為構造函數。

Js 面向對象與傳統oop 有些不同,語法較高級 語法糖封裝。

This 為指針。指向this作用域的調用者

1.原型繼承鏈頂端為Object 。Js函數是對象

2.當讀取對象中的屬性時,先去實例本身中搜索,如搜索不到則去指向的原型中搜索

1.原型的存在意義在於實現繼承共享,是在構造函數中定義的一個成員對象,在下次實例化時不需要在構造函數中定義成員 就可實現實例共享方法屬性。

例子:通常為。 構造函數.prototype.xxx=我想實現實例繼承的東西 -》 new 構造函數 -》新實例a對象.原型指針指向構造函數的xxx對象(引用類型)

例子:Array 不等於 Array() 原因 Array為一個函數,而Array()為一個構造函數調用語句,故Array擁有prototype對象用於實例的共享繼承,Array()產生一個實例 故只能擁有prototype對象的私有指針 proto

2.在使用原型繼承時 不能使用字面量 構造函數.prototype={} 的方式重寫原型對象 。因為會導致該原型對象的constructor屬性被重寫,在生成的實例中導致constructor指向Object並且會切斷之前原型對象的聯繫,破壞原型鏈。

3.JavaScript 主要通過原型鏈實現繼承。原型鏈的構建是通過將一個類型的實例賦值給另一個構造函數的原型實現的

例子:

xxx實例. proto -》function xxx()構造函數.prototype對象故xxx. proto === xxx.prototype

xxx.prototype. proto -》Object.prototype因為所有對象都為Object函數構造來的。故xxx.prototype. proto ===Object.prototype。

Object.prototype. proto 為原型鏈頂端 proto 定義了尚未使用所以為null故Object.prototype. proto ===null約定俗成。

instanceof 用來判斷某實例是否為某構造函數的實例

isPrototypeOf 用於判斷某實例是否擁有某構造函數的原型對象指針

1.原型模式有忽略構造函數定義初始值步驟及原型中操作引用類型的缺點。

所以需要組合使用 構造函數模式+原型模式 來創建實例。在構造函數中定義實例的屬性,而需共享的方法就定義在原型對象中。

繼承:在子構造函數中調用 父.call(this, name); 實現構造函數之間的屬性繼承。使用 子.prototype = new 父(); 子.prototype.constructor = 子;實現方法的繼承。

2.如要在生產環境下的構造函數新增方法(如Array) 需要使用一個類似於工廠函數的寄生構造函數模式 在構造函數中返回一個修改後的對象

談談對原型鏈的理解 JS原型鏈怎麼理解

js對象是由構造方法創建的,構造方法有個原型prototype,那麼對象和原型之間的關係就叫做原型鏈。例如用原型給對象定義方法obj.prototype.funName = function(){alert(“我是原型的方法”)};對象可以直接從原型中調用這個方法obj.funName();更多JS深層知識可以進群前面是二九6中間是5九一後面是二九零,每天分享JS深層技術。

什麼是作用域鏈,什麼是原型鏈,它們的區別,在js中它們具體指什麼

對於 javaScript 只有兩種作用域,全局作用域和 function 作用,如果一個 function 里還有function, 那麼這個 function 又是一塊作用域,對於他的得上一層 function 是有一個引用指向這個快作用,那麼這樣的一層一層的鏈式引用關係就是作用域鏈,而原型鏈主要與prototype、__proto__有關,保存着對象的繼承關係。

js中什麼是原型對象和原型鏈

每個 JavaScript 對象內部都有一個指向其它對象的“指針”或者 “引用“, 並通過這種方式在對象之間建立了一種聯繫,形成了一種鏈式結構,我的理解這就是所謂的原型鏈。

function F() {} // F 是一個函數,函數也是對象,而且每個函數都有一個屬性叫:”prototype”

var o = new F(); // F.prototype 就是 o 的原型對象

console.log(o.name);

// 輸出: undefined

F.prototype.name = “foo”;

console.log(o.name);

// 輸出: foo

// 上面這個例子是想說明:通過 new 在對象 o 與對象 F.prototype 之間建立了聯繫, 這個建立聯繫

// 的方式有人叫 “原型繼承” 。 當訪問的對象屬性不存在時,就會沿着原型鏈去查找。

原創文章,作者:ZBUFV,如若轉載,請註明出處:https://www.506064.com/zh-hant/n/315773.html

(0)
打賞 微信掃一掃 微信掃一掃 支付寶掃一掃 支付寶掃一掃
ZBUFV的頭像ZBUFV
上一篇 2025-01-09 12:14
下一篇 2025-01-09 12:14

相關推薦

  • JS Proxy(array)用法介紹

    JS Proxy(array)可以說是ES6中非常重要的一個特性,它可以代理一個數組,監聽數據變化並進行攔截、處理。在實際開發中,使用Proxy(array)可以方便地實現數據的監…

    編程 2025-04-29
  • 解析js base64並轉成unit

    本文將從多個方面詳細介紹js中如何解析base64編碼並轉成unit格式。 一、base64編碼解析 在JavaScript中解析base64編碼可以使用atob()函數,它會將b…

    編程 2025-04-29
  • Node.js使用Body-Parser處理HTTP POST請求時,特殊字符無法返回的解決方法

    本文將解決Node.js使用Body-Parser處理HTTP POST請求時,特殊字符無法返回的問題。同時,給出一些相關示例代碼,以幫助讀者更好的理解並處理這個問題。 一、問題解…

    編程 2025-04-29
  • t3.js:一個全能的JavaScript動態文本替換工具

    t3.js是一個非常流行的JavaScript動態文本替換工具,它是一個輕量級庫,能夠很容易地實現文本內容的遞增、遞減、替換、切換以及其他各種操作。在本文中,我們將從多個方面探討t…

    編程 2025-04-28
  • 鍵值存儲(kvs):從基礎概念到實戰應用

    本文將從基礎概念入手,介紹鍵值存儲(kvs)的概念、原理以及實戰應用,並給出代碼實現。通過閱讀本文,您將了解鍵值存儲的優缺點,如何選擇最適合的鍵值存儲方案,以及如何使用鍵值存儲解決…

    編程 2025-04-28
  • JS圖片沿着SVG路徑移動實現方法

    本文將為大家詳細介紹如何使用JS實現圖片沿着SVG路徑移動的效果,包括路徑製作、路徑效果、以及實現代碼等內容。 一、路徑製作 路徑的製作,我們需要使用到SVG,SVG是可縮放矢量圖…

    編程 2025-04-27
  • 如何使用JS調用Python腳本

    本文將詳細介紹通過JS調用Python腳本的方法,包括使用Node.js、Python shell、child_process等三種方法,以及在Web應用中的應用。 一、使用Nod…

    編程 2025-04-27
  • 如何反混淆美團slider.js

    本文將從多個方面詳細闡述如何反混淆美團slider.js。在開始之前,需要明確的是,混淆是一種保護JavaScript代碼的方法,其目的是使代碼難以理解和修改。因此,在進行反混淆操…

    編程 2025-04-27
  • Python要學JS嗎?

    Python和JavaScript都是非常受歡迎的編程語言。然而,你可能會問,既然我已經學了Python,是不是也需要學一下JS呢?在本文中,我們將圍繞這個問題進行討論,並從多個角…

    編程 2025-04-27
  • 解決js ajax post 419問題

    對於使用ajax post請求時出現的419問題,我們需要進行以下幾個方面的闡述,包括返回碼的含義、可能出現的情況、解決方案等內容。 一、解析419返回碼 419返回碼錶示用戶超時…

    編程 2025-04-27

發表回復

登錄後才能評論