mirror of
https://github.com/fofolee/uTools-Manuals.git
synced 2025-06-08 23:14:06 +08:00
100 lines
9.0 KiB
HTML
100 lines
9.0 KiB
HTML
<article id="wikiArticle">
|
||
<p></p> <div class="blockIndicator experimental indicator-warning">
|
||
<p><span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span> <strong>这是一个实验中的功能</strong><br/>此功能某些浏览器尚在开发中，请参考<a href="#Browser_compatibility">浏览器兼容性表格</a>以得到在不同浏览器中适合使用的前缀。由于该功能对应的标准文档可能被重新修订，所以在未来版本的浏览器中该功能的语法和行为可能随之改变。</p>
|
||
</div><p></p>
|
||
<p><code>globalThis</code> 可以获取全局对象。</p>
|
||
<h2 id="语法">语法</h2>
|
||
<pre><code class="language-javascript">globalThis</code></pre>
|
||
<h2 id="描述">描述</h2>
|
||
<p>事实上，在不同的 JavaScript 环境中拿到全局对象是需要不同的语句的。在 Web 中，可以通过 <code>window</code>、<code>self</code> 或者 <code>frames</code> 取到全局对象，但是在 <a href="https://developer.mozilla.org/en-US/docs/Web/API/Worker">Web Workers</a> 中只有 <code>self</code> 可以。在 Node.js 中，它们都无法获取，必须使用 <code>global</code>。在松散模式下，可以在函数中返回 <code>this</code> 来获取全局对象，但是在严格模式下 <code>this</code> 会返回 <code>undefined</code> 。</p>
|
||
<p><code>globalThis</code> 提供了一个标准的方式去获取不同环境下的全局对象。它不像 <code>window</code> 或者 <code>self</code> 这些属性，而是确保可以在有无窗口的环境下都可以正常工作。所以你可以安心的使用 <code>globalThis</code> ，不必担心它的运行环境。</p>
|
||
<p>便于记忆，你只需要记住<code>全局对象自己</code> 翻译过来就是 <code>globalThis</code>。</p>
|
||
<h3 id="命名">命名</h3>
|
||
<p>此特性曾经在提案时命名为 <code>global</code>，但有些网站会因此运行不正常，所以改名为 <code>globalThis</code> 了。</p>
|
||
<h2 id="示例">示例</h2>
|
||
<p>在 <code>globalThis</code> 之前，获取某个全局对象的唯一方式就是 <code>Function('return this')()</code>，但是这在某些情况下会导致 <a href="https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP">CSP</a> 危害，所以 <a class="external" href="https://github.com/paulmillr/es6-shim" rel="noopener">es6-shim</a> 使用如下的方式：</p>
|
||
<pre><code class="language-javascript"><code>var getGlobal = function () {
|
||
if (typeof self !== 'undefined') { return self; }
|
||
if (typeof window !== 'undefined') { return window; }
|
||
if (typeof global !== 'undefined') { return global; }
|
||
throw new Error('unable to locate global object');
|
||
};
|
||
|
||
var globals = getGlobal();
|
||
|
||
if (typeof globals.setTimeout !== 'function') {
|
||
// no setTimeout in this environment!
|
||
}</code></code></pre>
|
||
<p>但是有了 <code>globalThis</code> 之后，只需要：</p>
|
||
<pre><code class="language-javascript"><code>if (typeof globalThis.setTimeout !== 'function') {
|
||
// no setTimeout in this environment!
|
||
}</code>
|
||
</code></pre>
|
||
<h2 id="规范">规范</h2>
|
||
<table class="standard-table">
|
||
<tbody>
|
||
<tr>
|
||
<th scope="col">规范</th>
|
||
<th scope="col">状态</th>
|
||
<th scope="col">备注</th>
|
||
</tr>
|
||
<tr>
|
||
<td><a class="external" href="https://github.com/tc39/proposal-global/blob/master/spec.md" rel="noopener">tc39 提案 globalThis</a></td>
|
||
<td><span class="spec-Draft">Draft</span></td>
|
||
<td>目前处于 Stage 3</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
<h2 id="浏览器兼容">浏览器兼容</h2>
|
||
<p></p><div class="bc-data"><a class="bc-github-link external" href="https://github.com/mdn/browser-compat-data" rel="noopener">Update compatibility data on GitHub</a><table class="bc-table bc-table-js"><thead><tr class="bc-platforms"><td></td><th class="bc-platform-desktop" colspan="6"><span>Desktop</span></th><th class="bc-platform-mobile" colspan="7"><span>Mobile</span></th><th class="bc-platform-server" colspan="1"><span>Server</span></th></tr><tr class="bc-browsers"><td></td><th class="bc-browser-chrome"><span class="bc-head-txt-label bc-head-icon-chrome">Chrome</span></th><th class="bc-browser-edge"><span class="bc-head-txt-label bc-head-icon-edge">Edge</span></th><th class="bc-browser-firefox"><span class="bc-head-txt-label bc-head-icon-firefox">Firefox</span></th><th class="bc-browser-ie"><span class="bc-head-txt-label bc-head-icon-ie">Internet Explorer</span></th><th class="bc-browser-opera"><span class="bc-head-txt-label bc-head-icon-opera">Opera</span></th><th class="bc-browser-safari"><span class="bc-head-txt-label bc-head-icon-safari">Safari</span></th><th class="bc-browser-webview_android"><span class="bc-head-txt-label bc-head-icon-webview_android">Android webview</span></th><th class="bc-browser-chrome_android"><span class="bc-head-txt-label bc-head-icon-chrome_android">Chrome for Android</span></th><th class="bc-browser-edge_mobile"><span class="bc-head-txt-label bc-head-icon-edge_mobile">Edge Mobile</span></th><th class="bc-browser-firefox_android"><span class="bc-head-txt-label bc-head-icon-firefox_android">Firefox for Android</span></th><th class="bc-browser-opera_android"><span class="bc-head-txt-label bc-head-icon-opera_android">Opera for Android</span></th><th class="bc-browser-safari_ios"><span class="bc-head-txt-label bc-head-icon-safari_ios">Safari on iOS</span></th><th class="bc-browser-samsunginternet_android"><span class="bc-head-txt-label bc-head-icon-samsunginternet_android">Samsung Internet</span></th><th class="bc-browser-nodejs"><span class="bc-head-txt-label bc-head-icon-nodejs">Node.js</span></th></tr></thead><tbody><tr><th scope="row"><code>globalThis</code></th><td class="bc-supports-yes bc-browser-chrome"><span class="bc-browser-name">Chrome</span><abbr class="bc-level-yes only-icon" title="Full support">
|
||
<span>Full support</span>
|
||
</abbr>
|
||
71</td><td class="bc-supports-no bc-browser-edge"><span class="bc-browser-name">Edge</span><abbr class="bc-level-no only-icon" title="No support">
|
||
<span>No support</span>
|
||
</abbr>
|
||
No</td><td class="bc-supports-yes bc-browser-firefox"><span class="bc-browser-name">Firefox</span><abbr class="bc-level-yes only-icon" title="Full support">
|
||
<span>Full support</span>
|
||
</abbr>
|
||
65</td><td class="bc-supports-no bc-browser-ie"><span class="bc-browser-name">IE</span><abbr class="bc-level-no only-icon" title="No support">
|
||
<span>No support</span>
|
||
</abbr>
|
||
No</td><td class="bc-supports-no bc-browser-opera"><span class="bc-browser-name">Opera</span><abbr class="bc-level-no only-icon" title="No support">
|
||
<span>No support</span>
|
||
</abbr>
|
||
No</td><td class="bc-supports-no bc-browser-safari"><span class="bc-browser-name">Safari</span><abbr class="bc-level-no only-icon" title="No support">
|
||
<span>No support</span>
|
||
</abbr>
|
||
No</td><td class="bc-supports-yes bc-browser-webview_android"><span class="bc-browser-name">WebView Android</span><abbr class="bc-level-yes only-icon" title="Full support">
|
||
<span>Full support</span>
|
||
</abbr>
|
||
71</td><td class="bc-supports-yes bc-browser-chrome_android"><span class="bc-browser-name">Chrome Android</span><abbr class="bc-level-yes only-icon" title="Full support">
|
||
<span>Full support</span>
|
||
</abbr>
|
||
71</td><td class="bc-supports-no bc-browser-edge_mobile"><span class="bc-browser-name">Edge Mobile</span><abbr class="bc-level-no only-icon" title="No support">
|
||
<span>No support</span>
|
||
</abbr>
|
||
No</td><td class="bc-supports-yes bc-browser-firefox_android"><span class="bc-browser-name">Firefox Android</span><abbr class="bc-level-yes only-icon" title="Full support">
|
||
<span>Full support</span>
|
||
</abbr>
|
||
65</td><td class="bc-supports-no bc-browser-opera_android"><span class="bc-browser-name">Opera Android</span><abbr class="bc-level-no only-icon" title="No support">
|
||
<span>No support</span>
|
||
</abbr>
|
||
No</td><td class="bc-supports-no bc-browser-safari_ios"><span class="bc-browser-name">Safari iOS</span><abbr class="bc-level-no only-icon" title="No support">
|
||
<span>No support</span>
|
||
</abbr>
|
||
No</td><td class="bc-supports-no bc-browser-samsunginternet_android"><span class="bc-browser-name">Samsung Internet Android</span><abbr class="bc-level-no only-icon" title="No support">
|
||
<span>No support</span>
|
||
</abbr>
|
||
No</td><td class="bc-supports-no bc-browser-nodejs"><span class="bc-browser-name">nodejs</span><abbr class="bc-level-no only-icon" title="No support">
|
||
<span>No support</span>
|
||
</abbr>
|
||
No</td></tr></tbody></table><section class="bc-legend" id="sect1"><h3 class="offscreen" id="Legend">Legend</h3><dl><dt><span class="bc-supports-yes bc-supports">
|
||
<abbr class="bc-level bc-level-yes only-icon" title="Full support">
|
||
<span>Full support</span>
|
||
|
||
</abbr></span></dt><dd>Full support</dd><dt><span class="bc-supports-no bc-supports">
|
||
<abbr class="bc-level bc-level-no only-icon" title="No support">
|
||
<span>No support</span>
|
||
|
||
</abbr></span></dt><dd>No support</dd></dl></section></div><p></p>
|
||
</article> |