データの乗っ取りのためのES5のDefinePropertyとES6プロキシ

MVVMデータ駆動型、実際には、双方向のデータの更新への道をハイジャックからのデータを使用

データハイジャックのDefinePropertyを理解することがまず
<!DOCTYPE HTML > 
< HTML LANG = "EN" > 
< > 
    < メタ文字コード= "UTF-8" > 
    < メタ= "ビューポート" コンテンツ= "幅=装置幅、初期の規模= 1.0" > 
    < メタHTTP -equiv = "X-UA-互換" コンテンツ= "IE =縁" > 
    < タイトル>ドキュメント</ タイトル> 
</ ヘッド> 
< ボディ> 
    
<
> 

このmyobjせ= {}; 
 Object.definePropertyは(このmyobj、名前、{ 
     設定:// 。falseの場合は記載されているように構成し、オブジェクトが反対真削除することはできません、プロパティを変更しないかもしれない
     / * 列挙し列挙は、
     真の4つの方法の後にプロパティを操作するために使用することができる
     。1. 
     {(私はこのmyobjせで)ため
         にconsole.log(I); 
     } 
     2. 
     Object.keys(); 
     3. 
     JSON.stringify 
     4。
     Object.assign 
     * / 
     可算:trueに
    GET(){ //時間が取得した属性、メソッドを取得入ると、動作(値を返さなければならない)戻り値を得るために変更または定義されていない取得することができる
        // 値組み込み属性取得オブジェクトプロパティ値の
        戻り値; 
    }、
    SET(newValueに){ /を/ 値を取得するように変更する設定パラメータ設定newValueにリスナーメソッドの値
    // オブジェクトの値が内蔵させることができる属性プロパティが変更
    // 値=「DD」、
      値は= newValueに; 
    } 
})
myobj.nameは= ハム
console.log(myobj.name); 

</ スクリプト> 
</ HTML >
プロキシデータハイジャック
<!DOCTYPE HTML > 
< HTML LANG = "EN" > 
< > 
    < メタ文字コード= "UTF-8" > 
    < メタ= "ビューポート" コンテンツ= "幅=装置幅、初期の規模= 1.0" > 
    < メタHTTP -equiv = "X-UA-互換" コンテンツ= "IE =縁" > 
    < タイトル>ドキュメント</ タイトル> 
</ ヘッド> 
< ボディ> 
    
<
> 

このmyobjせ= {};
 // プロキシは、新しいオブジェクトが返されるインスタンス化しなければならない
// ハイジャックしない各プロパティに対して使用することがより便利
LET OBJ   =  新しい新しいプロキシ(このmyobj、{ 
    (目標、キーGET){ // ターゲットは電流を表しをキーは、オブジェクトインスタンス名が取得した属性
     
        はconsole.log(GET .. のリターン  ;標的[キー] 
    }、
    SET(ターゲット、キー、値){ // 現在のインスタンスキーは、取得した属性名を取得した値で表現する対象物を属性の現在の値を
        目標[キー] = 値; 
    } 
})
obj.name =  " ジョン・ドウ" ; 
はconsole.log(OBJ); 
</スクリプト> 
</ HTML >

 

おすすめ

転載: www.cnblogs.com/supermanGuo/p/11430378.html