Javascript對象及Proxy工作原理詳解
正文
這一章其實算是javascript的科普文章,其實這本書的讀者一般都不會是入門者,因此按道理說應該不需要再科普才對。但是作者依舊安排了這一章,證明就是這一章內(nèi)容與我們以為的對象不一樣。
Javascript中一切皆對象
這一句話大家應該耳熟能詳,對于常規(guī)的字面量對象,和new出來的對象,大家應該都能分辨
const str = '' const str2 = new String() const obj = {} const obj2 = Object.create()
但是根據(jù)ECMA,在javascript中其實分為2種對象:常規(guī)對象和異質(zhì)對象。任何不屬于常規(guī)對象的都叫異質(zhì)對象。
在javascript的世界中,函數(shù)也是一個對象。當我們指向Obj.foo
時,其實就會調(diào)用對象內(nèi)部[[Get]]
方法去獲取這個值,在ECMA中規(guī)定了如下內(nèi)部方法(網(wǎng)圖)。所以
所以,普通對象必須具有一組被稱為基本內(nèi)部方法(essential internal methods)的方法所定義的默認行為,也就是上圖。如果改變了默認方法,那么就是異質(zhì)對象。
比如Array
,當我們把Array.lenght = 0
,它會清空數(shù)組。
當我看到這張圖就知道了,如何判斷一個變量到底是普通對象還是函數(shù)呢?答案就是判斷它使用了[[Get]]
還是[[Call]]
。
毫無疑問,Proxy
是異質(zhì)對象,它可以直接性改變一些默認方法。當我們在Proxy
中沒有定義Get攔截器的時候,他會調(diào)用對象內(nèi)部自己的[[Get]]
,代理透明.
這一段話我反復看了很久,才明白它的意思。其實,proxy并不會直接改變對象內(nèi)部方法和行為,它是通過指定需要代理的方法,去執(zhí)行攔截的功能,這也與Proxy
的用法符合。
const p = new Proxy(obj,{/*被代理的屬性*/})
這時候p是與obj完全不相同的對象,有著不一樣的內(nèi)存地址。這就導致,當我們不能直接在p上去操縱obj,這時候我們就要反射Reflect
,反射猶如一面鏡子,映照著原始對象的地址,我們?nèi)ゲ僮髟紝ο髈bj,而不是p。
前面2章講了一些關于Proxy
和Reflect
的八股文,下一章就是具體講解vue3如何使用Proxy
了。
以上就是Javascript對象及Proxy工作原理詳解的詳細內(nèi)容,更多關于Javascript對象Proxy的資料請關注腳本之家其它相關文章!
相關文章
關于vue v-for 循環(huán)問題(一行顯示四個,每一行的最右邊那個計算屬性)
這篇文章主要介紹了關于vue v-for 循環(huán)問題(一行顯示四個,每一行的最右邊那個計算屬性),需要的朋友可以參考下2018-09-09Vue技巧Element Table二次封裝實戰(zhàn)示例
這篇文章主要為大家介紹了Vue技巧Element Table二次封裝實戰(zhàn)示例,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪2022-11-11vue項目本地開發(fā)使用Nginx配置代理后端接口問題
這篇文章主要介紹了vue項目本地開發(fā)使用Nginx配置代理后端接口問題,具有很好的參考價值,希望對大家有所幫助。如有錯誤或未考慮完全的地方,望不吝賜教2022-12-12