ホームページ > ウェブフロントエンド > フロントエンドQ&A > es6 プロキシ モードとは何ですか?

es6 プロキシ モードとは何ですか?

WBOY
リリース: 2022-04-01 10:18:27
オリジナル
1724 人が閲覧しました

es6 プロキシ モードはデザイン パターンであり、他のもののインターフェイスとして使用できるカテゴリを指します。具体的な表現形式は es6 の新しい Proxy オブジェクトです。Proxy オブジェクトは定義に使用されます。基本操作のカスタマイズ動作、構文は「let p=new Proxy(target,handler);」です。

es6 プロキシ モードとは何ですか?

このチュートリアルの動作環境: Windows 10 システム、ECMAScript バージョン 6.0、Dell G3 コンピューター。

es6 プロキシ パターンとは?

プロキシ パターン (英語: Proxy Pattern) は、プログラミングにおける設計パターンです。

いわゆるエージェントは、他のものとのインターフェイスとして機能できるカテゴリを指します。ブローカーは、ネットワーク接続、メモリ内の大きなオブジェクト、ファイル、その他の高価なリソースや再現不可能なリソースなど、あらゆるものとインターフェイスできます。

JavaScript におけるプロキシ モードの具体的な表現は、ES6 の新しいオブジェクトです---プロキシ

プロキシの説明は次のとおりです:

プロキシオブジェクトは、基本的な操作 (プロパティの検索、代入、列挙、関数呼び出しなど) のカスタム動作を定義するために使用されます。

簡単に言えば: Proxy オブジェクトを使用すると、JavaScript 内のすべての正当なオブジェクトの基本操作をカスタマイズできます。その後、カスタマイズした操作を使用して、そのオブジェクトの基本操作をオーバーライドします。つまり、オブジェクトが実行するとき、基本的な操作、実行プロセスと結果はオブジェクトではなく自分でカスタマイズします

:汗: うーん、言葉で表すと複雑すぎるので、直接コードに行きましょう。

#プロキシの構文は次のとおりです:

let p = new Proxy(target, handler);
ログイン後にコピー

  • target はプロキシしたいオブジェクトです。JavaScript の正当なオブジェクトであればどれでも構いません。例: (配列、オブジェクト、関数など)

  • handler はカスタマイズしたい操作メソッドのコレクションです。プロキシされた後の新しいオブジェクトには、ターゲットのすべてのプロパティとメソッドが含まれます。ただし、その動作と結果はハンドラーでカスタマイズされます。

  • 次に、このコードを見てみましょう:

    let obj = {
     a: 1,
     b: 2,
    }
     
    const p = new Proxy(obj, {
     get(target, key, value) {
      if (key === 'c') {
       return '我是自定义的一个结果';
      } else {
       return target[key];
      }
     },
     
     set(target, key, value) {
      if (value === 4) {
       target[key] = '我是自定义的一个结果';
      } else {
       target[key] = value;
      }
     }
    })
    console.log(obj.a) // 1
    console.log(obj.c) // undefined
    console.log(p.a) // 1
    console.log(p.c) // 我是自定义的一个结果
    obj.name = '李白';
    console.log(obj.name); // 李白
    obj.age = 4;
    console.log(obj.age); // 4
    p.name = '李白';
    console.log(p.name); // 李白
    p.age = 4;
    console.log(p.age); // 我是自定义的一个结果
    ログイン後にコピー

    上記のコードから、Proxy オブジェクトの役割が明確にわかります。これは、基本的な操作を定義するために使用されるカスタム動作です。同じ get 操作と set 操作です。プロキシのないオブジェクトの結果は、 JavaScript 自体の実行メカニズム. プロキシ オブジェクトの結果は独自のものです. プロキシの互換性は次のとおりです:

    [関連する推奨事項:

    JavaScript ビデオ チュートリアル

    es6 プロキシ モードとは何ですか?Web フロントエンド

    ]

    以上がes6 プロキシ モードとは何ですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
es6
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート