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

資訊專欄INFORMATION COLUMN

ES6 Proxy的學(xué)習(xí)與理解

LinkedME2016 / 1632人閱讀

摘要：是中添加的內(nèi)置對象，和配合功能十分強(qiáng)大。理解根據(jù)的文檔，是對原對象的包裝?？梢园b的內(nèi)容包括一系列等，值得注意的是同樣是一種可以攔截的操作。同時，對于未定義的操作保持原結(jié)果。

問題

前一段時間在字節(jié)跳動時聊到了Proxy。起因是問道Vue中數(shù)據(jù)綁定的實現(xiàn)，回答通過設(shè)置setter和getter實現(xiàn)，問這樣有什么缺點，答在對對象的屬性的監(jiān)控方面存在瑕疵，例如通過直接設(shè)置數(shù)組下標(biāo)進(jìn)行賦值，或者對對象直接進(jìn)行修改，是無法觀察到的，必須使用Vue.set添加，或者使用Array.prototype.push等方法。
面試官介紹說在Vue3中已經(jīng)通過Proxy解決了這個問題。Proxy是ES6中添加的內(nèi)置對象，和Reflect配合功能十分強(qiáng)大。正好今天看到一個問題。

理解

根據(jù)MDN的文檔，Proxy是對原對象的包裝。可以包裝的內(nèi)容包括一系列g(shù)et、set等，值得注意的是getPrototypeOf同樣是一種可以攔截的操作。同時，對于未定義的操作保持原結(jié)果。
在instanceof的頁面，可以看到如下示例

function C() {}
function D() {}

var o = new C();

// true, because: Object.getPrototypeOf(o) === C.prototype
o instanceof C;

那么，在上面那個問題中，既然未定義proxy的getPrototypeOf，那它就該與原對象保持一致。使用以下代碼進(jìn)行驗證：

Object.getPrototypeOf(proxy) === Array.prototype //true
進(jìn)一步思考

那么，是不是對于一切行為，在不做任何攔截的情況下，就能保證與目標(biāo)對象的行為完全一致呢？很顯然，這是不可能的。例如

a = {}
b = new Proxy(a, {})
console.log(a === b) //false

以及this的指向問題（案例來自阮一峰文章）

const target = {
  m: function () {
    console.log(this === proxy);
  }
};
const handler = {};

const proxy = new Proxy(target, handler);

target.m() // false
proxy.m()  // true

雖然大部分情況下這應(yīng)該不會成為大的障礙，但遇到錯誤的時候可以從這里入手尋找問題。

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

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

相關(guān)文章

  • ES6之Proxy學(xué)習(xí)

    摘要：在中構(gòu)造器的典型特點就是首字母大寫，我們通過原對象代理列表格式去創(chuàng)建對象創(chuàng)建的這個對象我們稱之為代理對象。就是原對象是當(dāng)前的屬性名是代理對象。理解為明星的經(jīng)理人消極怠工原封不動地轉(zhuǎn)告外界的信息給明星本身。但是要注意與是兩個不同的對象。 ES6之Proxy proxy的中文有代理的意思。在其他的程序設(shè)計語言中這個單詞也具有類似的含義。 它是什么 Proxy是一個構(gòu)造器。在js中構(gòu)造器的典...

    UnixAgain 評論0 收藏0

  • 【資源集合】 ES6 元編程（Proxy & Reflect & Symbol）

    摘要：理解元編程和是屬于元編程范疇的，能介入的對象底層操作進(jìn)行的過程中，并加以影響。元編程中的元的概念可以理解為程序本身。中，便是兩個可以用來進(jìn)行元編程的特性。在之后，標(biāo)準(zhǔn)引入了，從而提供比較完善的元編程能力。 導(dǎo)讀 幾年前 ES6 剛出來的時候接觸過 元編程（Metaprogramming）的概念，不過當(dāng)時還沒有深究。今天在應(yīng)用和學(xué)習(xí)中不斷接觸到這概念，比如 mobx 5 中就用到了 Pr...

    aikin 評論0 收藏0

  • JS每日一題：如何理解es6中的Proxy？

    20190124問: 如何理解es6中的Proxy？ 試題解析:對proxy的理解，可能會延伸到vue的雙向綁定 Proxy（代理） 定義 可以理解為為目標(biāo)對象架設(shè)一層攔截，外界對該對象的訪問，都必須通過這層攔截 簡單示例: const obj = new Proxy({}, { get: (target, key, receiver) => { return JS ...

    tinysun1234 評論0 收藏0

  • JS每日一題：如何理解es6中的Proxy？

    20190124問: 如何理解es6中的Proxy？ 試題解析:對proxy的理解，可能會延伸到vue的雙向綁定 Proxy（代理） 定義 可以理解為為目標(biāo)對象架設(shè)一層攔截，外界對該對象的訪問，都必須通過這層攔截 簡單示例: const obj = new Proxy({}, { get: (target, key, receiver) => { return JS ...

    PumpkinDylan 評論0 收藏0

  • 理解Javascript的Proxy

    摘要：關(guān)于在計算機(jī)領(lǐng)域是一個很普遍的概念，中文通常翻譯為代理，代理一般用于描述某人或某事代表他人行事。常見的概念有代理服務(wù)器反向代理代理模式等。所以至少可以起到兩方面的作用進(jìn)行訪問控制和增加功能。理解了上面兩個問題，學(xué)習(xí)的就簡單多了。 關(guān)于Proxy Proxy在計算機(jī)領(lǐng)域是一個很普遍的概念，中文通常翻譯為代理，代理一般用于描述某人或某事代表他人行事。常見的概念有Proxy Server（代...

    adie 評論0 收藏0

發(fā)表評論

0條評論

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