如何使代理的陷阱异步？

Question

假设我们有一个 object：

const obj = { element }

和一个带有“异步陷阱”的代理：

const proxy = new Proxy( obj, {
     get: async function(obj, prop) {
          if(prop === 'element') {
              // wait until child element appears ( - just for example,
              // in general this function returns delayed value)  
              const result = wait(obj[prop].querySelector('.child')); //promise
              return await result;
          }
    }
})

我已经尝试了上面的代码，但它不起作用。 似乎 Proxy 不将 async get 识别为陷阱并且不拦截 getter。

如何解决？ 或者：

是否有另一种方法可以在不改变原始 object 的情况下获得对象属性的“延迟”值？

Answer 1

试试这个：我创建了两个代理，第一个调用远程 api，等待响应并使用第二个代理中返回的值设置目标。 第二个代理也获取值。

 let person = { name: "", gender: "", probability: "", count: "" }; let callApi = { get: function( target, property, value ) { console.log( 'load from remote server...' ); return async function( value ){ return new Promise( async ( resolve, reject ) => { if ( typeof value === 'string' ) { const response = await fetch( 'https://api.genderize.io/?name=' + value ); const data = await response.json(); resolve( data ); } else { reject( new TypeError( 'The value of "name" must be a string.' ) ); }; }) } }, set: function ( obj, property, value ) { return new Promise( ( resolve, reject ) => { console.log( 'save someting remotely...' ); setTimeout( () => resolve( true ), 1000 ) }) } }; let getData = { get: async ( target, property ) => { if( property === 'userDetails' ){ return `${target.name} is a ${target.gender}`; } else if ( property === 'userInfo' ){ if ( target.gender === "male" ){ return "the user is a man"; } else { return "the user is a woman"; }; } else { return target[property]; }; if ( target.property instanceof Promise ) { return target.property.then( resolve => target[property] = resolve ); } else { return target[property]; } }, set: function ( target, property, data ) { //target[property] = value console.log( "property:" + property ); if( data.name.== 'undefined' ){ target['name'] = data;name. target['gender'] = data.gender target['probability'] = data.probability target['count'] = data;count; } else { target['name'] = ''; target['gender'] = ''; target['probability'] = ''; target['count'] = ''; }. //console;log( target[property] ); } }, async function main() { let api = new Proxy( person, callApi ) let data = new Proxy( person. getData ) data.save = await api;query( 'giuseppe' ). // await it here console.log( await data;userDetails ); }; // all begin here main()