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

190 lines
11 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>
<div></div>
<div>全局属性undefined表示原始值<code><a class="glossaryLink" href="/en-US/docs/Glossary/Undefined" title="undefined: A primitive value automatically assigned to variables that have just been declared or to formal arguments for which there are no actual arguments.">undefined</a></code>它是一个JavaScript的 <a class="glossaryLink" href="/en-US/docs/Glossary/Primitive" title="原始数据类型: In JavaScript, a primitive (primitive value, primitive data type) is data that is not an object and has no methods. There are 6 primitive data types: string, number, boolean, null, undefined, symbol (new in ECMAScript 2015).">原始数据类型</a></div>
<div> </div>
<div><table class="standard-table">
<thead>
<tr>
<th class="header" colspan="2"><code>undefined</code> 属性的属性特性:</th>
</tr>
</thead>
<tbody>
<tr>
<td>writable</td>
<td>false</td>
</tr>
<tr>
<td>enumerable</td>
<td>false</td>
</tr>
<tr>
<td>configurable</td>
<td>false</td>
</tr>
</tbody>
</table></div>
<div> </div>
</div>
</div>
<h2 id="Syntax" name="Syntax">语法</h2>
<pre><code class="language-javascript"><code>undefined </code></code></pre>
<h2 id="Description" name="Description">描述</h2>
<p><code>undefined</code>是全局对象的一个属性。也就是说,它是全局作用域的一个变量。<code>undefined</code>的最初值就是原始数据类型<code><a class="glossaryLink" href="/en-US/docs/Glossary/Undefined" title="undefined: A primitive value automatically assigned to variables that have just been declared or to formal arguments for which there are no actual arguments.">undefined</a></code></p>
<p>在现代浏览器JavaScript 1.8.5/Firefox 4+自ECMAscript5标准以来undefined是一个不能被配置non-configurable不能被重写non-writable的属性。即便事实并非如此也要避免去重写它。</p>
<p>一个没有被赋值的变量的类型是undefined。如果方法或者是语句中<strong>操作的变量没有被赋值则会返回undefined</strong>(对于这句话持疑惑态度,请查看英文原文来理解)。</p>
<pre><code class="language-javascript">function test(a){
console.log(typeof a); // undefined
return a;
}
test(); // 返回"undefined"</code></pre>
<p>一个函数如果没有使用return语句指定<a href="Reference/Statements/return" title="return语句终止函数的执行并返回一个指定的值给函数调用者。"><code>返回</code></a>就会返回一个undefined值。</p>
<div class="warning">
<p>但是它有可能在非全局作用域中被当作<a class="glossaryLink" href="/en-US/docs/Glossary/Identifier" title="标识符: A sequence of characters in the code that identifies a variable, function, or property.">标识符</a>(变量名)来使用(因为undefined不是一个<a href="Reference/Reserved_Words" title="此页面仍未被本地化, 期待您的翻译!"><code>保留字</code></a>)),这样做是一个非常坏的主意,因为这样会使你的代码难以去维护和排错。</p>
<pre><code class="language-javascript">// 不要这样做!
// 打印 'foo string' PS说明undefined的值和类型都已经改变
(function() {
var undefined = 'foo';
console.log(undefined, typeof undefined)
})()
// 打印 'foo string' PS说明undefined的值和类型都已经改变
(function(undefined) {
console.log(undefined, typeof undefined)
})('foo')
</code></pre>
</div>
<h2 id="示例">示例</h2>
<h3 id="严格相等和undefined">严格相等和undefined</h3>
<p>你可以使用undefined和严格相等或不相等操作符来决定一个变量是否拥有值。在下面的代码中变量x是未定义的if 语句的求值结果将是true</p>
<pre><code class="language-javascript">var x;
if (x === undefined) {
// 执行这些语句
} else {
// 这些语句不会被执行
}</code></pre>
<div class="note">
<p>注意:这里是必须使用严格相等操作符(===)而不是标准相等操作符(==),因为 x == undefined 会检查x是不是null但是严格相等不会检查。null不等同于undefined。移步<a href="Reference/Operators/Comparison_Operators" title="JavaScript 有两种比较方式:严格比较运算符和转换类型比较运算符。对于严格比较运算符(===)来说,仅当两个操作数的类型相同且值相等为 true而对于被广泛使用的比较运算符==)来说,会在进行比较之前,将两个操作数转换成相同的类型。对于关系运算符(比如 &lt;=)来说,会先将操作数转为原始值,使它们类型相同,再进行比较运算。"><code>比较操作符</code></a>查看详情。</p>
</div>
<h3 id="Typeof_操作符和undefined">Typeof 操作符和undefined</h3>
<p>或者,可以使用<a href="Reference/Operators/typeof" title="typeof操作符返回一个字符串表示未经计算的操作数的类型。"><code>typeof</code></a></p>
<pre><code class="language-javascript">var x;
if(typeof x === 'undefined') {
// 执行这些语句
}</code></pre>
<p>使用 <a href="Reference/Operators/typeof" title="typeof操作符返回一个字符串表示未经计算的操作数的类型。"><code>typeof</code></a>的原因是它不会在一个变量没有被声明的时候抛出一个错误。</p>
<pre><code class="language-javascript">// 这里没有声明y
if(typeof y === 'undefined') { // 没有错误执行结果为true
console.log("y is " + typeof y ) // y is undefined
}
if(y === undefined) { // ReferenceError: y is not defined
}</code></pre>
<p>但是技术方面看来这样的使用方法应该被避免。JavaScript是一个静态作用域语言所以一个变量是否被声明可以通过看它是否在一个封闭的上下文中被声明。唯一的例外是全局作用域但是全局作用域是被绑定在全局对象上的所以要检查一个变量是否在全局上下文中存在可以通过检查全局对象上是否存在这个属性比如使用<a href="Reference/Operators/in" title="如果指定的属性在指定的对象或其原型链中则in 运算符返回true。"><code>in</code></a>操作符)。</p>
<h3 id="Void操作符和undefined">Void操作符和undefined</h3>
<p><a href="Reference/Operators/void" title="void 运算符 对给定的表达式进行求值,然后返回 undefined。"><code>void</code></a> 操作符是第三种可以替代的方法。</p>
<pre><code class="language-javascript">var x;
if(x === void 0) {
// 执行这些语句
}
// 没有声明y
if(y === void 0) {
// 抛出一个RenferenceError错误(与`typeof`相比)
}
</code></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><a class="external" href="https://www.ecma-international.org/publications/files/ECMA-ST-ARCH/ECMA-262,%201st%20edition,%20June%201997.pdf#sec-4.3.9" hreflang="en" lang="en" rel="noopener">ECMAScript 1st Edition (ECMA-262)<br/><small lang="zh-CN">undefined</small></a></td>
<td><span class="spec-Standard">Standard</span></td>
<td>Initial definition. Implemented in JavaScript 1.3.</td>
</tr>
<tr>
<td><a class="external" href="https://www.ecma-international.org/ecma-262/5.1/#sec-15.1.1.3" hreflang="en" lang="en" rel="noopener">ECMAScript 5.1 (ECMA-262)<br/><small lang="zh-CN">undefined</small></a></td>
<td><span class="spec-Standard">Standard</span></td>
<td> </td>
</tr>
<tr>
<td><a class="external" href="https://www.ecma-international.org/ecma-262/6.0/#sec-undefined" hreflang="en" lang="en" rel="noopener">ECMAScript 2015 (6th Edition, ECMA-262)<br/><small lang="zh-CN">undefined</small></a></td>
<td><span class="spec-Standard">Standard</span></td>
<td> </td>
</tr>
<tr>
<td><a class="external" href="https://tc39.github.io/ecma262/#sec-undefined" hreflang="en" lang="en" rel="noopener">ECMAScript Latest Draft (ECMA-262)<br/><small lang="zh-CN">undefined</small></a></td>
<td><span class="spec-Draft">Draft</span></td>
<td> </td>
</tr>
</tbody>
</table>
<h2 id="浏览器兼容性">浏览器兼容性</h2>
<p></p><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><p></p>
<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><span style="color: #888;" title="Please update this with the earliest version of support.">(Yes)</span></td>
<td><span style="color: #888;" title="Please update this with the earliest version of support.">(Yes)</span></td>
<td><span style="color: #888;" title="Please update this with the earliest version of support.">(Yes)</span></td>
<td><span style="color: #888;" title="Please update this with the earliest version of support.">(Yes)</span></td>
<td><span style="color: #888;" title="Please update this with the earliest version of support.">(Yes)</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: #888;" title="Please update this with the earliest version of support.">(Yes)</span></td>
<td><span style="color: #888;" title="Please update this with the earliest version of support.">(Yes)</span></td>
<td><span style="color: #888;" title="Please update this with the earliest version of support.">(Yes)</span></td>
<td><span style="color: #888;" title="Please update this with the earliest version of support.">(Yes)</span></td>
<td><span style="color: #888;" title="Please update this with the earliest version of support.">(Yes)</span></td>
<td><span style="color: #888;" title="Please update this with the earliest version of support.">(Yes)</span></td>
</tr>
</tbody>
</table>
</div>
</article>