Javascript
 Computer >> コンピューター >  >> プログラミング >> Javascript

JavaScriptでのproxy（）オブジェクトの使用は何ですか？

Proxy（）

ECMAScript 6によって導入された新機能の1つ proxy（）です 物体。 Proxy（） オブジェクトは、基本的な操作（プロパティの検索、割り当て、列挙、関数の呼び出しなど）のカスタム動作を定義するために使用されます。

Proxy（） オブジェクトには3つの重要な用語が含まれています

1）ハンドラー -トラップを含むプレースホルダーオブジェクトです。

2）トラップ -トラップはプロパティへのアクセスを提供します。

3）ターゲット -プロキシが仮想化するオブジェクトです。

構文

var p = new Proxy(target, handler);

次の例では、「p」というオブジェクトがあり、いくつかのプロパティがあります。オブジェクトで定義されていないプロパティを実行しようとすると、出力に示されているように未定義が実行されます。

例

<html>
<body>
<script>
   var p = {
      Name: 'Ram kumar',
      Age: 27
   };
   document.write(person.Name);
   document.write("</br>");
   document.write(person.Age);
   document.write("</br>");
   document.write(person.designation);
</script>
</body>
</html>

出力

Ram kumar
27
undefined


proxy（）の場合 を使用すると、未定義の出力を削除できます。 Proxy（） 「get」を使用して不明なプロパティをトラップしようとします "キーワード。proxy（）内で定義されているハンドラー 、ターゲットを通過します リクエストされたキー名を「get」に入力します 「罠。

次の例では、最初はオブジェクト'p'に指定と役割がありません。しかし、後で proxy（） 画像に入ると、オブジェクトとそのプロパティは' getを使用してトラップされました 'および割り当てられていないプロパティは、出力に示されているように表示されました。

例

<html>
<body>
<script>
   var p = {
      Name: 'Ram kumar',
      Age: 27
   };
   var handler = {
      get: function(target, prop) {
         return prop in target ? target[prop] : 'Content developer';
      }
   };
   var prox = new Proxy(p, handler);
   document.write(prox.Name);
   document.write("</br>");
   document.write(prox.Age);
   document.write("</br>");
   document.write(prox.designation);
   document.write("</br>");
   document.write(prox.role);
</script>
</body>
</html>

出力

Ram kumar
27
content developer
content developer

  1. javascriptでの歩哨の使用は何ですか？

    Sentryは、完全なjavascriptデバッグおよび監視ツールパッケージであり、本番コードを追跡できます。歩哨の特徴のいくつか- 環境と使用法の詳細を記録して、バグを再現して修正します 以前はユーザーのデバッグコンソールにのみ表示されていたエラーとスタックトレースを確認してください。 ソースマップを自動的に適用して、縮小、コンパイル、またはトランスパイルされたコードを元の形式に変換します。 モバイルアプリのレポートサポート。

  2. JavaScript Proxy（）オブジェクト

    JavaScript proxy（）オブジェクトは、オブジェクトまたは関数をラップし、プロパティへのアクセス、関数の呼び出しなどの基本的な操作のカスタムアクションに使用されます。 以下はJavaScriptのproxy（）オブジェクトのコードです- 例 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-w