本文實例講述了ES6知識點整理之Proxy的應用。分享給大家供大家參考，具體如下：

Proxy 用于修改對象某些操作的默認行為，可以對外界的訪問進行過濾和改寫，其概念類似于元編程。

Proxy 讓我們可以對任何對象的絕大部分行為進行監聽和干涉，實現更多的自定義程序行為。在目標對象之前架設一層“攔截”，外界對該對象的訪問，都必須先通過這層攔截。

目前【兼容性】存在一定的問題，目前在chrome和ff瀏覽器中的非嚴格模式下可用，一些先進的技術即使在目前不能廣泛應用，但隨著時間的流逝，都將會進入程序員日常的編程中。

注： 博客整理時間：2018-03-24 16:21:15

初識Proxy

var obj = {name:'Joh'};var proxy = new Proxy(obj, { get (target, key) {  return 'test1'; }, set (target, key, value) {  target[key] = value }});console.log(proxy.name); // test1 進行get取值proxy.name = 'test2'; // 進行set設置console.log(obj.name); // test2

通過Proxy對象進行攔截target對象的屬性

完整的使用Proxy進行設置, 獲取，修改和刪除的案例

var obj = {name:'Joh',group:'g1',_type:'student'};var proxy = new Proxy(obj, { get (target, key) {  if(key[0]!== '_') {   // return Reflect.get(target,key); // 效果等同于下面的return語句   return target[key];  }; }, set (target, key, value) {  if(key[0]!== '_') {   // Reflect.set(target,key,value);   return target[key] = value;  } }, deleteProperty(target, key) {  // 業務邏輯  if(key[0] !== '_') {   // Reflect.deleteProperty(target, key);   delete target[key];  } }});console.log(proxy.name); // Johconsole.log(obj.name); // Johproxy.name = 'Lily'; // 在非嚴格模式下的賦值操作，嚴格模式將會報錯console.log(obj.name); // Lilydelete proxy.name; // 未能成功刪除，因為上面內部有判斷console.log(obj.name); // undefined 成功刪除delete proxy.group;console.log(obj.group); // undefined 成功刪除delete proxy._type;console.log(obj._type); // studentproxy.color='red';console.log(obj.color); // red

其中借助Reflect實現和直接實現的效果等同

通過has方法和in關鍵字進行攔截的示例：

var obj = {name:"Joh",_name:"Lily"};var proxy = new Proxy(obj, { has(target, key) {  if(key[0] === '_'){   return false;  } else {   return key in target;  } }});console.log('has name attr: ', 'name' in proxy); // has name attr: trueconsole.log('has _name attr: ', '_name' in proxy); // has _name attr: false

使用ownKeys方法與for-in遍歷過濾符合特定規則屬性的示例

var obj = {name:"Joh",_name:"Lily", age:10, group:"g1"};var proxy = new Proxy(obj, { ownKeys (target) {  return Reflect.ownKeys(target).filter(key => key[0] !== '_'); }});for(var k in proxy) { console.log(k); // 分別輸出 name age group 過濾了 _name}