diff options
Diffstat (limited to 'files/zh-cn/web/javascript/reference/global_objects/proxy/handler/get')
| -rw-r--r-- | files/zh-cn/web/javascript/reference/global_objects/proxy/handler/get/index.html | 177 |
1 files changed, 177 insertions, 0 deletions
diff --git a/files/zh-cn/web/javascript/reference/global_objects/proxy/handler/get/index.html b/files/zh-cn/web/javascript/reference/global_objects/proxy/handler/get/index.html new file mode 100644 index 0000000000..14a350436a --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/proxy/handler/get/index.html @@ -0,0 +1,177 @@ +--- +title: handler.get() +slug: Web/JavaScript/Reference/Global_Objects/Proxy/handler/get +tags: + - ECMAScript6 + - JavaScript + - Method + - Proxy +translation_of: Web/JavaScript/Reference/Global_Objects/Proxy/Proxy/get +--- +<div>{{JSRef}}</div> + +<p><strong><code>handler.get()</code></strong> 方法用于拦截对象的读取属性操作。</p> + +<h2 id="语法">语法</h2> + +<pre class="brush: js">var p = new Proxy(target, { + get: function(target, property, receiver) { + } +}); +</pre> + +<h3 id="参数">参数</h3> + +<p>以下是传递给get方法的参数,<code>this上下文绑定在</code>handler对象上.</p> + +<dl> + <dt><code>target</code></dt> + <dd>目标对象。</dd> + <dt><code>property</code></dt> + <dd>被获取的属性名。</dd> + <dt><code>receiver</code></dt> + <dd>Proxy或者继承Proxy的对象</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>get方法可以返回任何值。</p> + +<h2 id="描述">描述</h2> + +<p><strong><code>handler.get</code></strong> 方法用于拦截对象的读取属性操作。</p> + +<h3 id="拦截">拦截</h3> + +<p>该方法会拦截目标对象的以下操作:</p> + +<ul> + <li>访问属性: <code>proxy[foo]和</code> <code>proxy.bar</code></li> + <li>访问原型链上的属性: <code>Object.create(proxy)[foo]</code></li> + <li>{{jsxref("Reflect.get()")}}</li> +</ul> + +<h3 id="约束">约束</h3> + +<p>如果违背了以下的约束,proxy会抛出 {{jsxref("TypeError")}}:</p> + +<ul> + <li>如果要访问的目标属性是不可写以及不可配置的,则返回的值必须与该目标属性的值相同。</li> + <li>如果要访问的目标属性没有配置访问方法,即get方法是undefined的,则返回值必须为undefined。</li> +</ul> + +<h2 id="示例">示例</h2> + +<p>以下代码演示如何拦截属性值的读取操作。</p> + +<pre class="brush: js">var p = new Proxy({}, { + get: function(target, prop, receiver) { + console.log("called: " + prop); + return 10; + } +}); + +console.log(p.a); // "called: a" + // 10 +</pre> + +<p>以下代码演示违反约束的情况。</p> + +<pre class="brush: js">var obj = {}; +Object.defineProperty(obj, "a", { + configurable: false, + enumerable: false, + value: 10, + writable: false +}); + +var p = new Proxy(obj, { + get: function(target, prop) { + return 20; + } +}); + +p.a; //会抛出TypeError +</pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + <tr> + <td>{{SpecName('ES2015', '#sec-proxy-object-internal-methods-and-internal-slots-get-p-receiver', '[[Get]]')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-proxy-object-internal-methods-and-internal-slots-get-p-receiver', '[[Get]]')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div>{{CompatibilityTable}}</div> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Chrome</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatGeckoDesktop("18")}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Android</th> + <th>Chrome for Android</th> + <th>Firefox Mobile (Gecko)</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatGeckoMobile("18")}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="另见">另见</h2> + +<ul> + <li>{{jsxref("Proxy")}}</li> + <li>{{jsxref("Proxy.handler", "handler")}}</li> + <li>{{jsxref("Reflect.get()")}}</li> +</ul> |
