2019-04-21 11:50:48 +08:00

124 lines
6.0 KiB
HTML
Raw Blame History

This file contains invisible Unicode characters

This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<article id="wikiArticle">
<div> <div class="blockIndicator nonStandard nonStandardHeader">
<p><strong><span class="icon-only-inline" title="This API has not been standardized."><i class="icon-warning-sign"> </i></span> 非标准</strong><br/>
该特性是非标准的,请尽量不要在生产环境中使用它!</p>
</div></div>
<p><strong>Object.unobserve()</strong> 是用来移除通过 <a href="Reference/Global_Objects/Object/observe" title="Object.observe() 方法用于异步地监视一个对象的修改。当对象属性被修改时方法的回调函数会提供一个有序的修改流。然而这个接口已经被废弃并从各浏览器中移除。你可以使用更通用的 Proxy 对象替代。"><code>Object.observe()</code></a>设置的观察者的方法。</p>
<h2 id="语法">语法</h2>
<pre><code class="language-javascript"><code>Object.unobserve(<var>obj</var>, <var>callback</var>)</code></code></pre>
<h3 id="参数">参数</h3>
<dl>
<dt><code>obj</code></dt>
<dd>需要停止观察的对象。</dd>
<dt><code>callback</code></dt>
<dd>通过 observer  <strong>obj </strong>对象设置的回调函数.</dd>
</dl>
<h2 id="描述">描述</h2>
<p><code>Object.unobserve()</code> 用来在 <a href="Reference/Global_Objects/Object/observe" title="Object.observe() 方法用于异步地监视一个对象的修改。当对象属性被修改时方法的回调函数会提供一个有序的修改流。然而这个接口已经被废弃并从各浏览器中移除。你可以使用更通用的 Proxy 对象替代。"><code>Object.observe()</code></a> 被调用以后,从对象上移除一个观察者。</p>
<p>这个回调函数必须是一个函数的引用,而不能是一个匿名函数。因为这个引用将被用来移除之前设置的观察者方法。 给 <strong>Object.unobserve() </strong>传入匿名函数作为回调是不起作用的, 它不能移除任何观察者方法。</p>
<h2 id="例子">例子</h2>
<h3 id="观察一个对象">观察一个对象</h3>
<pre><code class="language-javascript">var obj = {
  foo: 0,
  bar: 1
};
var observer = function(changes) {
  console.log(changes);
}
Object.observe(obj, observer);
obj.newProperty = 2;
// [{name: 'newProperty', object: &lt;obj&gt;, type: 'add'}]
Object.unobserve(obj, observer);
obj.foo = 1;
// 回调函数不会被调用</code></pre>
<h3 id="使用匿名函数">使用匿名函数</h3>
<pre><code class="language-javascript">var person = {
  name : 'Ahmed',
  age : 25
};
Object.observe(person, function (changes) {
  console.log(changes);
});
person.age = 40;
// [{name: 'age', object: &lt;obj&gt;, oldValue: 25, type: 'update'}]
Object.unobserve(person, function (changes) {
  console.log(changes);
});
person.age = 63;
// [{name: 'age', object: &lt;obj&gt;, oldValue: 40, type: 'update'}]
// 回调函数将会被调用
</code></pre>
<h2 id="浏览器兼容性">浏览器兼容性</h2>
<div><div class="blockIndicator warning"><strong><a class="external" href="https://github.com/mdn/browser-compat-data" rel="noopener">We're converting our compatibility data into a machine-readable JSON format</a></strong>.
This compatibility table still uses the old format,
because we haven't yet converted the data it contains.
<strong><a class="new" href="/zh-CN/docs/MDN/Contribute/Structures/Compatibility_tables" rel="nofollow">Find out how you can help!</a></strong></div>
<div class="htab">
<a id="AutoCompatibilityTable" name="AutoCompatibilityTable"></a>
<ul>
<li class="selected"><a>Desktop</a></li>
<li><a>Mobile</a></li>
</ul>
</div></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>36</td>
<td><span style="color: #f00;">未实现</span></td>
<td><span style="color: #f00;">未实现</span></td>
<td>23</td>
<td><span style="color: #f00;">未实现</span></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><span style="color: #f00;">未实现</span></td>
<td>36</td>
<td><span style="color: #f00;">未实现</span></td>
<td><span style="color: #f00;">未实现</span></td>
<td>23</td>
<td><span style="color: #f00;">未实现</span></td>
</tr>
</tbody>
</table>
</div>
<h2 id="相关链接">相关链接</h2>
<ul>
<li><a href="Reference/Global_Objects/Object/observe" title="Object.observe() 方法用于异步地监视一个对象的修改。当对象属性被修改时方法的回调函数会提供一个有序的修改流。然而这个接口已经被废弃并从各浏览器中移除。你可以使用更通用的 Proxy 对象替代。"><code>Object.observe()</code></a> <span class="icon-only-inline" title="This API has not been standardized."><i class="icon-warning-sign"> </i></span></li>
<li><a href="Reference/Global_Objects/Array/observe" title='Array.observe() 方法用于异步监视数组发生的变化,类似于针对对象的 Object.observe() 。当数组的值发生变化时,它按发生顺序提供了一个变化流。与 Object.observe() 类似,它由如下可接受的变化类型列表["add"、"update"、"delete"、"splice"]触发。'><code>Array.observe()</code></a> <span class="icon-only-inline" title="This API has not been standardized."><i class="icon-warning-sign"> </i></span></li>
<li><a href="Reference/Global_Objects/Array/unobserve" title="Array.unobserve()方法用来移除Array.observe()设置的所有观察者。"><code>Array.unobserve()</code></a> <span class="icon-only-inline" title="This API has not been standardized."><i class="icon-warning-sign"> </i></span></li>
</ul>
</article>