摘要:要用作原型的對象。函數對象可以創建普通對象,這個我們上面講過了回顧一下這是一個自定義構造函數普通對象沒法創建函數對象,凡是通過創建的對象都是函數對象,其他都是普通對象通常通過創建,可以通過來判斷。
關于js的原型和原型鏈,有人覺得這是很頭疼的一塊知識點,其實不然,它很基礎,不信,往下看
要了解原型和原型鏈,我們得先從對象說起
創建對象的三種方式:
對象直接量通過對象直接量創建對象,這是最簡單也是最常用的創建對象的方式
var empty = {}; var pos = {x:12,y:23}; var pos2 = {x:pos.x,y:pos.y+1}; var author={ "my name":"陌上寒",//屬性名帶空格,必須用引號包裹 "article-title":"關于javascript的原型和原型鏈,看我就夠了(一)",//屬性名帶連字符,必須用引號包裹 "if":"使用保留字作為屬性名,必須用引號包裹"http://使用保留字作為屬性名,必須用引號包裹 }通過new創建對象
通過new運算符創建并初始化一個新對象,關鍵字new后跟隨一個函數調用,這個函數成為構造函數(constructor),構造函數用來初始化一個新對象,js包含了一些內置的構造函數
var obj = new Object()//創建一個空對象等同于 var obj = {} var arr = new Array()//創建一個空數組等同于 var arr = [] ...
上面的Object(),Array(),都是js內置的構造函數
除了內置的構造函數,我們還可以使用自定義構造函數來初始化對象
function fun(){ console.log("這是一個自定義構造函數") }; var myObj= new fun();Object.create()
這個創建對象的方法似乎有些陌生,它創建一個新對象,包含兩個參數,
第一個,必需。 要用作原型的對象。 可以為 null
第二個,可選。 包含一個或多個屬性描述符的 JavaScript 對象
const obj = Object.create({x:1})//obj 繼承了屬性x const obj2 = Object.create(Object.prototype, { foo: { writable: true, configurable: true, value: "hello" } }) console.log(obj2);//輸出{foo: "hello"} const obj3 = Object.create(null)//obj3不繼承任何屬性和方法
創建一個空對象
//以下三種方法等效 var obj1 = {}; var obj2 = new Object() var obj3 = Object.create(Object.prototype)
今天重點說原型,明天我們再把Object.create()展開講述
簡單回顧以下,以上就是創建對象的三種方式
通過對象直接量
通過new創建對象
通過Object.create()
馬上進入正題了,還差一點點
我們都知道 JavaScript中萬物皆對象,但對象之間也是有區別的。分為函數對象和普通對象。
函數對象可以創建普通對象,(這個我們上面講過了),回顧一下
function fun(){ console.log("這是一個自定義構造函數") }; var myObj= new fun();
普通對象沒法創建函數對象,凡是通過new Function創建的對象都是函數對象,其他都是普通對象(通常通過Object創建),可以通過typeof來判斷。
function f1(){}; typeof f1 //"function" var o1 = new f1(); typeof o1 //"object" var o2 = {}; typeof o2 //"object"
關于函數的創建,注意以下寫法等價
function f1(){} 等價于 var f1 = new Function(); function f21(a,b){ alert(a+b); } f21(1,2) 等價于 var f22 = new Function("a","b","alert(a+b)"); f22(1,2)
簡單回顧一下
我們將對象分為函數對象和普通對象,函數對象的級別要要高于普通對象,可以通過函數對象創建普通對象,但是無法通過普通對象創建函數對象
好了,進入正題!
每一個js對象(null除外)都和另一個對象相關聯,“另一個”對象就是原型,每一個對象都從原型繼承屬性
所有通過對象直接量創建的對象都具有同一個原型對象,可以通過Object.prototype獲取對原型對象的引用,注意以下代碼
//dmeo1 const obj =new Object() //等價于 const obj ={} //等價于const obj = Object.create() alert(obj.prototype)//undefined alert(Object.prototype)//[object Object] //demo2 function fun(){ console.log("這是一個自定義構造函數") }; alert(fun.prototype)//[object Object]
看以上代碼,obj 為普通對象,obj的prototype為undefined,Object為js內置構造函數,Object存在prototype
我們得出以下結論
每一個函數對象都有一個prototype屬性,但是普通對象是沒有的;
換個方式再說一遍,只有函數對象才會存在prototype屬性,普通的對象不存在
還沒結束,看如下代碼
function fun(){ console.log("這是一個自定義構造函數") }; console.log(fun.prototype)
輸出:
const obj = {} console.log(obj.__proto__);
輸出
const str="陌上寒" console.log(num.__proto__);
輸出
是構造函數創建的實例的屬性,該屬性的作用是指向創建當前對象的構造函數。(這個不是我們今天重點要介紹的)
_proto_這是什么?根據我們的console.log,不難發現,函數對象,普通對象,都存在__proto__,這是什么呢?__proto__和原型鏈有什么聯系呢?__proto__指向誰呢?
我們明天繼續探討js原型和原型鏈,不見不散
原文鏈接
參考鏈接
簡單理解js的prototype屬性
基于js中的原型(全面講解)
JS原型與原型鏈的深入理解
三張圖搞懂JavaScript的原型對象與原型鏈
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://m.specialneedsforspecialkids.com/yun/98963.html
摘要:原文鏈接關于的原型和原型鏈,看我就夠了一參考鏈接闖關記之原型及原型鏈之原型與原型鏈一篇文章帶你理解原型和原型鏈徹底理解原型鏈一的默認指向圖解和的三角關系原型和原型鏈三張圖搞懂的原型對象與原型鏈 溫故 創建對象的三種方式 通過對象直接量 通過new創建對象 通過Object.create() js中對象分為兩種 函數對象 普通對象 仔細觀察如下代碼 function Foo(na...
摘要:對于中的引用類型而言,是保存著它們所有實例方法的真正所在。高級程序設計構造函數陌上寒原型對象有一個屬性,指向該原型對象對應的構造函數為什么有屬性那是因為是的實例。 溫故 我們先回顧一下前兩天討論的內容 創建對象的三種方式 通過對象直接量 通過new創建對象 通過Object.create() js中對象分為兩種 函數對象 普通對象 原型對象prototype 每一個函數對象都...
摘要:基本概念方法會返回一個布爾值,指示對象自身屬性中非繼承屬性是否具有指定的屬性,如果具有帶指定名稱的屬性,則方法返回,否則返回。此方法不會檢查對象原型鏈中的屬性該屬性必須是對象本身的一個成員。使用語法參數,必需。 hasOwnProperty基本概念 hasOwnProperty() 方法會返回一個布爾值,指示對象自身屬性中(非繼承屬性)是否具有指定的屬性,如果 object 具有帶指定...
摘要:也就是說,所有的函數和構造函數都是由生成,包括本身。如果只考慮構造函數和及其關聯的原型對象,在不解決懸念的情況下,圖形是這樣的可以看到,每一個構造函數和它關聯的原型對象構成一個環,而且每一個構造函數的屬性無所指。 前言 JavaScript 是我接觸到的第二門編程語言,第一門是 C 語言。然后才是 C++、Java 還有其它一些什么。所以我對 JavaScript 是非常有感情的,畢...
閱讀 3580·2021-09-22 10:52
閱讀 1597·2021-09-09 09:34
閱讀 1998·2021-09-09 09:33
閱讀 766·2019-08-30 15:54
閱讀 2680·2019-08-29 11:15
閱讀 723·2019-08-26 13:37
閱讀 1676·2019-08-26 12:11
閱讀 2983·2019-08-26 12:00