diff options
Diffstat (limited to 'files/zh-cn/web/javascript/reference/global_objects')
610 files changed, 78169 insertions, 0 deletions
diff --git a/files/zh-cn/web/javascript/reference/global_objects/aggregateerror/index.html b/files/zh-cn/web/javascript/reference/global_objects/aggregateerror/index.html new file mode 100644 index 0000000000..ddc0486653 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/aggregateerror/index.html @@ -0,0 +1,106 @@ +--- +title: AggregateError +slug: Web/JavaScript/Reference/Global_Objects/AggregateError +translation_of: Web/JavaScript/Reference/Global_Objects/AggregateError +--- +<blockquote> +<p>{{JSRef}}{{Draft}}{{SeeCompatTable}}</p> +</blockquote> + +<p><code><strong>AggregateError</strong></code><font><font>当多个错误需要包装在一个错误中时，</font><font>该</font><font>对象表示一个错误。</font></font></p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox notranslate">new AggregateError(errors[, message])</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>errors</code></dt> + <dd>错误的描述，默认为空。</dd> + <dt><code>message</code>{{Optional_Inline}}</dt> + <dd>AggregateError错误的提示信息。</dd> +</dl> + +<h2 id="描述"><font><font>描述</font></font></h2> + +<p><font><font>一个</font></font><code>AggregateError</code><font><font>当需要由操作报告多个错误被抛出，例如通过</font></font><a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Promise/any"><code>Promise.any()</code></a><font><font>，在传递给它的所有</font></font><a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Promise/any"><code>Promise</code></a><font><font>拒绝。</font></font></p> + +<h2 id="属性">属性</h2> + +<dl> + <dt><code>AggregateError.prototype</code></dt> + <dd><code>AggregateError</code><font><font>的原</font></font><font><font>型</font></font></dd> +</dl> + +<h2 id="AggregateError_实例">AggregateError 实例</h2> + +<h3 id="实例属性">实例属性</h3> + +<dl> + <dt><code>AggregateError.prototype.constructor</code></dt> + <dd>指定创建实例原型的函数。</dd> + <dt>{{JSxRef("Error.prototype.message", "AggregateError.prototype.message")}}</dt> + <dd><font><font>错误消息，默认为</font></font><code>""</code><font><font>。</font></font></dd> + <dt>{{JSxRef("Error.prototype.name", "AggregateError.prototype.name")}}</dt> + <dd><font><font>错误名称，默认为</font></font><code>"AggregateError"</code><font><font>。</font></font></dd> +</dl> + +<h2 id="示例">示例</h2> + +<h3 id="捕获一个AggregateError"><font face="x-locale-heading-primary, zillaslab, Palatino, Palatino Linotype, x-locale-heading-secondary, serif"><span style="background-color: #333333;">捕获一个</span></font>AggregateError</h3> + +<pre class="brush: js; notranslate">Promise.any([ + Promise.reject(new Error("some error")), +]).catch(e => { + console.log(e instanceof AggregateError); // true + console.log(e.message); // "All Promises rejected" + console.log(e.name); // "AggregateError" + console.log(e.errors); // [ Error: "some error" ] +}); +</pre> + +<h3 id="创建一个AggregateError">创建一个AggregateError</h3> + +<pre class="brush: js; notranslate">try { + throw new AggregateError([ + new Error("some error"), + ], 'Hello'); +} catch (e) { + console.log(e instanceof AggregateError); // true + console.log(e.message); // "Hello" + console.log(e.name); // "AggregateError" + console.log(e.errors); // [ Error: "some error" ] +} +</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 href="https://tc39.es/proposal-promise-any/#sec-aggregate-error-constructor">ESNext Promise.any Proposal</a></td> + <td><span class="spec-Draft">Stage 3 Draft</span></td> + <td>Initial definition.</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> + + +<p>{{Compat("javascript.builtins.AggregateError")}}</p> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{JSxRef("Error")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/array/@@iterator/index.html b/files/zh-cn/web/javascript/reference/global_objects/array/@@iterator/index.html new file mode 100644 index 0000000000..31fe03d8b1 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/array/@@iterator/index.html @@ -0,0 +1,114 @@ +--- +title: 'Array.prototype[@@iterator]()' +slug: Web/JavaScript/Reference/Global_Objects/Array/@@iterator +tags: + - Array + - ECMAScript 2015 + - Iterator + - JavaScript + - Method + - Prototype + - 原型 + - 参考 + - 循环 + - 方法 + - 迭代 +translation_of: Web/JavaScript/Reference/Global_Objects/Array/@@iterator +--- +<div>{{JSRef}}</div> + +<p><code><strong>@@iterator</strong></code> 属性和 {{jsxref("Array.prototype.values()", "Array.prototype.values()")}} 属性的初始值是同一个函数对象。</p> + +<h2 id="语法">语法</h2> + +<pre class="brush: js"><var>arr</var>[Symbol.iterator]()</pre> + +<h3 id="返回值">返回值</h3> + +<p>数组的 <strong>iterator </strong>方法，默认情况下，与 {{jsxref("Array.prototype.values()", "values()")}} 返回值相同， <code>arr[Symbol.iterator]</code> 则会返回 {{jsxref("Array.prototype.values()", "values()")}} 函数。</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用_for...of_循环进行迭代"><font face="Open Sans, Arial, sans-serif">使用 </font><code>for...of</code> 循环进行迭代</h3> + +<pre class="brush: js">var arr = ['a', 'b', 'c', 'd', 'e']; +var eArr = arr[Symbol.iterator](); +// 浏览器必须支持 for...of 循环 +for (let letter of eArr) { + console.log(letter); +} +</pre> + +<h3 id="另一种迭代方式">另一种迭代方式</h3> + +<pre class="brush: js">var arr = ['a', 'b', 'c', 'd', 'e']; +var eArr = arr[Symbol.iterator](); +console.log(eArr.next().value); // a +console.log(eArr.next().value); // b +console.log(eArr.next().value); // c +console.log(eArr.next().value); // d +console.log(eArr.next().value); // e +</pre> + +<h3 id="Use_Case_for_brace_notation">Use Case for brace notation</h3> + +<p>The use case for this syntax over using the dot notation (<code>Array.prototype.values()</code>) is in a case where you don't know what object is going to be ahead of time. If you have a function that takes an iterator and then iterate over the value, but don't know if that Object is going to have a [Iterable].prototype.values method. This could be a built-in object like <a href="/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/String/@@iterator">String</a> object or a custom object.</p> + +<pre class="brush: js">function logIterable(it) { + var iterator = it[Symbol.iterator](); + // 浏览器必须支持 for...of 循环 + for (let letter of iterator) { + console.log(letter); + } +} + +// Array +logIterable(['a', 'b', 'c']); +// a +// b +// c + +// string +logIterable('abc'); +// a +// b +// c</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>{{SpecName('ES6', '#sec-array.prototype-@@iterator', 'Array.prototype[@@iterator]()')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>首次定义</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-array.prototype-@@iterator', 'Array.prototype[@@iterator]()')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.Array.@@iterator")}}</p> + +<h2 id="参见">参见</h2> + +<ul> + <li>{{jsxref("Array.prototype.keys()")}}</li> + <li>{{jsxref("Array.prototype.entries()")}}</li> + <li>{{jsxref("Array.prototype.forEach()")}}</li> + <li>{{jsxref("Array.prototype.every()")}}</li> + <li>{{jsxref("Array.prototype.some()")}}</li> + <li>{{jsxref("Array.prototype.values()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/array/@@species/index.html b/files/zh-cn/web/javascript/reference/global_objects/array/@@species/index.html new file mode 100644 index 0000000000..cc87927e5e --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/array/@@species/index.html @@ -0,0 +1,78 @@ +--- +title: 'get Array[@@species]' +slug: Web/JavaScript/Reference/Global_Objects/Array/@@species +tags: + - JavaScript + - 原型 + - 数组 + - 方法 +translation_of: Web/JavaScript/Reference/Global_Objects/Array/@@species +--- +<div>{{JSRef}}</div> + +<p><code><strong>Array[@@species]</strong></code> 访问器属性返回 <code>Array</code> 的构造函数。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">Array[Symbol.species] +</pre> + +<h3 id="返回值">返回值</h3> + +<p>{{jsxref("Array")}} 的构造函数。</p> + +<h2 id="描述">描述</h2> + +<p><code>species</code> 访问器属性返回 <code>Array</code> 对象的默认构造函数。子类的构造函数可能会覆盖并改变构造函数的赋值。</p> + +<h2 id="示例">示例</h2> + +<p><code>species</code> 属性返回默认构造函数, 它用于 <code>Array</code> 对象的构造函数 <code>Array</code>:</p> + +<pre class="brush: js">Array[Symbol.species]; // function Array()</pre> + +<p>在继承类的对象中（例如你自定义的数组 <code>MyArray</code>），<code>MyArray</code> 的 <code>species</code> 属性返回的是 <code>MyArray</code> 这个构造函数. 然而你可能想要覆盖它，以便在你继承的对象 <code>MyArray</code> 中返回父类的构造函数 <code>Array</code> :</p> + +<pre class="brush: js">class MyArray extends Array { + // 重写 MyArray 的 species 属性到父类 Array 的构造函数 + static get [Symbol.species]() { return Array; } +}</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>{{SpecName('ES6', '#sec-get-array-@@species', 'get Array [ @@species ]')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-get-array-@@species', 'get Array [ @@species ]')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> +<div> + + +<p>{{Compat("javascript.builtins.Array.@@species")}}</p> +</div> +</div> + +<h2 id="参见">参见</h2> + +<ul> + <li>{{jsxref("Array")}}</li> + <li>{{jsxref("Symbol.species")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/array/@@unscopables/index.html b/files/zh-cn/web/javascript/reference/global_objects/array/@@unscopables/index.html new file mode 100644 index 0000000000..b370dd1281 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/array/@@unscopables/index.html @@ -0,0 +1,89 @@ +--- +title: 'Array.prototype[@@unscopables]' +slug: Web/JavaScript/Reference/Global_Objects/Array/@@unscopables +tags: + - Array + - ECMAScript 2015 + - JavaScript + - Property + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Array/@@unscopables +--- +<div>{{JSRef}}</div> + +<p>Symbol 属性 <code><strong>@@unscopable</strong></code> 包含了所有 ES2015 (ES6) 中新定义的、且并未被更早的 ECMAScript 标准收纳的属性名。这些属性被排除在由 <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/with">with</a></code> 语句绑定的环境中。</p> + +<h2 id="语法">语法</h2> + +<pre class="brush: js"><var>arr</var>[Symbol.unscopables]</pre> + +<h2 id="描述">描述</h2> + +<p><code>with</code> 绑定中未包含的数组默认属性有：</p> + + + +<ul> + <li>{{jsxref("Array.prototype.copyWithin()", "copyWithin()")}}</li> + <li>{{jsxref("Array.prototype.entries()", "entries()")}}</li> + <li>{{jsxref("Array.prototype.fill()", "fill()")}}</li> + <li>{{jsxref("Array.prototype.find()", "find()")}}</li> + <li>{{jsxref("Array.prototype.findIndex()", "findIndex()")}}</li> + <li>{{jsxref("Array.prototype.includes()", "includes()")}}</li> + <li>{{jsxref("Array.prototype.keys()", "keys()")}}</li> + <li>{{jsxref("Array.prototype.values()", "values()")}}</li> +</ul> + +<p>参考 {{jsxref("Symbol.unscopables")}} 以了解如何为自定义的对象设置 <code>unscopables</code>。</p> + +<p>{{js_property_attributes(0,0,1)}}</p> + +<h2 id="示例">示例</h2> + +<p>以下的代码在 ES5 或更早的版本中能正常工作。然而 ECMAScript 2015 (ES6) 或之后的版本中新添加了 {{jsxref("Array.prototype.keys()")}} 这个方法。这意味着在 <code>with</code> 语句的作用域中，"keys"只能作为方法，而不能作为某个变量。这正是内置的 <code>@@unscopables</code> 即 <code>Array.prototype[@@unscopables]</code> symbol 属性所要解决的问题：防止某些数组方法被添加到 <code>with</code> 语句的作用域内。</p> + +<pre class="brush: js">var keys = []; + +with(Array.prototype) { + keys.push("something"); +} + +Object.keys(Array.prototype[Symbol.unscopables]); +// ["copyWithin", "entries", "fill", "find", "findIndex", +// "includes", "keys", "values"]</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>{{SpecName('ES6', '#sec-array.prototype-@@unscopables', 'Array.prototype[@@unscopables]')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>首次定义</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-array.prototype-@@unscopables', 'Array.prototype[@@unscopables]')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> + + +<p>{{Compat("javascript.builtins.Array.@@unscopables")}}</p> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Symbol.unscopables")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/array/concat/index.html b/files/zh-cn/web/javascript/reference/global_objects/array/concat/index.html new file mode 100644 index 0000000000..22911acb9d --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/array/concat/index.html @@ -0,0 +1,158 @@ +--- +title: Array.prototype.concat() +slug: Web/JavaScript/Reference/Global_Objects/Array/concat +tags: + - JavaScript + - 原型 + - 数组 + - 方法 +translation_of: Web/JavaScript/Reference/Global_Objects/Array/concat +--- +<div>{{JSRef}}</div> + +<p> <code><strong>concat()</strong></code> 方法用于合并两个或多个数组。此方法不会更改现有数组，而是返回一个新数组。</p> + +<p>{{EmbedInteractiveExample("pages/js/array-concat.html")}}</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox notranslate">var <var>new_array</var> = <var>old_array</var>.concat(<var>value1</var>[, <var>value2</var>[, ...[, <var>valueN</var>]]])</pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>value<em>N</em></code>{{optional_inline}}</dt> + <dd>数组和/或值，将被合并到一个新的数组中。如果省略了所有 <code>valueN</code> 参数，则 <code>concat</code> 会返回调用此方法的现存数组的一个浅拷贝。详情请参阅下文描述。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>新的 {{jsxref("Array")}} 实例。</p> + +<h2 id="Description" name="Description">描述</h2> + +<p><code>concat</code>方法创建一个新的数组，它由被调用的对象中的元素组成，每个参数的顺序依次是该参数的元素（如果参数是数组）或参数本身（如果参数不是数组）。它不会递归到嵌套数组参数中。</p> + +<p><code>concat</code>方法不会改变<code>this</code>或任何作为参数提供的数组，而是返回一个浅拷贝，它包含与原始数组相结合的相同元素的副本。 原始数组的元素将复制到新数组中，如下所示：</p> + +<ul> + <li>对象引用（而不是实际对象）：<code>concat</code>将对象引用复制到新数组中。 原始数组和新数组都引用相同的对象。 也就是说，如果引用的对象被修改，则更改对于新数组和原始数组都是可见的。 这包括也是数组的数组参数的元素。</li> +</ul> + +<ul> + <li>数据类型如字符串，数字和布尔（不是{{jsxref("Global_Objects/String", "String")}}，{{jsxref("Global_Objects/Number", "Number")}} 和 {{jsxref("Global_Objects/Boolean", "Boolean")}} 对象）：<code>concat</code>将字符串和数字的值复制到新数组中。</li> +</ul> + +<div class="note"> +<p><strong>注意：</strong>数组/值在连接时保持不变。此外，对于新数组的任何操作（仅当元素不是对象引用时）都不会对原始数组产生影响，反之亦然。</p> +</div> + +<h2 id="Examples" name="Examples">示例</h2> + +<h3 id="Example_Concatenating_two_arrays" name="Example:_Concatenating_two_arrays">连接两个数组</h3> + +<p>以下代码将两个数组合并为一个新数组：</p> + +<pre class="brush: js notranslate">var alpha = ['a', 'b', 'c']; +var numeric = [1, 2, 3]; + +alpha.concat(numeric); +// result in ['a', 'b', 'c', 1, 2, 3]</pre> + +<h3 id="Example_Concatenating_three_arrays" name="Example:_Concatenating_three_arrays">连接三个数组</h3> + +<p>以下代码将三个数组合并为一个新数组：</p> + +<pre class="brush: js notranslate">var num1 = [1, 2, 3], + num2 = [4, 5, 6], + num3 = [7, 8, 9]; + +var nums = num1.concat(num2, num3); + +console.log(nums); +// results in [1, 2, 3, 4, 5, 6, 7, 8, 9]</pre> + +<h3 id="Example_Concatenating_values_to_an_array" name="Example:_Concatenating_values_to_an_array">将值连接到数组</h3> + +<p>以下代码将三个值连接到数组：</p> + +<pre class="brush: js notranslate">var alpha = ['a', 'b', 'c']; + +var alphaNumeric = alpha.concat(1, [2, 3]); + +console.log(alphaNumeric); +// results in ['a', 'b', 'c', 1, 2, 3]</pre> + +<h3 id="合并嵌套数组">合并嵌套数组</h3> + +<p>以下代码合并数组并保留引用：</p> + +<pre class="brush: js notranslate">var num1 = [[1]]; +var num2 = [2, [3]]; +var num3=[5,[6]]; + +var nums = num1.concat(num2); + +console.log(nums); +// results is [[1], 2, [3]] + +var nums2=num1.concat(4,num3); + +console.log(nums2) +// results is [[1], 4, 5,[6]] + +// modify the first element of num1 +num1[0].push(4); + +console.log(nums); +// results is [[1, 4], 2, [3]]</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('ES3')}}</td> + <td>{{Spec2('ES3')}}</td> + <td>Initial definition. Implemented in JavaScript 1.2.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.4.4.4', 'Array.prototype.concat')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-array.prototype.concat', 'Array.prototype.concat')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-array.prototype.concat', 'Array.prototype.concat')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容">浏览器兼容</h2> + +<div class="hidden"> +<p>The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> +</div> + +<p>{{Compat("javascript.builtins.Array.concat")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Array.push", "push")}} / {{jsxref("Array.pop", "pop")}} — add/remove elements from the end of the array</li> + <li>{{jsxref("Array.unshift", "unshift")}} / {{jsxref("Array.shift", "shift")}} — add/remove elements from the beginning of the array</li> + <li>{{jsxref("Array.splice", "splice")}} — add/remove elements from the specified location of the array</li> + <li>{{jsxref("String.prototype.concat()")}}</li> + <li>{{jsxref("Symbol.isConcatSpreadable")}} – control flattening.</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/array/copywithin/index.html b/files/zh-cn/web/javascript/reference/global_objects/array/copywithin/index.html new file mode 100644 index 0000000000..b19fa2fc56 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/array/copywithin/index.html @@ -0,0 +1,190 @@ +--- +title: Array.prototype.copyWithin() +slug: Web/JavaScript/Reference/Global_Objects/Array/copyWithin +tags: + - ECMAScript 2015 + - JavaScript + - polyfill + - 原型 + - 数组 + - 方法 +translation_of: Web/JavaScript/Reference/Global_Objects/Array/copyWithin +--- +<div>{{JSRef}}</div> + +<div><code><strong>copyWithin()</strong></code> 方法浅复制数组的一部分到同一数组中的另一个位置，并返回它，不会改变原数组的长度。</div> + +<div>{{EmbedInteractiveExample("pages/js/array-copywithin.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>arr</var>.copyWithin(<var>target[</var>, <var>start[</var>, <var>end]]</var>) +</pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>target</code></dt> + <dd>0 为基底的索引，复制序列到该位置。如果是负数，<code>target</code> 将从末尾开始计算。</dd> + <dd>如果 <code>target</code> 大于等于 <code>arr.length</code>，将会不发生拷贝。如果 <code>target</code> 在 <code>start</code> 之后，复制的序列将被修改以符合 <code>arr.length</code>。</dd> + <dt><code>start</code></dt> + <dd>0 为基底的索引，开始复制元素的起始位置。如果是负数，<code>start</code> 将从末尾开始计算。</dd> + <dd>如果 <code>start</code> 被忽略，<code>copyWithin</code> 将会从0开始复制。</dd> + <dt><code>end</code></dt> + <dd>0 为基底的索引，开始复制元素的结束位置。<code>copyWithin</code> 将会拷贝到该位置，但不包括 <code>end</code> 这个位置的元素。如果是负数， <code>end</code> 将从末尾开始计算。</dd> + <dd>如果 <code>end</code> 被忽略，<code>copyWithin</code> 方法将会一直复制至数组结尾（默认为 <code>arr.length</code>）。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>改变后的数组。</p> + +<h2 id="描述">描述</h2> + +<p>参数 target、start 和 end 必须为整数。</p> + +<p>如果 start 为负，则其指定的索引位置等同于 length+start，length 为数组的长度。end 也是如此。</p> + +<p>copyWithin 方法不要求其 this 值必须是一个数组对象；除此之外，copyWithin 是一个可变方法，它可以改变 this 对象本身，并且返回它，而不仅仅是它的拷贝。</p> + +<p><code>copyWithin</code> 就像 C 和 C++ 的 <code>memcpy</code> 函数一样，且它是用来移动 {{jsxref("Array")}} 或者 {{jsxref("TypedArray")}} 数据的一个高性能的方法。复制以及粘贴序列这两者是为一体的操作;即使复制和粘贴区域重叠，粘贴的序列也会有拷贝来的值。</p> + +<p><code>copyWithin</code><strong> </strong>函数被设计为通用式的，其不要求其 <code>this</code> 值必须是一个{{jsxref("Array", "数组")}}对象。</p> + +<p><code>copyWithin</code> 是一个可变方法，它不会改变 this 的长度 length，但是会改变 this 本身的内容，且需要时会创建新的属性。</p> + +<h2 id="例子">例子</h2> + +<pre><code>[1, 2, 3, 4, 5].copyWithin(-2) +// [1, 2, 3, 1, 2] + +[1, 2, 3, 4, 5].copyWithin(0, 3) +// [4, 5, 3, 4, 5] + +[1, 2, 3, 4, 5].copyWithin(0, 3, 4) +// [4, 2, 3, 4, 5] + +[1, 2, 3, 4, 5].copyWithin(-2, -3, -1) +// [1, 2, 3, 3, 4]</code> + +[].copyWithin.call({length: 5, 3: 1}, 0, 3); +// {0: 1, 3: 1, length: 5} + +// ES2015 Typed Arrays are subclasses of Array +var i32a = new Int32Array([1, 2, 3, 4, 5]); + +i32a.copyWithin(0, 2); +// Int32Array [3, 4, 5, 4, 5] + +// On platforms that are not yet ES2015 compliant: +[].copyWithin.call(new Int32Array([1, 2, 3, 4, 5]), 0, 3, 4); +// Int32Array [4, 2, 3, 4, 5] +</pre> + +<h2 id="Polyfill">Polyfill</h2> + +<pre class="brush: js">if (!Array.prototype.copyWithin) { + Array.prototype.copyWithin = function(target, start/*, end*/) { + // Steps 1-2. + if (this == null) { + throw new TypeError('this is null or not defined'); + } + + var O = Object(this); + + // Steps 3-5. + var len = O.length >>> 0; + + // Steps 6-8. + var relativeTarget = target >> 0; + + var to = relativeTarget < 0 ? + Math.max(len + relativeTarget, 0) : + Math.min(relativeTarget, len); + + // Steps 9-11. + var relativeStart = start >> 0; + + var from = relativeStart < 0 ? + Math.max(len + relativeStart, 0) : + Math.min(relativeStart, len); + + // Steps 12-14. + var end = arguments[2]; + var relativeEnd = end === undefined ? len : end >> 0; + + var final = relativeEnd < 0 ? + Math.max(len + relativeEnd, 0) : + Math.min(relativeEnd, len); + + // Step 15. + var count = Math.min(final - from, len - to); + + // Steps 16-17. + var direction = 1; + + if (from < to && to < (from + count)) { + direction = -1; + from += count - 1; + to += count - 1; + } + + // Step 18. + while (count > 0) { + if (from in O) { + O[to] = O[from]; + } else { + delete O[to]; + } + + from += direction; + to += direction; + count--; + } + + // Step 19. + return O; + }; +} +</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>{{SpecName('ES2015', '#sec-array.prototype.copywithin', 'Array.prototype.copyWithin')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES2016', '#sec-array.prototype.copywithin', 'Array.prototype.copyWithin')}}</td> + <td>{{Spec2('ES2016')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-array.prototype.copywithin', 'Array.prototype.copyWithin')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.Array.copyWithin")}}</p> + +<h2 id="参见">参见</h2> + +<ul> + <li>{{jsxref("Array")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/array/entries/index.html b/files/zh-cn/web/javascript/reference/global_objects/array/entries/index.html new file mode 100644 index 0000000000..6d2d0018a8 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/array/entries/index.html @@ -0,0 +1,154 @@ +--- +title: Array.prototype.entries() +slug: Web/JavaScript/Reference/Global_Objects/Array/entries +tags: + - Array.prototype.entries() +translation_of: Web/JavaScript/Reference/Global_Objects/Array/entries +--- +<div>{{JSRef}}</div> + +<p><code><strong>entries()</strong></code> 方法返回一个新的<strong>Array Iterator</strong>对象，该对象包含数组中每个索引的键/值对。</p> + +<p>{{EmbedInteractiveExample("pages/js/array-entries.html")}}</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><em>arr</em>.entries()</code></pre> + +<h3 id="返回值">返回值</h3> + +<p>一个新的 {{jsxref("Array")}} 迭代器对象。<a href="http://www.ecma-international.org/ecma-262/6.0/#sec-createarrayiterator">Array Iterator</a>是对象，它的原型（__proto__:Array Iterator）上有一个<a href="http://www.ecma-international.org/ecma-262/6.0/#sec-%arrayiteratorprototype%.next">next</a>方法，可用用于遍历迭代器取得原数组的[key,value]。</p> + +<h2 id="示例">示例</h2> + +<h3 id="1、_Array_Iterator">1、 Array Iterator</h3> + +<pre class="brush: js">var arr = ["a", "b", "c"]; +var iterator = arr.entries(); +console.log(iterator); + +/*<em>Array Iterator {}</em> + __proto__:Array Iterator + next:<em>ƒ next()</em> + Symbol(Symbol.toStringTag):"Array Iterator" + __proto__:<em>Object</em> +*/</pre> + +<h3 id="2、iterator.next()">2、iterator.next()</h3> + +<pre class="brush: js">var arr = ["a", "b", "c"]; +var iterator = arr.entries(); +console.log(iterator.next()); + +/*{value: Array(2), done: false} + done:false + value:(2) [0, "a"] + __proto__: Object +*/ +// iterator.next()返回一个对象，对于有元素的数组， +// 是next{ value: Array(2), done: false }； +// next.done 用于指示迭代器是否完成：在每次迭代时进行更新而且都是false， +// 直到迭代器结束done才是true。 +// next.value是一个["key","value"]的数组，是返回的迭代器中的元素值。 +</pre> + +<h3 id="3、iterator.next方法运行">3、iterator.next方法运行</h3> + +<pre class="brush: js">var arr = ["a", "b", "c"]; +var iter = arr.entries(); +var a = []; + +// for(var i=0; i< arr.length; i++){ // 实际使用的是这个 +for(var i=0; i< arr.length+1; i++){ // 注意，是length+1，比数组的长度大 + var tem = iter.next(); // 每次迭代时更新next + console.log(tem.done); // 这里可以看到更新后的done都是false + if(tem.done !== true){ // 遍历迭代器结束done才是true + console.log(tem.value); + a[i]=tem.value; + } +} + +console.log(a); // 遍历完毕，输出next.value的数组</pre> + +<h3 id="4、二维数组按行排序">4、二维数组按行排序</h3> + +<pre class="brush: js">function sortArr(arr) { + var goNext = true; + var entries = arr.entries(); + while (goNext) { + var result = entries.next(); + if (result.done !== true) { + result.value[1].sort((a, b) => a - b); + goNext = true; + } else { + goNext = false; + } + } + return arr; +} + +var arr = [[1,34],[456,2,3,44,234],[4567,1,4,5,6],[34,78,23,1]]; +sortArr(arr); + +/*(4) [Array(2), Array(5), Array(5), Array(4)] + 0:(2) [1, 34] + 1:(5) [2, 3, 44, 234, 456] + 2:(5) [1, 4, 5, 6, 4567] + 3:(4) [1, 23, 34, 78] + length:4 + __proto__:Array(0) +*/ +</pre> + +<h3 id="5、使用for…of_循环">5、使用<a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...of">for…of</a> 循环</h3> + +<pre class="brush:js">var arr = ["a", "b", "c"]; +var iterator = arr.entries(); +// undefined + +for (let e of iterator) { + console.log(e); +} + +// [0, "a"] +// [1, "b"] +// [2, "c"] +</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>{{SpecName('ES6', '#sec-array.prototype.entries', 'Array.prototype.entries')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>首次定义</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> +<div> + + +<p>{{Compat("javascript.builtins.Array.entries")}}</p> +</div> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Array.prototype.keys()")}}</li> + <li>{{jsxref("Array.prototype.forEach()")}}</li> + <li>{{jsxref("Array.prototype.every()")}}</li> + <li>{{jsxref("Array.prototype.some()")}}</li> + <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...of">for...of</a></li> + <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Iteration_protocols">Iteration protocols</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/array/every/index.html b/files/zh-cn/web/javascript/reference/global_objects/array/every/index.html new file mode 100644 index 0000000000..a64c25b43d --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/array/every/index.html @@ -0,0 +1,194 @@ +--- +title: Array.prototype.every() +slug: Web/JavaScript/Reference/Global_Objects/Array/every +tags: + - ECMAScript 5 + - JavaScript + - polyfill + - 原型 + - 数组 + - 方法 +translation_of: Web/JavaScript/Reference/Global_Objects/Array/every +--- +<div>{{JSRef}}</div> + +<p><code><strong>every()</strong></code> 方法测试一个数组内的所有元素是否都能通过某个指定函数的测试。它返回一个布尔值。</p> + +<div class="note"> +<p><strong>注意</strong>：若收到一个空数组，此方法在一切情况下都会返回 <code>true</code>。</p> +</div> + +<div>{{EmbedInteractiveExample("pages/js/array-every.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="notranslate"><var>arr</var>.every(<var>callback</var>(<var>element</var>[, <var>index</var>[, <var>array</var>]])[, <var>thisArg</var>])</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>callback</code></dt> + <dd>用来测试每个元素的函数，它可以接收三个参数： + <dl> + <dt><code>element</code></dt> + <dd>用于测试的当前值。</dd> + <dt><code>index</code>{{Optional_inline}}</dt> + <dd>用于测试的当前值的索引。</dd> + <dt><code>array</code>{{Optional_inline}}</dt> + <dd>调用 <code>every</code> 的当前数组。</dd> + </dl> + </dd> + <dt><code>thisArg</code></dt> + <dd>执行 <code>callback</code> 时使用的 <code>this</code> 值。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>如果回调函数的每一次返回都为 {{Glossary("truthy")}} 值，返回 <code><strong>true</strong></code> ，否则返回 <code><strong>false</strong></code>。</p> + +<h2 id="描述">描述</h2> + +<p><code>every</code> 方法为数组中的每个元素执行一次 <code>callback</code> 函数，直到它找到一个会使 <code>callback</code> 返回 {{Glossary("falsy")}} 的元素。如果发现了一个这样的元素，<code>every</code> 方法将会立即返回 <code>false</code>。否则，<code>callback</code> 为每一个元素返回 <code>true</code>，<code>every</code> 就会返回 <code>true</code>。<code>callback</code> 只会为那些已经被赋值的索引调用。不会为那些被删除或从未被赋值的索引调用。</p> + +<p><code>callback</code> 在被调用时可传入三个参数：元素值，元素的索引，原数组。</p> + +<p>如果为 <code>every</code> 提供一个 <code>thisArg</code> 参数，则该参数为调用 <code>callback</code> 时的 <code>this</code> 值。如果省略该参数，则 <code>callback</code> 被调用时的 <code>this</code> 值，在非严格模式下为全局对象，在严格模式下传入 <code>undefined</code>。详见 <code><a href="/zh-CN/docs/Web/JavaScript/Reference/Operators/this">this</a></code> 条目。</p> + +<p><code>every</code> 不会改变原数组。</p> + +<p><code>every</code> 遍历的元素范围在第一次调用 <code>callback</code> 之前就已确定了。在调用 <code>every</code> 之后添加到数组中的元素不会被 <code>callback</code> 访问到。如果数组中存在的元素被更改，则他们传入 <code>callback</code> 的值是 <code>every</code> 访问到他们那一刻的值。那些被删除的元素或从来未被赋值的元素将不会被访问到。</p> + +<p><code>every</code> 和数学中的"所有"类似，当所有的元素都符合条件才会返回<code>true</code>。正因如此，若传入一个空数组，无论如何都会返回 <code>true</code>。（这种情况属于<a href="http://en.wikipedia.org/wiki/Vacuous_truth">无条件正确</a>：正因为一个<a href="https://en.wikipedia.org/wiki/Empty_set#Properties">空集合</a>没有元素，所以它其中的所有元素都符合给定的条件。)</p> + +<h2 id="例子">例子</h2> + +<h3 id="检测所有数组元素的大小">检测所有数组元素的大小</h3> + +<p>下例检测数组中的所有元素是否都大于 10。</p> + +<pre class="brush: js notranslate">function isBigEnough(element, index, array) { + return element >= 10; +} +[12, 5, 8, 130, 44].every(isBigEnough); // false +[12, 54, 18, 130, 44].every(isBigEnough); // true +</pre> + +<h3 id="使用箭头函数">使用箭头函数</h3> + +<p><a href="/zh-CN/docs/Web/JavaScript/Reference/Functions/Arrow_functions">箭头函数</a>为上面的检测过程提供了更简短的语法。</p> + +<pre class="brush: js notranslate">[12, 5, 8, 130, 44].every(x => x >= 10); // false +[12, 54, 18, 130, 44].every(x => x >= 10); // true</pre> + +<h2 id="兼容旧环境（Polyfill）">兼容旧环境（Polyfill）</h2> + +<p>在 ECMA-262 第 5 版时，<code>every</code> 被添加进 ECMA-262 标准；因此，在某些实现环境中，它尚未被支持。你可以把下面的代码放到脚本的开头来解决此问题，该代码允许在那些没有原生支持 <code>every</code> 的实现环境中使用它。该算法是 ECMA-262 第 5 版中指定的算法，它假定 <code>Object</code> 和 <code>TypeError</code> 拥有它们的初始值，且 <code>fun.call</code> 等价于 {{jsxref("Function.prototype.call")}}。</p> + +<pre class="brush: js notranslate">if (!Array.prototype.every) { + Array.prototype.every = function(callbackfn, thisArg) { + 'use strict'; + var T, k; + + if (this == null) { + throw new TypeError('this is null or not defined'); + } + + // 1. Let O be the result of calling ToObject passing the this + // value as the argument. + var O = Object(this); + + // 2. Let lenValue be the result of calling the Get internal method + // of O with the argument "length". + // 3. Let len be ToUint32(lenValue). + var len = O.length >>> 0; + + // 4. If IsCallable(callbackfn) is false, throw a TypeError exception. + if (typeof callbackfn !== 'function') { + throw new TypeError(); + } + + // 5. If thisArg was supplied, let T be thisArg; else let T be undefined. + if (arguments.length > 1) { + T = thisArg; + } + + // 6. Let k be 0. + k = 0; + + // 7. Repeat, while k < len + while (k < len) { + + var kValue; + + // a. Let Pk be ToString(k). + // This is implicit for LHS operands of the in operator + // b. Let kPresent be the result of calling the HasProperty internal + // method of O with argument Pk. + // This step can be combined with c + // c. If kPresent is true, then + if (k in O) { + + // i. Let kValue be the result of calling the Get internal method + // of O with argument Pk. + kValue = O[k]; + + // ii. Let testResult be the result of calling the Call internal method + // of callbackfn with T as the this value and argument list + // containing kValue, k, and O. + var testResult = callbackfn.call(T, kValue, k, O); + + // iii. If ToBoolean(testResult) is false, return false. + if (!testResult) { + return false; + } + } + k++; + } + return true; + }; +} +</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>{{SpecName('ES5.1', '#sec-15.4.4.16', 'Array.prototype.every')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td>Initial definition. Implemented in JavaScript 1.6.</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-array.prototype.every', 'Array.prototype.every')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-array.prototype.every', 'Array.prototype.every')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.Array.every")}}</p> + +<h2 id="参见">参见</h2> + +<ul> + <li>{{jsxref("Array.prototype.forEach()")}}</li> + <li>{{jsxref("Array.prototype.some()")}}</li> + <li>{{jsxref("Array.prototype.find()")}}</li> + <li>{{jsxref("TypedArray.prototype.every()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/array/fill/index.html b/files/zh-cn/web/javascript/reference/global_objects/array/fill/index.html new file mode 100644 index 0000000000..2acc9d6d73 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/array/fill/index.html @@ -0,0 +1,153 @@ +--- +title: Array.prototype.fill() +slug: Web/JavaScript/Reference/Global_Objects/Array/fill +tags: + - Array + - ECMAScript6 + - JavaScript + - Method + - polyfill +translation_of: Web/JavaScript/Reference/Global_Objects/Array/fill +--- +<div>{{JSRef}} </div> + +<p><code><strong>fill()</strong></code> 方法用一个固定值填充一个数组中从起始索引到终止索引内的全部元素。不包括终止索引。</p> + +<p>{{EmbedInteractiveExample("pages/js/array-fill.html")}}</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre><var>arr</var>.fill(<var>value[</var>, <var>start[<var>, <var>end]]</var>)</var></var></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>value</code></dt> + <dd>用来填充数组元素的值。</dd> + <dt><code>start</code> {{optional_inline}}</dt> + <dd>起始索引，默认值为0。</dd> + <dt><code>end</code> {{optional_inline}}</dt> + <dd>终止索引，默认值为 <code>this.length</code>。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>修改后的数组。</p> + +<h2 id="Description" name="Description">描述</h2> + +<p><strong><code>fill</code></strong> 方法接受三个参数 <code>value</code>, <code>start</code> 以及 <code>end</code>.<span> <code>start</code> 和 <code>end</code> 参数是可选的, 其默认值分别为 <code>0</code> 和 <code>this</code> 对象的 <code>length </code></span>属性值。</p> + +<p><span>如果 <code>start</code> 是个负数, 则开始索引会被自动计算成为 <code>length+start</code></span>, 其中<span> <code>length</code> 是 </span><code>this</code><span> 对象的 </span><code>length </code>属性值。<span>如果 </span><code>end</code><span> 是个负数, 则结束索引会被自动计算成为 </span><code>length+end</code>。</p> + +<p><span><code><strong>fill</strong></code> 方法故意被设计成通用方法, 该方法不要求 <code>this</code> 是数组对象。</span></p> + +<p><code><strong style="line-height: 1.5;">fill</strong></code><span style="line-height: 1.5;"> 方法是个可变方法, 它会改变调用它的 <code>this</code> 对象本身, 然后返回它, 而并不是返回一个副本。</span></p> + +<p>当一个对象被传递给 <strong><code>fill</code></strong>方法的时候, 填充数组的是这个对象的引用。</p> + +<h2 id="示例">示例</h2> + +<pre class="brush: js">[1, 2, 3].fill(4); // [4, 4, 4] +[1, 2, 3].fill(4, 1); // [1, 4, 4] +[1, 2, 3].fill(4, 1, 2); // [1, 4, 3] +[1, 2, 3].fill(4, 1, 1); // [1, 2, 3] +[1, 2, 3].fill(4, 3, 3); // [1, 2, 3] +[1, 2, 3].fill(4, -3, -2); // [4, 2, 3] +[1, 2, 3].fill(4, NaN, NaN); // [1, 2, 3] +[1, 2, 3].fill(4, 3, 5); // [1, 2, 3] +Array(3).fill(4); // [4, 4, 4] +[].fill.call({ length: 3 }, 4); // {0: 4, 1: 4, 2: 4, length: 3} + +// Objects by reference. +var arr = Array(3).fill({}) // [{}, {}, {}]; +// 需要注意如果fill的参数为引用类型，会导致都执行都一个引用类型 +// 如 arr[0] === arr[1] 为true +arr[0].hi = "hi"; // [{ hi: "hi" }, { hi: "hi" }, { hi: "hi" }]</pre> + +<h2 id="Polyfill">Polyfill</h2> + +<pre class="brush: js">if (!Array.prototype.fill) { + Object.defineProperty(Array.prototype, 'fill', { + value: function(value) { + + // Steps 1-2. + if (this == null) { + throw new TypeError('this is null or not defined'); + } + + var O = Object(this); + + // Steps 3-5. + var len = O.length >>> 0; + + // Steps 6-7. + var start = arguments[1]; + var relativeStart = start >> 0; + + // Step 8. + var k = relativeStart < 0 ? + Math.max(len + relativeStart, 0) : + Math.min(relativeStart, len); + + // Steps 9-10. + var end = arguments[2]; + var relativeEnd = end === undefined ? + len : end >> 0; + + // Step 11. + var final = relativeEnd < 0 ? + Math.max(len + relativeEnd, 0) : + Math.min(relativeEnd, len); + + // Step 12. + while (k < final) { + O[k] = value; + k++; + } + + // Step 13. + return O; + } + }); +} +</pre> + +<p>如果你确实需要维护已过时的不支持 <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperty">Object.defineProperty</a></code> 的 JavaScript 引擎，那么最好完全不向 <code>Array.prototype</code> 添加方法，因为你不能使它不可枚举。</p> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范</th> + <th scope="col">状态</th> + <th scope="col">注释</th> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-array.prototype.fill', 'Array.prototype.fill')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>最初定义。</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-array.prototype.fill', 'Array.prototype.fill')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div>{{Compat("javascript.builtins.Array.fill")}}</div> + +<div id="compat-mobile"> + +</div> + +<h2 id="See_also" name="See_also">相关</h2> + +<ul> + <li>{{jsxref("Array")}}</li> + <li>{{jsxref("TypedArray.prototype.fill()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/array/filter/index.html b/files/zh-cn/web/javascript/reference/global_objects/array/filter/index.html new file mode 100644 index 0000000000..c23bf5cb98 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/array/filter/index.html @@ -0,0 +1,234 @@ +--- +title: Array.prototype.filter() +slug: Web/JavaScript/Reference/Global_Objects/Array/filter +tags: + - ECMAScript 5 + - JavaScript + - Prototype + - polyfill + - 数组 + - 方法 +translation_of: Web/JavaScript/Reference/Global_Objects/Array/filter +--- +<div>{{JSRef}}</div> + +<p><code><strong>filter()</strong></code> 方法创建一个新数组, 其包含通过所提供函数实现的测试的所有元素。 </p> + +<p>{{EmbedInteractiveExample("pages/js/array-filter.html")}}</p> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox notranslate"><var>var newArray = arr</var>.filter(<var>callback(element[, index[, array]])</var>[, <var>thisArg</var>])</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>callback</code></dt> + <dd>用来测试数组的每个元素的函数。返回 <code>true</code> 表示该元素通过测试，保留该元素，<code>false</code> 则不保留。它接受以下三个参数：</dd> + <dd> + <dl> + <dt><code>element</code></dt> + <dd>数组中当前正在处理的元素。</dd> + <dt><code>index</code>{{optional_inline}}</dt> + <dd>正在处理的元素在数组中的索引。</dd> + <dt><code>array</code>{{optional_inline}}</dt> + <dd>调用了 <code>filter</code> 的数组本身。</dd> + </dl> + </dd> + <dt><code>thisArg</code>{{optional_inline}}</dt> + <dd>执行 <code>callback</code> 时，用于 <code>this</code> 的值。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>一个新的、由通过测试的元素组成的数组，如果没有任何数组元素通过测试，则返回空数组。</p> + +<h2 id="描述">描述</h2> + +<p><code>filter</code> 为数组中的每个元素调用一次 <code>callback</code> 函数，并利用所有使得 <code>callback</code> 返回 true 或<a href="/zh-CN/docs/Glossary/Truthy">等价于 true 的值</a>的元素创建一个新数组。<code>callback</code> 只会在已经赋值的索引上被调用，对于那些已经被删除或者从未被赋值的索引不会被调用。那些没有通过 <code>callback</code> 测试的元素会被跳过，不会被包含在新数组中。</p> + +<p><code>callback</code> 被调用时传入三个参数：</p> + +<ol> + <li>元素的值</li> + <li>元素的索引</li> + <li>被遍历的数组本身</li> +</ol> + +<p>如果为 <code>filter</code> 提供一个 <code>thisArg</code> 参数，则它会被作为 <code>callback</code> 被调用时的 <code>this</code> 值。否则，<code>callback</code> 的 <code>this</code> 值在非严格模式下将是全局对象，严格模式下为 <code>undefined</code>。<code>callback</code> 函数最终观察到的 <code>this</code> 值是根据<a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Operators/this">通常函数所看到的 "this"的规则</a>确定的。</p> + +<p><code>filter</code> 不会改变原数组，它返回过滤后的新数组。</p> + +<p><code>filter</code> 遍历的元素范围在第一次调用 <code>callback</code> 之前就已经确定了。在调用 <code>filter</code> 之后被添加到数组中的元素不会被 <code>filter</code> 遍历到。如果已经存在的元素被改变了，则他们传入 <code>callback</code> 的值是 <code>filter</code> 遍历到它们那一刻的值。被删除或从来未被赋值的元素不会被遍历到。</p> + +<h2 id="示例">示例</h2> + +<h3 id="筛选排除所有较小的值">筛选排除所有较小的值</h3> + +<p>下例使用 <code>filter</code> 创建了一个新数组，该数组的元素由原数组中值大于 10 的元素组成。</p> + +<pre class="brush: js notranslate">function isBigEnough(element) { + return element >= 10; +} +var filtered = [12, 5, 8, 130, 44].filter(isBigEnough); +// filtered is [12, 130, 44] +</pre> + +<h3 id="过滤_JSON_中的无效条目">过滤 JSON 中的无效条目</h3> + +<p>以下示例使用 <code>filter()</code> 创建具有非零 <code>id</code> 的元素的 json。</p> + +<pre class="brush: js notranslate">var arr = [ + { id: 15 }, + { id: -1 }, + { id: 0 }, + { id: 3 }, + { id: 12.2 }, + { }, + { id: null }, + { id: NaN }, + { id: 'undefined' } +]; + +var invalidEntries = 0; + +function isNumber(obj) { + return obj !== undefined && typeof(obj) === 'number' && !isNaN(obj); +} + +function filterByID(item) { + if (isNumber(item.id) && item.id !== 0) { + return true; + } + invalidEntries++; + return false; +} + +var arrByID = arr.filter(filterByID); + +console.log('Filtered Array\n', arrByID); +// Filtered Array +// [{ id: 15 }, { id: -1 }, { id: 3 }, { id: 12.2 }] + +console.log('Number of Invalid Entries = ', invalidEntries); +// Number of Invalid Entries = 5 +</pre> + +<h3 id="在数组中搜索">在数组中搜索</h3> + +<p>下例使用 <code>filter()</code> 根据搜索条件来过滤数组内容。</p> + +<pre class="brush: js notranslate">var fruits = ['apple', 'banana', 'grapes', 'mango', 'orange']; + +/** + * Array filters items based on search criteria (query) + */ +function filterItems(query) { + return fruits.filter(function(el) { + return el.toLowerCase().indexOf(query.toLowerCase()) > -1; + }) +} + +console.log(filterItems('ap')); // ['apple', 'grapes'] +console.log(filterItems('an')); // ['banana', 'mango', 'orange']</pre> + +<h4 id="ES2015_实现">ES2015 实现</h4> + +<pre class="brush: js notranslate">const fruits = ['apple', 'banana', 'grapes', 'mango', 'orange']; + +/** + * Array filters items based on search criteria (query) + */ +const filterItems = (query) => { + return fruits.filter((el) => + el.toLowerCase().indexOf(query.toLowerCase()) > -1 + ); +} + +console.log(filterItems('ap')); // ['apple', 'grapes'] +console.log(filterItems('an')); // ['banana', 'mango', 'orange'] + +</pre> + +<h2 id="Polyfill">Polyfill</h2> + +<p><code>filter</code> 被添加到 ECMA-262 标准第 5 版中，因此在某些实现环境中不被支持。可以把下面的代码插入到脚本的开头来解决此问题，该代码允许在那些没有原生支持 <code>filter</code> 的实现环境中使用它。该算法是 ECMA-262 第 5 版中指定的算法，假定 <code>fn.call</code> 等价于 {{jsxref("Function.prototype.call")}} 的初始值，且 {{jsxref("Array.prototype.push")}} 拥有它的初始值。</p> + +<pre class="brush: js notranslate">if (!Array.prototype.filter){ + Array.prototype.filter = function(func, thisArg) { + 'use strict'; + if ( ! ((typeof func === 'Function' || typeof func === 'function') && this) ) + throw new TypeError(); + + var len = this.length >>> 0, + res = new Array(len), // preallocate array + t = this, c = 0, i = -1; + if (thisArg === undefined){ + while (++i !== len){ + // checks to see if the key was set + if (i in this){ + if (func(t[i], i, t)){ + res[c++] = t[i]; + } + } + } + } + else{ + while (++i !== len){ + // checks to see if the key was set + if (i in this){ + if (func.call(thisArg, t[i], i, t)){ + res[c++] = t[i]; + } + } + } + } + + res.length = c; // shrink down array to proper size + return res; + }; +}</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>{{SpecName('ES5.1', '#sec-15.4.4.20', 'Array.prototype.filter')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td>Initial definition. Implemented in JavaScript 1.6.</td> + </tr> + <tr> + <td>{{SpecName('ES2015', '#sec-array.prototype.filter', 'Array.prototype.filter')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-array.prototype.filter', 'Array.prototype.filter')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.Array.filter")}}</p> + +<h2 id="参见">参见</h2> + +<ul> + <li>{{jsxref("Array.prototype.forEach()")}}</li> + <li>{{jsxref("Array.prototype.every()")}}</li> + <li>{{jsxref("Array.prototype.some()")}}</li> + <li>{{jsxref("Array.prototype.reduce()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/array/find/index.html b/files/zh-cn/web/javascript/reference/global_objects/array/find/index.html new file mode 100644 index 0000000000..425901f14d --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/array/find/index.html @@ -0,0 +1,200 @@ +--- +title: Array.prototype.find() +slug: Web/JavaScript/Reference/Global_Objects/Array/find +tags: + - ECMAScript6 + - JavaScript + - polyfill + - 数组 + - 方法 +translation_of: Web/JavaScript/Reference/Global_Objects/Array/find +--- +<div>{{JSRef}}</div> + +<p> <code><strong>find()</strong></code> 方法返回数组中满足提供的测试函数的第一个元素的值。否则返回 {{jsxref("undefined")}}。</p> + +<p>{{EmbedInteractiveExample("pages/js/array-find.html")}}</p> + +<p>另请参见 {{jsxref("Array.findIndex", "findIndex()")}} 方法，它返回数组中找到的元素的索引，而不是其值。</p> + +<p>如果你需要找到一个元素的位置或者一个元素是否存在于数组中，使用{{jsxref("Array.prototype.indexOf()")}} 或 {{jsxref("Array.prototype.includes()")}}。</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code><em>arr</em>.find(<em>callback</em>[, <em>thisArg</em>])</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>callback</code></dt> + <dd>在数组每一项上执行的函数，接收 3 个参数： + <dl> + <dt><code>element</code></dt> + <dd>当前遍历到的元素。</dd> + <dt><code>index</code>{{optional_inline}}</dt> + <dd>当前遍历到的索引。</dd> + <dt><code>array</code>{{optional_inline}}</dt> + <dd>数组本身。</dd> + </dl> + </dd> + <dt><code>thisArg</code>{{Optional_inline}}</dt> + <dd>执行回调时用作<code>this</code> 的对象。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>数组中第一个满足所提供测试函数的元素的值，否则返回 {{jsxref("undefined")}}。</p> + +<h2 id="Description" name="Description">描述</h2> + +<p><code>find</code>方法对数组中的每一项元素执行一次 <code>callback</code> 函数，直至有一个 callback 返回 <code>true</code>。当找到了这样一个元素后，该方法会立即返回这个元素的值，否则返回 {{jsxref("undefined")}}。注意 <code>callback </code>函数会为数组中的每个索引调用即从 <code>0 </code>到 <code>length - 1</code>，而不仅仅是那些被赋值的索引，这意味着对于稀疏数组来说，该方法的效率要低于那些只遍历有值的索引的方法。</p> + +<p><code>callback</code>函数带有3个参数：当前元素的值、当前元素的索引，以及数组本身。</p> + +<p>如果提供了 <code>thisArg</code>参数，那么它将作为每次 <code>callback</code>函数执行时的<code>this</code> ，如果未提供，则使用 {{jsxref("undefined")}}。</p> + +<p><code>find</code>方法不会改变数组。</p> + +<p>在第一次调用 <code>callback</code>函数时会确定元素的索引范围，因此在 <code>find</code>方法开始执行之后添加到数组的新元素将不会被 <code>callback</code>函数访问到。如果数组中一个尚未被<code>callback</code>函数访问到的元素的值被<code>callback</code>函数所改变，那么当<code>callback</code>函数访问到它时，它的值是将是根据它在数组中的索引所访问到的当前值。被删除的元素仍旧会被访问到，但是其值已经是undefined了。</p> + +<h2 id="示例">示例</h2> + +<h3 id="用对象的属性查找数组里的对象">用对象的属性查找数组里的对象</h3> + +<pre class="brush: js">var inventory = [ + {name: 'apples', quantity: 2}, + {name: 'bananas', quantity: 0}, + {name: 'cherries', quantity: 5} +]; + +function findCherries(fruit) { + return fruit.name === 'cherries'; +} + +console.log(inventory.find(findCherries)); // { name: 'cherries', quantity: 5 }</pre> + +<h3 id="寻找数组中的质数">寻找数组中的质数</h3> + +<p>下面的例子展示了如何从一个数组中寻找质数（如果找不到质数则返回{{jsxref("undefined")}}）</p> + +<pre class="brush: js">function isPrime(element, index, array) { + var start = 2; + while (start <= Math.sqrt(element)) { + if (element % start++ < 1) { + return false; + } + } + return element > 1; +} + +console.log([4, 6, 8, 12].find(isPrime)); // undefined, not found +console.log([4, 5, 8, 12].find(isPrime)); // 5 + +</pre> + +<p>当在回调中删除数组中的一个值时，当访问到这个位置时，其传入的值是 undefined：</p> + +<pre class="brush: js">// Declare array with no element at index 2, 3 and 4 +var a = [0,1,,,,5,6]; + +// Shows all indexes, not just those that have been assigned values +a.find(function(value, index) { + console.log('Visited index ' + index + ' with value ' + value); +}); + +// Shows all indexes, including deleted +a.find(function(value, index) { + + // Delete element 5 on first iteration + if (index == 0) { + console.log('Deleting a[5] with value ' + a[5]); + delete a[5]; // 注：这里只是将a[5]设置为undefined，可以试试用a.pop()删除最后一项，依然会遍历到被删的那一项 + } + // Element 5 is still visited even though deleted + console.log('Visited index ' + index + ' with value ' + value); +});</pre> + +<h2 id="Polyfill" name="Polyfill">Polyfill</h2> + +<p>本方法在ECMAScript 6规范中被加入，可能不存在于某些实现中。你可以通过以下代码来补充 <code>Array.prototype.find()</code>。</p> + +<pre class="brush: js">// https://tc39.github.io/ecma262/#sec-array.prototype.find +if (!Array.prototype.find) { + Object.defineProperty(Array.prototype, 'find', { + value: function(predicate) { + // 1. Let O be ? ToObject(this value). + if (this == null) { + throw new TypeError('"this" is null or not defined'); + } + + var o = Object(this); + + // 2. Let len be ? ToLength(? Get(O, "length")). + var len = o.length >>> 0; + + // 3. If IsCallable(predicate) is false, throw a TypeError exception. + if (typeof predicate !== 'function') { + throw new TypeError('predicate must be a function'); + } + + // 4. If thisArg was supplied, let T be thisArg; else let T be undefined. + var thisArg = arguments[1]; + + // 5. Let k be 0. + var k = 0; + + // 6. Repeat, while k < len + while (k < len) { + // a. Let Pk be ! ToString(k). + // b. Let kValue be ? Get(O, Pk). + // c. Let testResult be ToBoolean(? Call(predicate, T, « kValue, k, O »)). + // d. If testResult is true, return kValue. + var kValue = o[k]; + if (predicate.call(thisArg, kValue, k, o)) { + return kValue; + } + // e. Increase k by 1. + k++; + } + + // 7. Return undefined. + return undefined; + } + }); +}</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('ES6', '#sec-array.prototype.find', 'Array.prototype.find')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-array.prototype.find', 'Array.prototype.find')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{Compat("javascript.builtins.Array.find")}}</p> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("Array.prototype.findIndex()")}} – find and return an index</li> + <li>{{jsxref("Array.prototype.includes()")}} – test whether a value exists in the array</li> + <li>{{jsxref("Array.prototype.filter()")}} – find all matching elements</li> + <li>{{jsxref("Array.prototype.every()")}} – test all elements together</li> + <li>{{jsxref("Array.prototype.some()")}} – test at least one element</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/array/findindex/index.html b/files/zh-cn/web/javascript/reference/global_objects/array/findindex/index.html new file mode 100644 index 0000000000..bd7e039dd0 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/array/findindex/index.html @@ -0,0 +1,165 @@ +--- +title: Array.prototype.findIndex() +slug: Web/JavaScript/Reference/Global_Objects/Array/findIndex +tags: + - Array + - JavaScript + - Method + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Array/findIndex +--- +<div>{{JSRef}}</div> + +<p><code><strong>findIndex()</strong></code>方法返回数组中满足提供的测试函数的第一个元素的<strong>索引</strong>。若没有找到对应元素则返回-1。</p> + +<div>{{EmbedInteractiveExample("pages/js/array-findindex.html")}}</div> + + + +<p>另请参见 {{jsxref("Array.find", "find()")}} 方法，它返回数组中找到的元素的<strong>值</strong>，而不是其索引。</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox notranslate"><code><em>arr</em>.findIndex(<em>callback</em>[, <em>thisArg</em>])</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>callback</code></dt> + <dd>针对数组中的每个元素, 都会执行该回调函数, 执行时会自动传入下面三个参数: + <dl> + <dt><code>element</code></dt> + <dd>当前元素。</dd> + <dt><code>index</code></dt> + <dd>当前元素的索引。</dd> + <dt><code>array</code></dt> + <dd>调用<code>findIndex</code>的数组。</dd> + </dl> + </dd> + <dt><code>thisArg</code></dt> + <dd>可选。执行<code>callback</code>时作为<code style="font-size: 14px; line-height: inherit;">this</code>对象<span style="line-height: inherit;">的值.</span></dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p> 数组中通过提供测试函数的第一个元素的<strong>索引</strong>。否则，返回-1</p> + +<h2 id="Description" name="Description">描述</h2> + +<p><code>findIndex</code>方法对数组中的每个数组索引<code>0..length-1</code>（包括）执行一次<code>callback</code>函数，直到找到一个<code>callback</code>函数返回真实值（强制为<code>true</code>）的值。如果找到这样的元素，<code>findIndex</code>会立即返回该元素的索引。如果回调从不返回真值，或者数组的<code>length</code>为0，则<code>findIndex</code>返回-1。 与某些其他数组方法（如Array#some）不同，在稀疏数组中，即使对于数组中不存在的条目的索引也会调用回调函数。</p> + +<p>回调函数调用时有三个参数：元素的值，元素的索引，以及被遍历的数组。</p> + +<p>如果一个 <code>thisArg</code> 参数被提供给 <code>findIndex</code>, 它将会被当作<code>this</code>使用在每次回调函数被调用的时候。如果没有被提供，将会使用{{jsxref("undefined")}}。</p> + +<p><code>findIndex</code>不会修改所调用的数组。</p> + +<p>在第一次调用<code>callback</code>函数时会确定元素的索引范围，因此在<code>findIndex</code>方法开始执行之后添加到数组的新元素将不会被<code>callback</code>函数访问到。如果数组中一个尚未被<code>callback</code>函数访问到的元素的值被<code>callback</code>函数所改变，那么当<code>callback</code>函数访问到它时，它的值是将是根据它在数组中的索引所访问到的当前值。被删除的元素仍然会被访问到。</p> + +<h2 id="Examples" name="Examples">示例</h2> + +<h3 id="Example_Testing_size_of_all_array_elements" name="Example:_Testing_size_of_all_array_elements">查找数组中首个质数元素的索引</h3> + +<p><span style="line-height: inherit;">以下示例查找数组中素数的元素的索引（如果不存在素数，则返回-1）。</span></p> + +<pre class="brush: js notranslate">function isPrime(element, index, array) { + var start = 2; + while (start <= Math.sqrt(element)) { + if (element % start++ < 1) { + return false; + } + } + return element > 1; +} + +console.log([4, 6, 8, 12].findIndex(isPrime)); // -1, not found +console.log([4, 6, 7, 12].findIndex(isPrime)); // 2</pre> + +<h2 id="Polyfill">Polyfill</h2> + +<pre class="brush: js notranslate">// https://tc39.github.io/ecma262/#sec-array.prototype.findIndex +if (!Array.prototype.findIndex) { + Object.defineProperty(Array.prototype, 'findIndex', { + value: function(predicate) { + // 1. Let O be ? ToObject(this value). + if (this == null) { + throw new TypeError('"this" is null or not defined'); + } + + var o = Object(this); + + // 2. Let len be ? ToLength(? Get(O, "length")). + var len = o.length >>> 0; + + // 3. If IsCallable(predicate) is false, throw a TypeError exception. + if (typeof predicate !== 'function') { + throw new TypeError('predicate must be a function'); + } + + // 4. If thisArg was supplied, let T be thisArg; else let T be undefined. + var thisArg = arguments[1]; + + // 5. Let k be 0. + var k = 0; + + // 6. Repeat, while k < len + while (k < len) { + // a. Let Pk be ! ToString(k). + // b. Let kValue be ? Get(O, Pk). + // c. Let testResult be ToBoolean(? Call(predicate, T, « kValue, k, O »)). + // d. If testResult is true, return k. + var kValue = o[k]; + if (predicate.call(thisArg, kValue, k, o)) { + return k; + } + // e. Increase k by 1. + k++; + } + + // 7. Return -1. + return -1; + } + }); +} +</pre> + +<p>如果您需要兼容不支持<code><a href="/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperty">Object.defineProperty</a></code>的JavaScript引擎，那么最好不要对<code>Array.prototype</code>方法进行 polyfill ，因为您无法使其成为不可枚举的。</p> + +<p>使用此方法需要注意你是否在uc浏览器环境,如果你的页面在支付宝上使用尤其注意,因为支付宝使用的就是uc浏览器环境.</p> + +<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-array.prototype.findindex', 'Array.prototype.findIndex')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-array.prototype.findIndex', 'Array.prototype.findIndex')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容">浏览器兼容</h2> + +<div class="hidden"> +<p>The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> +</div> + +<p>{{Compat("javascript.builtins.Array.findIndex")}}</p> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("Array.prototype.find()")}}</li> + <li>{{jsxref("Array.prototype.indexOf()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/array/flat/index.html b/files/zh-cn/web/javascript/reference/global_objects/array/flat/index.html new file mode 100644 index 0000000000..5346c65b82 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/array/flat/index.html @@ -0,0 +1,218 @@ +--- +title: Array.prototype.flat() +slug: Web/JavaScript/Reference/Global_Objects/Array/flat +tags: + - JavaScript + - 原型 + - 参考 + - 数组 + - 方法 +translation_of: Web/JavaScript/Reference/Global_Objects/Array/flat +--- +<div>{{JSRef}}</div> + +<p><code><strong>flat()</strong></code> 方法会按照一个可指定的深度递归遍历数组，并将所有元素与遍历到的子数组中的元素合并为一个新数组返回。</p> + +<div>{{EmbedInteractiveExample("pages/js/array-flat.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox notranslate"><var>var newArray = arr</var>.flat([<var>depth]</var>)</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>depth</code> {{optional_inline}}</dt> + <dd>指定要提取嵌套数组的结构深度，默认值为 1。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>一个包含将数组与子数组中所有元素的新数组。</p> + +<h2 id="示例">示例</h2> + +<h3 id="扁平化嵌套数组">扁平化嵌套数组</h3> + +<pre class="notranslate">var arr1 = [1, 2, [3, 4]]; +arr1.flat(); +// [1, 2, 3, 4] + +var arr2 = [1, 2, [3, 4, [5, 6]]]; +arr2.flat(); +// [1, 2, 3, 4, [5, 6]] + +var arr3 = [1, 2, [3, 4, [5, 6]]]; +arr3.flat(2); +// [1, 2, 3, 4, 5, 6] + +//使用 Infinity，可展开任意深度的嵌套数组 +<code>var arr4 = [1, 2, [3, 4, [5, 6, [7, 8, [9, 10]]]]]; +arr4.flat(Infinity); +// [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]</code></pre> + +<h3 id="扁平化与数组空项">扁平化与数组空项</h3> + +<p><code>flat()</code> 方法会移除数组中的空项:</p> + +<pre class="brush: js notranslate">var arr4 = [1, 2, , 4, 5]; +arr4.flat(); +// [1, 2, 4, 5]</pre> + +<h2 id="替代方案">替代方案</h2> + +<h3 id="使用_reduce_与_concat">使用 <code>reduce</code> 与 <code>concat</code></h3> + +<pre class="notranslate"><code>var arr = [1, 2, [3, 4]]; + +// 展开一层数组 +arr.flat(); +// 等效于 +arr.reduce((acc, val) => acc.concat(val), []); +// [1, 2, 3, 4] + +// 使用扩展运算符 ... +const flattened = arr => [].concat(...arr);</code></pre> + +<h3 class="brush: js" id="reduce_concat_isArray_recursivity">reduce + concat + isArray + recursivity</h3> + +<pre class="brush: js notranslate"><code>// 使用 reduce、concat 和递归展开无限多层嵌套的数组 +var arr1 = [1,2,3,[1,2,3,4, [2,3,4]]]; +</code> +<code class="language-js"><span class="keyword token">function</span> <span class="function token">flatDeep</span><span class="punctuation token">(</span><span class="parameter token">arr<span class="punctuation token">,</span> d <span class="operator token">=</span> <span class="number token">1</span></span><span class="punctuation token">)</span> <span class="punctuation token">{</span> + <span class="keyword token">return</span> d <span class="operator token">></span> <span class="number token">0</span> <span class="operator token">?</span> arr<span class="punctuation token">.</span><span class="function token">reduce</span><span class="punctuation token">(</span><span class="punctuation token">(</span><span class="parameter token">acc<span class="punctuation token">,</span> val</span><span class="punctuation token">)</span> <span class="operator token">=></span> acc<span class="punctuation token">.</span><span class="function token">concat</span><span class="punctuation token">(</span>Array<span class="punctuation token">.</span><span class="function token">isArray</span><span class="punctuation token">(</span>val<span class="punctuation token">)</span> <span class="operator token">?</span> <span class="function token">flatDeep</span><span class="punctuation token">(</span>val<span class="punctuation token">,</span> d <span class="operator token">-</span> <span class="number token">1</span><span class="punctuation token">)</span> <span class="punctuation token">:</span> val<span class="punctuation token">)</span><span class="punctuation token">,</span> <span class="punctuation token">[</span><span class="punctuation token">]</span><span class="punctuation token">)</span> + <span class="punctuation token">:</span> arr<span class="punctuation token">.</span><span class="function token">slice</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">;</span> +<span class="punctuation token">}</span><span class="punctuation token">;</span></code> +<code> +flatDeep(arr1, Infinity); +// [1, 2, 3, 1, 2, 3, 4, 2, 3, 4]</code></pre> + +<h3 id="forEachisArraypushrecursivity">forEach+isArray+push+recursivity</h3> + +<pre class="brush: js notranslate">// forEach 遍历数组会自动跳过空元素 +const eachFlat = (arr = [], depth = 1) => { + const result = []; // 缓存递归结果 + // 开始递归 + (function flat(arr, depth) { + // forEach 会自动去除数组空位 + arr.forEach((item) => { + // 控制递归深度 + if (Array.isArray(item) && depth > 0) { + // 递归数组 + flat(item, depth - 1) + } else { + // 缓存元素 + result.push(item) + } + }) + })(arr, depth) + // 返回递归结果 + return result; +} + +// for of 循环不能去除数组空位，需要手动去除 +const forFlat = (arr = [], depth = 1) => { + const result = []; + (function flat(arr, depth) { + for (let item of arr) { + if (Array.isArray(item) && depth > 0) { + flat(item, depth - 1) + } else { + // 去除空元素，添加非undefined元素 + item !== void 0 && result.push(item); + } + } + })(arr, depth) + return result; +} +</pre> + +<h3 id="使用堆栈stack">使用堆栈stack</h3> + +<pre class="notranslate">// 无递归数组扁平化，使用堆栈 +// 注意：深度的控制比较低效，因为需要检查每一个值的深度 +// 也可能在 shift / unshift 上进行 w/o 反转，但是末端的数组 OPs 更快 +var arr1 = [1,2,3,[1,2,3,4, [2,3,4]]]; +function flatten(input) { + const stack = [...input]; + const res = []; + while (stack.length) { + // 使用 pop 从 stack 中取出并移除值 + const next = stack.pop(); + if (Array.isArray(next)) { + // 使用 push 送回内层数组中的元素，不会改动原始输入 + stack.push(...next); + } else { + res.push(next); + } + } + // 反转恢复原数组的顺序 + return res.reverse(); +} +flatten(arr1);// [1, 2, 3, 1, 2, 3, 4, 2, 3, 4]</pre> + +<pre class="notranslate">// 递归版本的反嵌套 +function flatten(array) { + var flattend = []; + (function flat(array) { + array.forEach(function(el) { + if (Array.isArray(el)) flat(el); + else flattend.push(el); + }); + })(array); + return flattend; +}</pre> + +<h3 id="Use_Generator_function">Use <code>Generator</code> function</h3> + +<pre class="notranslate"><code>function* flatten(array) { + for (const item of array) { + if (Array.isArray(item)) { + yield* flatten(item); + } else { + yield item; + } + } +} + +var arr = [1, 2, [3, 4, [5, 6]]]; +const flattened = [...flatten(arr)]; +// [1, 2, 3, 4, 5, 6]</code></pre> + +<p>Please do not add polyfills on this article. For reference, please check: <a href="https://discourse.mozilla.org/t/mdn-rfc-001-mdn-wiki-pages-shouldnt-be-a-distributor-of-polyfills/24500">https://discourse.mozilla.org/t/mdn-rfc-001-mdn-wiki-pages-shouldnt-be-a-distributor-of-polyfills/24500</a></p> + +<h2 id="Specifications">Specifications</h2> + +<table> + <tbody> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + <tr> + <td><a href="https://www.ecma-international.org/ecma-262/10.0/index.html#sec-array.prototype.flat">ECMAScript 2019</a></td> + <td>Finished</td> + <td>Initial definition</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> + + +<p>{{Compat("javascript.builtins.Array.flat")}}</p> +</div> + +<h2 id="参见">参见</h2> + +<ul> + <li>{{jsxref("Array.prototype.flatMap()")}}</li> + <li>{{jsxref("Array.prototype.map()")}}</li> + <li>{{jsxref("Array.prototype.reduce()")}}</li> + <li>{{jsxref("Array.prototype.concat()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/array/flatmap/index.html b/files/zh-cn/web/javascript/reference/global_objects/array/flatmap/index.html new file mode 100644 index 0000000000..9099d44001 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/array/flatmap/index.html @@ -0,0 +1,149 @@ +--- +title: Array.prototype.flatMap() +slug: Web/JavaScript/Reference/Global_Objects/Array/flatMap +tags: + - Array + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Array/flatMap +--- +<div>{{JSRef}}</div> + +<p><code><strong>flatMap()</strong></code> 方法首先使用映射函数映射每个元素，然后将结果压缩成一个新数组。它与 <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map">map</a> 连着深度值为1的 <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/flat">flat</a> 几乎相同，但 <code>flatMap</code> 通常在合并成一种方法的效率稍微高一些。</p> + +<p class="hidden">\{{EmbedInteractiveExample("pages/js/array-flatmap.html")}}</p> + +<p class="hidden">此交互式示例的源代码存储在GitHub存储库中。如果您想要为交互式示例项目做出贡献，请复制https：//github.com/mdn/interactive-examples，并向我们发送 pull request。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox notranslate"><var>var new_array = arr</var>.flatMap(function <var>callback(currentValue[, index[, array]]) { + // return element for new_array +}</var>[, <var>thisArg</var>])</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>callback</code></dt> + <dd>可以生成一个新数组中的元素的函数，可以传入三个参数： + <dl> + <dt></dt> + <dt><code>currentValue</code></dt> + <dd>当前正在数组中处理的元素</dd> + <dt><code>index</code>{{optional_inline}}</dt> + <dd>可选的。数组中正在处理的当前元素的索引。</dd> + <dt><code>array</code>{{optional_inline}}</dt> + <dd>可选的。被调用的 <code>map</code> 数组</dd> + </dl> + </dd> + <dt><code>thisArg</code>{{optional_inline}}</dt> + <dd>可选的。执行 <code>callback</code> 函数时 使用的<code>this</code> 值。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p> 一个新的数组，其中每个元素都是回调函数的结果，并且结构深度 <code>depth</code> 值为1。</p> + +<h2 id="描述">描述</h2> + +<p>有关回调函数的详细描述，请参见 {{jsxref("Array.prototype.map()")}} 。 <code>flatMap</code> 方法与 <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map">map</a></code> 方法和深度depth为1的 <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/flat">flat</a></code> 几乎相同.</p> + +<h2 id="示例">示例</h2> + +<h3 id="map_与_flatMap"><code>map()</code> 与 <code>flatMap()</code></h3> + +<pre class="brush: js notranslate">var arr1 = <span class="js source"><span class="function-call js meta"><span class="js meta"><span class="brace js meta square"><span>[</span></span><span class="constant decimal js numeric"><span>1</span></span><span class="comma delimiter js meta object"><span>,</span></span><span> </span><span class="brace js meta square"><span>2, 3, 4]; + +arr1.map(</span></span></span></span></span>x => [x * 2]<span class="js source"><span class="function-call js meta"><span class="js meta"><span class="brace js meta square"><span>);</span></span></span></span></span> +// [[2], [4], [6], [8]] + +arr1.flatMap(x => [x * 2]<span class="js source"><span class="function-call js meta"><span class="js meta"><span class="brace js meta square"><span>); +// [2, 4, 6, 8]</span></span></span></span></span> + +// <code>only one level is flatt</code><code>ened</code> +arr1.flatMap(x => [[x * 2]]); +// [[2], [4], [6], [8]]</pre> + +<p>虽然上面的代码使用 map 和 flatMap 好像都可以，但这只能展示如何使用 flatMap。</p> + +<p>所以，为了更好的展示 flatMap 的作用，下面我们将包含几句话的数组拆分成单个词组成的新数组。</p> + +<pre class="notranslate"><code>let arr1 = ["it's Sunny in", "", "California"]; + +arr1.map(x => x.split(" ")); +// [["it's","Sunny","in"],[""],["California"]] + +arr1.flatMap(x => x.split(" ")); +// ["it's","Sunny","in", "", "California"]</code></pre> + +<p>注意，输出列表长度可以不同于输入列表长度。</p> + +<h3 id="在一个_map_期间增加或去除一些项">在一个 <code>map()</code> 期间增加或去除一些项</h3> + +<p><code>flatMap</code> 能用于在map期间增删项目（也就是修改items的数量）。换句话说，它允许你遍历很多项使之成为另一些项（靠分别把它们放进去来处理），而不是总是一对一。 从这个意义上讲，它的作用类似于 <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/filter">filter</a>的对立面。只需返回一个1项元素数组以保留该项，返回一个多元素数组以添加项，或返回一个0项元素数组以删除该项。</p> + +<pre class="notranslate"><code>// Let's say we want to remove all the negative numbers and split the odd numbers into an even number and a 1 +let a = [5, 4, -3, 20, 17, -33, -4, 18] +// |\ \ x | | \ x x | +// [4,1, 4, 20, 16, 1, 18] + +a.flatMap( (n) => + (n < 0) ? [] : + (n % 2 == 0) ? [n] : + [n-1, 1] +) + +// expected output: [4, 1, 4, 20, 16, 1, 18]</code></pre> + +<h2 id="替代方案">替代方案</h2> + +<h3 id="reduce_与_concat"><code>reduce()</code> 与 <code>concat()</code></h3> + +<pre class="notranslate"><code>var arr = [1, 2, 3, 4]; + +arr.flatMap(x => [x, x * 2]); +// is equivalent to +arr.reduce((acc, x) => acc.concat([x, x * 2]), []); +// [1, 2, 2, 4, 3, 6, 4, 8]</code></pre> + +<p>请注意，这是低效的，并且应该避免大型阵列：在每次迭代中，它创建一个必须被垃圾收集的新临时数组，并且它将元素从当前的累加器数组复制到一个新的数组中，而不是将新的元素添加到现有的数组中。</p> + +<div class="hidden"> +<p>Please do not add polyfills on this article. For reference, please check: <a href="https://discourse.mozilla.org/t/mdn-rfc-001-mdn-wiki-pages-shouldnt-be-a-distributor-of-polyfills/24500">https://discourse.mozilla.org/t/mdn-rfc-001-mdn-wiki-pages-shouldnt-be-a-distributor-of-polyfills/24500</a></p> +</div> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <td>Specification</td> + <td>Status</td> + <td>Comment</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-array.prototype.flatmap', 'Array.prototype.flatMap')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div class="hidden"> +<p>The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> +</div> + +<p>{{Compat("javascript.builtins.Array.flatMap")}}</p> + +<h2 id="参见">参见</h2> + +<ul> + <li>{{jsxref("Array.prototype.flat()")}}</li> + <li>{{jsxref("Array.prototype.map()")}}</li> + <li>{{jsxref("Array.prototype.reduce()")}}</li> + <li>{{jsxref("Array.prototype.concat()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/array/foreach/index.html b/files/zh-cn/web/javascript/reference/global_objects/array/foreach/index.html new file mode 100644 index 0000000000..020a7dc3cd --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/array/foreach/index.html @@ -0,0 +1,384 @@ +--- +title: Array.prototype.forEach() +slug: Web/JavaScript/Reference/Global_Objects/Array/forEach +tags: + - Array + - ECMAScript5 + - JavaScript + - 参考 + - 数组 + - 方法 +translation_of: Web/JavaScript/Reference/Global_Objects/Array/forEach +--- +<div>{{JSRef}}</div> + +<p><code><strong>forEach()</strong></code> 方法对数组的每个元素执行一次给定的函数。</p> + + + +<p>{{EmbedInteractiveExample("pages/js/array-foreach.html")}}</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>arr</var>.forEach(<var>callback(currentValue [, index [, array]])</var>[, <var>thisArg</var>])</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code><var>callback</var></code></dt> + <dd>为数组中每个元素执行的函数，该函数接收一至三个参数：</dd> + <dd> + <dl> + <dt><code><var>currentValue</var></code></dt> + <dd>数组中正在处理的当前元素。</dd> + <dt><code><var>index</var></code> {{optional_inline}}</dt> + <dd>数组中正在处理的当前元素的索引。</dd> + <dt><code><var>array</var></code> {{optional_inline}}</dt> + <dd><code>forEach()</code> 方法正在操作的数组。</dd> + </dl> + </dd> + <dt><code><var>thisArg</var></code> {{optional_inline}}</dt> + <dd>可选参数。当执行回调函数 <code><var>callback</var></code> 时，用作 <code>this</code> 的值。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>{{jsxref("undefined")}}。</p> + +<h2 id="描述">描述</h2> + +<p><code>forEach()</code> 方法按升序为数组中含有效值的每一项执行一次 <code><var>callback</var></code> 函数，那些已删除或者未初始化的项将被跳过（例如在稀疏数组上）。</p> + +<p>可依次向 <code><var>callback</var></code> 函数传入三个参数：</p> + +<ol> + <li>数组当前项的值</li> + <li>数组当前项的索引</li> + <li>数组对象本身</li> +</ol> + +<p>如果 <code><var>thisArg</var></code> 参数有值，则每次 <code><var>callback</var></code> 函数被调用时，<code>this</code> 都会指向 <code><var>thisArg</var></code> 参数。如果省略了 <code><var>thisArg</var></code> 参数，或者其值为 <code>null</code> 或 <code>undefined</code>，<code>this</code> 则指向全局对象。按照<a href="/zh-CN/docs/Web/JavaScript/Reference/Operators/this">函数观察到 <code>this</code> 的常用规则</a>，<code><var>callback</var></code> 函数最终可观察到 <code>this</code> 值。</p> + +<p><code>forEach()</code> 遍历的范围在第一次调用 <code><var>callback</var></code> 前就会确定。调用 <code>forEach</code> 后添加到数组中的项不会被 <code><var>callback</var></code> 访问到。如果已经存在的值被改变，则传递给 <code><var>callback</var></code> 的值是 <code>forEach()</code> 遍历到他们那一刻的值。已删除的项不会被遍历到。如果已访问的元素在迭代时被删除了（例如使用 {{jsxref("Array.prototype.shift()", "shift()")}}），之后的元素将被跳过——<a href="#如果数组在迭代时被修改了，则其他元素会被跳过。">参见下面的示例</a>。</p> + +<p><code>forEach()</code> 为每个数组元素执行一次 <code><var>callback</var></code> 函数；与 {{jsxref("Array.prototype.map()", "map()")}} 或者 {{jsxref("Array.prototype.reduce()", "reduce()")}} 不同的是，它总是返回 {{jsxref("undefined")}} 值，并且不可链式调用。其典型用例是在一个调用链的最后执行副作用（side effects，函数式编程上，指函数进行 返回结果值 以外的操作）。</p> + +<p><code>forEach()</code> 被调用时，不会改变原数组，也就是调用它的数组（尽管 <code><var>callback</var></code> 函数在被调用时可能会改变原数组）。（译注：此处说法可能不够明确，具体可参考EMCA语言规范：'<code>forEach</code> does not directly mutate the object on which it is called but the object may be mutated by the calls to <code><var>callbackfn</var></code>.'，即 <code>forEach</code> 不会直接改变调用它的对象，但是那个对象可能会被 <code><var>callback</var></code> 函数改变。）</p> + +<div class="note"> +<p><strong>注意：</strong> 除了抛出异常以外，没有办法中止或跳出 <code>forEach()</code> 循环。如果你需要中止或跳出循环，<code>forEach()</code> 方法不是应当使用的工具。</p> + +<p>若你需要提前终止循环，你可以使用：</p> + +<ul> + <li>一个简单的 <a href="/zh-CN/docs/Web/JavaScript/Reference/Statements/for">for</a> 循环</li> + <li><a href="/zh-CN/docs/Web/JavaScript/Reference/Statements/for...of">for...of</a> / <a href="/zh-CN/docs/Web/JavaScript/Reference/Statements/for...in">for...in</a> 循环</li> + <li>{{jsxref("Array.prototype.every()")}}</li> + <li>{{jsxref("Array.prototype.some()")}}</li> + <li>{{jsxref("Array.prototype.find()")}}</li> + <li>{{jsxref("Array.prototype.findIndex()")}}</li> +</ul> + +<p>这些数组方法则可以对数组元素判断，以便确定是否需要继续遍历：</p> + +<ul> + <li>{{jsxref("Array.prototype.every()", "every()")}}</li> + <li>{{jsxref("Array.prototype.some()", "some()")}}</li> + <li>{{jsxref("Array.prototype.find()", "find()")}}</li> + <li>{{jsxref("Array.prototype.findIndex()", "findIndex()")}}</li> +</ul> + +<p>译者注：只要条件允许，也可以使用 {{jsxref("Array.prototype.filter()", "filter()")}} 提前过滤出需要遍历的部分，再用 <code>forEach()</code> 处理。</p> +</div> + +<h2 id="示例">示例</h2> + +<h3 id="不对未初始化的值进行任何操作（稀疏数组）">不对未初始化的值进行任何操作（稀疏数组）</h3> + +<p>如你所见，<code>3</code> 和 <code>7</code> 之间空缺的数组单元未被 <code>forEach()</code> 调用 <code><var>callback</var></code> 函数，或进行任何其他操作。</p> + +<pre class="brush: js">const arraySparse = [1,3,,7]; +let numCallbackRuns = 0; + +arraySparse.forEach(function(element){ + console.log(element); + numCallbackRuns++; +}); + +console.log("numCallbackRuns: ", numCallbackRuns); + +// 1 +// 3 +// 7 +// numCallbackRuns: 3</pre> + +<h3 id="将_for_循环转换为_forEach">将 for 循环转换为 forEach</h3> + +<pre class="brush:js">const items = ['item1', 'item2', 'item3']; +const copy = []; + +// before +for (let i=0; i<items.length; i++) { + copy.push(items[i]); +} + +// after +items.forEach(function(item){ + copy.push(item); +}); +</pre> + +<h3 id="打印出数组的内容">打印出数组的内容</h3> + +<div class="blockIndicator note"> +<p><strong>注意：</strong>为了在控制台中显示数组的内容，你可以使用 <code><a href="/zh-CN/docs/Web/API/Console/table">console.table()</a></code> 来展示经过格式化的数组。下面的例子则是另一种使用 <code>forEach()</code> 的格式化的方法。</p> +</div> + +<p>下面的代码会为每一个数组元素输出一行记录：</p> + +<pre class="brush:js">function logArrayElements(element, index, array) { + console.log('a[' + index + '] = ' + element); +} + +// 注意索引 2 被跳过了，因为在数组的这个位置没有项 +[2, 5, , 9].forEach(logArrayElements); +// logs: +// a[0] = 2 +// a[1] = 5 +// a[3] = 9 +</pre> + +<h3 id="使用_thisArg">使用 <code><var>thisArg</var></code></h3> + +<p>举个勉强的例子，按照每个数组中的元素值，更新一个对象的属性：</p> + +<pre class="brush:js">function Counter() { + this.sum = 0; + this.count = 0; +} +Counter.prototype.add = function(array) { + array.forEach(function(entry) { + this.sum += entry; + ++this.count; + }, this); + // ^---- Note +}; + +const obj = new Counter(); +obj.add([2, 5, 9]); +obj.count; +// 3 === (1 + 1 + 1) +obj.sum; +// 16 === (2 + 5 + 9) +</pre> + +<p>因为 <code><var>thisArg</var></code> 参数（<code>this</code>）传给了 <code>forEach()</code>，每次调用时，它都被传给 <code><var>callback</var></code> 函数，作为它的 <code>this</code> 值。</p> + +<div> +<div class="note"><strong>注意：</strong>如果使用<a href="/zh-CN/docs/Web/JavaScript/Reference/Functions/Arrow_functions">箭头函数表达式</a>来传入函数参数， <code><var>thisArg</var></code> 参数会被忽略，因为箭头函数在词法上绑定了 {{jsxref("Operators/this", "this")}} 值。</div> +</div> + +<h3 id="对象复制器函数">对象复制器函数</h3> + +<p>下面的代码会创建一个给定对象的副本。 创建对象的副本有不同的方法，以下是只是一种方法，并解释了 <code>Array.prototype.forEach()</code> 是如何使用 ECMAScript 5 <code>Object.*</code> 元属性（meta property）函数工作的。</p> + +<pre class="brush: js">function copy(obj) { + const copy = Object.create(Object.getPrototypeOf(obj)); + const propNames = Object.getOwnPropertyNames(obj); + + propNames.forEach(function(name) { + const desc = Object.getOwnPropertyDescriptor(obj, name); + Object.defineProperty(copy, name, desc); + }); + + return copy; +} + +const obj1 = { a: 1, b: 2 }; +const obj2 = copy(obj1); // 现在 obj2 看起来和 obj1 一模一样了 +</pre> + +<h3 id="如果数组在迭代时被修改了，则其他元素会被跳过。">如果数组在迭代时被修改了，则其他元素会被跳过。</h3> + +<p>下面的例子会输出 "one", "two", "four"。当到达包含值 "two" 的项时，整个数组的第一个项被移除了，这导致所有剩下的项上移一个位置。因为元素 "four" 正位于在数组更前的位置，所以 "three" 会被跳过。 <code>forEach()</code> 不会在迭代之前创建数组的副本。</p> + +<pre class="brush:js">var words = ['one', 'two', 'three', 'four']; +words.forEach(function(word) { + console.log(word); + if (word === 'two') { + words.shift(); + } +}); +// one +// two +// four +</pre> + +<h3 id="扁平化数组">扁平化数组</h3> + +<p>下面的示例仅用于学习目的。如果你想使用内置方法来扁平化数组，你可以考虑使用 {{jsxref("Array.prototype.flat()")}}（预计将成为 ES2019 的一部分，并且已在主要浏览器中实现）或参考其 polyfill。</p> + +<pre class="brush: js">/** + * Flattens passed array in one dimensional array + * + * @params {array} arr + * @returns {array} + */ +function flatten(arr) { + const result = []; + + arr.forEach((i) => { + if (Array.isArray(i)) + result.push(...flatten(i)); + else + result.push(i); + }) + + return result; +} + +// Usage +const problem = [1, 2, 3, [4, 5, [6, 7], 8, 9]]; + +flatten(problem); // [1, 2, 3, 4, 5, 6, 7, 8, 9] +</pre> + +<h2 id="针对_promise_或_async_函数的使用备注">针对 promise 或 async 函数的使用备注</h2> + +<p>如果使用 promise 或 async 函数作为 <code>forEach()</code> 等类似方法的 <code><var>callback</var></code> 参数，最好对造成的执行顺序影响多加考虑，否则容易出现错误。</p> + +<pre class="brush: js">let ratings = [5, 4, 5]; + +let sum = 0; + +let sumFunction = async function (a, b) { + return a + b; +} + +ratings.forEach(async function(rating) { + sum = await sumFunction(sum, rating); +}) + +console.log(sum); +// Expected output: 14 +// Actual output: 0 +</pre> + +<h2 id="Polyfill">Polyfill</h2> + +<p><code>forEach()</code> 是在第五版本里被添加到 ECMA-262 标准的；这样它可能在标准的其他实现中不存在，你可以在你调用 <code>forEach()</code> 之前插入下面的代码，在本地不支持的情况下使用 <code>forEach()</code>。该算法是 ECMA-262 第5版中指定的算法。它假定 {{jsxref("Object")}} 和 {{jsxref("TypeError")}} 拥有它们的初始值，且 <code>callback.call</code> 等价于 {{jsxref("Function.prototype.call()")}}。</p> + +<pre class="brush: js">// Production steps of ECMA-262, Edition 5, 15.4.4.18 +// Reference: http://es5.github.io/#x15.4.4.18 +if (!Array.prototype.forEach) { + + Array.prototype.forEach = function(callback, thisArg) { + + var T, k; + + if (this == null) { + throw new TypeError(' this is null or not defined'); + } + + // 1. Let O be the result of calling toObject() passing the + // |this| value as the argument. + var O = Object(this); + + // 2. Let lenValue be the result of calling the Get() internal + // method of O with the argument "length". + // 3. Let len be toUint32(lenValue). + var len = O.length >>> 0; + + // 4. If isCallable(callback) is false, throw a TypeError exception. + // See: http://es5.github.com/#x9.11 + if (typeof callback !== "function") { + throw new TypeError(callback + ' is not a function'); + } + + // 5. If thisArg was supplied, let T be thisArg; else let + // T be undefined. + if (arguments.length > 1) { + T = thisArg; + } + + // 6. Let k be 0 + k = 0; + + // 7. Repeat, while k < len + while (k < len) { + + var kValue; + + // a. Let Pk be ToString(k). + // This is implicit for LHS operands of the in operator + // b. Let kPresent be the result of calling the HasProperty + // internal method of O with argument Pk. + // This step can be combined with c + // c. If kPresent is true, then + if (k in O) { + + // i. Let kValue be the result of calling the Get internal + // method of O with argument Pk. + kValue = O[k]; + + // ii. Call the Call internal method of callback with T as + // the this value and argument list containing kValue, k, and O. + callback.call(T, kValue, k, O); + } + // d. Increase k by 1. + k++; + } + // 8. return undefined + }; +} +</pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">规范</th> + <th scope="col">状态</th> + <th scope="col">备注</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-array.prototype.foreach', 'Array.prototype.forEach')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-array.prototype.foreach', 'Array.prototype.forEach')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.4.4.18', 'Array.prototype.forEach')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td>Initial definition. Implemented in JavaScript 1.6.</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> + + +<p>{{Compat("javascript.builtins.Array.forEach")}}</p> +</div> + +<h2 id="参见">参见</h2> + +<ul> + <li>{{jsxref("Array.prototype.find()")}}</li> + <li>{{jsxref("Array.prototype.findIndex()")}}</li> + <li>{{jsxref("Array.prototype.map()")}}</li> + <li>{{jsxref("Array.prototype.filter()")}}</li> + <li>{{jsxref("Array.prototype.every()")}}</li> + <li>{{jsxref("Array.prototype.some()")}}</li> + <li>{{jsxref("Map.prototype.forEach()")}}</li> + <li>{{jsxref("Set.prototype.forEach()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/array/from/index.html b/files/zh-cn/web/javascript/reference/global_objects/array/from/index.html new file mode 100644 index 0000000000..98a16c1700 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/array/from/index.html @@ -0,0 +1,258 @@ +--- +title: Array.from() +slug: Web/JavaScript/Reference/Global_Objects/Array/from +tags: + - Array + - ECMAScript 2015 + - JavaScript + - Reference + - arguments + - polyfill + - 参考 + - 数组 +translation_of: Web/JavaScript/Reference/Global_Objects/Array/from +--- +<div>{{JSRef}}</div> + +<p><code><strong>Array.from()</strong></code> 方法从一个类似数组或可迭代对象创建一个新的，浅拷贝的数组实例。</p> + +<div>{{EmbedInteractiveExample("pages/js/array-from.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox notranslate">Array.from(<em>arrayLike</em>[, <em>mapFn</em>[, <em>thisArg</em>]]) +</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>arrayLike</code></dt> + <dd>想要转换成数组的伪数组对象或可迭代对象。</dd> + <dt><code>mapFn</code> {{Optional_inline}}</dt> + <dd>如果指定了该参数，新数组中的每个元素会执行该回调函数。</dd> + <dt><code>thisArg</code> {{Optional_inline}}</dt> + <dd>可选参数，执行回调函数 <code>mapFn</code> 时 <code>this</code> 对象。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>一个新的{{jsxref("Array","数组")}}实例。</p> + +<h2 id="描述">描述</h2> + +<p><code>Array.from()</code> 可以通过以下方式来创建数组对象：</p> + +<ul> + <li>伪数组对象（拥有一个 <code>length</code> 属性和若干索引属性的任意对象）</li> + <li><a href="/zh-CN/docs/Web/JavaScript/Guide/iterable">可迭代对象</a>（可以获取对象中的元素,如 Map和 Set 等）</li> +</ul> + +<p><code>Array.from()</code> 方法有一个可选参数 <code>mapFn</code>，让你可以在最后生成的数组上再执行一次 {{jsxref("Array.prototype.map", "map")}} 方法后再返回。也就是说<code> Array.from(obj, mapFn, thisArg) </code>就相当于<code> Array.from(obj).map(mapFn, thisArg),</code> 除非创建的不是可用的中间数组。 这对一些数组的子类<code>,</code>如 <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Typed_arrays">typed arrays</a><font face="Consolas, Liberation Mono, Courier, monospace"> 来说很重要,</font> 因为中间数组的值在调用 map() 时需要是适当的类型。</p> + +<p><code>from()</code> 的 <code>length</code> 属性为 1 ，即 <code>Array.from.length === 1</code>。</p> + +<p>在 ES2015 中， <code>Class</code> 语法允许我们为内置类型（比如 <code>Array</code>）和自定义类新建子类（比如叫 <code>SubArray</code>）。这些子类也会继承父类的静态方法，比如 <code>SubArray.from()</code>，调用该方法后会返回子类 <code>SubArray</code> 的一个实例，而不是 <code>Array</code> 的实例。</p> + +<h2 id="示例">示例</h2> + +<h3 id="从_String_生成数组">从 <code>String</code> 生成数组</h3> + +<pre class="brush: js notranslate">Array.from('foo'); +// [ "f", "o", "o" ]</pre> + +<h3 id="从_Set_生成数组">从 <code>Set</code> 生成数组</h3> + +<pre class="brush: js notranslate">const set = new Set(['foo', 'bar', 'baz', 'foo']); +Array.from(set); +// [ "foo", "bar", "baz" ]</pre> + +<h3 id="从_Map_生成数组">从 <code>Map</code> 生成数组</h3> + +<pre class="brush: js notranslate">const map = new Map([[1, 2], [2, 4], [4, 8]]); +Array.from(map); +// [[1, 2], [2, 4], [4, 8]] + +const mapper = new Map([['1', 'a'], ['2', 'b']]); +Array.from(mapper.values()); +// ['a', 'b']; + +Array.from(mapper.keys()); +// ['1', '2']; +</pre> + +<h3 id="从类数组对象（arguments）生成数组">从类数组对象（arguments）生成数组</h3> + +<pre class="brush: js notranslate">function f() { + return Array.from(arguments); +} + +f(1, 2, 3); + +// [ 1, 2, 3 ]</pre> + +<h3 id="在_Array.from_中使用箭头函数">在 <code>Array.from</code> 中使用箭头函数</h3> + +<pre class="brush: js notranslate">// Using an arrow function as the map function to +// manipulate the elements +Array.from([1, 2, 3], x => x + x); +// [2, 4, 6] + + +// Generate a sequence of numbers +// Since the array is initialized with `undefined` on each position, +// the value of `v` below will be `undefined` +Array.from({length: 5}, (v, i) => i); +// [0, 1, 2, 3, 4] +</pre> + +<h3 id="序列生成器指定范围">序列生成器(指定范围)</h3> + +<pre class="brush: js notranslate">// Sequence generator function (commonly referred to as "range", e.g. Clojure, PHP etc) +const range = (start, stop, step) => Array.from({ length: (stop - start) / step + 1}, (_, i) => start + (i * step)); + +// Generate numbers range 0..4 +range(0, 4, 1); +// [0, 1, 2, 3, 4] + +// Generate numbers range 1..10 with step of 2 +range(1, 10, 2); +// [1, 3, 5, 7, 9] + +// Generate the alphabet using Array.from making use of it being ordered as a sequence +range('A'.charCodeAt(0), 'Z'.charCodeAt(0), 1).map(x => String.fromCharCode(x)); +// ["A", "B", "C", "D", "E", "F", "G", "H", "I", "J", "K", "L", "M", "N", "O", "P", "Q", "R", "S", "T", "U", "V", "W", "X", "Y", "Z"] +</pre> + +<h3 id="数组去重合并">数组去重合并</h3> + +<pre class="brush: js notranslate">function combine(){ + let arr = [].concat.apply([], arguments); //没有去重复的新数组 + return Array.from(new Set(arr)); +} + +var m = [1, 2, 2], n = [2,3,3]; +console.log(combine(m,n)); // [1, 2, 3]</pre> + +<h2 id="Polyfill">Polyfill</h2> + +<p>ECMA-262 第六版标准中添加了 <code>Array.from </code>。有些实现中可能尚未包括在其中。你可以通过在脚本前添加如下内容作为替代方法，以使用未原生支持的 <code>Array.from</code> 方法。该算法按照 ECMA-262 第六版中的规范实现，并假定 <code>Object</code> 和 <code>TypeError</code> 有其本身的值， <code>callback.call</code> 对应 {{jsxref("Function.prototype.call")}} 。此外，鉴于无法使用 Polyfill 实现真正的的迭代器，该实现不支持规范中定义的泛型可迭代元素。</p> + +<pre class="brush: js notranslate">// Production steps of ECMA-262, Edition 6, 22.1.2.1 +if (!Array.from) { + Array.from = (function () { + var toStr = Object.prototype.toString; + var isCallable = function (fn) { + return typeof fn === 'function' || toStr.call(fn) === '[object Function]'; + }; + var toInteger = function (value) { + var number = Number(value); + if (isNaN(number)) { return 0; } + if (number === 0 || !isFinite(number)) { return number; } + return (number > 0 ? 1 : -1) * Math.floor(Math.abs(number)); + }; + var maxSafeInteger = Math.pow(2, 53) - 1; + var toLength = function (value) { + var len = toInteger(value); + return Math.min(Math.max(len, 0), maxSafeInteger); + }; + + // The length property of the from method is 1. + return function from(arrayLike/*, mapFn, thisArg */) { + // 1. Let C be the this value. + var C = this; + + // 2. Let items be ToObject(arrayLike). + var items = Object(arrayLike); + + // 3. ReturnIfAbrupt(items). + if (arrayLike == null) { + throw new TypeError("Array.from requires an array-like object - not null or undefined"); + } + + // 4. If mapfn is undefined, then let mapping be false. + var mapFn = arguments.length > 1 ? arguments[1] : void undefined; + var T; + if (typeof mapFn !== 'undefined') { + // 5. else + // 5. a If IsCallable(mapfn) is false, throw a TypeError exception. + if (!isCallable(mapFn)) { + throw new TypeError('Array.from: when provided, the second argument must be a function'); + } + + // 5. b. If thisArg was supplied, let T be thisArg; else let T be undefined. + if (arguments.length > 2) { + T = arguments[2]; + } + } + + // 10. Let lenValue be Get(items, "length"). + // 11. Let len be ToLength(lenValue). + var len = toLength(items.length); + + // 13. If IsConstructor(C) is true, then + // 13. a. Let A be the result of calling the [[Construct]] internal method + // of C with an argument list containing the single item len. + // 14. a. Else, Let A be ArrayCreate(len). + var A = isCallable(C) ? Object(new C(len)) : new Array(len); + + // 16. Let k be 0. + var k = 0; + // 17. Repeat, while k < len… (also steps a - h) + var kValue; + while (k < len) { + kValue = items[k]; + if (mapFn) { + A[k] = typeof T === 'undefined' ? mapFn(kValue, k) : mapFn.call(T, kValue, k); + } else { + A[k] = kValue; + } + k += 1; + } + // 18. Let putStatus be Put(A, "length", len, true). + A.length = len; + // 20. Return A. + return A; + }; + }()); +} +</pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-array.from', 'Array.from')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES2015', '#sec-array.from', 'Array.from')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>Initial definition.</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.Array.from")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Array")}}</li> + <li>{{jsxref("Array.prototype.map()")}}</li> + <li>{{jsxref("TypedArray.from()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/array/includes/index.html b/files/zh-cn/web/javascript/reference/global_objects/array/includes/index.html new file mode 100644 index 0000000000..183d9978b3 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/array/includes/index.html @@ -0,0 +1,185 @@ +--- +title: Array.prototype.includes() +slug: Web/JavaScript/Reference/Global_Objects/Array/includes +tags: + - Array + - ECMAScript 2016 + - JavaScript + - 数组 + - 方法 +translation_of: Web/JavaScript/Reference/Global_Objects/Array/includes +--- +<div>{{JSRef}} </div> + +<p><code><strong>includes()</strong></code> 方法用来判断一个数组是否包含一个指定的值，根据情况，如果包含则返回 true，否则返回false。</p> + +<div>{{EmbedInteractiveExample("pages/js/array-includes.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre><var>arr</var>.includes(<var>valueToFind[</var>, <var>fromIndex]</var>)</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>valueToFind</code></dt> + <dd> + <p>需要查找的元素值。</p> + + <div class="blockIndicator note"> + <p><strong>Note: </strong>使用<strong> </strong><code>includes()</code>比较字符串和字符时是区分大小写。</p> + </div> + </dd> + <dt><code>fromIndex</code> {{optional_inline}}</dt> + <dd>从<code>fromIndex</code> 索引处开始查找 <code>valueToFind</code>。如果为负值，则按升序从 <code>array.length + fromIndex</code> 的索引开始搜 （即使从末尾开始往前跳 <code>fromIndex</code> 的绝对值个索引，然后往后搜寻）。默认为 0。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>A {{jsxref("Boolean")}} which is <code>true</code> if the value <code>valueToFind</code> is found within the array (or the part of the array indicated by the index <code>fromIndex</code>, if specified). Values of zero are all considered to be equal regardless of sign (that is, -0 is considered to be equal to both 0 and +0), but <code>false</code> is not considered to be the same as 0.</p> + +<p>返回一个布尔值 {{jsxref("Boolean")}} ，如果在数组中找到了（如果传入了 <code>fromIndex</code> ，表示在 <code>fromIndex</code> 指定的索引范围中找到了）则返回 <code>true</code> 。</p> + +<div class="note"> +<p><strong>Note:</strong> Technically speaking, <code>includes()</code> uses the <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Equality_comparisons_and_sameness#Same-value-zero_equality">sameValueZero</a></code> algorithm to determine whether the given element is found.</p> +</div> + +<h2 id="示例">示例</h2> + +<pre class="brush: js">[1, 2, 3].includes(2); // true +[1, 2, 3].includes(4); // false +[1, 2, 3].includes(3, 3); // false +[1, 2, 3].includes(3, -1); // true +[1, 2, NaN].includes(NaN); // true +</pre> + +<h3 id="fromIndex_大于等于数组长度">fromIndex 大于等于数组长度</h3> + +<p>如果 <code>fromIndex</code> 大于等于数组的长度，则会返回 <code>false</code>，且该数组不会被搜索。</p> + +<pre class="brush: js">var arr = ['a', 'b', 'c']; + +arr.includes('c', 3); // false +arr.includes('c', 100); // false</pre> + +<h3 id="计算出的索引小于_0">计算出的索引小于 0</h3> + +<p>如果 <code>fromIndex </code>为负值，计算出的索引将作为开始搜索<code>searchElement</code>的位置。如果计算出的索引小于 0，则整个数组都会被搜索。</p> + +<pre class="brush: js">// array length is 3 +// fromIndex is -100 +// computed index is 3 + (-100) = -97 + +var arr = ['a', 'b', 'c']; + +arr.includes('a', -100); // true +arr.includes('b', -100); // true +arr.includes('c', -100); // true +arr.includes('a', -2); // false</pre> + +<h3 id="作为通用方法的_includes">作为通用方法的 includes()</h3> + +<p><code>includes()</code> 方法有意设计为通用方法。它不要求<code>this</code>值是数组对象，所以它可以被用于其他类型的对象 (比如类数组对象)。下面的例子展示了 在函数的 <a href="/zh-CN/docs/Web/JavaScript/Reference/Functions/arguments">arguments</a> 对象上调用的 <code>includes()</code> 方法。</p> + +<pre class="brush: js">(function() { + console.log([].includes.call(arguments, 'a')); // true + console.log([].includes.call(arguments, 'd')); // false +})('a','b','c');</pre> + +<h2 id="Polyfill">Polyfill</h2> + +<pre class="brush: js">// https://tc39.github.io/ecma262/#sec-array.prototype.includes +if (!Array.prototype.includes) { + Object.defineProperty(Array.prototype, 'includes', { + value: function(valueToFind, fromIndex) { + + if (this == null) { + throw new TypeError('"this" is null or not defined'); + } + + // 1. Let O be ? ToObject(this value). + var o = Object(this); + + // 2. Let len be ? ToLength(? Get(O, "length")). + var len = o.length >>> 0; + + // 3. If len is 0, return false. + if (len === 0) { + return false; + } + + // 4. Let n be ? ToInteger(fromIndex). + // (If fromIndex is undefined, this step produces the value 0.) + var n = fromIndex | 0; + + // 5. If n ≥ 0, then + // a. Let k be n. + // 6. Else n < 0, + // a. Let k be len + n. + // b. If k < 0, let k be 0. + var k = Math.max(n >= 0 ? n : len - Math.abs(n), 0); + + function sameValueZero(x, y) { + return x === y || (typeof x === 'number' && typeof y === 'number' && isNaN(x) && isNaN(y)); + } + + // 7. Repeat, while k < len + while (k < len) { + // a. Let elementK be the result of ? Get(O, ! ToString(k)). + // b. If SameValueZero(valueToFind, elementK) is true, return true. + if (sameValueZero(o[k], valueToFind)) { + return true; + } + // c. Increase k by 1. + k++; + } + + // 8. Return false + return false; + } + }); +} + +</pre> + +<p>如果你需要支持那些不支持<code><a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperty">Object.defineProperty</a></code>的废弃JavaScript 引擎，你最好不要 polyfill <code>Array.prototype</code> 方法，因为你不能使它们不可枚举。</p> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范</th> + <th scope="col">状态</th> + <th scope="col">备注</th> + </tr> + <tr> + <td>{{SpecName('ES7', '#sec-array.prototype.includes', 'Array.prototype.includes')}}</td> + <td>{{Spec2('ES7')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-array.prototype.includes', 'Array.prototype.includes')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.Array.includes")}}</p> + +<h2 id="参见">参见</h2> + +<ul> + <li>{{jsxref("TypedArray.prototype.includes()")}}</li> + <li>{{jsxref("String.prototype.includes()")}}</li> + <li>{{jsxref("Array.prototype.indexOf()")}}</li> + <li>{{jsxref("Array.prototype.find()")}}</li> + <li>{{jsxref("Array.prototype.findIndex()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/array/index.html b/files/zh-cn/web/javascript/reference/global_objects/array/index.html new file mode 100644 index 0000000000..b8c665f147 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/array/index.html @@ -0,0 +1,445 @@ +--- +title: Array +slug: Web/JavaScript/Reference/Global_Objects/Array +tags: + - JavaScript + - 二维数组 + - 全局对象 + - 参考手册 + - 数组 +translation_of: Web/JavaScript/Reference/Global_Objects/Array +--- +<div>{{JSRef}}</div> + +<div></div> + +<p>JavaScript的 <code><strong>Array</strong></code> 对象是用于构造数组的全局对象，数组是类似于列表的高阶对象。</p> + +<p><strong>创建数组</strong></p> + +<pre class="brush: js">var fruits = ['Apple', 'Banana']; + +console.log(fruits.length); +// 2 +</pre> + +<p><strong>通过索引访问数组元素</strong></p> + +<pre class="brush: js">var first = fruits[0]; +// Apple + +var last = fruits[fruits.length - 1]; +// Banana</pre> + +<p><strong>遍历数组</strong></p> + +<pre class="brush: js">fruits.forEach(function (item, index, array) { + console.log(item, index); +}); +// Apple 0 +// Banana 1</pre> + +<p><strong>添加元素到数组的末尾</strong></p> + +<pre class="brush: js">var newLength = fruits.push('Orange'); +// newLength:3; fruits: ["Apple", "Banana", "Orange"]</pre> + +<p><strong>删除数组末尾的元素</strong></p> + +<pre class="brush: js">var last = fruits.pop(); // remove Orange (from the end) +// last: "Orange"; fruits: ["Apple", "Banana"];</pre> + +<p><strong>删除数组最前面（头部）的元素</strong></p> + +<pre class="brush: js">var first = fruits.shift(); // remove Apple from the front +// first: "Apple"; fruits: ["Banana"];</pre> + +<p><strong>添加元素到数组的头部</strong></p> + +<pre class="brush: js">var newLength = fruits.unshift('Strawberry') // add to the front +// ["Strawberry", "Banana"]; +</pre> + +<p><strong>找出某个元素在数组中的索引</strong></p> + +<pre class="brush: js">fruits.push('Mango'); +// ["Strawberry", "Banana", "Mango"] + +var pos = fruits.indexOf('Banana'); +// 1</pre> + +<p><strong>通过索引删除某个元素</strong></p> + +<pre class="brush: js">var removedItem = fruits.splice(pos, 1); // this is how to remove an item + +// ["Strawberry", "Mango"]</pre> + +<p><strong>从一个索引位置删除多个元素</strong></p> + +<pre class="brush: js">var vegetables = ['Cabbage', 'Turnip', 'Radish', 'Carrot']; +console.log(vegetables); +// ["Cabbage", "Turnip", "Radish", "Carrot"] + +var pos = 1, n = 2; + +var removedItems = vegetables.splice(pos, n); +// this is how to remove items, n defines the number of items to be removed, +// from that position(pos) onward to the end of array. + +console.log(vegetables); +// ["Cabbage", "Carrot"] (the original array is changed) + +console.log(removedItems); +// ["Turnip", "Radish"]</pre> + +<p><strong>复制一个数组</strong></p> + +<pre class="brush: js">var shallowCopy = fruits.slice(); // this is how to make a copy +// ["Strawberry", "Mango"]</pre> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">[<var>element0</var>, <var>element1</var>, ..., <var>elementN</var>] +new Array(<var>element0</var>, <var>element1</var>[, ...[, <var>elementN</var>]]) +new Array(<var>arrayLength</var>) +</pre> + +<dl> + <dt> + <h3 id="参数">参数</h3> + </dt> + <dt><code>elementN</code></dt> + <dd><code>Array</code> 构造器会根据给定的元素创建一个 JavaScript 数组，但是当仅有一个参数且为数字时除外（详见下面的 <code>arrayLength</code> 参数）。注意，后面这种情况仅适用于用 <code>Array</code> 构造器创建数组，而不适用于用方括号创建的数组字面量。</dd> + <dt><code>arrayLength</code></dt> + <dd>一个范围在 0 到 2<sup>32</sup>-1 之间的整数，此时将返回一个 <code>length</code> 的值等于 <code>arrayLength</code> 的数组对象（言外之意就是该数组此时并没有包含任何实际的元素，不能理所当然地认为它包含 <code>arrayLength</code> 个值为 <code>undefined</code> 的元素）。如果传入的参数不是有效值，则会抛出 {{jsxref("RangeError")}} 异常。</dd> +</dl> + +<h2 id="描述">描述</h2> + +<p>数组是一种类列表对象，它的原型中提供了遍历和修改元素的相关操作。JavaScript 数组的长度和元素类型都是非固定的。因为数组的长度可随时改变，并且其数据在内存中也可以不连续，所以 JavaScript 数组不一定是密集型的，这取决于它的使用方式。一般来说，数组的这些特性会给使用带来方便，但如果这些特性不适用于你的特定使用场景的话，可以考虑使用类型数组 {{jsxref("TypedArray")}}。</p> + +<p>只能用整数作为数组元素的索引，而不能用字符串。后者称为<a href="https://en.wikipedia.org/wiki/Associative_array">关联数组</a>。使用非整数并通过<a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Guide/Working_with_Objects#Objects_and_properties">方括号</a>或<a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Operators/Property_Accessors">点号</a>来访问或设置数组元素时，所操作的并不是数组列表中的元素，而是数组对象的<a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Data_structures#Properties">属性集合</a>上的变量。数组对象的属性和数组元素列表是分开存储的，并且数组的遍历和修改操作也不能作用于这些命名属性。</p> + +<h3 id="访问数组元素">访问数组元素</h3> + +<p>JavaScript 数组的索引是从0开始的，第一个元素的索引为0，最后一个元素的索引等于该数组的长度减1。如果指定的索引是一个无效值，JavaScript 数组并不会报错，而是会返回 <code>undefined</code>。</p> + +<pre class="brush: js language-js">var arr = ['this is the first element', 'this is the second element', 'this is the last element']; +console.log(arr[0]); // 打印 'this is the first element' +console.log(arr[1]); // 打印 'this is the second element' +console.log(arr[arr.length - 1]); // 打印 'this is the last element' +</pre> + +<p>虽然数组元素可以看做是数组对象的属性，就像 <code>toString</code> 一样，但是下面的写法是错误的，运行时会抛出 <code>SyntaxError</code> 异常，而原因则是使用了非法的属性名：</p> + +<pre class="brush: js language-js">console.log(arr.0); // a syntax error +</pre> +<p>并不是 JavaScript 数组有什么特殊之处，而是因为在 JavaScript 中，以数字开头的属性不能用点号引用，必须用方括号。比如，如果一个对象有一个名为 <code>3d</code> 的属性，那么只能用方括号来引用它。下面是具体的例子：</p> + +<pre class="brush: js language-js">var years = [1950, 1960, 1970, 1980, 1990, 2000, 2010]; +console.log(years.0); // 语法错误 +console.log(years[0]); // √ +</pre> +<pre class="brush: js language-js">renderer.3d.setTexture(model, 'character.png'); // 语法错误 +renderer['3d'].setTexture(model, 'character.png'); // √ +</pre> + +<p>注意在 <code>3d</code> 那个例子中，引号是必须的。你也可以将数组的索引用引号引起来，比如 <code>years[2]</code> 可以写成 <code>years['2']</code>。 <code>years[2]</code> 中的 2 会被 JavaScript 解释器通过调用 <code>toString</code> 隐式转换成字符串。正因为这样，<code>'2'</code> 和 <code>'02'</code> 在 <code>years</code> 中所引用的可能是不同位置上的元素。而下面这个例子也可能会打印 <code>true</code>：</p> + +<pre class="brush: js language-js">console.log(years['2'] != years['02']); +</pre> +<p>类似地，如果对象的属性名称是保留字（最好不要这么做！），那么就只能通过字符串的形式用方括号来访问（从 firefox 40.0a2 开始也支持用点号访问了）：</p> + +<pre class="brush: js language-js">var promise = { + 'var' : 'text', + 'array': [1, 2, 3, 4] +}; + +console.log(promise['var']); +</pre> + +<h3 id="length_和数字下标之间的关系">length 和数字下标之间的关系</h3> + +<p>JavaScript 数组的 {{jsxref("Array.length", "length")}} 属性和其数字下标之间有着紧密的联系。数组内置的几个方法（例如 {{jsxref("Array.join", "join")}}、{{jsxref("Array.slice", "slice")}}、{{jsxref("Array.indexOf", "indexOf")}} 等）都会考虑 {{jsxref("Array.length", "length")}} 的值。另外还有一些方法（例如 {{jsxref("Array.push", "push")}}、{{jsxref("Array.splice", "splice")}} 等）还会改变 {{jsxref("Array.length", "length")}} 的值。</p> + +<pre class="brush: js language-js">var fruits = []; +fruits.push('banana', 'apple', 'peach'); + +console.log(fruits.length); // 3 +</pre> + +<p>使用一个合法的下标为数组元素赋值，并且该下标超出了当前数组的大小的时候，解释器会同时修改 {{jsxref("Array.length", "length")}} 的值：</p> + +<pre class="brush: js language-js">fruits[5] = 'mango'; +console.log(fruits[5]); // 'mango' +console.log(Object.keys(fruits)); // ['0', '1', '2', '5'] +console.log(fruits.length); // 6 +</pre> + +<p>也可以显式地给 {{jsxref("Array.length", "length")}} 赋一个更大的值：</p> + +<pre class="brush: js language-js">fruits.length = 10; +console.log(Object.keys(fruits)); // ['0', '1', '2', '5'] +console.log(fruits.length); // 10 +</pre> +<p>而为 {{jsxref("Array.length", "length")}} 赋一个更小的值则会删掉一部分元素：</p> + +<pre class="brush: js language-js">fruits.length = 2; +console.log(Object.keys(fruits)); // ['0', '1'] +console.log(fruits.length); // 2</pre> + +<p>这一节的内容在 {{jsxref("Array.length")}} 中有更详细的介绍。</p> +<h3 id="正则匹配结果所返回的数组">正则匹配结果所返回的数组</h3> + +<p>使用正则表达式匹配字符串可以得到一个数组。这个数组中包含本次匹配的相关信息和匹配结果。{{jsxref("RegExp.exec")}}、{{jsxref("String.match")}}、{{jsxref("String.replace")}} 都会返回这样的数组。看下面的例子和例子下面的表格：</p> + +<pre class="brush: js">// 匹配1个 d 后面紧跟着至少1个 b，再后面又跟着1个 d 的子串， +// 并且需要记住子串中匹配到的 b 和最后的 d （通过正则表达式中的分组）， +// 同时在匹配时忽略大小写 + +myRe = /d(b+)(d)/i; +myArray = myRe.exec("cdbBdbsbz"); +</pre> + +<p>该正则匹配返回的数组包含以下属性和元素：</p> + +<table class="fullwidth-table"> + <tbody> + <tr> + <td class="header">属性/元素</td> + <td class="header">说明</td> + <td class="header">示例</td> + </tr> + <tr> + <td><code>input</code></td> + <td>只读属性，原始字符串</td> + <td>cdbBdbsbz</td> + </tr> + <tr> + <td><code>index</code></td> + <td>只读属性，匹配到的子串在原始字符串中的索引</td> + <td>1</td> + </tr> + <tr> + <td><code>[0]</code></td> + <td>只读元素，本次匹配到的子串</td> + <td>dbBd</td> + </tr> + <tr> + <td><code>[1], ...[n]</code></td> + <td>只读元素，正则表达式中所指定的分组所匹配到的子串，其数量由正则中的分组数量决定，无最大上限</td> + <td>[1]: bB<br> + [2]: d</td> + </tr> + </tbody> +</table> + +<h2 id="属性">属性</h2> + +<div><code>Array.length</code></div> + +<dl> + <dd><code>Array</code> 构造函数的 length 属性，其值为1（注意该属性为静态属性，不是数组实例的 length 属性）。</dd> + <dt>{{jsxref("Array.@@species", "get Array[@@species]")}}</dt> + <dd>返回 <code>Array</code> 构造函数。</dd> + <dt>{{jsxref("Array.prototype")}}</dt> + <dd>通过数组的原型对象可以为所有数组对象添加属性。</dd> +</dl> + +<h2 id="方法">方法</h2> + +<dl> + <dt>{{jsxref("Array.from()")}}</dt> + <dd>从类数组对象或者可迭代对象中创建一个新的数组实例。</dd> + <dt>{{jsxref("Array.isArray()")}}</dt> + <dd>用来判断某个变量是否是一个数组对象。</dd> + <dt>{{jsxref("Array.of()")}}</dt> + <dd>根据一组参数来创建新的数组实例，支持任意的参数数量和类型。</dd> +</dl> + +<h2 id="数组实例"><font face="Consolas, Liberation Mono, Courier, monospace">数组实例</font></h2> + +<p>所有数组实例都会从 {{jsxref("Array.prototype")}} 继承属性和方法。修改 <code>Array</code> 的原型会影响到所有的数组实例。</p> + +<h3 id="属性_2">属性</h3> + +<div>{{page('/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array/prototype', 'Properties')}}</div> + +<h3 id="方法_2">方法</h3> + +<h4 id="修改器方法">修改器方法</h4> + +<p>{{page('zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array/prototype', 'Mutator_methods')}}</p> + +<h4 id="访问方法">访问方法</h4> + +<p>{{page('zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array/prototype', 'Accessor_methods')}}</p> + +<h4 id="迭代方法">迭代方法</h4> + +<p>{{page('zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array/prototype', 'Iteration_methods')}}</p> + +<h2 id="数组泛型方法">数组泛型方法</h2> + +<div class="warning"> +<p><strong>泛型方法是非标准，并且已弃用，有可能不久就会移除。</strong> 需注意的是此方法同时有跨浏览器问题. 但是 <a href="https://github.com/plusdude/array-generics">Github上有可用的shim</a>。</p> +</div> + +<p>有时我们会希望在字符串或其他类数组对象上使用数组所提供的方法（如函数的 {{jsxref("Functions/arguments", "arguments", "", 1)}}）。此时你可以把一个字符串作为一个字符数组来看待（也就是说，把非数组以某种方式看成是一个数组）。比如，可以用下面的方法来检查变量 <code>str</code> 中的字符是否都是字母：</p> + +<pre class="brush: js">function isLetter(character) { + return character >= 'a' && character <= 'z'; +} + +if (Array.prototype.every.call(str, isLetter)) { + console.log("The string '" + str + "' contains only letters!"); +}</pre> + +<p>这种方法能够行得通，但不够简洁，JavaScript 1.6 中引入了一个泛型化的简写形式：</p> + +<pre class="brush: js">if (Array.every(str, isLetter)) { + console.log("The string '" + str + "' contains only letters!"); +}</pre> + +<p>{{jsxref("Global_Objects/String", "String")}} 对象也包含一些泛型方法，见： {{jsxref("Global_Objects/String", "Generics", "#String_generic_methods", 1)}}。</p> + +<p>注意，这些并不属于 ECMAScript 标准，也不能在非 Gecko 浏览器中使用。你可以用标准方法 {{jsxref("Array.from()")}} 来替代上面的写法， <code>from</code> 方法可以将一个对象转换为真正的数组（虽然老的浏览器可能不支持）：</p> + +<pre class="brush: js"><code>if (Array.from(str).every(isLetter)) { + console.log("The string '" + str + "' contains only letters!"); +}</code></pre> + +<h2 id="示例">示例</h2> + +<h3 id="创建数组">创建数组</h3> + +<p>下面这个例子创建了一个长度为 0 的数组 <code>msgArray</code>，然后给 <code>msgArray[0]</code> 和 <code>msgArray[99]</code> 赋值，从而导致数组长度变为了 100。</p> + +<pre class="brush: js">var msgArray = []; +msgArray[0] = 'Hello'; +msgArray[99] = 'world'; + +if (msgArray.length === 100) { + console.log('The length is 100.'); +}</pre> + +<h3 id="创建二维数组">创建二维数组</h3> + +<p>下面的例子创建了一个代表国际象棋棋盘的二维数组，然后将 (6, 4) 上的 Pawn （卒）拷贝到 (4, 4) 位置，而原本 (6, 4) 位置则被设置为空格。</p> + +<pre class="brush: js">var board = [ + ['R','N','B','Q','K','B','N','R'], + ['P','P','P','P','P','P','P','P'], + [' ',' ',' ',' ',' ',' ',' ',' '], + [' ',' ',' ',' ',' ',' ',' ',' '], + [' ',' ',' ',' ',' ',' ',' ',' '], + [' ',' ',' ',' ',' ',' ',' ',' '], + ['p','p','p','p','p','p','p','p'], + ['r','n','b','q','k','b','n','r'] ]; + +console.log(board.join('\n') + '\n\n'); + +// Move King's Pawn forward 2 +board[4][4] = board[6][4]; +board[6][4] = ' '; +console.log(board.join('\n')); +</pre> + +<p>下面是输出：</p> + +<pre class="brush: js">R,N,B,Q,K,B,N,R +P,P,P,P,P,P,P,P + , , , , , , , + , , , , , , , + , , , , , , , + , , , , , , , +p,p,p,p,p,p,p,p +r,n,b,q,k,b,n,r + +R,N,B,Q,K,B,N,R +P,P,P,P,P,P,P,P + , , , , , , , + , , , , , , , + , , , ,p, , , + , , , , , , , +p,p,p,p, ,p,p,p +r,n,b,q,k,b,n,r +</pre> + +<h3 id="用数组将一组值以表格形式显示">用数组将一组值以表格形式显示</h3> + +<pre class="brush: js"><code>values = []; +for (var x = 0; x < 10; x++){ + values.push([ + 2 ** x, + 2 * x ** 2 + ]) +}; +console.table(values)</code></pre> + +<p>结果为：</p> + +<pre><code>0 1 0 +1 2 2 +2 4 8 +3 8 18 +4 16 32 +5 32 50 +6 64 72 +7 128 98 +8 256 128 +9 512 162</code></pre> + +<p>（第一列为索引）</p> + +<h2 id="规范">规范</h2> + +<table class=" standard-table"> + <tbody> + <tr> + <th scope="col">规范</th> + <th scope="col">状态</th> + <th scope="col">说明</th> + </tr> + <tr> + <td>{{SpecName('ES1')}}</td> + <td>{{Spec2('ES1')}}</td> + <td>初始定义。</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.4', 'Array')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td>新增方法: {{jsxref("Array.isArray")}}, {{jsxref("Array.prototype.indexOf", "indexOf")}}, {{jsxref("Array.prototype.lastIndexOf", "lastIndexOf")}}, {{jsxref("Array.prototype.every", "every")}}, {{jsxref("Array.prototype.some", "some")}}, {{jsxref("Array.prototype.forEach", "forEach")}}, {{jsxref("Array.prototype.map", "map")}}, {{jsxref("Array.prototype.filter", "filter")}}, {{jsxref("Array.prototype.reduce", "reduce")}}, {{jsxref("Array.prototype.reduceRight", "reduceRight")}}</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-array-objects', 'Array')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> + <p>新增方法：{{jsxref("Array.from")}}, {{jsxref("Array.of")}}, {{jsxref("Array.prototype.find", "find")}}, {{jsxref("Array.prototype.findIndex", "findIndex")}}, {{jsxref("Array.prototype.fill", "fill")}}, {{jsxref("Array.prototype.copyWithin", "copyWithin")}}</p> + </td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-array-objects', 'Array')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> + <p>新增方法：{{jsxref("Array.prototype.includes()")}}</p> + </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div class="hidden">The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</div> + +<div>{{Compat("javascript.builtins.Array")}}</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li><a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Guide/Working_with_Objects#Indexing_object_properties">JavaScript Guide: “Indexing object properties”</a></li> + <li><a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Guide/Predefined_Core_Objects#Array_Object">JavaScript Guide: “Predefined Core Objects: <code>Array</code> Object”</a></li> + <li><a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Operators/Array_comprehensions">Array comprehensions</a></li> + <li><a href="https://github.com/plusdude/array-generics">Polyfill for JavaScript 1.8.5 Array Generics and ECMAScript 5 Array Extras</a></li> + <li><a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Typed_arrays">Typed Arrays</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/array/indexof/index.html b/files/zh-cn/web/javascript/reference/global_objects/array/indexof/index.html new file mode 100644 index 0000000000..c470a8b265 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/array/indexof/index.html @@ -0,0 +1,197 @@ +--- +title: Array.prototype.indexOf() +slug: Web/JavaScript/Reference/Global_Objects/Array/indexOf +tags: + - JavaScript + - polyfill + - 原型 + - 参考 + - 数组 + - 方法 +translation_of: Web/JavaScript/Reference/Global_Objects/Array/indexOf +--- +<div>{{JSRef}}</div> + +<p><code><strong>indexOf()</strong></code>方法返回在数组中可以找到一个给定元素的第一个索引，如果不存在，则返回-1。</p> + +<div>{{EmbedInteractiveExample("pages/js/array-indexof.html")}}</div> + +<div class="note"> +<p>注意：对于String方法，请参阅 {{jsxref("String.prototype.indexOf()")}}。</p> +</div> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre><var>arr</var>.indexOf(<var>searchElement</var>[, <var>fromIndex</var>])</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>searchElement</code></dt> + <dd>要查找的元素</dd> + <dt><code><var>fromIndex</var></code> {{optional_inline}}</dt> + <dd>开始查找的位置。如果该索引值大于或等于数组长度，意味着不会在数组里查找，返回-1。如果参数中提供的索引值是一个负值，则将其作为数组末尾的一个抵消，即-1表示从最后一个元素开始查找，-2表示从倒数第二个元素开始查找 ，以此类推。 注意：如果参数中提供的索引值是一个负值，并不改变其查找顺序，查找顺序仍然是从前向后查询数组。如果抵消后的索引值仍小于0，则整个数组都将会被查询。其默认值为0.</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>首个被找到的元素在数组中的索引位置; 若没有找到则返回 -1</p> + +<h2 id="描述">描述</h2> + +<p><code>indexOf</code> 使用<a href="/zh-CN/docs/Web/JavaScript/Reference/Operators/Comparison_Operators#Using_the_Equality_Operators">strict equality</a> (无论是 ===, 还是 triple-equals操作符都基于同样的方法)进行判断 <code>searchElement与</code>数组中包含的元素之间的关系。</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用indexOf">使用indexOf</h3> + +<p>以下例子使用<code>indexOf方法确定多个值在数组中的位置。</code></p> + +<pre class="brush: js">var array = [2, 5, 9]; +array.indexOf(2); // 0 +array.indexOf(7); // -1 +array.indexOf(9, 2); // 2 +array.indexOf(2, -1); // -1 +array.indexOf(2, -3); // 0 +</pre> + +<h3 id="找出指定元素出现的所有位置">找出指定元素出现的所有位置</h3> + +<pre class="brush: js">var indices = []; +var array = ['a', 'b', 'a', 'c', 'a', 'd']; +var element = 'a'; +var idx = array.indexOf(element); +while (idx != -1) { + indices.push(idx); + idx = array.indexOf(element, idx + 1); +} +console.log(indices); +// [0, 2, 4] +</pre> + +<h3 id="判断一个元素是否在数组里，不在则更新数组">判断一个元素是否在数组里，不在则更新数组</h3> + +<pre class="brush: js">function updateVegetablesCollection (veggies, veggie) { + if (veggies.indexOf(veggie) === -1) { + veggies.push(veggie); + console.log('New veggies collection is : ' + veggies); + } else if (veggies.indexOf(veggie) > -1) { + console.log(veggie + ' already exists in the veggies collection.'); + } +} + +var veggies = ['potato', 'tomato', 'chillies', 'green-pepper']; + +// New veggies collection is : potato,tomato,chillies,green-papper,spinach +updateVegetablesCollection(veggies, 'spinach'); +// spinach already exists in the veggies collection. +updateVegetablesCollection(veggies, 'spinach'); </pre> + +<h2 id="Polyfill">Polyfill</h2> + +<p><code>indexOf</code> 在ECMA-262 标准 的第5版中被加入，但并非所有的浏览器都支持该方法。你可以在编写scripts时，在其开头使用以下代码，它能够允许你在没有本地支持的情况下使用indexOf方法。该算法符合ECMA-262第5版其中一项规定, 即假定 {{jsxref("Global_Objects/TypeError", "TypeError")}}和 {{jsxref("Math.abs")}} 呈现它们原有的值。</p> + +<pre class="brush: js">// Production steps of ECMA-262, Edition 5, 15.4.4.14 +// Reference: http://es5.github.io/#x15.4.4.14 +if (!Array.prototype.indexOf) { + Array.prototype.indexOf = function(searchElement, fromIndex) { + + var k; + + // 1. Let O be the result of calling ToObject passing + // the this value as the argument. + if (this == null) { + throw new TypeError('"this" is null or not defined'); + } + + var O = Object(this); + + // 2. Let lenValue be the result of calling the Get + // internal method of O with the argument "length". + // 3. Let len be ToUint32(lenValue). + var len = O.length >>> 0; + + // 4. If len is 0, return -1. + if (len === 0) { + return -1; + } + + // 5. If argument fromIndex was passed let n be + // ToInteger(fromIndex); else let n be 0. + var n = +fromIndex || 0; + + if (Math.abs(n) === Infinity) { + n = 0; + } + + // 6. If n >= len, return -1. + if (n >= len) { + return -1; + } + + // 7. If n >= 0, then Let k be n. + // 8. Else, n<0, Let k be len - abs(n). + // If k is less than 0, then let k be 0. + k = Math.max(n >= 0 ? n : len - Math.abs(n), 0); + + // 9. Repeat, while k < len + while (k < len) { + // a. Let Pk be ToString(k). + // This is implicit for LHS operands of the in operator + // b. Let kPresent be the result of calling the + // HasProperty internal method of O with argument Pk. + // This step can be combined with c + // c. If kPresent is true, then + // i. Let elementK be the result of calling the Get + // internal method of O with the argument ToString(k). + // ii. Let same be the result of applying the + // Strict Equality Comparison Algorithm to + // searchElement and elementK. + // iii. If same is true, return k. + if (k in O && O[k] === searchElement) { + return k; + } + k++; + } + return -1; + }; +} +</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('ES5.1', '#sec-15.4.4.14', 'Array.prototype.indexOf')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td>Initial definition.<br> + Implemented in JavaScript 1.6</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-array.prototype.indexof', 'Array.prototype.indexOf')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> + + +<p>{{Compat("javascript.builtins.Array.indexOf")}}</p> +</div> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("Array.prototype.lastIndexOf()")}}</li> + <li>{{jsxref("TypedArray.prototype.indexOf()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/array/isarray/index.html b/files/zh-cn/web/javascript/reference/global_objects/array/isarray/index.html new file mode 100644 index 0000000000..817312bc5c --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/array/isarray/index.html @@ -0,0 +1,140 @@ +--- +title: Array.isArray() +slug: Web/JavaScript/Reference/Global_Objects/Array/isArray +tags: + - ECMAScript5 + - JavaScript + - 'brush: js' + - class= + - polyfill + - 数组 + - 方法 +translation_of: Web/JavaScript/Reference/Global_Objects/Array/isArray +--- +<div>{{JSRef}}</div> + +<p><strong>Array.isArray() </strong>用于确定传递的值是否是一个 {{jsxref("Array")}}。</p> + +<pre class="brush: js">Array.isArray([1, 2, 3]); +// true +Array.isArray({foo: 123}); +// false +Array.isArray("foobar"); +// false +Array.isArray(undefined); +// false +</pre> + +<h2 id="语法">语法</h2> + +<pre>Array.isArray(<var>obj</var>)</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>obj</code></dt> + <dd>需要检测的值。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>如果值是 {{jsxref("Array")}}，则为true; 否则为false。</p> + +<h2 id="描述">描述</h2> + +<p>如果对象是 {{jsxref("Array")}} ，则返回true，否则为false。</p> + +<p>有关更多详细信息，请参阅文章<a href="http://web.mit.edu/jwalden/www/isArray.html">严格判定JavaScript对象是否为数组</a>。</p> + +<p>See the article <a href="http://web.mit.edu/jwalden/www/isArray.html">“Determining with absolute accuracy whether or not a JavaScript object is an array”</a> for more details. Given a {{jsxref("TypedArray")}} instance, <code>false</code> is always returned.</p> + +<h2 id="示例">示例</h2> + +<pre class="brush: js">// 下面的函数调用都返回 true +Array.isArray([]); +Array.isArray([1]); +Array.isArray(new Array()); +Array.isArray(new Array('a', 'b', 'c', 'd')) +// 鲜为人知的事实：其实 Array.prototype 也是一个数组。 +Array.isArray(Array.prototype); + +// 下面的函数调用都返回 false +Array.isArray(); +Array.isArray({}); +Array.isArray(null); +Array.isArray(undefined); +Array.isArray(17); +Array.isArray('Array'); +Array.isArray(true); +Array.isArray(false); +Array.isArray(new Uint8Array(32)) +Array.isArray({ __proto__: Array.prototype }); +</pre> + +<h3 id="instanceof_和_isArray"><code>instanceof</code> 和 <code>isArray</code></h3> + +<p>当检测Array实例时, <code>Array.isArray</code> 优于 <code>instanceof</code>,因为Array.isArray能检测<code>iframes</code>.</p> + +<pre><code>var iframe = document.createElement('iframe'); +document.body.appendChild(iframe); +xArray = window.frames[window.frames.length-1].Array; +var arr = new xArray(1,2,3); // [1,2,3] + +// Correctly checking for Array +Array.isArray(arr); // true +// Considered harmful, because doesn't work though iframes +arr instanceof Array; // false</code></pre> + +<h2 id="Polyfill">Polyfill</h2> + +<p>假如不存在 Array.isArray()，则在其他代码之前运行下面的代码将创建该方法。</p> + +<pre class="brush: js">if (!Array.isArray) { + Array.isArray = function(arg) { + return Object.prototype.toString.call(arg) === '[object Array]'; + }; +} +</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('ES5.1', '#sec-15.4.3.2', 'Array.isArray')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td>Initial definition. Implemented in JavaScript 1.8.5.</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-array.isarray', 'Array.isArray')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-array.isarray', 'Array.isArray')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> +<div> + + +<p>{{Compat("javascript.builtins.Array.isArray")}}</p> +</div> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Array")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/array/join/index.html b/files/zh-cn/web/javascript/reference/global_objects/array/join/index.html new file mode 100644 index 0000000000..c40b87ebed --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/array/join/index.html @@ -0,0 +1,111 @@ +--- +title: Array.prototype.join() +slug: Web/JavaScript/Reference/Global_Objects/Array/join +tags: + - Array + - Array.prototype.join() + - join() + - separator +translation_of: Web/JavaScript/Reference/Global_Objects/Array/join +--- +<div>{{JSRef}}</div> + +<p><code><strong>join()</strong></code> 方法将一个数组（或一个<a href="/zh-CN//docs/Web/JavaScript/Guide/Indexed_collections#Working_with_array-like_objects">类数组对象</a>）的所有元素连接成一个字符串并返回这个字符串。如果数组只有一个项目，那么将返回该项目而不使用分隔符。</p> + +<div>{{EmbedInteractiveExample("pages/js/array-join.html")}}</div> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre><var>arr</var>.join([<var>separator</var>])</pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>separator</code> {{optional_inline}}</dt> + <dd>指定一个字符串来分隔数组的每个元素。如果需要，将分隔符转换为字符串。如果缺省该值，数组元素用逗号（<code>,</code>）分隔。如果<code>separator</code>是空字符串(<code>""</code>)，则所有元素之间都没有任何字符。</dd> + <dt> + <h3 id="返回值">返回值</h3> + </dt> + <dd>一个所有数组元素连接的字符串。如果 <code>arr.length</code><strong> </strong>为0，则返回空字符串。</dd> +</dl> + +<h2 id="Description" name="Description">描述</h2> + +<p>所有的数组元素被转换成字符串，再用一个分隔符将这些字符串连接起来。</p> + +<div class="blockIndicator warning"> +<p>如果一个元素为 <code>undefined</code> 或 <code>null</code>，它会被转换为空字符串。</p> +</div> + +<h2 id="Examples" name="Examples">示例</h2> + +<h3 id="Example_Joining_an_array_three_different_ways" name="Example:_Joining_an_array_three_different_ways">使用四种不同的分隔符连接数组元素</h3> + +<p>下例首先创建了一个数组 <code>a</code>，包含有三个元素，然后用四种不同的分隔符连接所有数组元素。首先是默认的分隔符逗号，然后是一个逗号加空格，接下来是一个加号前后加空格，最后是一个空字符串。</p> + +<pre class="brush: js">var a = ['Wind', 'Rain', 'Fire']; +var myVar1 = a.join(); // myVar1的值变为"Wind,Rain,Fire" +var myVar2 = a.join(', '); // myVar2的值变为"Wind, Rain, Fire" +var myVar3 = a.join(' + '); // myVar3的值变为"Wind + Rain + Fire" +var myVar4 = a.join(''); // myVar4的值变为"WindRainFire" +</pre> + +<h3 id="连接类数组对象">连接类数组对象</h3> + +<p>下面的示例将连接类数组对象（arguments），通过在<code>Array.prototype.join</code>上调用{{jsxref("Function.prototype.call")}}。</p> + +<pre class="brush: js"><code>function f(a, b, c) { + var s = Array.prototype.join.call(arguments); + console.log(s); // '1,a,true' +} +f(1, 'a', true);</code></pre> + +<h2 id="Specifications" name="Specifications">规范</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('ES1')}}</td> + <td>{{Spec2('ES1')}}</td> + <td>Initial definition. Implemented in JavaScript 1.1.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.4.4.5', 'Array.prototype.join')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-array.prototype.join', 'Array.prototype.join')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-array.prototype.join', 'Array.prototype.join')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">浏览器兼容性</h2> + +<div> +<div> + + +<p>{{Compat("javascript.builtins.Array.join")}}</p> +</div> +</div> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("String.prototype.split()")}}</li> + <li>{{jsxref("Array.prototype.toString()")}}</li> + <li>{{jsxref("TypedArray.prototype.join()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/array/keys/index.html b/files/zh-cn/web/javascript/reference/global_objects/array/keys/index.html new file mode 100644 index 0000000000..6da9228ed2 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/array/keys/index.html @@ -0,0 +1,77 @@ +--- +title: Array.prototype.keys() +slug: Web/JavaScript/Reference/Global_Objects/Array/keys +tags: + - Array + - ECMAScript 2015 + - Iterator + - JavaScript + - Method + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Array/keys +--- +<div>{{JSRef}}</div> + +<p> <code><strong>keys() </strong></code>方法返回一个包含数组中每个索引键的<code><strong>Array Iterator</strong></code>对象。</p> + +<div>{{EmbedInteractiveExample("pages/js/array-keys.html")}}</div> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code><var>arr</var>.keys()</code> +</pre> + +<h3 id="返回值">返回值 </h3> + +<p>一个新的 {{jsxref("Array")}} 迭代器对象。</p> + +<h2 id="Examples" name="Examples">示例</h2> + +<h3 id="索引迭代器会包含那些没有对应元素的索引">索引迭代器会包含那些没有对应元素的索引</h3> + +<pre class="brush: js">var arr = ["a", , "c"]; +var sparseKeys = Object.keys(arr); +var denseKeys = [...arr.keys()]; +console.log(sparseKeys); // ['0', '2'] +console.log(denseKeys); // [0, 1, 2] +</pre> + +<h2 id="Specifications" name="Specifications">规范</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-array.prototype.keys', 'Array.prototype.keys')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-array.prototype.keys', 'Array.prototype.keys')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">浏览器兼容性</h2> + +<div> +<div> + + +<p>{{Compat("javascript.builtins.Array.keys")}}</p> +</div> +</div> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("Array.prototype.values()")}}</li> + <li>{{jsxref("Array.prototype.entries()")}}</li> + <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Iteration_protocols">Iteration protocols</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/array/lastindexof/index.html b/files/zh-cn/web/javascript/reference/global_objects/array/lastindexof/index.html new file mode 100644 index 0000000000..51cf89a71f --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/array/lastindexof/index.html @@ -0,0 +1,176 @@ +--- +title: Array.prototype.lastIndexOf() +slug: Web/JavaScript/Reference/Global_Objects/Array/lastIndexOf +translation_of: Web/JavaScript/Reference/Global_Objects/Array/lastIndexOf +--- +<div>{{JSRef("Global_Objects", "Array")}}</div> + +<h2 id="Summary" name="Summary">概述</h2> + +<p><code><strong>lastIndexOf()</strong></code> 方法返回指定元素（也即有效的 JavaScript 值或变量）在数组中的最后一个的索引，如果不存在则返回 -1。从数组的后面向前查找，从 <code>fromIndex</code> 处开始。</p> + +<div>{{EmbedInteractiveExample("pages/js/array-lastindexof.html")}}</div> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre><var>arr</var>.lastIndexOf(<var>searchElement[</var>, <var>fromIndex]</var>)</pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>searchElement</code></dt> + <dd>被查找的元素。</dd> + <dt><code>fromIndex</code> {{optional_inline}}</dt> + <dd>从此位置开始逆向查找。默认为数组的长度减 1(<code>arr.length - 1</code>)，即整个数组都被查找。如果该值大于或等于数组的长度，则整个数组会被查找。如果为负值，将其视为从数组末尾向前的偏移。即使该值为负，数组仍然会被从后向前查找。如果该值为负时，其绝对值大于数组长度，则方法返回 -1，即数组不会被查找。</dd> + <dd> + <h3 id="返回值">返回值</h3> + + <p>数组中该元素最后一次出现的索引，如未找到返回-1。</p> + </dd> +</dl> + +<h2 id="Description" name="Description">描述</h2> + +<p><code>lastIndexOf</code> 使用<a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Operators/Comparison_Operators#Using_the_Equality_Operators">严格相等</a>（strict equality，即 ===）比较 <code>searchElement</code> 和数组中的元素。</p> + +<h2 id="Examples" name="Examples">示例</h2> + +<h3 id="Example_Using_lastIndexOf" name="Example:_Using_lastIndexOf">例子：使用 lastIndexOf</h3> + +<p>下例使用 <code>lastIndexOf</code> 定位数组中的值。</p> + +<pre class="brush: js">var array = [2, 5, 9, 2]; +var index = array.lastIndexOf(2); +// index is 3 +index = array.lastIndexOf(7); +// index is -1 +index = array.lastIndexOf(2, 3); +// index is 3 +index = array.lastIndexOf(2, 2); +// index is 0 +index = array.lastIndexOf(2, -2); +// index is 0 +index = array.lastIndexOf(2, -1); +// index is 3 +</pre> + +<h3 id="Example_Finding_all_the_occurrences_of_an_element" name="Example:_Finding_all_the_occurrences_of_an_element">例子：查找所有元素</h3> + +<p>下例使用 <code>lastIndexOf</code> 查找到一个元素在数组中所有的索引（下标），并使用 {{jsxref("Array.push", "push")}} 将所有添加到另一个数组中。</p> + +<pre class="brush: js">var indices = []; +var array = ['a', 'b', 'a', 'c', 'a', 'd']; +var element = 'a'; +var idx = array.lastIndexOf(element); + +while (idx != -1) { + indices.push(idx); + idx = (idx > 0 ? array.lastIndexOf(element, idx - 1) : -1); +} + +console.log(indices); +// [4, 2, 0]; + +</pre> + +<p>注意，我们要单独处理<code>idx==0</code>时的情况，因为如果是第一个元素，忽略了<code>fromIndex</code>参数则第一个元素总会被查找。这不同于{{jsxref("Array.prototype.indexOf", "indexOf")}}方法</p> + +<p>注：原英文是针对使用三元操作符语句的作用进行说明的：<br> + <code>idx = (idx > 0 ? array.lastIndexOf(element, idx - 1) : -1);</code><br> + <code>idx > 0</code>时，才进入lastIndexOf由后往前移一位进行倒查找；如果<code>idx == 0</code>则直接设置<code>idx = -1</code>，循环<code>while (idx != -1)</code>就结束了。<br> + </p> + +<h2 id="Compatibility" name="Compatibility">兼容旧环境（Polyfill）</h2> + +<p><code>lastIndexOf</code> 在 ECMA-262 标准第 5 版被添加。因此它在不兼容该标准的浏览器中可能不被支持。你可以把下面代码添加到脚本中来使那些没有实现该方法的实现环境支持该方法。该算法是被 ECMA-262 第 5 版指定的。假定 {{jsxref("Global_Objects/Object", "Object")}}、{{jsxref("Global_Objects/TypeError", "TypeError")}}、{{jsxref("Global_Objects/Number", "Number")}}、{{jsxref("Math.floor")}}、{{jsxref("Math.abs")}}，以及 {{jsxref("Math.min")}} 拥有其初始值。</p> + +<pre class="brush: js">if (!Array.prototype.lastIndexOf) { + Array.prototype.lastIndexOf = function(searchElement /*, fromIndex*/) { + 'use strict'; + + if (this === void 0 || this === null) { + throw new TypeError(); + } + + var n, k, + t = Object(this), + len = t.length >>> 0; + if (len === 0) { + return -1; + } + + n = len - 1; + if (arguments.length > 1) { + n = Number(arguments[1]); + if (n != n) { + n = 0; + } + else if (n != 0 && n != (1 / 0) && n != -(1 / 0)) { + n = (n > 0 || -1) * Math.floor(Math.abs(n)); + } + } + + for (k = n >= 0 + ? Math.min(n, len - 1) + : len - Math.abs(n); k >= 0; k--) { + if (k in t && t[k] === searchElement) { + return k; + } + } + return -1; + }; +} + +</pre> + +<p>另外，该实现是为了绝对兼容 Firefox 和 the SpiderMonkey JavaScript 引擎中的 <code>lastIndexOf</code>，包括了几种临界情况。如果你要在实际应用中使用该实现，可以忽略这些临界情况，从而简化 <code>fromIndex</code> 的计算。</p> + +<h2 id="Specifications">Specifications</h2> + +<table> + <tbody> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.4.4.15', 'Array.prototype.lastIndexOf')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td>Initial definition. Implemented in JavaScript 1.6.</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-array.prototype.lastindexof', 'Array.prototype.lastIndexOf')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-array.prototype.lastindexof', 'Array.prototype.lastIndexOf')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<table class="standard-table"> + <tbody> + <tr> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> + + +<p>{{Compat("javascript.builtins.Array.lastIndexOf")}}</p> +</div> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("Array.prototype.indexOf()")}}</li> + <li>{{jsxref("TypedArray.prototype.lastIndexOf()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/array/length/index.html b/files/zh-cn/web/javascript/reference/global_objects/array/length/index.html new file mode 100644 index 0000000000..7b126495fb --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/array/length/index.html @@ -0,0 +1,149 @@ +--- +title: Array.length +slug: Web/JavaScript/Reference/Global_Objects/Array/length +tags: + - JavaScript + - 参考 + - 属性 + - 数组 +translation_of: Web/JavaScript/Reference/Global_Objects/Array/length +--- +<p>{{JSRef}}</p> + +<p><code><strong>length</strong></code> 是<code>Array</code>的实例属性。返回或设置一个数组中的元素个数。该值是一个无符号 32-bit 整数，并且总是大于数组最高项的下标。</p> + +<div>{{EmbedInteractiveExample("pages/js/array-length.html")}}</div> + +<h2 id="Description" name="Description">描述</h2> + +<p><code>length</code> 属性的值是一个 0 到 2<sup>32</sup>-1 的整数。</p> + +<pre class="brush: js">var namelistA = new Array(4294967296); // 2的32次方 = 4294967296 +var namelistC = new Array(-100) // 负号 + +console.log(namelistA.length); // RangeError: 无效数组长度 +console.log(namelistC.length); // RangeError: 无效数组长度 + + + +var namelistB = []; +namelistB.length = Math.pow(2,32)-1; //set array length less than 2 to the 32nd power +console.log(namelistB.length); + +// 4294967295 +</pre> + +<p>你可以设置 <code>length</code> 属性的值来截断任何数组。当通过改变<code>length</code>属性值来扩展数组时，实际元素的数目将会增加。例如：将一个拥有 2 个元素的数组的 <code>length</code> 属性值设为 3 时，那么这个数组将会包含3个元素，并且，第三个元素的值将会是 <code>undefined</code> 。</p> + +<pre><code>var arr = [1, 2, 3]; +printEntries(arr); + +arr.length = 5; // set array length to 5 while currently 3. +printEntries(arr); + +function printEntries(arr) { + var goNext = true; + var entries = arr.entries(); + while (goNext) { + var result = entries.next(); + if (result.done !== true) { + console.log(result.value[1]); + goNext = true; + } else + goNext = false; + } + console.log('=== printed ==='); +} + +// 1 +// 2 +// 3 +// === printed === +// 1 +// 2 +// 3 +// undefined +// undefined +// === printed ===</code></pre> + +<p>但是， <code>length</code> 属性不一定表示数组中定义值的个数。了解更多：<a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array#Relationship_between_length_and_numerical_properties">长度与数值下标属性之间的关系</a>。</p> + +<p>{{js_property_attributes(1, 0, 0)}}</p> + +<ul> + <li><code>Writable</code> ：如果设置为<code>false</code>，该属性值将不能被修改。</li> + <li><code>Configurable</code> ：如果设置为<code>false</code>，删除或更改任何属性都将会失败。</li> + <li><code>Enumerable</code> ：如果设置为 <code>true</code> ，属性可以通过迭代器<a href="zh-CN/docs/Web/JavaScript/Reference/Statements/for">for</a>或<a href="/zh-CN/docs/Web/JavaScript/Reference/Statements/for...in">for...in</a>进行迭代。</li> +</ul> + +<h2 id="Examples" name="Examples">示例 </h2> + +<h3 id="Example:_Iterating_over_an_array" name="Example:_Iterating_over_an_array">遍历数组</h3> + +<p>下面的例子中，通过数组下标遍历数组元素，并把每个元素的值修改为原值的2倍。</p> + +<pre class="brush: js line-numbers language-js"><code class="language-js"><span class="keyword token">var</span> numbers <span class="operator token">=</span> <span class="punctuation token">[</span><span class="number token">1</span><span class="punctuation token">,</span> <span class="number token">2</span><span class="punctuation token">,</span> <span class="number token">3</span><span class="punctuation token">,</span> <span class="number token">4</span><span class="punctuation token">,</span> <span class="number token">5</span><span class="punctuation token">]</span><span class="punctuation token">;</span> +<span class="keyword token">var</span> length <span class="operator token">=</span> numbers<span class="punctuation token">.</span>length<span class="punctuation token">;</span> +<span class="keyword token">for</span> <span class="punctuation token">(</span><span class="keyword token">var</span> i <span class="operator token">=</span> <span class="number token">0</span><span class="punctuation token">;</span> i <span class="operator token"><</span> length<span class="punctuation token">;</span> i<span class="operator token">++</span><span class="punctuation token">)</span> <span class="punctuation token">{</span> + numbers<span class="punctuation token">[</span>i<span class="punctuation token">]</span> <span class="operator token">*</span><span class="operator token">=</span> <span class="number token">2</span><span class="punctuation token">;</span> +<span class="punctuation token">}</span> +<span class="comment token">// 遍历后的结果 [2, 4, 6, 8, 10]</span></code></pre> + +<h3 id="Example:_Shortening_an_array" name="Example:_Shortening_an_array">截断数组</h3> + +<p>下面的例子中，如果数组长度大于 3，则把该数组的长度截断为 3 。</p> + +<pre class="brush: js line-numbers language-js"><code class="language-js"><span class="keyword token">var</span> numbers <span class="operator token">=</span> <span class="punctuation token">[</span><span class="number token">1</span><span class="punctuation token">,</span> <span class="number token">2</span><span class="punctuation token">,</span> <span class="number token">3</span><span class="punctuation token">,</span> <span class="number token">4</span><span class="punctuation token">,</span> <span class="number token">5</span><span class="punctuation token">]</span><span class="punctuation token">;</span> + +<span class="keyword token">if</span> <span class="punctuation token">(</span>numbers<span class="punctuation token">.</span>length <span class="operator token">></span> <span class="number token">3</span><span class="punctuation token">)</span> <span class="punctuation token">{</span> + numbers<span class="punctuation token">.</span>length <span class="operator token">=</span> <span class="number token">3</span><span class="punctuation token">;</span> +<span class="punctuation token">}</span> + +console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>numbers<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// [1, 2, 3]</span> +console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>numbers<span class="punctuation token">.</span>length<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// 3</span></code></pre> + +<h2 id="规范">规范</h2> + +<table> + <tbody> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + <tr> + <td>{{SpecName('ES1')}}</td> + <td>{{Spec2('ES1')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.4.5.2', 'Array.length')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-properties-of-array-instances-length', 'Array.length')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-properties-of-array-instances-length', 'Array.length')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> + + +<p>{{Compat("javascript.builtins.Array.length")}}</p> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Array")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/array/map/index.html b/files/zh-cn/web/javascript/reference/global_objects/array/map/index.html new file mode 100644 index 0000000000..b00ce5df07 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/array/map/index.html @@ -0,0 +1,343 @@ +--- +title: Array.prototype.map() +slug: Web/JavaScript/Reference/Global_Objects/Array/map +tags: + - Array + - ECMAScript5 + - JavaScript + - Method + - Prototype + - polyfill +translation_of: Web/JavaScript/Reference/Global_Objects/Array/map +--- +<div>{{JSRef}}</div> + +<p><code><strong>map()</strong></code> 方法创建一个新数组，其结果是该数组中的每个元素是调用一次提供的函数后的返回值。</p> + +<div>{{EmbedInteractiveExample("pages/js/array-map.html")}}</div> + + + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="notranslate"><var>var new_array = arr</var>.map(function <var>callback(currentValue[, index[, array]]) { + // Return element for new_array </var> +<var>}</var>[, <var>thisArg</var>])</pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>callback</code></dt> + <dd>生成新数组元素的函数，使用三个参数： + <dl> + <dt><code>currentValue</code></dt> + <dd><code>callback</code> 数组中正在处理的当前元素。</dd> + <dt><code>index</code>{{optional_inline}}</dt> + <dd><code>callback</code> 数组中正在处理的当前元素的索引。</dd> + <dt><code>array</code>{{optional_inline}}</dt> + <dd><code>map</code> 方法调用的数组。</dd> + </dl> + </dd> + <dt><code>thisArg</code>{{optional_inline}}</dt> + <dd>执行 <code>callback</code> 函数时值被用作<code>this</code>。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>一个由原数组每个元素执行回调函数的结果组成的新数组。</p> + +<h2 id="Description" name="Description">描述</h2> + +<p><code>map</code> 方法会给原数组中的每个元素都按顺序调用一次 <code>callback</code> 函数。<code>callback</code> 每次执行后的返回值（包括 {{jsxref("undefined")}}）组合起来形成一个新数组。 <code>callback</code> 函数只会在有值的索引上被调用；那些从来没被赋过值或者使用 <code>delete</code> 删除的索引则不会被调用。</p> + +<p>因为<code>map</code>生成一个新数组，当你不打算使用返回的新数组却使用<code>map</code>是违背设计初衷的，请用<code><a href="/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach">forEach</a></code>或者<code><a href="/zh-CN/docs/Web/JavaScript/Reference/Statements/for...of">for-of</a></code>替代。你不该使用<code>map</code>: A)你不打算使用返回的新数组，或/且 B) 你没有从回调函数中返回值。</p> + +<p><code>callback</code> 函数会被自动传入三个参数：数组元素，元素索引，原数组本身。</p> + +<p>如果 <code>thisArg</code> 参数提供给<code>map</code>，则会被用作回调函数的<code>this</code>值。否则{{jsxref("undefined")}}会被用作回调函数的<code>this</code>值。<code>this</code>的值最终相对于<code>callback</code>函数的可观察性是依据<a href="/en-US/docs/Web/JavaScript/Reference/Operators/this">the usual rules for determining the this seen by a function</a>决定的</p> + +<p><code>map </code>不修改调用它的原数组本身（当然可以在 <code>callback</code> 执行时改变原数组）</p> + +<p><code>map</code> 方法处理数组元素的范围是在 <code>callback</code> 方法第一次调用之前就已经确定了。调用<code>map</code>方法之后追加的数组元素不会被<code>callback</code>访问。如果存在的数组元素改变了，那么传给<code>callback</code>的值是<code>map</code>访问该元素时的值。在<code>map</code>函数调用后但在访问该元素前，该元素被删除的话，则无法被访问到。</p> + +<p>根据规范中定义的算法，如果被map调用的数组是离散的，新数组将也是离散的保持相同的索引为空。</p> + +<h2 id="Examples" name="Examples">示例</h2> + +<h3 id="Example_Mapping_an_array_of_numbers_to_an_array_of_square_roots" name="Example:_Mapping_an_array_of_numbers_to_an_array_of_square_roots">求数组中每个元素的平方根</h3> + +<p>下面的代码创建了一个新数组，值为原数组中对应数字的平方根。</p> + +<pre class="brush: js notranslate">var numbers = [1, 4, 9]; +var roots = numbers.map(Math.sqrt); +// roots的值为[1, 2, 3], numbers的值仍为[1, 4, 9]</pre> + +<h3 id="使用_map_重新格式化数组中的对象">使用 map 重新格式化数组中的对象</h3> + +<p>以下代码使用一个包含对象的数组来重新创建一个格式化后的数组。</p> + +<pre class="brush: js notranslate">var kvArray = [{key: 1, value: 10}, + {key: 2, value: 20}, + {key: 3, value: 30}]; + +var reformattedArray = kvArray.map(function(obj) { + var rObj = {}; + rObj[obj.key] = obj.value; + return rObj; +}); + +// reformattedArray 数组为： [{1: 10}, {2: 20}, {3: 30}], + +// kvArray 数组未被修改: +// [{key: 1, value: 10}, +// {key: 2, value: 20}, +// {key: 3, value: 30}] +</pre> + +<h3 id="Example_Pluralizing_the_words_.28strings.29_in_an_array" name="Example:_Pluralizing_the_words_.28strings.29_in_an_array">使用一个包含一个参数的函数来mapping(构建)一个数字数组</h3> + +<p>下面的代码表示了当函数需要一个参数时map的工作方式。当map循环遍历原始数组时，这个参数会自动被分配成数组中对应的每个元素。</p> + +<pre class="brush: js notranslate">var numbers = [1, 4, 9]; +var doubles = numbers.map(function(num) { + return num * 2; +}); + +// doubles数组的值为： [2, 8, 18] +// numbers数组未被修改： [1, 4, 9]</pre> + +<h3 id="Example_using_map_generically" name="Example:_using_map_generically">一般的<code>map</code> 方法</h3> + +<p>下面的例子演示如何在一个 {{jsxref("String")}} 上使用 map 方法获取字符串中每个字符所对应的 ASCII 码组成的数组：</p> + +<pre class="brush: js notranslate">var map = Array.prototype.map +var a = map.call("Hello World", function(x) { + return x.charCodeAt(0); +}) +// a的值为[72, 101, 108, 108, 111, 32, 87, 111, 114, 108, 100] +</pre> + +<h3 id="querySelectorAll_应用"><code>querySelectorAll 应用</code></h3> + +<p>下面代码展示了如何去遍历用 <code>querySelectorAll </code>得到的动态对象集合。在这里，我们获得了文档里所有选中的选项，并将其打印：</p> + +<pre class="brush: js notranslate">var elems = document.querySelectorAll('select option:checked'); +var values = Array.prototype.map.call(elems, function(obj) { + return obj.value; +}); +</pre> + +<h3 id="使用技巧案例">使用技巧案例</h3> + +<p><a class="external" href="http://www.wirfs-brock.com/allzh-cn/posts/166">(原文地址)</a></p> + +<p>通常情况下，<code>map</code> 方法中的 <code>callback</code> 函数只需要接受一个参数，就是正在被遍历的数组元素本身。但这并不意味着 <code>map</code> 只给 <code>callback</code> 传了一个参数。这个思维惯性可能会让我们犯一个很容易犯的错误。</p> + +<p>考虑下例：</p> + +<pre class="notranslate"><code>["1", "2", "3"].map(parseInt);</code></pre> + +<p>我们期望输出 <code>[1, 2, 3]</code>, 而实际结果是 <code>[1, NaN, NaN]</code>.</p> + +<p>parseInt 经常被带着一个参数使用, 但是这里接受两个。第一个参数是一个表达式而第二个是callback function的基, <code>Array.prototype.map</code> 传递3个参数:</p> + +<ul> + <li>the element</li> + <li>the index</li> + <li>the array</li> +</ul> + +<p>第三个参数被parseInt忽视了, <u>but not the second one</u>, 但不是第二个。因此可能出现混淆。下面是迭代步骤的简明示例：</p> + +<pre class="notranslate"><code>// parseInt(string, radix) -> map(parseInt(value, index)) +/* first iteration (index is 0): */ parseInt("1", 0); // 1 +/* second iteration (index is 1): */ parseInt("2", 1); // NaN +/* third iteration (index is 2): */ parseInt("3", 2); // NaN</code></pre> + +<p>下面让我们来讨论解决方案：</p> + +<pre class="notranslate"><code>function returnInt(element) { + return parseInt(element, 10); +} + +['1', '2', '3'].map(returnInt); // [1, 2, 3] +// Actual result is an array of numbers (as expected) + +// Same as above, but using the concise arrow function syntax +['1', '2', '3'].map( str => parseInt(str) ); + +// A simpler way to achieve the above, while avoiding the "gotcha": +['1', '2', '3'].map(Number); // [1, 2, 3] + +// But unlike parseInt(), Number() will also return a float or (resolved) exponential notation: +['1.1', '2.2e2', '3e300'].map(Number); // [1.1, 220, 3e+300] +// For comparison, if we use parseInt() on the array above: +['1.1', '2.2e2', '3e300'].map( str => parseInt(str) ); // [1, 2, 3]</code></pre> + +<p>一个map方法调用 parseInt 作为一个参数的等效输出运行如下:</p> + +<pre class="notranslate"><code>var xs = ['10', '10', '10']; + +xs = xs.map(parseInt); + +console.log(xs); // 输出结果为</code>(3) [10, NaN, 2]<code> +// Actual result of 10,NaN,2 may be unexpected based on the above description.</code></pre> + +<h3 id="Mapping_含_undefined的数组">Mapping 含 undefined的数组</h3> + +<p>当返回undefined 或没有返回任何内容时:</p> + +<pre class="notranslate"><code>var numbers = [1, 2, 3, 4]; +var filteredNumbers = numbers.map(function(num, index) { + if(index < 3) { + return num; + } +}); +//index goes from 0,so the filterNumbers are 1,2,3 and undefined. +// filteredNumbers is [1, 2, 3, undefined] +// numbers is still [1, 2, 3, 4]</code></pre> + +<h2 id="Polyfill">Polyfill</h2> + +<p><code>map</code> was added to the ECMA-262 standard in the 5th edition; as such it may not be present in all implementations of the standard. You can work around this by inserting the following code at the beginning of your scripts, allowing use of <code>map</code> in implementations which do not natively support it. This algorithm is exactly the one specified in ECMA-262, 5th edition, assuming {{jsxref("Object")}}, {{jsxref("TypeError")}}, and {{jsxref("Array")}} have their original values and that <code>callback.call</code> evaluates to the original value of <code>{{jsxref("Function.prototype.call")}}</code>.</p> + +<pre class="notranslate"><code>// Production steps of ECMA-262, Edition 5, 15.4.4.19 +// Reference: http://es5.github.io/#x15.4.4.19 +if (!Array.prototype.map) { + + Array.prototype.map = function(callback/*, thisArg*/) { + + var T, A, k; + + if (this == null) { + throw new TypeError('this is null or not defined'); + } + + // 1. Let O be the result of calling ToObject passing the |this| + // value as the argument. + var O = Object(this); + + // 2. Let lenValue be the result of calling the Get internal + // method of O with the argument "length". + // 3. Let len be ToUint32(lenValue). + var len = O.length >>> 0; + + // 4. If IsCallable(callback) is false, throw a TypeError exception. + // See: http://es5.github.com/#x9.11 + if (typeof callback !== 'function') { + throw new TypeError(callback + ' is not a function'); + } + + // 5. If thisArg was supplied, let T be thisArg; else let T be undefined. + if (arguments.length > 1) { + T = arguments[1]; + } + + // 6. Let A be a new array created as if by the expression new Array(len) + // where Array is the standard built-in constructor with that name and + // len is the value of len. + A = new Array(len); + + // 7. Let k be 0 + k = 0; + + // 8. Repeat, while k < len + while (k < len) { + + var kValue, mappedValue; + + // a. Let Pk be ToString(k). + // This is implicit for LHS operands of the in operator + // b. Let kPresent be the result of calling the HasProperty internal + // method of O with argument Pk. + // This step can be combined with c + // c. If kPresent is true, then + if (k in O) { + + // i. Let kValue be the result of calling the Get internal + // method of O with argument Pk. + kValue = O[k]; + + // ii. Let mappedValue be the result of calling the Call internal + // method of callback with T as the this value and argument + // list containing kValue, k, and O. + mappedValue = callback.call(T, kValue, k, O); + + // iii. Call the DefineOwnProperty internal method of A with arguments + // Pk, Property Descriptor + // { Value: mappedValue, + // Writable: true, + // Enumerable: true, + // Configurable: true }, + // and false. + + // In browsers that support Object.defineProperty, use the following: + // Object.defineProperty(A, k, { + // value: mappedValue, + // writable: true, + // enumerable: true, + // configurable: true + // }); + + // For best browser support, use the following: + A[k] = mappedValue; + } + // d. Increase k by 1. + k++; + } + + // 9. return A + return A; + }; +}</code></pre> + +<h2 id="Specifications">Specifications</h2> + +<table> + <tbody> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.4.4.19', 'Array.prototype.map')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td>Initial definition. Implemented in JavaScript 1.6.</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-array.prototype.map', 'Array.prototype.map')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-array.prototype.map', 'Array.prototype.map')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<table class="standard-table"> + <tbody> + <tr> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> + + +<p>{{Compat("javascript.builtins.Array.map")}}</p> +</div> + +<h2 id="See_also" name="See_also" style="margin-bottom: 20px; line-height: 30px;">相关链接</h2> + +<ul> + <li>{{jsxref("Array.prototype.forEach()")}}</li> + <li>{{jsxref("Map")}} object</li> + <li>{{jsxref("Array.from()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/array/observe/index.html b/files/zh-cn/web/javascript/reference/global_objects/array/observe/index.html new file mode 100644 index 0000000000..7c2dcc8474 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/array/observe/index.html @@ -0,0 +1,92 @@ +--- +title: Array.observe() +slug: Web/JavaScript/Reference/Global_Objects/Array/observe +tags: + - JavaScript + - 实验性 + - 数组 + - 方法 + - 过时的 +translation_of: Archive/Web/JavaScript/Array.observe +--- +<div>{{JSRef}}{{obsolete_header}}</div> + +<p><strong>Array.observe()</strong> 方法用于异步监视数组发生的变化，类似于针对对象的 {{jsxref("Object.observe()")}} 。当数组的值发生变化时，它按发生顺序提供了一个变化流。与 <code>Object.observe()</code> 类似，它由如下可接受的变化类型列表<code>["add"、"update"、"delete"、"splice"]</code>触发。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code>Array.observe(<var>arr</var>, <var>callback</var>)</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>arr</code></dt> + <dd>用于被监视的数组</dd> + <dt><code>callback</code></dt> + <dd>每当数组发生变化时，使用如下参数调用该函数： + <dl> + <dt><code>changes</code></dt> + <dd>用于表示变化的对象数组。每个变化对象的属性如下： + <ul> + <li><strong><code>name</code></strong>: 变化的属性名。</li> + <li><strong><code>object</code></strong>: 变化后的数组。</li> + <li><strong><code>type</code></strong>: 用于表示变化类型的字符串。<code>其取值为"add"、</code><code>"update"、</code><code>"delete"</code>或 <code>"splice"</code>之一。</li> + <li><strong><code>oldValue</code></strong>: 仅用于<code>"update"</code>和<code>"delete"类型。变化</code>之前的取值。</li> + <li><strong><code>index</code></strong>: <code>仅用于"splice"类型。</code>变化发生所在索引。</li> + <li><strong><code>removed</code></strong>: 仅用于<code>"splice"类型。</code>被删除元素组成的数组。</li> + <li><strong><code>addedCount</code></strong>: 仅用于<code>"splice"</code>类型。被添加的元素数量。</li> + </ul> + </dd> + </dl> + </dd> +</dl> + +<h2 id="描述">描述</h2> + +<p>每次 arr 发生任何变化时，回调函数将被调用，调用参数为所有变化按发生顺序组成的数组。</p> + +<div class="note"> +<p>通过Array方法如<a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array/pop"> Array.prototype.pop( )</a> 触发的变化将被报告成"<em>splice</em>"变化，长度不变但索引赋值发生变化的将被报告成"update"变化。</p> +</div> + +<h2 id="示例">示例</h2> + +<h3 id="Example_Logging_different_change_types">Example: Logging different change types</h3> + +<pre class="brush: js">var arr = ['a', 'b', 'c']; + +Array.observe(arr, function(changes) { + console.log(changes); +}); + +arr[1] = 'B'; +// [{type: 'update', object: <arr>, name: '1', oldValue: 'b'}] + +arr[3] = 'd'; +// [{type: 'splice', object: <arr>, index: 3, removed: [], addedCount: 1}] + +arr.splice(1, 2, 'beta', 'gamma', 'delta'); +// [{type: 'splice', object: <arr>, index: 1, removed: ['B', 'c'], addedCount: 3}] +</pre> + +<h2 id="Specifications" name="Specifications">标准规范</h2> + +<p><a href="https://github.com/arv/ecmascript-object-observe">Strawman proposal specification</a>.</p> + +<h2 id="Browser_compatibility" name="Browser_compatibility">浏览器支持</h2> + +<div> +<div> + + +<p>{{Compat("javascript.builtins.Array.observe")}}</p> +</div> +</div> + +<h2 id="See_also" name="See_also">相关内容</h2> + +<ul> + <li>{{jsxref("Array.unobserve()")}} {{experimental_inline}}</li> + <li>{{jsxref("Object.observe()")}} {{experimental_inline}}</li> + <li><a href="https://stackoverflow.com/q/29269057/778272">Under what condition would Array.observe's “add” event trigger?</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/array/of/index.html b/files/zh-cn/web/javascript/reference/global_objects/array/of/index.html new file mode 100644 index 0000000000..4636c06bdb --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/array/of/index.html @@ -0,0 +1,99 @@ +--- +title: Array.of() +slug: Web/JavaScript/Reference/Global_Objects/Array/of +tags: + - Array + - Array.of() + - ECMAScript 2015 + - ES 6 + - JavaScript + - polyfill + - 方法 +translation_of: Web/JavaScript/Reference/Global_Objects/Array/of +--- +<div>{{JSRef}}</div> + +<p><code><strong>Array.of()</strong></code> 方法创建一个具有可变数量参数的新数组实例，而不考虑参数的数量或类型。</p> + +<p> <code><strong>Array.of()</strong></code> 和 <code><strong>Array</strong></code> 构造函数之间的区别在于处理整数参数：<code><strong>Array.of(7)</strong></code><strong> </strong>创建一个具有单个元素 <strong>7</strong> 的数组，而 <strong><code>Array(7)</code> </strong>创建一个长度为7的空数组（<strong>注意：</strong>这是指一个有7个空位(empty)的数组，而不是由7个<code>undefined</code>组成的数组）。</p> + +<pre class="brush: js">Array.of(7); // [7] +Array.of(1, 2, 3); // [1, 2, 3] + +Array(7); // [ , , , , , , ] +Array(1, 2, 3); // [1, 2, 3] +</pre> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code>Array.of(<var>element0</var>[, <var>element1</var>[, ...[, <var>elementN</var>]]])</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt>element<em>N</em></dt> + <dd>任意个参数，将按顺序成为返回数组中的元素。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>新的 {{jsxref("Array")}} 实例。</p> + +<h2 id="描述">描述</h2> + +<p>此函数是ECMAScript 2015标准的一部分。详见 <a href="https://gist.github.com/rwaldron/1074126"><code>Array.of 和</code> <code>Array.from</code> proposal</a> 和 <a href="https://gist.github.com/rwaldron/3186576"><code>Array.of</code> polyfill</a>。</p> + +<h2 id="示例">示例</h2> + +<pre class="brush: js" style="font-size: 14px;"><span style="line-height: 22px;">Array.of(1); // [1] +</span><span style="line-height: 22px;">Array.of(1, 2, 3); // [1, 2, 3]</span> +Array.of(undefined); // [undefined] +</pre> + +<h2 id="Compatibility" name="Compatibility">兼容旧环境</h2> + +<p>如果原生不支持的话，在其他代码之前执行以下代码会创建 <code>Array.of()</code> 。</p> + +<pre class="brush: js" style="font-size: 14px;">if (!Array.of) { + Array.of = function() { + return Array.prototype.slice.call(arguments); + }; +}</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-array.of', 'Array.of')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-array.of', 'Array.of')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> + + +<p>{{Compat("javascript.builtins.Array.of")}}</p> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Array")}}</li> + <li>{{jsxref("Array.from()")}}</li> + <li>{{jsxref("TypedArray.of()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/array/pop/index.html b/files/zh-cn/web/javascript/reference/global_objects/array/pop/index.html new file mode 100644 index 0000000000..51fc625019 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/array/pop/index.html @@ -0,0 +1,101 @@ +--- +title: Array.prototype.pop() +slug: Web/JavaScript/Reference/Global_Objects/Array/pop +tags: + - Array + - Array.prototype.pop() + - ES5 + - ES6 + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Array/pop +--- +<p>{{JSRef}}</p> + +<p><code><strong>pop()</strong></code>方法从数组中删除最后一个元素，并返回该元素的值。此方法更改数组的长度。</p> + +<div>{{EmbedInteractiveExample("pages/js/array-pop.html")}}</div> + + + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code><em>arr</em>.pop()</code></pre> + +<h3 id="返回值">返回值</h3> + +<p>从数组中删除的元素(当数组为空时返回{{jsxref("undefined")}})。</p> + +<h2 id="Description" name="Description">描述</h2> + +<p><code>pop</code> 方法从一个数组中删除并返回最后一个元素。</p> + +<p><code>pop</code> 方法有意具有通用性。该方法和 {{jsxref("Function.call", "call()")}} 或 {{jsxref("Function.apply", "apply()")}} 一起使用时，可应用在类似数组的对象上。<code>pop</code>方法根据 <code>length</code>属性来确定最后一个元素的位置。如果不包含<code>length</code>属性或<code>length</code>属性不能被转成一个数值，会将<code>length</code>置为0，并返回<code>undefined</code>。</p> + +<p>如果你在一个空数组上调用 pop()，它返回 {{jsxref("undefined")}}。</p> + +<h2 id="Example" name="Example">示例</h2> + +<h3 id="Example:_Removing_the_last_element_of_an_array" name="Example:_Removing_the_last_element_of_an_array">例子: 删除掉数组的最后一个元素</h3> + +<p>下面的代码首先创建了一个拥有四个元素的数组 myFish，然后删除掉它的最后一个元素。</p> + +<pre class="brush:js">let myFish = ["angel", "clown", "mandarin", "surgeon"]; + +let popped = myFish.pop(); + +console.log(myFish); +// ["angel", "clown", "mandarin"] + +console.log(popped); +// surgeon +</pre> + +<h2 id="规范" style="margin-bottom: 20px; line-height: 30px;">规范</h2> + +<table> + <tbody> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + <tr> + <td>{{SpecName('ES3')}}</td> + <td>{{Spec2('ES3')}}</td> + <td>Initial definition. Implemented in JavaScript 1.2.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.4.4.6', 'Array.prototype.pop')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-array.prototype.pop', 'Array.prototype.pop')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-array.prototype.pop', 'Array.prototype.pop')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> + + +<p>{{Compat("javascript.builtins.Array.pop")}}</p> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Array.prototype.push()")}}</li> + <li>{{jsxref("Array.prototype.shift()")}}</li> + <li>{{jsxref("Array.prototype.unshift()")}}</li> + <li>{{jsxref("Array.prototype.concat()")}}</li> + <li>{{jsxref("Array.prototype.splice()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/array/prototype/index.html b/files/zh-cn/web/javascript/reference/global_objects/array/prototype/index.html new file mode 100644 index 0000000000..31d65bf734 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/array/prototype/index.html @@ -0,0 +1,178 @@ +--- +title: Array.prototype +slug: Web/JavaScript/Reference/Global_Objects/Array/prototype +tags: + - Array.prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Array/prototype +--- +<div>{{JSRef}}</div> + +<p><strong><code>Array.prototype</code></strong> 属性表示 {{jsxref("Array")}} 构造函数的原型，并允许您向所有Array对象添加新的属性和方法。</p> + +<pre class="brush: js">/* +如果JavaScript本身不提供 first() 方法， +添加一个返回数组的第一个元素的新方法。 +*/ + +if(!Array.prototype.first) { + Array.prototype.first = function() { + console.log(`如果JavaScript本身不提供 first() 方法， +添加一个返回数组的第一个元素的新方法。`); + return this[0]; + } +} +</pre> + +<h2 id="Description" name="Description">描述</h2> + +<p>{{jsxref("Array")}}实例继承自 <strong>Array.prototype </strong>。与所有构造函数一样，您可以更改构造函数的原型对象，以对所有 {{jsxref("Array")}} 实例进行更改。例如，可以添加新方法和属性以扩展所有Array对象。这用于 {{Glossary("Polyfill", "polyfilling")}}， 例如。</p> + +<p>鲜为人知的事实：<code>Array.prototype</code> 本身也是一个 {{jsxref("Array")}}。</p> + +<pre class="brush: js">Array.isArray(Array.prototype); +// true +</pre> + +<p>{{js_property_attributes(0, 0, 0)}}</p> + +<h2 id="Properties" name="Properties">属性</h2> + +<dl> + <dt><code>Array.prototype.constructor</code></dt> + <dd>所有的数组实例都继承了这个属性，它的值就是 {{jsxref("Array")}}，表明了所有的数组都是由 {{jsxref("Array")}} 构造出来的。</dd> + <dt>{{jsxref("Array.prototype.length")}}</dt> + <dd>上面说了，因为 <code>Array.prototype</code> 也是个数组，所以它也有 <code>length</code> 属性，这个值为 <code>0</code>，因为它是个空数组。</dd> +</dl> + +<h2 id="Methods" name="Methods">方法</h2> + +<h3 id="Mutator_methods" name="Mutator_methods">会改变自身的方法</h3> + +<p>下面的这些方法会改变调用它们的对象自身的值：</p> + +<dl> + <dt>{{jsxref("Array.prototype.copyWithin()")}} {{experimental_inline}}</dt> + <dd>在数组内部，将一段元素序列拷贝到另一段元素序列上，覆盖原有的值。</dd> + <dt>{{jsxref("Array.prototype.fill()")}} {{experimental_inline}}</dt> + <dd>将数组中指定区间的所有元素的值，都替换成某个固定的值。</dd> + <dt>{{jsxref("Array.prototype.pop()")}}</dt> + <dd>删除数组的最后一个元素，并返回这个元素。</dd> + <dt>{{jsxref("Array.prototype.push()")}}</dt> + <dd>在数组的末尾增加一个或多个元素，并返回数组的新长度。</dd> + <dt>{{jsxref("Array.prototype.reverse()")}}</dt> + <dd>颠倒数组中元素的排列顺序，即原先的第一个变为最后一个，原先的最后一个变为第一个。</dd> + <dt>{{jsxref("Array.prototype.shift()")}}</dt> + <dd>删除数组的第一个元素，并返回这个元素。</dd> + <dt>{{jsxref("Array.prototype.sort()")}}</dt> + <dd>对数组元素进行排序，并返回当前数组。</dd> + <dt>{{jsxref("Array.prototype.splice()")}}</dt> + <dd>在任意的位置给数组添加或删除任意个元素。</dd> + <dt>{{jsxref("Array.prototype.unshift()")}}</dt> + <dd>在数组的开头增加一个或多个元素，并返回数组的新长度。</dd> +</dl> + +<h3 id="Accessor_methods" name="Accessor_methods">不会改变自身的方法</h3> + +<p>下面的这些方法绝对不会改变调用它们的对象的值，只会返回一个新的数组或者返回一个其它的期望值。</p> + +<dl> + <dt>{{jsxref("Array.prototype.concat()")}}</dt> + <dd>返回一个由当前数组和其它若干个数组或者若干个非数组值组合而成的新数组。</dd> + <dt>{{jsxref("Array.prototype.includes()")}} {{experimental_inline}}</dt> + <dd>判断当前数组是否包含某指定的值，如果是返回 <code>true</code>，否则返回 <code>false</code>。</dd> + <dt>{{jsxref("Array.prototype.join()")}}</dt> + <dd>连接所有数组元素组成一个字符串。</dd> + <dt>{{jsxref("Array.prototype.slice()")}}</dt> + <dd>抽取当前数组中的一段元素组合成一个新数组。</dd> + <dt>{{jsxref("Array.prototype.toSource()")}} {{non-standard_inline}}</dt> + <dd>返回一个表示当前数组字面量的字符串。遮蔽了原型链上的 {{jsxref("Object.prototype.toSource()")}} 方法。</dd> + <dt>{{jsxref("Array.prototype.toString()")}}</dt> + <dd>返回一个由所有数组元素组合而成的字符串。遮蔽了原型链上的 {{jsxref("Object.prototype.toString()")}} 方法。</dd> + <dt>{{jsxref("Array.prototype.toLocaleString()")}}</dt> + <dd>返回一个由所有数组元素组合而成的本地化后的字符串。遮蔽了原型链上的 {{jsxref("Object.prototype.toLocaleString()")}} 方法。</dd> + <dt>{{jsxref("Array.prototype.indexOf()")}}</dt> + <dd>返回数组中第一个与指定值相等的元素的索引，如果找不到这样的元素，则返回 -1。</dd> + <dt>{{jsxref("Array.prototype.lastIndexOf()")}}</dt> + <dd>返回数组中最后一个（从右边数第一个）与指定值相等的元素的索引，如果找不到这样的元素，则返回 -1。</dd> +</dl> + +<h3 id="Iteration_methods" name="Iteration_methods">遍历方法</h3> + +<p>在下面的众多遍历方法中，有很多方法都需要指定一个回调函数作为参数。在每一个数组元素都分别执行完回调函数之前，数组的length属性会被缓存在某个地方，所以，如果你在回调函数中为当前数组添加了新的元素，那么那些新添加的元素是不会被遍历到的。此外，如果在回调函数中对当前数组进行了其它修改，比如改变某个元素的值或者删掉某个元素，那么随后的遍历操作可能会受到未预期的影响。总之，不要尝试在遍历过程中对原数组进行任何修改，虽然规范对这样的操作进行了详细的定义，但为了可读性和可维护性，请不要这样做。</p> + +<dl> + <dt>{{jsxref("Array.prototype.forEach()")}}</dt> + <dd>为数组中的每个元素执行一次回调函数。</dd> + <dt>{{jsxref("Array.prototype.entries()")}} {{experimental_inline}}</dt> + <dd>返回一个数组迭代器对象，该迭代器会包含所有数组元素的键值对。</dd> + <dt>{{jsxref("Array.prototype.every()")}}</dt> + <dd>如果数组中的每个元素都满足测试函数，则返回 <code>true</code>，否则返回 <code>false。</code></dd> + <dt>{{jsxref("Array.prototype.some()")}}</dt> + <dd>如果数组中至少有一个元素满足测试函数，则返回 true，否则返回 false。</dd> + <dt>{{jsxref("Array.prototype.filter()")}}</dt> + <dd>将所有在过滤函数中返回 <code>true</code> 的数组元素放进一个新数组中并返回。</dd> + <dt>{{jsxref("Array.prototype.find()")}} {{experimental_inline}}</dt> + <dd>找到第一个满足测试函数的元素并返回那个元素的值，如果找不到，则返回 <code>undefined</code>。</dd> + <dt>{{jsxref("Array.prototype.findIndex()")}} {{experimental_inline}}</dt> + <dd>找到第一个满足测试函数的元素并返回那个元素的索引，如果找不到，则返回 <code>-1</code>。</dd> + <dt>{{jsxref("Array.prototype.keys()")}} {{experimental_inline}}</dt> + <dd>返回一个数组迭代器对象，该迭代器会包含所有数组元素的键。</dd> + <dt>{{jsxref("Array.prototype.map()")}}</dt> + <dd>返回一个由回调函数的返回值组成的新数组。</dd> + <dt>{{jsxref("Array.prototype.reduce()")}}</dt> + <dd>从左到右为每个数组元素执行一次回调函数，并把上次回调函数的返回值放在一个暂存器中传给下次回调函数，并返回最后一次回调函数的返回值。</dd> + <dt>{{jsxref("Array.prototype.reduceRight()")}}</dt> + <dd>从右到左为每个数组元素执行一次回调函数，并把上次回调函数的返回值放在一个暂存器中传给下次回调函数，并返回最后一次回调函数的返回值。</dd> + <dt>{{jsxref("Array.prototype.values()")}} {{experimental_inline}}</dt> + <dd>返回一个数组迭代器对象，该迭代器会包含所有数组元素的值。</dd> + <dt>{{jsxref("Array.prototype.@@iterator()", "Array.prototype[@@iterator]()")}} {{experimental_inline}}</dt> + <dd>和上面的 <code>values() 方法是同一个函数。</code></dd> +</dl> + +<h3 id="Generic_methods" name="Generic_methods">通用方法</h3> + +<p>在 JavaScript 中，很多的数组方法被故意设计成是通用的。也就是说，那些看起来像是数组的对象（类数组对象），即拥有一个 <code>length</code> 属性，以及对应的索引属性（也就是数字类型的属性，比如 <code>obj[5]</code>）的非数组对象也是可以调用那些数组方法的。其中一些数组方法，比如说 {{jsxref("Array.join", "join")}} 方法，它们只会单纯的读取当前对象的 <code>length</code> 属性和索引属性的值，并不会尝试去改变这些属性的值。而另外一些数组方法，比如说 {{jsxref("Array.reverse", "reverse")}} 方法，它们会尝试修改那些属性的值，因此，如果当前对象是个 {{jsxref("String")}} 对象，那么这些方法在执行时就会报错，因为字符串对象的 <code>length</code> 属性和索引属性都是只读的。</p> + +<h2 id="Specifications" name="Specifications">规范</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('ES1')}}</td> + <td>{{Spec2('ES1')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.4.3.1', 'Array.prototype')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-array.prototype', 'Array.prototype')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">浏览器兼容性</h2> + +<div> +<div> + + +<p>{{Compat("javascript.builtins.Array.prototype")}}</p> +</div> +</div> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("Array")}}</li> + <li>{{jsxref("Function.prototype")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/array/push/index.html b/files/zh-cn/web/javascript/reference/global_objects/array/push/index.html new file mode 100644 index 0000000000..3be7c12520 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/array/push/index.html @@ -0,0 +1,149 @@ +--- +title: Array.prototype.push() +slug: Web/JavaScript/Reference/Global_Objects/Array/push +tags: + - Array + - Array.prototype.push() + - JavaScript + - Method + - Prototype + - 参考 + - 数组 + - 方法 +translation_of: Web/JavaScript/Reference/Global_Objects/Array/push +--- +<div>{{JSRef}}</div> + +<p><code><strong>push()</strong></code> 方法将一个或多个元素添加到数组的末尾，并返回该数组的新长度。</p> + +<div>{{EmbedInteractiveExample("pages/js/array-push.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">arr.push(element1, ..., elementN) +</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>element<em>N</em></code></dt> + <dd>被添加到数组末尾的元素。</dd> +</dl> + +<h3 id="返回值" style="line-height: 24px;">返回值</h3> + +<p>当调用该方法时，新的 {{jsxref("Array.length", "length")}} 属性值将被返回。</p> + +<h2 id="Description" name="Description" style="margin-bottom: 20px; line-height: 30px;">描述</h2> + +<p>push方法将值追加到数组中。</p> + +<p><code>push</code> 方法具有通用性。该方法和 {{jsxref("Function.call", "call()")}} 或 {{jsxref("Function.apply", "apply()")}} 一起使用时，可应用在类似数组的对象上。<code>push</code> 方法根据 <code>length</code> 属性来决定从哪里开始插入给定的值。如果 <code>length</code> 不能被转成一个数值，则插入的元素索引为 0，包括 <code>length</code> 不存在时。当 <code>length</code> 不存在时，将会创建它。</p> + +<p>唯一的原生类数组（array-like）对象是 {{jsxref("Global_Objects/String", "Strings")}}，尽管如此，它们并不适用该方法，因为字符串是不可改变的。</p> + +<h2 id="示例">示例</h2> + +<h3 id="添加元素到数组">添加元素到数组</h3> + +<p>下面的代码创建了 <code>sports</code> 数组，包含两个元素，然后又把两个元素添加给它。<code>total</code> 变量为数组的新长度值。</p> + +<pre class="brush: js">var sports = ["soccer", "baseball"]; +var total = sports.push("football", "swimming"); + +console.log(sports); +// ["soccer", "baseball", "football", "swimming"] + +console.log(total); +// 4</pre> + +<h3 id="合并两个数组">合并两个数组</h3> + +<p>该示例使用 {{jsxref("Function.apply", "apply()")}} 添加第二个数组的所有元素。</p> + +<p>注意当第二个数组(如示例中的moreVegs)太大时不要使用这个方法来合并数组，因为事实上一个函数能够接受的参数个数是有限制的。具体可以参考 {{jsxref("Function.apply", "apply()")}} 。</p> + +<pre class="brush: js">var vegetables = ['parsnip', 'potato']; +var moreVegs = ['celery', 'beetroot']; + +// 将第二个数组融合进第一个数组 +// 相当于 vegetables.push('celery', 'beetroot'); +Array.prototype.push.apply(vegetables, moreVegs); + +console.log(vegetables); +// ['parsnip', 'potato', 'celery', 'beetroot']</pre> + +<h3 id="像数组一样使用对象">像数组一样使用对象</h3> + +<p>如上所述，push 是特意设计为通用的，我们可以使用它来获得便利。正如下面的例子所示，Array.prototype.push 可以在一个对象上工作。 注意，我们没有创建一个数组来存储对象的集合。 相反，我们将该集合存储在对象本身上，并使用在 Array.prototype.push 上使用的 <code>call</code> 来调用该方法，使其认为我们正在处理数组，而它只是像平常一样运作，这要感谢 JavaScript 允许我们建立任意的执行上下文。</p> + +<pre class="brush: js">var obj = { + length: 0, + + addElem: function addElem (elem) { + // obj.length is automatically incremented + // every time an element is added. + [].push.call(this, elem); + } +}; + +// Let's add some empty objects just to illustrate. +obj.addElem({}); +obj.addElem({}); +console.log(obj.length); +// → 2</pre> + +<p>注意，尽管 obj 不是数组，但是 push 方法成功地使 obj 的 length 属性增长了，就像我们处理一个实际的数组一样。</p> + +<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('ES3')}}</td> + <td>{{Spec2('ES3')}}</td> + <td>Initial definition. Implemented in JavaScript 1.2.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.4.4.7', 'Array.prototype.push')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-array.prototype.push', 'Array.prototype.push')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-array.prototype.push', 'Array.prototype.push')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> +<div> + + +<p>{{Compat("javascript.builtins.Array.push")}}</p> +</div> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Array.prototype.pop()")}}</li> + <li>{{jsxref("Array.prototype.shift()")}}</li> + <li>{{jsxref("Array.prototype.unshift()")}}</li> + <li>{{jsxref("Array.prototype.concat()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/array/reduce/index.html b/files/zh-cn/web/javascript/reference/global_objects/array/reduce/index.html new file mode 100644 index 0000000000..75edc90a73 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/array/reduce/index.html @@ -0,0 +1,688 @@ +--- +title: Array.prototype.reduce() +slug: Web/JavaScript/Reference/Global_Objects/Array/Reduce +tags: + - Array + - ECMAScript 5 + - JavaScript + - Method + - Prototype + - Reduce + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Array/Reduce +--- +<p>{{JSRef}}</p> + +<p><code><strong>reduce()</strong></code> 方法对数组中的每个元素执行一个由您提供的<strong>reducer</strong>函数(升序执行)，将其结果汇总为单个返回值。</p> + +<div>{{EmbedInteractiveExample("pages/js/array-reduce.html")}}</div> + +<div class="hidden"> +<p>The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> and send us a pull request. </p> +</div> + +<div> +<p><strong>reducer</strong> 函数接收4个参数:</p> + +<ol> + <li>Accumulator (acc) (累计器)</li> + <li>Current Value (cur) (当前值)</li> + <li>Current Index (idx) (当前索引)</li> + <li>Source Array (src) (源数组)</li> +</ol> + +<p>您的 <strong>reducer</strong> 函数的返回值分配给累计器，该返回值在数组的每个迭代中被记住，并最后成为最终的单个结果值。</p> +</div> + +<h2 id="语法">语法</h2> + +<pre class="notranslate"><var>arr.reduce(callback(accumulator, currentValue[, index[, array]])[, initialValue])</var></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>callback</code></dt> + <dd>执行数组中每个值 (如果没有提供 <code>initialValue则第一个值除外</code>)的函数，包含四个参数：</dd> + <dd> + <dl> + </dl> + <strong><code>accumulator</code></strong> + + <dl> + <dd> + <p>累计器累计回调的返回值; 它是上一次调用回调时返回的累积值，或<code>initialValue</code>（见于下方）。</p> + </dd> + <dt><code>currentValue</code></dt> + <dd>数组中正在处理的元素。</dd> + <dt><code>index</code> {{optional_inline}}</dt> + <dd>数组中正在处理的当前元素的索引。 如果提供了<code>initialValue</code>，则起始索引号为0，否则从索引1起始。</dd> + <dt><code>array</code>{{optional_inline}}</dt> + <dd>调用<code>reduce()</code>的数组</dd> + </dl> + </dd> + <dt><code>initialValue</code>{{optional_inline}}</dt> + <dd>作为第一次调用 <code>callback</code>函数时的第一个参数的值。 如果没有提供初始值，则将使用数组中的第一个元素。 在没有初始值的空数组上调用 reduce 将报错。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>函数累计处理的结果</p> + +<h2 id="描述">描述</h2> + +<p><code>reduce</code>为数组中的每一个元素依次执行<code>callback</code>函数，不包括数组中被删除或从未被赋值的元素，接受四个参数：</p> + +<ul> + <li><code>accumulator 累计器</code></li> + <li><code>currentValue 当前值</code></li> + <li><code>currentIndex 当前索引</code></li> + <li><code>array 数组</code></li> +</ul> + +<p>回调函数第一次执行时，<code>accumulator</code><span style="line-height: 1.5;"> 和</span><code>currentValue</code>的取值有两种情况：如果调用<code>reduce()</code>时提供了<code>initialValue</code>，<code>accumulator</code>取值为<code>initialValue</code>，<code>currentValue</code>取数组中的第一个值；如果没有提供 <code>initialValue</code>，那么<code>accumulator</code>取数组中的第一个值，<code>currentValue</code>取数组中的第二个值。</p> + +<div class="note"> +<p><strong>注意：</strong>如果没有提供<code>initialValue</code>，reduce 会从索引1的地方开始执行 callback 方法，跳过第一个索引。如果提供<code>initialValue</code>，从索引0开始。</p> +</div> + +<p>如果数组为空且没有提供<code>initialValue</code>，会抛出{{jsxref("TypeError")}} 。如果数组仅有一个元素（无论位置如何）并且没有提供<code>initialValue</code>， 或者有提供<code>initialValue</code>但是数组为空，那么此唯一值将被返回并且<code>callback</code>不会被执行。</p> + +<p>提供初始值通常更安全，正如下面的例子，如果没有提供<code>initialValue</code>，则可能有四种输出：</p> + +<pre class="brush: js notranslate">var maxCallback = ( acc, cur ) => Math.max( acc.x, cur.x ); +var maxCallback2 = ( max, cur ) => Math.max( max, cur ); + +// reduce() 没有初始值 +[ { x: 2 }, { x: 22 }, { x: 42 } ].reduce( maxCallback ); // NaN +[ { x: 2 }, { x: 22 } ].reduce( maxCallback ); // 22 +[ { x: 2 } ].reduce( maxCallback ); // { x: 2 } +[ ].reduce( maxCallback ); // TypeError + +// map/reduce; 这是更好的方案，即使传入空数组或更大数组也可正常执行 +[ { x: 22 }, { x: 42 } ].map( el => el.x ) + .reduce( maxCallback2, -Infinity ); +</pre> + +<h3 id="reduce_如何运行">reduce() 如何运行</h3> + +<p>假如运行下段<code>reduce()</code>代码：</p> + +<pre class="brush:js notranslate">[0, 1, 2, 3, 4].reduce(function(accumulator, currentValue, currentIndex, array){ + return accumulator + currentValue; +}); +</pre> + +<p>callback 被调用四次，每次调用的参数和返回值如下表：</p> + +<table> + <thead> + <tr> + <th scope="col"><code>callback</code></th> + <th scope="col"><code>accumulator</code></th> + <th scope="col"><code>currentValue</code></th> + <th scope="col"><code>currentIndex</code></th> + <th scope="col"><code>array</code></th> + <th scope="col">return value</th> + </tr> + </thead> + <tbody> + <tr> + <th scope="row">first call</th> + <td><code>0</code></td> + <td><code>1</code></td> + <td><code>1</code></td> + <td><code>[0, 1, 2, 3, 4]</code></td> + <td><code>1</code></td> + </tr> + <tr> + <th scope="row">second call</th> + <td><code>1</code></td> + <td><code>2</code></td> + <td><code>2</code></td> + <td><code>[0, 1, 2, 3, 4]</code></td> + <td><code>3</code></td> + </tr> + <tr> + <th scope="row">third call</th> + <td><code>3</code></td> + <td><code>3</code></td> + <td><code>3</code></td> + <td><code>[0, 1, 2, 3, 4]</code></td> + <td><code>6</code></td> + </tr> + <tr> + <th scope="row">fourth call</th> + <td><code>6</code></td> + <td><code>4</code></td> + <td><code>4</code></td> + <td><code>[0, 1, 2, 3, 4]</code></td> + <td><code>10</code></td> + </tr> + </tbody> +</table> + +<table style="width: 100%;"> + <tbody> + <tr> + </tr> + </tbody> +</table> + +<p>由<code>reduce</code>返回的值将是最后一次回调返回值（10）。</p> + +<p>你还可以使用{{jsxref("Functions/Arrow_functions", "箭头函数","",1)}}来代替完整的函数。 下面的代码将产生与上面的代码相同的输出：</p> + +<pre class="brush: js notranslate">[0, 1, 2, 3, 4].reduce((prev, curr) => prev + curr );</pre> + +<p>如果你打算提供一个初始值作为<code>reduce()</code>方法的第二个参数，以下是运行过程及结果：</p> + +<pre class="brush: js notranslate">[0, 1, 2, 3, 4].reduce((accumulator, currentValue, currentIndex, array) => { + return accumulator + currentValue +}, 10) +</pre> + +<table> + <thead> + <tr> + <th scope="col"><code>callback</code></th> + <th scope="col"><code>accumulator</code></th> + <th scope="col"><code>currentValue</code></th> + <th scope="col"><code>currentIndex</code></th> + <th scope="col"><code>array</code></th> + <th scope="col">return value</th> + </tr> + </thead> + <tbody> + <tr> + <th scope="row">first call</th> + <td><code>10</code></td> + <td><code>0</code></td> + <td><code>0</code></td> + <td><code>[0, 1, 2, 3, 4]</code></td> + <td><code>10</code></td> + </tr> + <tr> + <th scope="row">second call</th> + <td><code>10</code></td> + <td><code>1</code></td> + <td><code>1</code></td> + <td><code>[0, 1, 2, 3, 4]</code></td> + <td><code>11</code></td> + </tr> + <tr> + <th scope="row">third call</th> + <td><code>11</code></td> + <td><code>2</code></td> + <td><code>2</code></td> + <td><code>[0, 1, 2, 3, 4]</code></td> + <td><code>13</code></td> + </tr> + <tr> + <th scope="row">fourth call</th> + <td><code>13</code></td> + <td><code>3</code></td> + <td><code>3</code></td> + <td><code>[0, 1, 2, 3, 4]</code></td> + <td><code>16</code></td> + </tr> + <tr> + <th scope="row">fifth call</th> + <td><code>16</code></td> + <td><code>4</code></td> + <td><code>4</code></td> + <td><code>[0, 1, 2, 3, 4]</code></td> + <td><code>20</code></td> + </tr> + </tbody> +</table> + +<p>这种情况下<code>reduce()</code>返回的值是<code>20</code>。</p> + +<h2 id="例子">例子</h2> + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +<h3 id="数组里所有值的和">数组里所有值的和</h3> + +<pre class="brush: js notranslate">var sum = [0, 1, 2, 3].reduce(function (accumulator, currentValue) { + return accumulator + currentValue; +}, 0); +// 和为 6</pre> + +<p>你也可以写成箭头函数的形式：</p> + +<pre class="brush: js notranslate">var total = [ 0, 1, 2, 3 ].reduce( + ( acc, cur ) => acc + cur, + 0 +);</pre> + +<h3 id="累加对象数组里的值">累加对象数组里的值</h3> + +<p>要累加对象数组中包含的值，必须提供初始值，以便各个item正确通过你的函数。</p> + +<pre class="brush: js notranslate">var initialValue = 0; +var sum = [{x: 1}, {x:2}, {x:3}].reduce(function (accumulator, currentValue) { + return accumulator + currentValue.x; +},initialValue) + +console.log(sum) // logs 6</pre> + +<p>你也可以写成箭头函数的形式：</p> + +<pre class="brush: js notranslate">var initialValue = 0; +var sum = [{x: 1}, {x:2}, {x:3}].reduce( + (accumulator, currentValue) => accumulator + currentValue.x + ,initialValue +); + +console.log(sum) // logs 6 +</pre> + +<h3 id="将二维数组转化为一维">将二维数组转化为一维</h3> + +<pre class="brush: js notranslate">var flattened = [[0, 1], [2, 3], [4, 5]].reduce( + function(a, b) { + return a.concat(b); + }, + [] +); +// flattened is [0, 1, 2, 3, 4, 5] +</pre> + +<p>你也可以写成箭头函数的形式：</p> + +<pre class="brush: js notranslate">var flattened = [[0, 1], [2, 3], [4, 5]].reduce( + ( acc, cur ) => acc.concat(cur), + [] +); + +</pre> + +<h3 id="计算数组中每个元素出现的次数">计算数组中每个元素出现的次数</h3> + +<pre class="brush: js notranslate">var names = ['Alice', 'Bob', 'Tiff', 'Bruce', 'Alice']; + +var countedNames = names.reduce(function (allNames, name) { + if (name in allNames) { + allNames[name]++; + } + else { + allNames[name] = 1; + } + return allNames; +}, {}); +// countedNames is: +// { 'Alice': 2, 'Bob': 1, 'Tiff': 1, 'Bruce': 1 }</pre> + +<h3 id="按属性对object分类">按属性对object分类</h3> + +<pre class="brush: js notranslate">var people = [ + { name: 'Alice', age: 21 }, + { name: 'Max', age: 20 }, + { name: 'Jane', age: 20 } +]; + +function groupBy(objectArray, property) { + return objectArray.reduce(function (acc, obj) { + var key = obj[property]; + if (!acc[key]) { + acc[key] = []; + } + acc[key].push(obj); + return acc; + }, {}); +} + +var groupedPeople = groupBy(people, 'age'); +// groupedPeople is: +// { +// 20: [ +// { name: 'Max', age: 20 }, +// { name: 'Jane', age: 20 } +// ], +// 21: [{ name: 'Alice', age: 21 }] +// } +</pre> + +<h3 id="使用扩展运算符和initialValue绑定包含在对象数组中的数组">使用扩展运算符和initialValue绑定包含在对象数组中的数组</h3> + +<pre class="brush: js notranslate">// friends - 对象数组 +// where object field "books" - list of favorite books +var friends = [{ + name: 'Anna', + books: ['Bible', 'Harry Potter'], + age: 21 +}, { + name: 'Bob', + books: ['War and peace', 'Romeo and Juliet'], + age: 26 +}, { + name: 'Alice', + books: ['The Lord of the Rings', 'The Shining'], + age: 18 +}]; + +// allbooks - list which will contain all friends' books + +// additional list contained in initialValue +var allbooks = friends.reduce(function(prev, curr) { + return [...prev, ...curr.books]; +}, ['Alphabet']); + +// allbooks = [ +// 'Alphabet', 'Bible', 'Harry Potter', 'War and peace', +// 'Romeo and Juliet', 'The Lord of the Rings', +// 'The Shining' +// ] +</pre> + +<h3 id="数组去重">数组去重</h3> + +<div class="blockIndicator note"> +<p>注意： 如果你正在使用一个可以兼容{{jsxref("Set")}} 和 {{jsxref("Array.from()")}} 的环境， 你可以使用<code>let orderedArray = Array.from(new Set(myArray));</code> 来获得一个相同元素被移除的数组。</p> +</div> + +<pre class="brush: js notranslate">let myArray = ['a', 'b', 'a', 'b', 'c', 'e', 'e', 'c', 'd', 'd', 'd', 'd'] +let myOrderedArray = myArray.reduce(function (accumulator, currentValue) { + if (accumulator.indexOf(currentValue) === -1) { + accumulator.push(currentValue) + } + return accumulator +}, []) + +console.log(myOrderedArray)</pre> + +<pre class="brush: js notranslate">let arr = [1,2,1,2,3,5,4,5,3,4,4,4,4]; +let result = arr.sort().reduce((init, current) => { + if(init.length === 0 || init[init.length-1] !== current) { + init.push(current); + } + return init; +}, []); +console.log(result); //[1,2,3,4,5]</pre> + +<h3 id="按顺序运行Promise">按顺序运行Promise</h3> + +<pre class="brush: js notranslate">/** + * Runs promises from array of functions that can return promises + * in chained manner + * + * @param {array} arr - promise arr + * @return {Object} promise object + */ +function runPromiseInSequence(arr, input) { + return arr.reduce( + (promiseChain, currentFunction) => promiseChain.then(currentFunction), + Promise.resolve(input) + ); +} + +// promise function 1 +function p1(a) { + return new Promise((resolve, reject) => { + resolve(a * 5); + }); +} + +// promise function 2 +function p2(a) { + return new Promise((resolve, reject) => { + resolve(a * 2); + }); +} + +// function 3 - will be wrapped in a resolved promise by .then() +function f3(a) { + return a * 3; +} + +// promise function 4 +function p4(a) { + return new Promise((resolve, reject) => { + resolve(a * 4); + }); +} + +const promiseArr = [p1, p2, f3, p4]; +runPromiseInSequence(promiseArr, 10) + .then(console.log); // 1200 +</pre> + +<h3 id="功能型函数管道">功能型函数管道</h3> + +<pre class="brush: js notranslate">// Building-blocks to use for composition +const double = x => x + x; +const triple = x => 3 * x; +const quadruple = x => 4 * x; + +// Function composition enabling pipe functionality +const pipe = (...functions) => input => functions.reduce( + (acc, fn) => fn(acc), + input +); + +// Composed functions for multiplication of specific values +const multiply6 = pipe(double, triple); +const multiply9 = pipe(triple, triple); +const multiply16 = pipe(quadruple, quadruple); +const multiply24 = pipe(double, triple, quadruple); + +// Usage +multiply6(6); // 36 +multiply9(9); // 81 +multiply16(16); // 256 +multiply24(10); // 240 +</pre> + +<h3 id="使用_reduce实现map">使用 reduce实现map</h3> + +<pre class="brush: js notranslate">if (!Array.prototype.mapUsingReduce) { + Array.prototype.mapUsingReduce = function(callback, thisArg) { + return this.reduce(function(mappedArray, currentValue, index, array) { + mappedArray[index] = callback.call(thisArg, currentValue, index, array) + return mappedArray + }, []) + } +} + +[1, 2, , 3].mapUsingReduce( + (currentValue, index, array) => currentValue + index + array.length +) // [5, 7, , 10] +</pre> + +<h2 id="Polyfill">Polyfill</h2> + +<pre class="brush: js notranslate">// Production steps of ECMA-262, Edition 5, 15.4.4.21 +// Reference: http://es5.github.io/#x15.4.4.21 +// https://tc39.github.io/ecma262/#sec-array.prototype.reduce +if (!Array.prototype.reduce) { + Object.defineProperty(Array.prototype, 'reduce', { + value: function(callback /*, initialValue*/) { + if (this === null) { + throw new TypeError( 'Array.prototype.reduce ' + + 'called on null or undefined' ); + } + if (typeof callback !== 'function') { + throw new TypeError( callback + + ' is not a function'); + } + + // 1. Let O be ? ToObject(this value). + var o = Object(this); + + // 2. Let len be ? ToLength(? Get(O, "length")). + var len = o.length >>> 0; + + // Steps 3, 4, 5, 6, 7 + var k = 0; + var value; + + if (arguments.length >= 2) { + value = arguments[1]; + } else { + while (k < len && !(k in o)) { + k++; + } + + // 3. If len is 0 and initialValue is not present, + // throw a TypeError exception. + if (k >= len) { + throw new TypeError( 'Reduce of empty array ' + + 'with no initial value' ); + } + value = o[k++]; + } + + // 8. Repeat, while k < len + while (k < len) { + // a. Let Pk be ! ToString(k). + // b. Let kPresent be ? HasProperty(O, Pk). + // c. If kPresent is true, then + // i. Let kValue be ? Get(O, Pk). + // ii. Let accumulator be ? Call( + // callbackfn, undefined, + // « accumulator, kValue, k, O »). + if (k in o) { + value = callback(value, o[k], k, o); + } + + // d. Increase k by 1. + k++; + } + + // 9. Return accumulator. + return value; + } + }); +} +</pre> + +<p>如果您需要兼容不支持<code><a href="/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperty">Object.defineProperty</a></code>的JavaScript引擎，那么最好不要 polyfill <code>Array.prototype</code>方法，因为你无法使其成为<strong>不可枚举</strong>的。</p> + +<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('ES5.1', '#sec-15.4.4.21', 'Array.prototype.reduce')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td>初始定语. 实施于 JavaScript 1.8.</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-array.prototype.reduce', 'Array.prototype.reduce')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-array.prototype.reduce', 'Array.prototype.reduce')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> + + +<p>{{Compat("javascript.builtins.Array.reduce")}}</p> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Array.prototype.reduceRight()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/array/reduceright/index.html b/files/zh-cn/web/javascript/reference/global_objects/array/reduceright/index.html new file mode 100644 index 0000000000..e4846dbfbf --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/array/reduceright/index.html @@ -0,0 +1,409 @@ +--- +title: Array.prototype.reduceRight() +slug: Web/JavaScript/Reference/Global_Objects/Array/ReduceRight +tags: + - JavaScript + - 原型 + - 数组 + - 方法 +translation_of: Web/JavaScript/Reference/Global_Objects/Array/ReduceRight +--- +<div>{{JSRef}}</div> + +<p><code><strong>reduceRight()</strong></code> 方法接受一个函数作为累加器（accumulator）和数组的每个值（从右到左）将其减少为单个值。</p> + +<div>{{EmbedInteractiveExample("pages/js/array-reduce-right.html")}}</div> + + + +<p>对于从左至右遍历的相似方法请参阅 {{jsxref("Array.prototype.reduce()")}}.</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox notranslate"><var>arr.reduceRight(callback(accumulator, currentValue[, index[, array]])[, initialValue])</var></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>callback</code></dt> + <dd>一个回调函数，用于操作数组中的每个元素，它可接受四个参数： + <dl> + <dt><code>accumulator</code></dt> + <dd><span class="tlid-translation translation" lang="zh-CN"><span title="">累加器：</span></span>上一次调用回调函数时，回调函数返回的值。首次调用回调函数时，如果 <code>initialValue</code> 存在，<span class="tlid-translation translation" lang="zh-CN"><span title="">累加器</span></span>即为 <code>initialValue</code>，否则须为数组中的最后一个元素（详见下方 <code>initialValue</code> 处相关说明）。</dd> + <dt><code>currentValue</code></dt> + <dd><span class="tlid-translation translation" lang="zh-CN"><span title="">当前元素：</span></span>当前被处理的元素。</dd> + <dt><code>index</code>{{optional_inline}}</dt> + <dd>数组中当前被处理的元素的索引。</dd> + <dt><code>array</code>{{optional_inline}}</dt> + <dd>调用 <code>reduceRight()</code> 的数组。</dd> + </dl> + </dd> + <dt><code>initialValue</code>{{optional_inline}} </dt> + <dd><span class="tlid-translation translation" lang="zh-CN"><span title="">首次调用</span></span> <code>callback</code> 函数时，<span class="tlid-translation translation" lang="zh-CN"><span title="">累加器 </span></span> <code>accumulator</code> <span class="tlid-translation translation" lang="zh-CN"><span title="">的值</span></span>。如果未提供该初始值，则将使用数组中的最后一个元素，并跳过该元素。如果不给出初始值，则需保证数组不为空。<br> + 否则，在空数组上调用 <code>reduce</code> 或 <code>reduceRight</code> 且未提供初始值（例如 <code>[].reduce( (acc, cur, idx, arr) => {} )</code> ）的话，会导致类型错误 <code><a href="/zh-CN/docs/Web/JavaScript/Reference/Errors/Reduce_of_empty_array_with_no_initial_value">TypeError: reduce of empty array with no initial value</a></code>。</dd> + <dt> + <h3 id="返回值">返回值</h3> + </dt> + <dd> + <p>执行之后的返回值。</p> + </dd> +</dl> + +<h2 id="描述">描述</h2> + +<p><code>reduceRight</code> 为数组中每个元素调用一次 <code>callback</code> 回调函数，但是数组中被删除的索引或从未被赋值的索引会跳过。回调函数接受四个参数：初始值（或上次调用回调的返回值）、当前元素值、当前索引，以及调用迭代的当前数组。</p> + +<p>可以像下面这样调用 <code>reduceRight</code> 的回调函数 <code>callback</code>：</p> + +<pre class="brush: js notranslate">array.reduceRight(function(accumulator, currentValue, index, array) { + // ... +});</pre> + +<p>首次调用回调函数时，<code>accumulator</code> 和 <code>currentValue</code> 的可能取值情况有两种：</p> + +<ul> + <li>如果在调用 <code>reduceRight</code> 时提供了 <code>initialValue</code> 参数，则 <code>accumulator</code> 等于 <code>initialValue</code>，<code>currentValue</code> 等于数组中的最后一个元素。</li> + <li>如果没有提供 <code>initialValue</code> 参数，则 <code>accumulator</code> 等于数组最后一个元素， <code>currentValue</code> 等于数组中倒数第二个元素。</li> +</ul> + +<p>如果数组为空，但提供了 <code>initialValue</code> 参数，或如果数组中只有一个元素，且没有提供 <code>initialValue</code> 参数，将会直接返回 <code>initialValue</code> 参数或数组中的那一个元素。这两种情况下，都不会调用 <code>callback</code> 函数。</p> + +<p>如果数组为空，且没有提供 <code>initialValue</code> 参数，则会抛出一个 <code>TypeError</code> 错误。</p> + +<p>最终，首次调用时的情况可汇总为此表：</p> + +<table class="standard-table"> + <thead> + <tr> + <th>数组内元素数量</th> + <th>是否提供 <code>initialValue</code></th> + <th>结果</th> + </tr> + </thead> + <tbody> + <tr> + <td rowspan="2">> 1</td> + <td>未提供</td> + <td><code>accumulator</code> 为<u>数组中</u>（下略）最后一个元素<br> + <code>currentValue</code> 为倒数第二个元素</td> + </tr> + <tr> + <td>提供</td> + <td><code>accumulator</code> 为 <code>initialValue</code><br> + <code>currentValue</code> 为最后一个元素</td> + </tr> + <tr> + <td>= 1</td> + <td>未提供</td> + <td>直接返回数组中的唯一一个元素</td> + </tr> + <tr> + <td rowspan="2">= 0</td> + <td>提供</td> + <td>直接返回 <code>initialValue</code></td> + </tr> + <tr> + <td>未提供</td> + <td>抛出 <code>TypeError</code> 错误</td> + </tr> + </tbody> +</table> + +<p>该函数的完整执行过程见下例：</p> + +<pre class="brush: js notranslate">[0, 1, 2, 3, 4].reduceRight(function(previousValue, currentValue, index, array) { + return previousValue + currentValue; +}); +</pre> + +<p>一共会调用四次回调函数，每次调用的参数及返回值如下：</p> + +<table style="width: 100%;"> + <thead> + <tr> + <th scope="col"><code>callback</code></th> + <th scope="col"><code>previousValue</code></th> + <th scope="col"><code>currentValue</code></th> + <th scope="col"><code>index</code></th> + <th scope="col"><code>array</code></th> + <th scope="col">返回值</th> + </tr> + </thead> + <tbody> + <tr> + <th scope="row">第一次调用</th> + <td><code>4</code></td> + <td><code>3</code></td> + <td><code>3</code></td> + <td><code>[0,1,2,3,4]</code></td> + <td><code>7</code></td> + </tr> + <tr> + <th scope="row">第二次调用</th> + <td><code>7</code></td> + <td><code>2</code></td> + <td><code>2</code></td> + <td><code>[0,1,2,3,4]</code></td> + <td><code>9</code></td> + </tr> + <tr> + <th scope="row">第三次调用</th> + <td><code>9</code></td> + <td><code>1</code></td> + <td><code>1</code></td> + <td><code>[0,1,2,3,4]</code></td> + <td><code>10</code></td> + </tr> + <tr> + <th scope="row">第四次调用</th> + <td><code>10</code></td> + <td><code>0</code></td> + <td><code>0</code></td> + <td><code>[0,1,2,3,4]</code></td> + <td><code>10</code></td> + </tr> + </tbody> +</table> + +<p><code>reduceRight</code> 返回值是最后一次调用回调的返回值（<code>10</code>）。</p> + +<p>如果提供了一个 <code>initialValue</code> 参数，则结果如下：</p> + +<pre class="brush: js notranslate">[0, 1, 2, 3, 4].reduceRight(function(previousValue, currentValue, index, array) { + return previousValue + currentValue; +}, 10); +</pre> + +<table style="width: 100%;"> + <thead> + <tr> + <th scope="col"><code>callback</code></th> + <th scope="col"><code>previousValue</code></th> + <th scope="col"><code>currentValue</code></th> + <th scope="col"><code>index</code></th> + <th scope="col"><code>array</code></th> + <th scope="col">返回值</th> + </tr> + </thead> + <tbody> + <tr> + <th scope="row">第一次调用</th> + <td><code>10</code></td> + <td><code>4</code></td> + <td><code>4</code></td> + <td><code>[0,1,2,3,4]</code></td> + <td><code>14</code></td> + </tr> + <tr> + <th scope="row">第二次调用</th> + <td><code>14</code></td> + <td><code>3</code></td> + <td><code>3</code></td> + <td><code>[0,1,2,3,4]</code></td> + <td><code>17</code></td> + </tr> + <tr> + <th scope="row">第三次调用</th> + <td><code>17</code></td> + <td><code>2</code></td> + <td><code>2</code></td> + <td><code>[0,1,2,3,4]</code></td> + <td><code>19</code></td> + </tr> + <tr> + <th scope="row">第四次调用</th> + <td><code>19</code></td> + <td><code>1</code></td> + <td><code>1</code></td> + <td><code>[0,1,2,3,4]</code></td> + <td><code>20</code></td> + </tr> + <tr> + <th scope="row">第五次调用</th> + <td><code>20</code></td> + <td><code>0</code></td> + <td><code>0</code></td> + <td><code>[0,1,2,3,4]</code></td> + <td><code>20</code></td> + </tr> + </tbody> +</table> + +<p>这时，<code>reduceRight</code> 返回值为 20。</p> + +<h2 id="示例">示例</h2> + +<h3 id="求一个数组中所有值的和">求一个数组中所有值的和</h3> + +<pre class="brush: js notranslate">var sum = [0, 1, 2, 3].reduceRight(function(a, b) { + return a + b; +}); +// sum is 6</pre> + +<h3 id="扁平化（flatten）一个二维数组">扁平化（flatten）一个二维数组</h3> + +<pre class="brush: js notranslate">var flattened = [[0, 1], [2, 3], [4, 5]].reduceRight(function(a, b) { + return a.concat(b); +}, []); +// flattened is [4, 5, 2, 3, 0, 1] +</pre> + +<h3 id="运行一个带有回调每个函数将其结果传给下一个的异步函数列表">运行一个带有回调每个函数将其结果传给下一个的异步函数列表</h3> + +<pre class="brush: js notranslate">const waterfall = (...functions) => (callback, ...args) => + functions.reduceRight( + (composition, fn) => (...results) => fn(composition, ...results), + callback + )(...args); + +const randInt = max => Math.floor(Math.random() * max) + +const add5 = (callback, x) => { + setTimeout(callback, randInt(1000), x + 5); +}; +const mult3 = (callback, x) => { + setTimeout(callback, randInt(1000), x * 3); +}; +const sub2 = (callback, x) => { + setTimeout(callback, randInt(1000), x - 2); +}; +const split = (callback, x) => { + setTimeout(callback, randInt(1000), x, x); +}; +const add = (callback, x, y) => { + setTimeout(callback, randInt(1000), x + y); +}; +const div4 = (callback, x) => { + setTimeout(callback, randInt(1000), x / 4); +}; + +const computation = waterfall(add5, mult3, sub2, split, add, div4); +computation(console.log, 5) // -> 14 + +// same as: + +const computation2 = (input, callback) => { + const f6 = x=> div4(callback, x); + const f5 = (x, y) => add(f6, x, y); + const f4 = x => split(f5, x); + const f3 = x => sub2(f4, x); + const f2 = x => mult3(f3, x); + add5(f2, input); +}</pre> + +<h3 id="展示_reduce_与_reduceRight_之间的区别">展示 <code>reduce</code> 与 <code>reduceRight</code> 之间的区别</h3> + +<pre class="brush: js notranslate">var a = ['1', '2', '3', '4', '5']; +var left = a.reduce(function(prev, cur) { return prev + cur; }); +var right = a.reduceRight(function(prev, cur) { return prev + cur; }); + +console.log(left); // "12345" +console.log(right); // "54321"</pre> + +<h3 id="定义可组合函数">定义可组合函数</h3> + +<p>组合函数的概念简单，它只是简单地结合了多个函数。它是一个从右向左流动的函数，用上一个函数的输出调用每个函数。</p> + +<pre class="brush: js notranslate">/** + * Function Composition is way in which result of one function can + * be passed to another and so on. + * + * h(x) = f(g(x)) + * + * Function execution happens right to left + * + * https://en.wikipedia.org/wiki/Function_composition + */ + +const compose = (...args) => (value) => args.reduceRight((acc, fn) => fn(acc), value) + +// Increament passed number +const inc = (n) => n + 1 + +// Doubles the passed value +const double = (n) => n * 2 + +// using composition function +console.log(compose(double, inc)(2)); // 6 + +// using composition function +console.log(compose(inc, double)(2)); // 5</pre> + +<h2 id="兼容旧环境（Polyfill）">兼容旧环境（Polyfill）</h2> + +<p><code>reduceRight</code> 被添加到 ECMA-262 标准第 5 版，因此它在某些实现环境中可能不被支持。把下面的代码添加到脚本开头可以解决此问题，从而允许在那些没有原生支持 <code>reduceRight</code> 的实现环境中使用它。</p> + +<pre class="brush: js notranslate">// Production steps of ECMA-262, Edition 5, 15.4.4.22 +// Reference: http://es5.github.io/#x15.4.4.22 +if ('function' !== typeof Array.prototype.reduceRight) { + Array.prototype.reduceRight = function(callback /*, initialValue*/) { + 'use strict'; + if (null === this || 'undefined' === typeof this) { + throw new TypeError('Array.prototype.reduceRight called on null or undefined'); + } + if ('function' !== typeof callback) { + throw new TypeError(callback + ' is not a function'); + } + var t = Object(this), len = t.length >>> 0, k = len - 1, value; + if (arguments.length >= 2) { + value = arguments[1]; + } else { + while (k >= 0 && !(k in t)) { + k--; + } + if (k < 0) { + throw new TypeError('reduceRight of empty array with no initial value'); + } + value = t[k--]; + } + for (; k >= 0; k--) { + if (k in t) { + value = callback(value, t[k], k, t); + } + } + return value; + }; +} +</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('ES5.1', '#sec-15.4.4.22', 'Array.prototype.reduceRight')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td>Initial definition.<br> + Implemented in JavaScript 1.8</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-array.prototype.reduceright', 'Array.prototype.reduceRight')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-array.prototype.reduceright', 'Array.prototype.reduceRight')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> + + +<p>{{Compat("javascript.builtins.Array.reduceRight")}}</p> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Array.prototype.reduce()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/array/reverse/index.html b/files/zh-cn/web/javascript/reference/global_objects/array/reverse/index.html new file mode 100644 index 0000000000..a9c984245f --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/array/reverse/index.html @@ -0,0 +1,141 @@ +--- +title: Array.prototype.reverse() +slug: Web/JavaScript/Reference/Global_Objects/Array/reverse +tags: + - Array + - Array.prototype.reverse() + - JavaScript + - 原型 + - 数组 + - 方法 +translation_of: Web/JavaScript/Reference/Global_Objects/Array/reverse +--- +<div>{{JSRef}}</div> + +<p><code><strong>reverse()</strong></code> 方法将数组中元素的位置颠倒，并返回该数组。数组的第一个元素会变成最后一个，数组的最后一个元素变成第一个。该方法会改变原数组。</p> + +<div>{{EmbedInteractiveExample("pages/js/array-reverse.html")}}</div> + +<div></div> + +<div></div> + +<h2 id="语法" style="margin-bottom: 20px; line-height: 30px;">语法</h2> + +<pre class="syntaxbox"><code><var> arr</var>.reverse()</code></pre> + +<h3 id="返回值" style="line-height: 24px;">返回值</h3> + +<p>颠倒后的数组。</p> + +<h2 id="描述" style="margin-bottom: 20px; line-height: 30px;">描述</h2> + +<p><code>reverse</code> 方法颠倒数组中元素的位置，改变了数组，并返回该数组的引用。</p> + +<p>reverse方法是特意类化的；此方法可被 <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/call" title="The call() method calls a function with a given this value and arguments provided individually.">called</a> 或 <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/apply" title="The apply() method calls a function with a given this value, and arguments provided as an array (or an array-like object).">applied</a>于类似数组对象。对象如果不包含反映一系列连续的、基于零的数值属性中的最后一个长度的属性，则该对象可能不会以任何有意义的方式运行。</p> + +<h2 id="示例" style="margin-bottom: 20px; line-height: 30px;">示例</h2> + +<h3 id="颠倒数组中的元素" style="line-height: 24px;">颠倒数组中的元素</h3> + +<p>下例将会创建一个数组 sourceArray，其包含三个元素，然后颠倒该数组。</p> + +<p> <code>reverse()</code> 的调用返回了一个颠倒后的数组 <code>a</code>的引用。</p> + +<pre><code>const a = [1, 2, 3]; + +console.log(a); // [1, 2, 3] + +a.reverse(); + +console.log(a); // [3, 2, 1]</code></pre> + +<h3 id="颠倒类数组中的元素">颠倒类数组中的元素</h3> + +<p>下例创造了一个类数组对象 <code>a</code>, 包含3个元素和一个 length 属性, 然后颠倒这个类数组对象。 <code>reverse()</code> 的调用返回一个颠倒后的类数组对象 <code>a</code>的引用。</p> + +<pre><code>const a = {0: 1, 1: 2, 2: 3, length: 3}; + +console.log(a); // {0: 1, 1: 2, 2: 3, length: 3} + +Array.prototype.reverse.call(a); //same syntax for using apply() + +console.log(a); // {0: 3, 1: 2, 2: 1, length: 3}</code></pre> + +<h2 id="Specifications">Specifications</h2> + +<table> + <tbody> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + <tr> + <td>{{SpecName('ES1')}}</td> + <td>{{Spec2('ES1')}}</td> + <td>Initial definition. Implemented in JavaScript 1.1.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.4.4.8', 'Array.prototype.reverse')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-array.prototype.reverse', 'Array.prototype.reverse')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-array.prototype.reverse', 'Array.prototype.reverse')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> <br> + </td> + </tr> + </tbody> +</table> + +<h2 id="规范" style="margin-bottom: 20px; line-height: 30px;">规范</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('ES1')}}</td> + <td>{{Spec2('ES1')}}</td> + <td>Initial definition. Implemented in JavaScript 1.1</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.4.4.8', 'Array.prototype.reverse')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-array.prototype.reverse', 'Array.prototype.reverse')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性" style="margin-bottom: 20px; line-height: 30px;">浏览器兼容性</h2> + +<div> +<div> + + +<p>{{Compat("javascript.builtins.Array.reverse")}}</p> +</div> +</div> + +<h2 id="See_also" name="See_also" style="margin-bottom: 20px; line-height: 30px;">相关链接</h2> + +<ul> + <li>{{jsxref("Array.prototype.join()")}}</li> + <li>{{jsxref("Array.prototype.sort()")}}</li> + <li>{{jsxref("TypedArray.prototype.reverse()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/array/shift/index.html b/files/zh-cn/web/javascript/reference/global_objects/array/shift/index.html new file mode 100644 index 0000000000..3675c12bc4 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/array/shift/index.html @@ -0,0 +1,129 @@ +--- +title: Array.prototype.shift() +slug: Web/JavaScript/Reference/Global_Objects/Array/shift +tags: + - Array.prototype.shift() + - JavaScript + - 原型 + - 数组 + - 方法 +translation_of: Web/JavaScript/Reference/Global_Objects/Array/shift +--- +<div>{{JSRef}}</div> + +<p><code><strong>shift()</strong></code> 方法从数组中删除<strong>第一个</strong>元素，并返回该元素的值。此方法更改数组的长度。</p> + +<div>{{EmbedInteractiveExample("pages/js/array-shift.html")}}</div> + +<p class="hidden">这份交互测试源码存储在Github仓库中。如果你想为这份交互测试源码做贡献, 请克隆 <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> 同时提交一个pull request.</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><var>arr</var>.shift()</code></pre> + + + +<h3 id="返回值">返回值 </h3> + +<p>从数组中删除的元素; 如果数组为空则返回{{jsxref("undefined")}} 。 </p> + +<h2 id="描述">描述</h2> + +<p><code>shift</code> 方法移除索引为 0 的元素(即第一个元素)，并返回被移除的元素，其他元素的索引值随之减 1。如果 {{jsxref("Array.length", "length")}} 属性的值为 0 (长度为 0)，则返回 {{jsxref("undefined")}}。</p> + +<p><code>shift</code> 方法并不局限于数组：这个方法能够通过 {{jsxref("Function.call", "call")}} 或 {{jsxref("Function.apply", "apply")}} 方法作用于类似数组的对象上。但是对于没有 length 属性（从0开始的一系列连续的数字属性的最后一个）的对象，调用该方法可能没有任何意义。</p> + +<p>{{jsxref("Array.prototype.pop()")}} 有着和 <code>shift</code>相似的行为, 但是是作用在数组的最后一个元素上的。</p> + +<h2 id="示例">示例</h2> + +<h3 id="移除数组中的一个元素">移除数组中的一个元素</h3> + +<p>以下代码显示了删除其第一个元素之前和之后的myFish数组。它还显示已删除的元素：</p> + +<pre class="brush: js">let myFish = ['angel', 'clown', 'mandarin', 'surgeon']; + +console.log('调用 shift 之前: ' + myFish); +// "调用 shift 之前: angel,clown,mandarin,surgeon" + +var shifted = myFish.shift(); + +console.log('调用 shift 之后: ' + myFish); +// "调用 shift 之后: clown,mandarin,surgeon" + +console.log('被删除的元素: ' + shifted); +// "被删除的元素: angel"</pre> + +<pre><code>var myFish = ['angel', 'clown', 'mandarin', 'surgeon']; + +console.log('myFish before:', JSON.stringify(myFish)); +// myFish before: ['angel', 'clown', 'mandarin', 'surgeon'] + +var shifted = myFish.shift(); + +console.log('myFish after:', myFish); +// myFish after: ['clown', 'mandarin', 'surgeon'] + +console.log('Removed this element:', shifted); +// Removed this element: angel</code></pre> + +<h3 id="在while循环中使用shift">在while循环中使用shift()</h3> + +<p>shift() 方法经常用于while loop的环境中.。下例中每个循环将要从一个数组中移除下一项元素，直至它成为空数组。</p> + +<pre><code>var names = ["Andrew", "Edward", "Paul", "Chris" ,"John"]; + +while( (i = names.shift()) !== undefined ) { + console.log(i); +} +// Andrew, Edward, Paul, Chris, John</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>{{SpecName('ES3')}}</td> + <td>{{Spec2('ES3')}}</td> + <td>Initial definition. Implemented in JavaScript 1.2.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.4.4.9', 'Array.prototype.shift')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-array.prototype.shift', 'Array.prototype.shift')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-array.prototype.shift', 'Array.prototype.shift')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器支持">浏览器支持</h2> + +<div> +<div> + + +<p>{{Compat("javascript.builtins.Array.shift")}}</p> +</div> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Array.prototype.push()")}}</li> + <li>{{jsxref("Array.prototype.pop()")}}</li> + <li>{{jsxref("Array.prototype.unshift()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/array/slice/index.html b/files/zh-cn/web/javascript/reference/global_objects/array/slice/index.html new file mode 100644 index 0000000000..eb68df4907 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/array/slice/index.html @@ -0,0 +1,253 @@ +--- +title: Array.prototype.slice() +slug: Web/JavaScript/Reference/Global_Objects/Array/slice +tags: + - Array + - JavaScript + - Prototype + - 原型 + - 数组 + - 方法 +translation_of: Web/JavaScript/Reference/Global_Objects/Array/slice +--- +<div>{{JSRef}}</div> + +<p><code><strong title="切片">slice()</strong></code> 方法返回一个新的数组对象，这一对象是一个由 <code>begin</code> 和 <code>end</code> 决定的原数组的<strong>浅拷贝</strong>（包括 <code>begin</code>，不包括<code>end</code>）。原始数组不会被改变。</p> + +<div>{{EmbedInteractiveExample("pages/js/array-slice.html")}}</div> + +<p class="hidden">The source for this interactive demo is stored in a GitHub repository. If you'd like to contribute to the interactive demo project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> and send us a pull request.</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox notranslate"><var>arr</var>.slice([<var>begin</var>[, <var>end</var>]])</pre> + +<h2 id="参数">参数</h2> + +<dl> + <dt><code>begin</code> {{optional_inline}}</dt> + <dd>提取起始处的索引（从 <code>0</code> 开始），从该索引开始提取原数组元素。</dd> + <dd>如果该参数为负数，则表示从原数组中的倒数第几个元素开始提取，<code>slice(-2)</code> 表示提取原数组中的倒数第二个元素到最后一个元素（包含最后一个元素）。</dd> + <dd>如果省略 <code>begin</code>，则 <code>slice</code> 从索引 <code>0</code> 开始。</dd> + <dd>如果 <code>begin</code> 超出原数组的索引范围，则会返回空数组。</dd> +</dl> + +<dl> + <dt><code>end</code> {{optional_inline}}</dt> + <dd>提取终止处的索引（从 <code>0</code> 开始），在该索引处结束提取原数组元素。<code>slice</code> 会提取原数组中索引从 <code>begin</code> 到 <code>end</code> 的所有元素（包含 <code>begin</code>，但不包含 <code>end</code>）。</dd> + <dd><code>slice(1,4)</code> 会提取原数组中从第二个元素开始一直到第四个元素的所有元素 （索引为 1, 2, 3的元素）。</dd> + <dd>如果该参数为负数， 则它表示在原数组中的倒数第几个元素结束抽取。 <code>slice(-2,-1)</code> 表示抽取了原数组中的倒数第二个元素到最后一个元素（不包含最后一个元素，也就是只有倒数第二个元素）。</dd> + <dd>如果 <code>end</code> 被省略，则 <code>slice</code> 会一直提取到原数组末尾。</dd> + <dd>如果 <code>end</code> 大于数组的长度，<code>slice</code> 也会一直提取到原数组末尾。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>一个含有被提取元素的新数组。</p> + +<h2 id="描述">描述</h2> + +<p><code>slice</code> 不会修改原数组，只会返回一个浅复制了原数组中的元素的一个新数组。原数组的元素会按照下述规则拷贝：</p> + +<ul> + <li>如果该元素是个对象引用 （不是实际的对象），<code>slice</code> 会拷贝这个对象引用到新的数组里。两个对象引用都引用了同一个对象。如果被引用的对象发生改变，则新的和原来的数组中的这个元素也会发生改变。</li> +</ul> + +<ul> + <li>对于字符串、数字及布尔值来说（不是 {{jsxref("Global_Objects/String", "String")}}、{{jsxref("Global_Objects/Number", "Number")}} 或者 {{jsxref("Boolean")}} 对象），<code>slice</code> 会拷贝这些值到新的数组里。在别的数组里修改这些字符串或数字或是布尔值，将不会影响另一个数组。</li> +</ul> + +<p>如果向两个数组任一中添加了新元素，则另一个不会受到影响。</p> + +<h2 id="Examples" name="Examples">示例</h2> + +<h3 id="返回现有数组的一部分">返回现有数组的一部分</h3> + +<pre class="brush: js notranslate">var fruits = ['Banana', 'Orange', 'Lemon', 'Apple', 'Mango']; +var citrus = fruits.slice(1, 3); + +// fruits contains ['Banana', 'Orange', 'Lemon', 'Apple', 'Mango'] +// citrus contains ['Orange','Lemon'] +</pre> + +<div class="standardNoteBlock"> +<p class="syntaxbox"><strong>译者注：citrus</strong> <em>[n.]</em> 柑橘类果实</p> +</div> + +<h3 id="使用_slice">使用 <code>slice</code></h3> + +<p>在下例中, <code>slice</code> 从 <code>myCar</code> 中创建了一个新数组<code>newCar</code>。两个数组都包含了一个 <code>myHonda</code> 对象的引用。当 <code>myHonda</code> 的 <code>color</code> 属性改变为 <code>purple</code>，则两个数组中的对应元素都会随之改变。</p> + +<pre class="brush: js notranslate">// 使用 slice 方法从 myCar 中创建一个 newCar。 +var myHonda = { color: 'red', wheels: 4, engine: { cylinders: 4, size: 2.2 } }; +var myCar = [myHonda, 2, "cherry condition", "purchased 1997"]; +var newCar = myCar.slice(0, 2); + +// 输出 myCar、newCar 以及各自的 myHonda 对象引用的 color 属性。 +console.log(' myCar = ' + JSON.stringify(myCar)); +console.log('newCar = ' + JSON.stringify(newCar)); +console.log(' myCar[0].color = ' + JSON.stringify(myCar[0].color)); +console.log('newCar[0].color = ' + JSON.stringify(newCar[0].color)); + +// 改变 myHonda 对象的 color 属性. +myHonda.color = 'purple'; +console.log('The new color of my Honda is ' + myHonda.color); + +//输出 myCar、newCar 中各自的 myHonda 对象引用的 color 属性。 +console.log(' myCar[0].color = ' + myCar[0].color); +console.log('newCar[0].color = ' + newCar[0].color); +</pre> + +<p>上述代码输出：</p> + +<pre class="brush: js notranslate"> myCar = [{color: 'red', wheels: 4, engine: {cylinders: 4, size: 2.2}}, 2, + 'cherry condition', 'purchased 1997'] +newCar = [{color: 'red', wheels: 4, engine: {cylinders: 4, size: 2.2}}, 2] + myCar[0].color = red +newCar[0].color = red +The new color of my Honda is purple + myCar[0].color = purple +newCar[0].color = purple +</pre> + +<h2 id="Array-like" name="Array-like">类数组（Array-like）对象</h2> + +<p><code>slice</code> 方法可以用来将一个类数组（Array-like）对象/集合转换成一个新数组。你只需将该方法绑定到这个对象上。 一个函数中的 {{jsxref("Functions/arguments", "arguments")}} 就是一个类数组对象的例子。</p> + +<pre class="brush: js notranslate">function list() { + return Array.prototype.slice.call(arguments); +} + +var list1 = list(1, 2, 3); // [1, 2, 3] +</pre> + +<p>除了使用 <code>Array.prototype.slice.call(</code><code>arguments</code><code>)</code>，你也可以简单的使用 <code>[].slice.call(arguments)</code> 来代替。另外，你可以使用 <code>bind</code> 来简化该过程。</p> + +<pre class="brush: js notranslate">var unboundSlice = Array.prototype.slice; +var slice = Function.prototype.call.bind(unboundSlice); + +function list() { + return slice(arguments); +} + +var list1 = list(1, 2, 3); // [1, 2, 3] +</pre> + +<h2 id="精简跨浏览器行为">精简跨浏览器行为</h2> + +<p>根据规范，使用 <code>Array.prototype.slice</code> 转换宿主对象（如 DOM 对象）时，不必遵循 Mozilla 的默认行为，即可以转化任何符合条件的伪数组宿主对象为数组，IE < 9 没有遵循，而 IE9 + 遵循这个行为，但是稍加改造可以使其在跨浏览器使用时更可靠。只要其他现代浏览器继续支持该行为，目前 IE 9+、FireFox、Chrome、Safari 以及 Opera 都支持，开发者在使用下面代码时遍历 DOM 时就不会被该方法的字面意义误导，即 IE < 9 不能转化 DOM Collections。开发者可以安全地根据语义知道该方法的实际上的标准行为。（下面的代码还修正了 IE 中 <code>slice()</code> 方法第二个参数不允许为显式的 {{jsxref("Global_Objects/null", "null")}}/{{jsxref("Global_Objects/undefined", "undefined")}} 值的问题，其他现代浏览器，包括 IE9+ 都允许）。</p> + +<pre class="brush: js notranslate">/** + * Shim for "fixing" IE's lack of support (IE < 9) for applying slice + * on host objects like NamedNodeMap, NodeList, and HTMLCollection + * (technically, since host objects have been implementation-dependent, + * at least before ES2015, IE hasn't needed to work this way). + * Also works on strings, fixes IE < 9 to allow an explicit undefined + * for the 2nd argument (as in Firefox), and prevents errors when + * called on other DOM objects. + */ +(function () { + 'use strict'; + var _slice = Array.prototype.slice; + + try { + // Can't be used with DOM elements in IE < 9 + _slice.call(document.documentElement); + } catch (e) { // Fails in IE < 9 + // This will work for genuine arrays, array-like objects, + // NamedNodeMap (attributes, entities, notations), + // NodeList (e.g., getElementsByTagName), HTMLCollection (e.g., childNodes), + // and will not fail on other DOM objects (as do DOM elements in IE < 9) + Array.prototype.slice = function(begin, end) { + // IE < 9 gets unhappy with an undefined end argument + end = (typeof end !== 'undefined') ? end : this.length; + + // For native Array objects, we use the native slice function + if (Object.prototype.toString.call(this) === '[object Array]'){ + return _slice.call(this, begin, end); + } + + // For array like object we handle it ourselves. + var i, cloned = [], + size, len = this.length; + + // Handle negative value for "begin" + var start = begin || 0; + start = (start >= 0) ? start : Math.max(0, len + start); + + // Handle negative value for "end" + var upTo = (typeof end == 'number') ? Math.min(end, len) : len; + if (end < 0) { + upTo = len + end; + } + + // Actual expected size of the slice + size = upTo - start; + + if (size > 0) { + cloned = new Array(size); + if (this.charAt) { + for (i = 0; i < size; i++) { + cloned[i] = this.charAt(start + i); + } + } else { + for (i = 0; i < size; i++) { + cloned[i] = this[start + i]; + } + } + } + + return cloned; + }; + } +}()); +</pre> + +<h2 id="规范" style="margin-bottom: 20px; line-height: 30px;">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范</th> + <th scope="col">状态</th> + <th scope="col">备注</th> + </tr> + <tr> + <td>{{SpecName('ES3')}}</td> + <td>{{Spec2('ES3')}}</td> + <td>Initial definition.<br> + Implemented in JavaScript 1.2</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.4.4.10', 'Array.prototype.slice')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-array.prototype.slice', 'Array.prototype.slice')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-array.prototype.slice', 'Array.prototype.slice')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性" style="margin-bottom: 20px; line-height: 30px;">浏览器兼容性</h2> + +<div> + + +<p>{{Compat("javascript.builtins.Array.slice")}}</p> +</div> + +<h2 id="See_also" name="See_also" style="margin-bottom: 20px; line-height: 30px;">相关链接</h2> + +<ul> + <li>{{jsxref("Array.prototype.splice()")}}</li> + <li>{{jsxref("Function.prototype.call()")}}</li> + <li>{{jsxref("Function.prototype.bind()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/array/some/index.html b/files/zh-cn/web/javascript/reference/global_objects/array/some/index.html new file mode 100644 index 0000000000..734cace600 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/array/some/index.html @@ -0,0 +1,215 @@ +--- +title: Array.prototype.some() +slug: Web/JavaScript/Reference/Global_Objects/Array/some +tags: + - Array + - ECMAScript5 + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Array/some +--- +<div>{{JSRef}}</div> + +<p><code><strong>some()</strong></code> 方法测试数组中是不是至少有1个元素通过了被提供的函数测试。它返回的是一个Boolean类型的值。</p> + +<div class="note"> +<p><strong>注意：</strong>如果用一个空数组进行测试，在任何情况下它返回的都是<code>false</code>。</p> +</div> + +<div>{{EmbedInteractiveExample("pages/js/array-some.html")}}</div> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code><em>arr</em>.some(<em>callback(element[, index[, array]])[, thisArg]</em>)</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>callback</code></dt> + <dd>用来测试每个元素的函数，接受三个参数： + <dl> + <dt><code>element</code></dt> + <dd>数组中正在处理的元素。</dd> + <dt><code>index</code> {{Optional_inline}}</dt> + <dd>数组中正在处理的元素的索引值。</dd> + <dt><code>array</code>{{Optional_inline}}</dt> + <dd><code>some()</code>被调用的数组。</dd> + </dl> + </dd> + <dt><code>thisArg</code>{{Optional_inline}}</dt> + <dd>执行 <code>callback</code> 时使用的 <code>this</code> 值。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>数组中有至少一个元素通过回调函数的测试就会返回<strong><code>true</code></strong>；所有元素都没有通过回调函数的测试返回值才会为false。</p> + +<h2 id="Description" name="Description">描述</h2> + +<p><code>some()</code> 为数组中的每一个元素执行一次 <code>callback</code> 函数，直到找到一个使得 callback 返回一个“真值”（即可转换为布尔值 true 的值）。如果找到了这样一个值，<code>some()</code> 将会立即返回 <code>true</code>。否则，<code>some()</code> 返回 <code>false</code>。<code>callback</code> 只会在那些”有值“的索引上被调用，不会在那些被删除或从来未被赋值的索引上调用。</p> + +<p><code style="font-style: normal; line-height: 1.5;">callback</code><span style="line-height: 1.5;"> 被调用时传入三个参数：元素的值，元素的索引，被遍历的数组。</span></p> + +<p>如果一个<code>thisArg</code>参数提供给some()，它将被用作调用的 <code>callback</code>的 <code>this</code> 值。否则， 它的 <code>this</code> value将是 <code>undefined</code>。<code>this</code>的值最终通过callback来观察，根据 <a href="/en-US/docs/Web/JavaScript/Reference/Operators/this">the usual rules for determining the <code>this</code> seen by a function</a>的this判定规则来确定。</p> + +<p><code>some()</code> 被调用时不会改变数组。</p> + +<p><code>some()</code> 遍历的元素的范围在第一次调用 <code>callback</code>. 前就已经确定了。在调用 <code>some()</code> 后被添加到数组中的值不会被 <code>callback</code> 访问到。如果数组中存在且还未被访问到的元素被 <code>callback</code> 改变了，则其传递给 <code>callback</code> 的值是 <code>some()</code> 访问到它那一刻的值。已经被删除的元素不会被访问到。</p> + +<h2 id="Examples" name="Examples">示例</h2> + +<h3 id="Example_Testing_size_of_all_array_elements" name="Example:_Testing_size_of_all_array_elements">测试数组元素的值</h3> + +<p>下面的例子检测在数组中是否有元素大于 10。</p> + +<pre class="brush: js">function isBiggerThan10(element, index, array) { + return element > 10; +} + +[2, 5, 8, 1, 4].some(isBiggerThan10); // false +[12, 5, 8, 1, 4].some(isBiggerThan10); // true</pre> + +<h3 id="使用箭头函数测试数组元素的值">使用箭头函数测试数组元素的值</h3> + +<p><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions">箭头函数</a> 可以通过更简洁的语法实现相同的用例.</p> + +<pre class="brush: js"><code>[2, 5, 8, 1, 4].some(x => x > 10); // false +[12, 5, 8, 1, 4].some(x => x > 10); // true</code></pre> + +<p>{{ EmbedLiveSample('Testing_array_elements_using_arrow_functions', '', '', '', 'Web/JavaScript/Reference/Global_Objects/Array/some') }}</p> + +<h3 id="判断数组元素中是否存在某个值">判断数组元素中是否存在某个值</h3> + +<p>此例中为模仿 <code>includes()</code> 方法, 若元素在数组中存在, 则回调函数返回值为 <code>true</code> :</p> + +<pre class="brush: js">var fruits = ['apple', 'banana', 'mango', 'guava']; + +function checkAvailability(arr, val) { + return arr.some(function(arrVal) { + return val === arrVal; + }); +} + +checkAvailability(fruits, 'kela'); // false +checkAvailability(fruits, 'banana'); // true</pre> + +<p>{{ EmbedLiveSample('Checking_whether_a_value_exists_in_an_array', '', '', '', 'Web/JavaScript/Reference/Global_Objects/Array/some') }}</p> + +<h3 id="使用箭头函数判断数组元素中是否存在某个值">使用箭头函数判断数组元素中是否存在某个值</h3> + +<pre class="brush: js">var fruits = ['apple', 'banana', 'mango', 'guava']; + +function checkAvailability(arr, val) { + return arr.some(arrVal => val === arrVal); +} + +checkAvailability(fruits, 'kela'); // false +checkAvailability(fruits, 'banana'); // true</pre> + +<p>{{ EmbedLiveSample('Checking_whether_a_value_exists_using_an_arrow_function', '', '', '', 'Experiment:StaticExamplesOnTop/JavaScript/Array/some') }}</p> + + + +<h3 id="将任意值转换为布尔类型">将任意值转换为布尔类型</h3> + +<pre class="brush: js">var TRUTHY_VALUES = [true, 'true', 1]; + +function getBoolean(value) { + 'use strict'; + + if (typeof value === 'string') { + value = value.toLowerCase().trim(); + } + + return TRUTHY_VALUES.some(function(t) { + return t === value; + }); +} + +getBoolean(false); // false +getBoolean('false'); // false +getBoolean(1); // true +getBoolean('true'); // true +</pre> + +<p>{{ EmbedLiveSample('Converting_any_value_to_Boolean', '', '', '', 'Web/JavaScript/Reference/Global_Objects/Array/some') }}</p> + +<h2 id="Compatibility" name="Compatibility">Polyfill</h2> + +<p>在第 5 版时，<code>some()</code> 被添加进 ECMA-262 标准；这样导致某些实现环境可能不支持它。你可以把下面的代码插入到脚本的开头来解决此问题，从而允许在那些没有原生支持它的实现环境中使用它。该算法是 ECMA-262 第 5 版中指定的算法，假定 <code>Object </code>和 <code>TypeError</code> 拥有他们的初始值，且 <code>fun.call</code> 等价于 <code>{{jsxref("Function.prototype.call")}}</code>。</p> + +<pre class="brush: js">// Production steps of ECMA-262, Edition 5, 15.4.4.17 +// Reference: http://es5.github.io/#x15.4.4.17 +if (!Array.prototype.some) { + Array.prototype.some = function(fun/*, thisArg*/) { + 'use strict'; + + if (this == null) { + throw new TypeError('Array.prototype.some called on null or undefined'); + } + + if (typeof fun !== 'function') { + throw new TypeError(); + } + + var t = Object(this); + var len = t.length >>> 0; + + var thisArg = arguments.length >= 2 ? arguments[1] : void 0; + for (var i = 0; i < len; i++) { + if (i in t && fun.call(thisArg, t[i], i, t)) { + return true; + } + } + + return false; + }; +}</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('ES5.1', '#sec-15.4.4.17', 'Array.prototype.some')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> + <p>Initial definition. Implemented in JavaScript 1.6.</p> + </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-array.prototype.some', 'Array.prototype.some')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-array.prototype.some', 'Array.prototype.some')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容">浏览器兼容</h2> + +<div> + + +<p>{{Compat("javascript.builtins.Array.some")}}</p> +</div> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("Array.prototype.find()")}}</li> + <li>{{jsxref("Array.prototype.forEach()")}}</li> + <li>{{jsxref("Array.prototype.every()")}}</li> + <li>{{jsxref("TypedArray.prototype.some()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/array/sort/index.html b/files/zh-cn/web/javascript/reference/global_objects/array/sort/index.html new file mode 100644 index 0000000000..e9f9808420 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/array/sort/index.html @@ -0,0 +1,265 @@ +--- +title: Array.prototype.sort() +slug: Web/JavaScript/Reference/Global_Objects/Array/sort +tags: + - Array + - Array & sort + - JavaScript + - Prototype + - sort +translation_of: Web/JavaScript/Reference/Global_Objects/Array/sort +--- +<div>{{JSRef}}</div> + +<p><code><strong>sort()</strong></code> 方法用<a href="https://en.wikipedia.org/wiki/In-place_algorithm">原地算法</a>对数组的元素进行排序，并返回数组。默认排序顺序是在将元素转换为字符串，然后比较它们的UTF-16代码单元值序列时构建的</p> + +<p>由于它取决于具体实现，因此无法保证排序的时间和空间复杂性。</p> + +<div>{{EmbedInteractiveExample("pages/js/array-sort.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>arr</var>.sort(<var>[compareFunction]</var>) +</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>compareFunction</code> {{optional_inline}}</dt> + <dd>用来指定按某种顺序进行排列的函数。如果省略，元素按照转换为的字符串的各个字符的Unicode位点进行排序。 + <dl> + <dt><code>firstEl</code></dt> + <dd>第一个用于比较的元素。</dd> + <dt><code>secondEl</code></dt> + <dd>第二个用于比较的元素。</dd> + </dl> + </dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>排序后的数组。请注意，数组已原地排序，并且不进行复制。</p> + +<h2 id="Description" name="Description">描述</h2> + +<p>如果没有指明 <code>compareFunction</code> ，那么元素会按照转换为的字符串的诸个字符的Unicode位点进行排序。例如 "Banana" 会被排列到 "cherry" 之前。当数字按由小到大排序时，9 出现在 80 之前，但因为（没有指明 <code>compareFunction</code>），比较的数字会先被转换为字符串，所以在Unicode顺序上 "80" 要比 "9" 要靠前。</p> + +<p>如果指明了 <code>compareFunction</code> ，那么数组会按照调用该函数的返回值排序。即 a 和 b 是两个将要被比较的元素：</p> + +<ul> + <li>如果 <code>compareFunction(a, b)</code> 小于 0 ，那么 a 会被排列到 b 之前；</li> +</ul> + +<ul> + <li>如果 <code>compareFunction(a, b)</code> 等于 0 ， a 和 b 的相对位置不变。备注： ECMAScript 标准并不保证这一行为，而且也不是所有浏览器都会遵守（例如 Mozilla 在 2003 年之前的版本）；</li> +</ul> + +<ul> + <li>如果 <code>compareFunction(a, b)</code> 大于 0 ， b 会被排列到 a 之前。</li> + <li><code>compareFunction(a, b)</code> 必须总是对相同的输入返回相同的比较结果，否则排序的结果将是不确定的。</li> +</ul> + +<p>所以，比较函数格式如下：</p> + +<pre class="brush: js">function compare(a, b) { + if (a < b ) { // 按某种排序标准进行比较, a 小于 b + return -1; + } + if (a > b ) { + return 1; + } + // a must be equal to b + return 0; +} +</pre> + +<p>要比较数字而非字符串，比较函数可以简单的以 a 减 b，如下的函数将会将数组升序排列</p> + +<pre class="brush: js">function compareNumbers(a, b) { + return a - b; +} +</pre> + +<p><code>sort</code> 方法可以使用 {{jsxref("Operators/function", "函数表达式", "", 1)}} 方便地书写：</p> + +<pre class="brush: js">var numbers = [4, 2, 5, 1, 3]; +numbers.sort(function(a, b) { + return a - b; +}); +console.log(numbers); + +也可以写成： +var numbers = [4, 2, 5, 1, 3]; +numbers.sort((a, b) => a - b); +console.log(numbers); + +// [1, 2, 3, 4, 5] +</pre> + +<p>对象可以按照某个属性排序：</p> + +<pre class="brush: js line-numbers language-js">var items = [ + { name: 'Edward', value: 21 }, + { name: 'Sharpe', value: 37 }, + { name: 'And', value: 45 }, + { name: 'The', value: -12 }, + { name: 'Magnetic' }, + { name: 'Zeros', value: 37 } +]; + +// sort by value +items.sort(function (a, b) { + return (a.value - b.value) +}); + +<code class="language-js"><span class="comment token">// sort by name</span> +items<span class="punctuation token">.</span><span class="function token">sort</span><span class="punctuation token">(</span><span class="keyword token">function</span><span class="punctuation token">(</span>a<span class="punctuation token">,</span> b<span class="punctuation token">)</span> <span class="punctuation token">{</span> + <span class="keyword token">var</span> nameA <span class="operator token">=</span> a<span class="punctuation token">.</span>name<span class="punctuation token">.</span><span class="function token">toUpperCase</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// ignore upper and lowercase</span> + <span class="keyword token">var</span> nameB <span class="operator token">=</span> b<span class="punctuation token">.</span>name<span class="punctuation token">.</span><span class="function token">toUpperCase</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// ignore upper and lowercase</span> + <span class="keyword token">if</span> <span class="punctuation token">(</span>nameA <span class="operator token"><</span> nameB<span class="punctuation token">)</span> <span class="punctuation token">{</span> + <span class="keyword token">return</span> <span class="operator token">-</span><span class="number token">1</span><span class="punctuation token">;</span> + <span class="punctuation token">}</span> + <span class="keyword token">if</span> <span class="punctuation token">(</span>nameA <span class="operator token">></span> nameB<span class="punctuation token">)</span> <span class="punctuation token">{</span> + <span class="keyword token">return</span> <span class="number token">1</span><span class="punctuation token">;</span> + <span class="punctuation token">}</span></code> + + <span class="comment token">// names must be equal</span> + <span class="keyword token">return</span> <span class="number token">0</span><span class="punctuation token">;</span> +<span class="punctuation token">}</span><span class="punctuation token">)</span><span class="punctuation token">;</span></pre> + +<h2 id="Examples" name="Examples">示例</h2> + +<h3 id="Example_Creating.2C_displaying.2C_and_sorting_an_array" name="Example:_Creating.2C_displaying.2C_and_sorting_an_array">创建、显示及排序数组</h3> + +<p>下述示例创建了四个数组，并展示原数组。之后对数组进行排序。对比了数字数组分别指定与不指定比较函数的结果。</p> + +<pre class="brush: js">var stringArray = ["Blue", "Humpback", "Beluga"]; +var numericStringArray = ["80", "9", "700"]; +var numberArray = [40, 1, 5, 200]; +var mixedNumericArray = ["80", "9", "700", 40, 1, 5, 200]; + +function compareNumbers(a, b) +{ + return a - b; +} + +console.log('stringArray:' + stringArray.join()); +console.log('Sorted:' + stringArray.sort()); + +console.log('numberArray:' + numberArray.join()); +console.log('Sorted without a compare function:'+ numberArray.sort()); +console.log('Sorted with compareNumbers:'+ numberArray.sort(compareNumbers)); + +console.log('numericStringArray:'+ numericStringArray.join()); +console.log('Sorted without a compare function:'+ numericStringArray.sort()); +console.log('Sorted with compareNumbers:'+ numericStringArray.sort(compareNumbers)); + +console.log('mixedNumericArray:'+ mixedNumericArray.join()); +console.log('Sorted without a compare function:'+ mixedNumericArray.sort()); +console.log('Sorted with compareNumbers:'+ mixedNumericArray.sort(compareNumbers)); +</pre> + +<p>该示例的返回结果如下。输出显示，当使用比较函数后，数字数组会按照数字大小排序。</p> + +<pre class="brush: js">stringArray: Blue,Humpback,Beluga +Sorted: Beluga,Blue,Humpback + +numberArray: 40,1,5,200 +Sorted without a compare function: 1,200,40,5 +Sorted with compareNumbers: 1,5,40,200 + +numericStringArray: 80,9,700 +Sorted without a compare function: 700,80,9 +Sorted with compareNumbers: 9,80,700 + +mixedNumericArray: 80,9,700,40,1,5,200 +Sorted without a compare function: 1,200,40,5,700,80,9 +Sorted with compareNumbers: 1,5,9,40,80,200,700 +</pre> + +<h3 id="Example_Sorting_non-ASCII_characters" name="Example:_Sorting_non-ASCII_characters">对非 ASCII 字符排序</h3> + +<p>当排序非 ASCII 字符的字符串（如包含类似 e, é, è, a, ä 等字符的字符串）。一些非英语语言的字符串需要使用 {{jsxref("String.localeCompare")}}。这个函数可以将函数排序到正确的顺序。</p> + +<pre class="brush: js">var items = ['réservé', 'premier', 'cliché', 'communiqué', 'café', 'adieu']; +items.sort(function (a, b) { + return a.localeCompare(b); +}); + +// items is ['adieu', 'café', 'cliché', 'communiqué', 'premier', 'réservé'] +</pre> + +<h3 id="Example_Sorting_maps" name="Example:_Sorting_maps">使用映射改善排序</h3> + +<p><code>compareFunction</code> 可能需要对元素做多次映射以实现排序，尤其当 <code>compareFunction</code> 较为复杂，且元素较多的时候，某些 <code>compareFunction</code> 可能会导致很高的负载。使用 map 辅助排序将会是一个好主意。基本思想是首先将数组中的每个元素比较的实际值取出来，排序后再将数组恢复。</p> + +<pre class="brush: js">// 需要被排序的数组 +var list = ['Delta', 'alpha', 'CHARLIE', 'bravo']; + +// 对需要排序的数字和位置的临时存储 +var mapped = list.map(function(el, i) { + return { index: i, value: el.toLowerCase() }; +}) + +// 按照多个值排序数组 +mapped.sort(function(a, b) { + return +(a.value > b.value) || +(a.value === b.value) - 1; +}); + +// 根据索引得到排序的结果 +var result = mapped.map(function(el){ + return list[el.index]; +}); +</pre> + +<h2 id="Specifications" name="Specifications">规范</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('ES1')}}</td> + <td>{{Spec2('ES1')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.4.4.11', 'Array.prototype.sort')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-array.prototype.sort', 'Array.prototype.sort')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-array.prototype.sort', 'Array.prototype.sort')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">浏览器兼容性</h2> + +<div> +<div> + + +<p>{{Compat("javascript.builtins.Array.sort")}}</p> +</div> +</div> + +<h2 id="See_also" name="See_also">参考</h2> + +<ul> + <li>{{jsxref("Array.prototype.reverse()")}}</li> + <li>{{jsxref("String.prototype.localeCompare()")}}</li> + <li><a href="https://zhuanlan.zhihu.com/p/55338902">[译] V8引擎中的排序</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/array/splice/index.html b/files/zh-cn/web/javascript/reference/global_objects/array/splice/index.html new file mode 100644 index 0000000000..2dcb909975 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/array/splice/index.html @@ -0,0 +1,165 @@ +--- +title: Array.prototype.splice() +slug: Web/JavaScript/Reference/Global_Objects/Array/splice +tags: + - Array + - JavaScript + - 原型 + - 参考 + - 数组 + - 方法 +translation_of: Web/JavaScript/Reference/Global_Objects/Array/splice +--- +<div>{{JSRef}}</div> + +<p><strong><code>splice()</code></strong> 方法通过删除或替换现有元素或者原地添加新的元素来修改数组,并以数组形式返回被修改的内容。此方法会改变原数组。</p> + +<div>{{EmbedInteractiveExample("pages/js/array-splice.html")}}</div> + +<p class="hidden">交互范例的源码储存于 GitHub 仓库。想要参与此项目，可 clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> 并发送 pull request 给我们。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>array</var>.splice(<var>start[</var>, <var>deleteCount[</var>, <var>item1[</var>, <var>item2[</var>, <em>...]]]]</em>) +</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>start</code></dt> + <dd>指定修改的开始位置（从0计数）。如果超出了数组的长度，则从数组末尾开始添加内容；如果是负值，则表示从数组末位开始的第几位（从-1计数，这意味着-n是倒数第n个元素并且等价于<code>array.length-n</code>）；如果负数的绝对值大于数组的长度，则表示开始位置为第0位。</dd> + <dt><code>deleteCount</code> {{optional_inline}}</dt> + <dd>整数，表示要移除的数组元素的个数。</dd> + <dd>如果 <code>deleteCount</code> 大于 <code>start</code> 之后的元素的总数，则从 <code>start</code> 后面的元素都将被删除（含第 <code>start</code> 位）。</dd> + <dd>如果 <code>deleteCount</code> 被省略了，或者它的值大于等于<code>array.length - start</code>(也就是说，如果它大于或者等于<code>start</code>之后的所有元素的数量)，那么<code>start</code>之后数组的所有元素都会被删除。</dd> + <dd>如果 <code>deleteCount</code> 是 0 或者负数，则不移除元素。这种情况下，至少应添加一个新元素。</dd> + <dt><code>item1, item2, <em>...</em></code> {{optional_inline}}</dt> + <dd>要添加进数组的元素,从<code><var>start</var></code> 位置开始。如果不指定，则 <code>splice()</code> 将只删除数组元素。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>由被删除的元素组成的一个数组。如果只删除了一个元素，则返回只包含一个元素的数组。如果没有删除元素，则返回空数组。</p> + +<h2 id="描述">描述</h2> + +<p>如果添加进数组的元素个数不等于被删除的元素个数，数组的长度会发生相应的改变。</p> + +<h2 id="示例">示例</h2> + +<h3 id="从第_2_位开始删除_0_个元素，插入“drum”">从第 2 位开始删除 0 个元素，插入“drum”</h3> + +<pre class="brush: js">var myFish = ["angel", "clown", "mandarin", "sturgeon"]; +var removed = myFish.splice(2, 0, "drum"); + +// 运算后的 myFish: ["angel", "clown", "drum", "mandarin", "sturgeon"] +// 被删除的元素: [], 没有元素被删除 +</pre> + +<h3 id="从第_2_位开始删除_0_个元素，插入“drum”_和_guitar">从第 2 位开始删除 0 个元素，插入“drum” 和 "guitar"</h3> + +<pre class="brush: js">var myFish = ['angel', 'clown', 'mandarin', 'sturgeon']; +var removed = myFish.splice(2, 0, 'drum', 'guitar'); + +// 运算后的 myFish: ["angel", "clown", "drum", "guitar", "mandarin", "sturgeon"] +// 被删除的元素: [], 没有元素被删除 +</pre> + +<h3 id="从第_3_位开始删除_1_个元素">从第 3 位开始删除 1 个元素</h3> + +<pre class="brush: js">var myFish = ['angel', 'clown', 'drum', 'mandarin', 'sturgeon']; +var removed = myFish.splice(3, 1); + +// 运算后的 myFish: ["angel", "clown", "drum", "sturgeon"] +// 被删除的元素: ["mandarin"] +</pre> + +<h3 id="从第_2_位开始删除_1_个元素，插入“trumpet”">从第 2 位开始删除 1 个元素，插入“trumpet”</h3> + +<pre class="brush: js">var myFish = ['angel', 'clown', 'drum', 'sturgeon']; +var removed = myFish.splice(2, 1, "trumpet"); + +// 运算后的 myFish: ["angel", "clown", "trumpet", "sturgeon"] +// 被删除的元素: ["drum"] +</pre> + +<h3 id="从第_0_位开始删除_2_个元素，插入parrot、anemone和blue">从第 0 位开始删除 2 个元素，插入"parrot"、"anemone"和"blue"</h3> + +<pre class="brush: js">var myFish = ['angel', 'clown', 'trumpet', 'sturgeon']; +var removed = myFish.splice(0, 2, 'parrot', 'anemone', 'blue'); + +// 运算后的 myFish: ["parrot", "anemone", "blue", "trumpet", "sturgeon"] +// 被删除的元素: ["angel", "clown"] +</pre> + +<h3 id="从第_2_位开始删除_2_个元素">从第 2 位开始删除 2 个元素</h3> + +<pre class="brush: js">var myFish = ['parrot', 'anemone', 'blue', 'trumpet', 'sturgeon']; +var removed = myFish.splice(myFish.length - 3, 2); + +// 运算后的 myFish: ["parrot", "anemone", "sturgeon"] +// 被删除的元素: ["blue", "trumpet"] +</pre> + +<h3 id="从倒数第_2_位开始删除_1_个元素">从倒数第 2 位开始删除 1 个元素</h3> + +<pre class="brush: js">var myFish = ['angel', 'clown', 'mandarin', 'sturgeon']; +var removed = myFish.splice(-2, 1); + +// 运算后的 myFish: ["angel", "clown", "sturgeon"] +// 被删除的元素: ["mandarin"]</pre> + +<h3 id="从第_2_位开始删除所有元素">从第 2 位开始删除所有元素</h3> + +<pre class="brush: js">var myFish = ['angel', 'clown', 'mandarin', 'sturgeon']; +var removed = myFish.splice(2); + +// 运算后的 myFish: ["angel", "clown"] +// 被删除的元素: ["mandarin", "sturgeon"] +</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>{{SpecName('ES3')}}</td> + <td>{{Spec2('ES3')}}</td> + <td>Initial definition. Implemented in JavaScript 1.2.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.4.4.12', 'Array.prototype.splice')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-array.prototype.splice', 'Array.prototype.splice')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-array.prototype.splice', 'Array.prototype.splice')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div class="hidden">此页面中的兼容性表是根据结构化数据生成的。如果您想为数据做出贡献，请查看 <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> 并发送 pull request 给我们。</div> + +<p>{{Compat("javascript.builtins.Array.splice")}}</p> + +<h2 id="参见">参见</h2> + +<ul> + <li>{{jsxref("Array.prototype.push()", "push()")}} / {{jsxref("Array.prototype.pop()", "pop()")}} - 在数组末尾增/删元素；</li> + <li>{{jsxref("Array.prototype.unshift()", "unshift()")}} / {{jsxref("Array.prototype.shift()", "shift()")}} - 在数组首部增/删元素；</li> + <li>{{jsxref("Array.prototype.concat()", "concat()")}} - 把一个（或多个）数组和（或）值与原数组拼接，返回拼接后的数组。</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/array/tolocalestring/index.html b/files/zh-cn/web/javascript/reference/global_objects/array/tolocalestring/index.html new file mode 100644 index 0000000000..38b9c01c94 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/array/tolocalestring/index.html @@ -0,0 +1,177 @@ +--- +title: Array.prototype.toLocaleString() +slug: Web/JavaScript/Reference/Global_Objects/Array/toLocaleString +tags: + - Array + - JavaScript + - Method +translation_of: Web/JavaScript/Reference/Global_Objects/Array/toLocaleString +--- +<div>{{JSRef("Global_Objects", "Array")}}</div> + +<p><code><strong>toLocaleString()</strong></code> 返回一个字符串表示数组中的元素。数组中的元素将使用各自的 <code>toLocaleString</code> 方法转成字符串，这些字符串将使用一个特定语言环境的字符串（例如一个逗号 ","）隔开。</p> + +<div>{{EmbedInteractiveExample("pages/js/array-tolocalestring.html")}}</div> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><font face="consolas, Liberation Mono, courier, monospace">arr.toLocaleString([locales[,options]]);</font></pre> + +<h3 id="参数"><font face="consolas, Liberation Mono, courier, monospace">参数</font></h3> + +<dl> + <dt><code>locales</code> {{optional_inline}}</dt> + <dd>带有BCP 47语言标记的字符串或字符串数组，关于<code>locales</code>参数的形式与解释，请看{{jsxref("Intl")}}页面。</dd> + <dt><code>options</code> {{optional_inline}}</dt> + <dd>一个可配置属性的对象，对于数字 {{jsxref("Number.prototype.toLocaleString()")}}，对于日期{{jsxref("Date.prototype.toLocaleString()")}}.</dd> +</dl> + +<h3 id="返回值"><font face="consolas, Liberation Mono, courier, monospace">返回值</font></h3> + +<p>表示数组元素的字符串。</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用locales和options">使用<code>locales</code>和<code>options</code></h3> + +<p>数组中的元素将会使用各自的 toLocaleString 方法：</p> + +<ul> + <li><code>Object</code>: {{jsxref("Object.prototype.toLocaleString()")}}</li> + <li><code>Number</code>: {{jsxref("Number.prototype.toLocaleString()")}}</li> + <li><code>Date</code>: {{jsxref("Date.prototype.toLocaleString()")}}</li> +</ul> + +<p>总是在<code>prices</code>数组中显示字符串和数字的货币符号：</p> + +<pre class="brush: js">var prices = ['￥7', 500, 8123, 12]; +prices.toLocaleString('ja-JP', { style: 'currency', currency: 'JPY' }); + +// "￥7,￥500,￥8,123,￥12"</pre> + +<p>更多实例请看 {{jsxref("Intl")}}，{{jsxref("NumberFormat")}}和{{jsxref("DateTimeFormat")}}页面。</p> + +<h2 id="Polyfill">Polyfill</h2> + +<pre class="brush: js">// https://tc39.github.io/ecma402/#sup-array.prototype.tolocalestring +if (!Array.prototype.toLocaleString) { + Object.defineProperty(Array.prototype, 'toLocaleString', { + value: function(locales, options) { + // 1. Let O be ? ToObject(this value). + if (this == null) { + throw new TypeError('"this" is null or not defined'); + } + + var a = Object(this); + + // 2. Let len be ? ToLength(? Get(A, "length")). + var len = a.length >>> 0; + + // 3. Let separator be the String value for the + // list-separator String appropriate for the + // host environment's current locale (this is + // derived in an implementation-defined way). + // NOTE: In this case, we will use a comma + var separator = ','; + + // 4. If len is zero, return the empty String. + if (len === 0) { + return ''; + } + + // 5. Let firstElement be ? Get(A, "0"). + var firstElement = a[0]; + // 6. If firstElement is undefined or null, then + // a.Let R be the empty String. + // 7. Else, + // a. Let R be ? + // ToString(? + // Invoke( + // firstElement, + // "toLocaleString", + // « locales, options » + // ) + // ) + var r = firstElement == null ? + '' : firstElement.toLocaleString(locales, options); + + // 8. Let k be 1. + var k = 1; + + // 9. Repeat, while k < len + while (k < len) { + // a. Let S be a String value produced by + // concatenating R and separator. + var s = r + separator; + + // b. Let nextElement be ? Get(A, ToString(k)). + var nextElement = a[k]; + + // c. If nextElement is undefined or null, then + // i. Let R be the empty String. + // d. Else, + // i. Let R be ? + // ToString(? + // Invoke( + // nextElement, + // "toLocaleString", + // « locales, options » + // ) + // ) + r = nextElement == null ? + '' : nextElement.toLocaleString(locales, options); + + // e. Let R be a String value produced by + // concatenating S and R. + r = s + r; + + // f. Increase k by 1. + k++; + } + + // 10. Return R. + return r; + } + }); +} +</pre> + +<p>如果你需要支持真正不支持<code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperty">Object.defineProperty</a></code>的JavaScript引擎，最好不要对<code>Array.prototype</code>方法进行填充，因为你不能使它们不可枚举。</p> + +<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('ESDraft', '#sec-array.prototype.tolocalestring', 'Array.prototype.toLocaleString')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td>Initial definition was in ECMAScript 3.</td> + </tr> + <tr> + <td>{{SpecName('ES Int Draft', '#sup-array.prototype.tolocalestring', 'Array.prototype.toLocaleString')}}</td> + <td>{{Spec2('ES Int Draft')}}</td> + <td>This definition supersedes the definition provided in ECMA-262.</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.Array.toLocaleString")}}</p> + +<h2 id="See_also" name="See_also">参见</h2> + +<ul> + <li>{{jsxref("Array.prototype.toString()")}}</li> + <li>{{jsxref("Intl")}}</li> + <li>{{jsxref("Object.prototype.toLocaleString()")}}</li> + <li>{{jsxref("Number.prototype.toLocaleString()")}}</li> + <li>{{jsxref("Date.prototype.toLocaleString()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/array/tosource/index.html b/files/zh-cn/web/javascript/reference/global_objects/array/tosource/index.html new file mode 100644 index 0000000000..7ff8cff304 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/array/tosource/index.html @@ -0,0 +1,40 @@ +--- +title: Array.prototype.toSource() +slug: Web/JavaScript/Reference/Global_Objects/Array/toSource +translation_of: Web/JavaScript/Reference/Global_Objects/Array/toSource +--- +<p>{{JSRef("Global_Objects", "Array")}}{{Non-standard_header}}</p> + +<h2 id="Summary" name="Summary">概述</h2> + +<p>返回一个字符串,代表该数组的源代码.</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code><em>array</em>.toSource()</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<p>无</p> + +<h2 id="Description" name="Description">描述</h2> + +<p>在调试时,你可以使用<code>toSource方法</code>来查看一个数组的内容.</p> + +<h2 id="Examples" name="Examples">例子</h2> + +<h3 id="Example:_Examining_the_source_code_of_an_array" name="Example:_Examining_the_source_code_of_an_array">例子: 查看数组的源码</h3> + +<pre class="brush:js">var alpha = new Array("a", "b", "c"); + +alpha.toSource(); //返回["a", "b", "c"]</pre> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{Compat("javascript.builtins.Array.toSource")}}</p> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li><a href="/zh-CN/docs/JavaScript/Reference/Global_Objects/Array/toString" title="JavaScript/Reference/Global_Objects/Array/toString">Array.toString</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/array/tostring/index.html b/files/zh-cn/web/javascript/reference/global_objects/array/tostring/index.html new file mode 100644 index 0000000000..9d49798a94 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/array/tostring/index.html @@ -0,0 +1,80 @@ +--- +title: Array.prototype.toString() +slug: Web/JavaScript/Reference/Global_Objects/Array/toString +tags: + - Array + - JavaScript + - Method +translation_of: Web/JavaScript/Reference/Global_Objects/Array/toString +--- +<div>{{JSRef("Global_Objects", "Array")}}</div> + +<p><code><strong>toString()</strong></code> 返回一个字符串，表示指定的数组及其元素。</p> + +<div>{{EmbedInteractiveExample("pages/js/array-tostring.html")}}</div> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="brush: js">arr.toString() +</pre> + +<h3 id="Parameters" name="Parameters">返回值</h3> + +<p>一个表示指定的数组及其元素的字符串。</p> + +<h2 id="描述">描述</h2> + +<p>{{jsxref("Array")}}对象覆盖了{{jsxref("Object")}}的 <code>toString</code> 方法。对于数组对象，<code>toString</code> 方法连接数组并返回一个字符串，其中包含用逗号分隔的每个数组元素。</p> + +<p>当一个数组被作为文本值或者进行字符串连接操作时，将会自动调用其 <code>toString</code> 方法。</p> + +<h3 id="ECMAScript_5_semantics">ECMAScript 5 semantics</h3> + +<p>从 JavaScript 1.8.5 (<span class="st">Firefox 4</span>) 开始，和 ECMAScript 第5版语义（semantics）一致，<code>toString()</code> 方法是通用的，可被用于任何对象。将调用{{jsxref("Object.prototype.toString()")}}，并返回结果值。</p> + +<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('ES1')}}</td> + <td>{{Spec2('ES1')}}</td> + <td>Initial definition. Implemented in JavaScript 1.1.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.4.4.2', 'Array.prototype.toString')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-array.prototype.tostring', 'Array.prototype.toString')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-array.prototype.tostring', 'Array.prototype.toString')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> + + +<p>{{Compat("javascript.builtins.Array.toString")}}</p> +</div> + +<h2 id="See_Also" name="See_Also">相关链接</h2> + +<ul> + <li>{{jsxref("Array.prototype.join()")}}</li> + <li>{{jsxref("Object.prototype.toSource()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/array/unobserve/index.html b/files/zh-cn/web/javascript/reference/global_objects/array/unobserve/index.html new file mode 100644 index 0000000000..90678a1081 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/array/unobserve/index.html @@ -0,0 +1,86 @@ +--- +title: Array.unobserve() +slug: Web/JavaScript/Reference/Global_Objects/Array/unobserve +translation_of: Archive/Web/JavaScript/Array.unobserve +--- +<div>{{JSRef}} {{non-standard_header}}</div> + +<p>Array<strong>.unobserve()方法用来移除</strong>{{jsxref("Array.observe()")}}设置的所有观察者。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code>Array.unobserve(<var>arr</var>, <var>callback</var>)</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>arr</code></dt> + <dd>停止观察的数组。</dd> + <dt> </dt> + <dt><code>callback回调</code></dt> + <dd>需要停止的array <strong>arr</strong>每次改变都会调用的函数引用。</dd> +</dl> + +<h2 id="描述">描述</h2> + +<p><code>Array.unobserve()</code> 方法因为要移除观察者，所以应该在{{jsxref("Array.observe()")}}调用后调用。</p> + +<p>回调函数应该是一个函数的引用并且不能是匿名函数， 因为这个函数需要用来移除前面的观察者， 如果用匿名函数是没有用的，将不能移除任何观察者。</p> + +<h2 id="例子">例子</h2> + +<h3 id="停止观察一个数组">停止观察一个数组</h3> + +<pre class="brush: js">var arr = [1, 2, 3]; + +var observer = function(changes) { + console.log(changes); +} + +Array.observe(arr, observer); + +arr.push(4); +// [{type: "splice", object: <arr>, index: 3, removed:[], addedCount: 1}] + +Array.unobserve(arr, observer); + +arr.pop(); +// The callback wasn't called</pre> + +<h3 id="使用匿名函数">使用匿名函数</h3> + +<pre class="brush: js">var persons = ['Khalid', 'Ahmed', 'Mohammed']; + +Array.observe(persons, function (changes) { + console.log(changes); +}); + +persons.shift(); +// [{type: "splice", object: <arr>, index: 0, removed: [ "Khalid" ], addedCount: 0 }] + +Array.unobserve(persons, function (changes) { + console.log(changes); +}); + +persons.push('Abdullah'); +// [{type: "splice", object: <arr>, index: 2, removed: [], addedCount: 1 }] +// The callback will always be called +</pre> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> +<div> + + +<p>{{Compat("javascript.builtins.Array.unobserve")}}</p> +</div> +</div> + +<h2 id="相关内容">相关内容</h2> + +<ul> + <li>{{jsxref("Array.observe()")}} {{non-standard_inline}}</li> + <li>{{jsxref("Object.observe()")}} {{non-standard_inline}}</li> + <li>{{jsxref("Object.unobserve()")}} {{non-standard_inline}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/array/unshift/index.html b/files/zh-cn/web/javascript/reference/global_objects/array/unshift/index.html new file mode 100644 index 0000000000..7b1148813f --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/array/unshift/index.html @@ -0,0 +1,120 @@ +--- +title: Array.prototype.unshift() +slug: Web/JavaScript/Reference/Global_Objects/Array/unshift +tags: + - Array + - JavaScript + - Method + - 原型 + - 参考资料 + - 数组 + - 方法 +translation_of: Web/JavaScript/Reference/Global_Objects/Array/unshift +--- +<p>{{JSRef}}</p> + +<p><strong><code>unshift()</code></strong> 方法将一个或多个元素添加到数组的<strong>开头</strong>，并返回该数组的<strong>新长度(该</strong>方法修改原有数组<strong>)</strong>。</p> + +<div>{{EmbedInteractiveExample("pages/js/array-unshift.html")}}</div> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox">arr.unshift(element1, ..., elementN) +</pre> + +<h3 id="Parameters" name="Parameters">参数列表</h3> + +<dl> + <dt><code>elementN</code></dt> + <dd>要添加到数组开头的元素或多个元素。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>当一个对象调用该方法时，返回其 {{jsxref("Array.length", "length")}} 属性值。</p> + +<dl> +</dl> + +<h2 id="Description" name="Description">描述</h2> + +<p><code>unshift</code> 方法会在调用它的类数组对象的开始位置插入给定的参数。</p> + +<p><code>unshift</code> 特意被设计成具有通用性；这个方法能够通过 {{jsxref("Function.call", "call")}} 或 {{jsxref("Function.apply", "apply")}} 方法作用于类数组对象上。<span style="line-height: inherit;">不过对于没有 length 属性（代表从0开始的一系列连续的数字属性的最后一个）的对象，调用该方法可能没有任何意义。</span></p> + +<p>注意, 如果传入多个参数，它们会被以块的形式插入到对象的开始位置，它们的顺序和被作为参数传入时的顺序一致。 于是，传入多个参数调用一次 <code>unshift</code> ，和传入一个参数调用多次 <code>unshift</code> (例如，循环调用)，它们将得到不同的结果。例如:</p> + +<pre class="syntaxbox">let arr = [4,5,6]; +arr.unshift(1,2,3); +console.log(arr); // [<strong>1, 2, 3</strong>, 4, 5, 6] + +arr = [4,5,6]; // 重置数组 +arr.unshift(1); +arr.unshift(2); +arr.unshift(3); +console.log(arr); // [<strong>3, 2, 1</strong>, 4, 5, 6] +</pre> + +<h2 id="示例">示例</h2> + +<pre class="brush: js">let arr = [1, 2]; + +arr.unshift(0); // result of the call is 3, which is the new array length +// arr is [0, 1, 2] + +arr.unshift(-2, -1); // the new array length is 5 +// arr is [-2, -1, 0, 1, 2] + +arr.unshift([-4, -3]); // the new array length is 6 +// arr is [[-4, -3], -2, -1, 0, 1, 2] + +arr.unshift([-7, -6], [-5]); // the new array length is 8 +// arr is [ [-7, -6], [-5], [-4, -3], -2, -1, 0, 1, 2 ] +</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>{{SpecName('ES3')}}</td> + <td>{{Spec2('ES3')}}</td> + <td>Initial definition. Implemented in JavaScript 1.2.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.4.4.13', 'Array.prototype.unshift')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-array.prototype.unshift', 'Array.prototype.unshift')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-array.prototype.unshift', 'Array.prototype.unshift')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div class="hidden">兼容性表是使用结构化数据生成的. 如果您希望为此数据做贡献, 请检出(check out) <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> 同时向我们提交一个pull request.</div> + +<p>{{Compat("javascript.builtins.Array.unshift")}}</p> + +<h2 id="参见">参见</h2> + +<ul> + <li>{{jsxref("Array.prototype.push()")}}</li> + <li>{{jsxref("Array.prototype.pop()")}}</li> + <li>{{jsxref("Array.prototype.shift()")}}</li> + <li>{{jsxref("Array.prototype.concat()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/array/values/index.html b/files/zh-cn/web/javascript/reference/global_objects/array/values/index.html new file mode 100644 index 0000000000..cf9b1c7c82 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/array/values/index.html @@ -0,0 +1,125 @@ +--- +title: Array.prototype.values() +slug: Web/JavaScript/Reference/Global_Objects/Array/values +tags: + - Array + - ECMAScript 2015 + - Iterator + - JavaScript + - Prototype + - 数组 + - 方法 + - 迭代 +translation_of: Web/JavaScript/Reference/Global_Objects/Array/values +--- +<div>{{JSRef}}</div> + +<p><strong><code>values()</code></strong> 方法返回一个新的 <strong><code>Array Iterator</code></strong> 对象，该对象包含数组每个索引的值</p> + +<div>{{EmbedInteractiveExample("pages/js/array-values.html")}}</div> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox notranslate"><var>arr</var>.values()</pre> + +<h3 id="返回值">返回值</h3> + +<p>一个新的 {{jsxref("Array")}} 迭代对象。</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用_for...of_循环进行迭代">使用 <code>for...of</code> 循环进行迭代</h3> + +<pre class="brush: js notranslate">let arr = ['w', 'y', 'k', 'o', 'p']; +let eArr = arr.values(); + +for (let letter of eArr) { + console.log(letter); +} //"w" "y "k" "o" "p"</pre> + +<p><strong>Array.prototype.values</strong> 是 <strong>Array.prototype[Symbol.iterator] </strong>的默认实现。</p> + +<pre class="notranslate">Array.prototype.values === Array.prototype[Symbol.iterator] // true </pre> + +<h3 id="使用_.next_迭代">使用 <code>.next()</code> 迭代</h3> + +<pre class="notranslate">var arr = ['a', 'b', 'c', 'd', 'e']; +var iterator = arr.values(); +iterator.next(); // Object { value: "a", done: false } +iterator.next().value; // "b" +iterator.next()["value"]; // "c" +iterator.next(); // Object { value: "d", done: false } +iterator.next(); // Object { value: "e", done: false } +iterator.next(); // Object { value: undefined, done: true } +iteraroe.next().value; // undefined</pre> + +<div class="blockIndicator warning"> +<p>一次性：数组迭代器是一次性的，或者说临时对象</p> +</div> + +<p>例子：</p> + +<pre class="notranslate">var arr = ['a', 'b', 'c', 'd', 'e']; + var iterator = arr.values(); + for (let letter of iterator) { + console.log(letter); +} //"a" "b" "c" "d" +for (let letter of iterator) { +console.log(letter); +} // undefined</pre> + +<p><strong>解释:</strong> 当 <code>next().done=true</code> 或 <code>currentIndex>length</code> 时， <code>for..of</code> 循环结束。参见 <a href="/en-US/docs/Web/JavaScript/Reference/Iteration_protocols">Iteration protocols</a> 。</p> + +<p><strong>值</strong>: 数组迭代器中存储的是原数组的地址，而不是数组元素值。</p> + +<pre class="notranslate">var arr = ['a', 'b', 'c', 'd', 'e']; +var iterator = arr.values(); +console.log(iterator); // Array Iterator { } +iterator.next().value; // "a" +arr[1] = 'n'; +iterator.next().value; // "n" +</pre> + +<div class="blockIndicator note"> +<p>如果数组中元素改变，那么迭代器的值也会改变</p> +</div> + +<p class="hidden"><strong>TODO</strong>: please write about why we need it, use cases.</p> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范名称</th> + <th scope="col">规范状态</th> + <th scope="col">备注</th> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-array.prototype.values', 'Array.prototype.values')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>首次定义</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-array.prototype.values', 'Array.prototype.values')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.Array.values")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Array.prototype.keys()")}}</li> + <li>{{jsxref("Array.prototype.entries()")}}</li> + <li>{{jsxref("Array.prototype.forEach()")}}</li> + <li>{{jsxref("Array.prototype.every()")}}</li> + <li>{{jsxref("Array.prototype.some()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/arraybuffer/@@species/index.html b/files/zh-cn/web/javascript/reference/global_objects/arraybuffer/@@species/index.html new file mode 100644 index 0000000000..fe99f2b076 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/arraybuffer/@@species/index.html @@ -0,0 +1,70 @@ +--- +title: 'get ArrayBuffer[@@species]' +slug: Web/JavaScript/Reference/Global_Objects/ArrayBuffer/@@species +tags: + - ArrayBuffer + - JavaScript + - TypedArrays + - 属性 +translation_of: Web/JavaScript/Reference/Global_Objects/ArrayBuffer/@@species +--- +<div>{{JSRef}}</div> + +<p>该 <code><strong>ArrayBuffer[@@species]</strong></code> 访问器属性会返回 <code>ArrayBuffer</code> 构造器。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">ArrayBuffer[Symbol.species] +</pre> + +<h2 id="描述">描述</h2> + +<p>这个 species 访问器属性会返回默认的 <code>ArrayBuffer</code> 构造器。子类构造器可能会覆盖它以改变构造器赋值。</p> + +<h2 id="示例">示例</h2> + +<p>返回默认的 <code>ArrayBuffer</code> 构造器：</p> + +<pre class="brush: js">ArrayBuffer[Symbol.species]; // function ArrayBuffer()</pre> + +<p>在派生集合对象中（比如你定制的 array buffer <code>MyArrayBuffer</code>），<code>MyArrayBuffer</code> species 就是 <code>MyArrayBuffer</code> 构造器。但是，你可能想要在派生类里重写它，以期返回的是父类的 <code>ArrayBuffer</code> 对象：</p> + +<pre class="brush: js">class MyArrayBuffer extends ArrayBuffer { + // Overwrite MyArrayBuffer species to the parent ArrayBuffer constructor + static get [Symbol.species]() { return ArrayBuffer; } +}</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('ES6', '#sec-get-arraybuffer-@@species', 'get ArrayBuffer [ @@species ]')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-get-arraybuffer-@@species', 'get ArrayBuffer [ @@species ]')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器支持">浏览器支持</h2> + + + +<p>{{Compat("javascript.builtins.ArrayBuffer.@@species")}}</p> + +<h2 id="相关">相关</h2> + +<ul> + <li>{{jsxref("ArrayBuffer")}}</li> + <li>{{jsxref("Symbol.species")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/arraybuffer/bytelength/index.html b/files/zh-cn/web/javascript/reference/global_objects/arraybuffer/bytelength/index.html new file mode 100644 index 0000000000..af8868a563 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/arraybuffer/bytelength/index.html @@ -0,0 +1,62 @@ +--- +title: ArrayBuffer.prototype.byteLength +slug: Web/JavaScript/Reference/Global_Objects/ArrayBuffer/byteLength +translation_of: Web/JavaScript/Reference/Global_Objects/ArrayBuffer/byteLength +--- +<div>{{JSRef}}</div> + +<p><code><strong>byteLength</strong>访问器属性</code>表示一个{{jsxref("ArrayBuffer")}} 对象的字节长度。</p> + +<div>{{EmbedInteractiveExample("pages/js/arraybuffer-bytelength.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>arr</var>aybuffer.byteLength</pre> + +<h2 id="描述">描述</h2> + +<p>byteLength属性是一个访问器属性，它的set访问器函数是undefined，这意味着你只能读这个属性。 该值在数组创建时确定，并且不可变更。如果这个<code>ArrayBuffer</code> 被移除，则此属性返回0。</p> + +<p> </p> + +<h2 id="示例">示例</h2> + +<pre class="brush:js">var buffer = new ArrayBuffer(8); +buffer.byteLength; // 8 +</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>{{SpecName('Typed Array')}}</td> + <td>{{Spec2('Typed Array')}}</td> + <td>Superseded by ECMAScript 6.</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-get-arraybuffer.prototype.bytelength', 'ArrayBuffer.prototype.byteLength')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition in an ECMA standard.</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.ArrayBuffer.byteLength")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("ArrayBuffer")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/arraybuffer/index.html b/files/zh-cn/web/javascript/reference/global_objects/arraybuffer/index.html new file mode 100644 index 0000000000..a98aca4290 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/arraybuffer/index.html @@ -0,0 +1,161 @@ +--- +title: ArrayBuffer +slug: Web/JavaScript/Reference/Global_Objects/ArrayBuffer +tags: + - ArrayBuffer + - JavaScript + - 构造函数 + - 类型数组 +translation_of: Web/JavaScript/Reference/Global_Objects/ArrayBuffer +--- +<div> +<p>{{JSRef}}</p> + +<p><strong><code>ArrayBuffer</code></strong> 对象用来表示通用的、固定长度的原始二进制数据缓冲区。</p> + +<p>它是一个字节数组，通常在其他语言中称为“byte array”。</p> + +<p>你不能直接操作 <code>ArrayBuffer</code> 的内容，而是要通过<a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/TypedArray">类型数组对象</a>或 {{jsxref("DataView")}} 对象来操作，它们会将缓冲区中的数据表示为特定的格式，并通过这些格式来读写缓冲区的内容。</p> +</div> + +<div>{{EmbedInteractiveExample("pages/js/arraybuffer-constructor.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox notranslate">new ArrayBuffer(length) +</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>length</code></dt> + <dd>要创建的 <code>ArrayBuffer</code> 的大小，单位为字节。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>一个指定大小的 <code>ArrayBuffer</code> 对象，其内容被初始化为 0。</p> + +<h3 id="异常">异常</h3> + +<p>如果 <font face="consolas, Liberation Mono, courier, monospace"><span style="background-color: rgba(220, 220, 220, 0.5);">length</span></font> 大于 {{jsxref("Number.MAX_SAFE_INTEGER")}}（>= 2 ** 53）或为负数，则抛出一个 {{jsxref("RangeError")}} 异常。</p> + +<h2 id="描述">描述</h2> + +<p><code>ArrayBuffer</code> 构造函数用来创建一个指定字节长度的 <code>ArrayBuffer</code> 对象。</p> + +<h3 id="以现有数据获取_ArrayBuffer">以现有数据获取 ArrayBuffer</h3> + +<ul> + <li><a href="https://developer.mozilla.org/zh-CN/docs/Web/API/WindowBase64/Base64_encoding_and_decoding#Appendix.3A_Decode_a_Base64_string_to_Uint8Array_or_ArrayBuffer">从 Base64 字符串</a></li> + <li><a href="https://developer.mozilla.org/zh-CN/docs/Web/API/FileReader#readAsArrayBuffer()">从本地文件</a></li> +</ul> + +<h2 id="属性">属性</h2> + +<dl> + <dt><code>ArrayBuffer.length</code></dt> + <dd>ArrayBuffer 构造函数的 length 属性，其值为1。</dd> +</dl> + +<dl> + <dt>{{jsxref("ArrayBuffer.prototype.byteLength")}}</dt> + <dd>只读属性，表示 <code>ArrayBuffer</code> 的byte的大小，在ArrayBuffer构造完成时生成，不可改变。</dd> +</dl> + +<dl> + <dt>{{jsxref("ArrayBuffer.@@species", "get ArrayBuffer[@@species]")}}</dt> + <dd>返回 ArrayBuffer 的构造函数。</dd> + <dt>{{jsxref("ArrayBuffer.prototype")}}</dt> + <dd>通过 ArrayBuffer 的原型对象可以为所有 ArrayBuffer 对象添加属性。</dd> +</dl> + +<h2 id="方法">方法</h2> + +<dl> + <dt>{{jsxref("ArrayBuffer.isView", "ArrayBuffer.isView(arg)")}}</dt> + <dd>如果参数是 ArrayBuffer 的视图实例则返回 <code>true</code>，例如 <a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/TypedArray">类型数组对象</a> 或 {{jsxref("DataView")}} 对象；否则返回 <code>false</code>。</dd> + <dt>{{jsxref("ArrayBuffer.transfer", "ArrayBuffer.transfer(oldBuffer [, newByteLength])")}} {{experimental_inline}}</dt> + <dd> + <p>返回一个新的 ArrayBuffer 对象，其内容取自 <code>oldBuffer</code> 中的数据，并且根据 <code>newByteLength</code> 的大小对数据进行截取或补 0。</p> + </dd> +</dl> + +<h2 id="ArrayBuffer_实例">ArrayBuffer 实例</h2> + +<p>所有 <code>ArrayBuffer</code> 实例都会从 {{jsxref("ArrayBuffer.prototype")}} 继承属性和方法。</p> + +<h3 id="属性_2">属性</h3> + +<p>{{page('zh-CN/docs/Web/JavaScript/Reference/Global_Objects/ArrayBuffer/prototype','属性')}}</p> + +<h3 id="方法_2">方法</h3> + +<p>{{page('zh-CN/docs/Web/JavaScript/Reference/Global_Objects/ArrayBuffer/prototype','方法')}}</p> + +<dl> + <dt>{{jsxref("ArrayBuffer.slice()")}} {{non-standard_inline}}</dt> + <dd>和 {{jsxref("ArrayBuffer.prototype.slice()")}} 功能相同。</dd> +</dl> + +<h2 id="示例">示例</h2> + +<p>下面的例子创建了一个 8 字节的缓冲区，并使用一个 {{jsxref("Global_Objects/Int32Array", "Int32Array")}} 来引用它：</p> + +<pre class="notranslate"><code>var buffer = new ArrayBuffer(8); +var view = new Int32Array(buffer);</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>{{SpecName('Typed Array')}}</td> + <td>{{Spec2('Typed Array')}}</td> + <td>已被 ECMAScript 6 中的 ArrayBuffer 取代</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-arraybuffer-constructor', 'ArrayBuffer')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>在 ECMA 标准中的初始定义。规定了必须通过 <code>new</code> 来调用构造函数</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-arraybuffer-constructor', 'ArrayBuffer')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div class="hidden"> +<p>The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> +</div> + +<p>{{Compat("javascript.builtins.ArrayBuffer")}}</p> + +<h2 id="兼容性提醒">兼容性提醒</h2> + +<p>从 ECMAScript 2015 开始，<code>ArrayBuffer</code> 对象需要用 {{jsxref("Operators/new", "new")}} 运算符创建。如果调用构造函数时没有使用 <code>new</code>，将会抛出 {{jsxref("TypeError")}} 异常。</p> + +<pre class="brush: js example-bad notranslate">var dv = ArrayBuffer(10); +// TypeError: calling a builtin ArrayBuffer constructor +// without new is forbidden</pre> + +<pre class="brush: js example-good notranslate">var dv = new ArrayBuffer(10);</pre> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li><a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Typed_arrays">JavaScript 类型数组</a></li> + <li><a href="zh-CN/docs/Web/JavaScript/Typed_arrays" title="zh-CN/JavaScript typed arrays">{{jsxref("SharedArrayBuffer")}}</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/arraybuffer/isview/index.html b/files/zh-cn/web/javascript/reference/global_objects/arraybuffer/isview/index.html new file mode 100644 index 0000000000..2b545d9c03 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/arraybuffer/isview/index.html @@ -0,0 +1,87 @@ +--- +title: ArrayBuffer.isView() +slug: Web/JavaScript/Reference/Global_Objects/ArrayBuffer/isView +tags: + - 类型数组 + - 缓冲区 +translation_of: Web/JavaScript/Reference/Global_Objects/ArrayBuffer/isView +--- +<div>{{JSRef}}</div> + +<p><code><strong>ArrayBuffer.isView()</strong></code> 方法用来判断传入的参数值是否是一种 <code>ArrayBuffer</code> 视图（view），比如类型化数组对象（<a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray">typed array objects</a>）或者数据视图（ {{jsxref("DataView")}}）。</p> + +<div>{{EmbedInteractiveExample("pages/js/arraybuffer-isview.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="brush: js"><code>ArrayBuffer.isView(<var>value</var>)</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>value</code></dt> + <dd>被检测的值。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<dl> + <dt><code>true</code></dt> + <dd>如果提供的参数是一种 {{jsxref("ArrayBuffer")}} 视图；</dd> + <dt><code>false</code></dt> + <dd>提供的参数不是一种 {{jsxref("ArrayBuffer")}} 视图类型；</dd> +</dl> + +<h2 id="示例">示例</h2> + +<pre class="brush: js">ArrayBuffer.isView(); // false +ArrayBuffer.isView([]); // false +ArrayBuffer.isView({}); // false +ArrayBuffer.isView(null); // false +ArrayBuffer.isView(undefined); // false +ArrayBuffer.isView(new ArrayBuffer(10)); // false + +ArrayBuffer.isView(new Uint8Array()); // true +ArrayBuffer.isView(new Float32Array()); // true +ArrayBuffer.isView(new Int8Array(10).subarray(0, 3)); // true + +var buffer = new ArrayBuffer(2); +var dv = new DataView(buffer); +ArrayBuffer.isView(dv); // true +</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('Typed Array')}}</td> + <td>{{Spec2('Typed Array')}}</td> + <td>Superseded by ECMAScript 6.</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-arraybuffer.isview', 'ArrayBuffer.isView')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition in an ECMA standard.</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.ArrayBuffer.isView")}}</p> + +<h2 id="另见">另见</h2> + +<ul> + <li><a href="/en-US/docs/Web/JavaScript/Typed_arrays" title="en/JavaScript typed arrays">JavaScript typed arrays</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/arraybuffer/prototype/index.html b/files/zh-cn/web/javascript/reference/global_objects/arraybuffer/prototype/index.html new file mode 100644 index 0000000000..376e969064 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/arraybuffer/prototype/index.html @@ -0,0 +1,63 @@ +--- +title: ArrayBuffer.prototype +slug: Web/JavaScript/Reference/Global_Objects/ArrayBuffer/prototype +tags: + - ArrayBuffer +translation_of: Web/JavaScript/Reference/Global_Objects/ArrayBuffer +--- +<div>{{JSRef}}</div> + +<p><strong><code>ArrayBuffer.prototype</code></strong><code>属性表示</code>{{jsxref("ArrayBuffer")}}对象的原型。</p> + +<div>{{js_property_attributes(0,0,0)}}</div> + +<div> </div> + +<h2 id="描述">描述</h2> + +<p>ArrayBuffer 实例继承自<code>ArrayBuffer.prototype。对所有的构造函数来说，你可以通过改变构造函数的原型对象来改变所有的ArrayBuffer实例。</code></p> + +<h2 id="属性">属性</h2> + +<dl> + <dt>ArrayBuffer.prototype.constructor</dt> + <dd>指定函数，它创建一个对象的原型。其初始值是标准ArrayBuffer内置构造函数。</dd> + <dt>{{jsxref("ArrayBuffer.prototype.byteLength")}} {{readonlyInline}}</dt> + <dd>数组的字节大小。在数组创建时确定，并且不可变更。<strong>只读</strong>。</dd> +</dl> + +<h2 id="方法">方法</h2> + +<dl> + <dt>{{jsxref("ArrayBuffer.prototype.slice()")}}</dt> + <dd>返回一个新的 <code>ArrayBuffer</code> ，它的内容是这个 <code>ArrayBuffer</code> 的字节副本，从begin（包括），到end（不包括）。如果begin或end是负数，则指的是从数组末尾开始的索引，而不是从头开始。</dd> +</dl> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范</th> + <th scope="col">状态</th> + <th scope="col">备注</th> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-arraybuffer.prototype', 'ArrayBuffer.prototype')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>初始定义</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.ArrayBuffer.prototype")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("ArrayBuffer")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/arraybuffer/slice/index.html b/files/zh-cn/web/javascript/reference/global_objects/arraybuffer/slice/index.html new file mode 100644 index 0000000000..2c03d1e13c --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/arraybuffer/slice/index.html @@ -0,0 +1,83 @@ +--- +title: ArrayBuffer.prototype.slice() +slug: Web/JavaScript/Reference/Global_Objects/ArrayBuffer/slice +translation_of: Web/JavaScript/Reference/Global_Objects/ArrayBuffer/slice +--- +<div>{{JSRef}}</div> + +<p><code><strong>slice()</strong></code>方法返回一个新的 <code>ArrayBuffer</code> ，它的内容是这个<code>ArrayBuffer的</code>字节副本，从begin（包括），到end（不包括）。</p> + +<div>{{EmbedInteractiveExample("pages/js/arraybuffer-slice.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">arraybuffer.slice(begin[, end])</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>begin</code></dt> + <dd>从零开始的字节索引，切片从这开始。</dd> +</dl> + +<dl> + <dt><code>end</code></dt> + <dd>结束切片的字节索引。如果没指定end，新的 <code>ArrayBuffer</code> 将包含这个 <code>ArrayBuffer</code> 从头到尾的所有字节。由begin和end指定的这个范围夹在当前数组的有效索引范围内。如果新<code>ArrayBuffer</code>的长度在计算后为负，它将强制为0 。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p> 一个新的 <code>ArrayBuffer</code> 对象。</p> + +<h2 id="描述">描述</h2> + +<p><code>slice</code> 方法复制到但不包括由end参数指示的字节。如果begin或end是负数，则指的是从数组末尾开始的索引，而不是从头开始。</p> + +<h2 id="示例">示例</h2> + +<h3 id="复制一个_ArrayBuffer">复制一个 <code>ArrayBuffer</code></h3> + +<pre class="brush: js">var buf1 = new ArrayBuffer(8); +var buf2 = buf1.slice(0); +</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('Typed Array')}}</td> + <td>{{Spec2('Typed Array')}}</td> + <td>Superseded by EMCAScript 6.</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-arraybuffer.prototype.slice', 'ArrayBuffer.prototype.slice')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition in an ECMA standard.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-arraybuffer.prototype.slice', 'ArrayBuffer.prototype.slice')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.ArrayBuffer.slice")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("ArrayBuffer")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/arraybuffer/transfer/index.html b/files/zh-cn/web/javascript/reference/global_objects/arraybuffer/transfer/index.html new file mode 100644 index 0000000000..cf3185f637 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/arraybuffer/transfer/index.html @@ -0,0 +1,116 @@ +--- +title: ArrayBuffer.transfer() +slug: Web/JavaScript/Reference/Global_Objects/ArrayBuffer/transfer +translation_of: Archive/Web/JavaScript/ArrayBuffer.transfer +--- +<div>{{JSRef}} {{SeeCompatTable}}</div> + +<p> 静态<code><strong>ArrayBuf</strong></code><strong>fer.transfer()</strong> 方法返回一个新的ArrayBuffer， 其内容取自oldBuffer的数据，并且根据 newByteLength 的大小来对数据进行截取或者以0扩展。 如果 newByteLength 未定义，则使用 oldBuffer 的byteLength。这个操作使得 oldBuffer 处于被移除的状态。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">ArrayBuffer.transfer(oldBuffer [, newByteLength]);</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>oldBuffer</code></dt> + <dd> 要转移的{{jsxref("ArrayBuffer")}}对象。</dd> + <dt>newByteLength</dt> + <dd>新 <code>ArrayBuffer</code> 对象的字节长度。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>一个新的ArrayBuffer对象。</p> + +<h2 id="描述">描述</h2> + +<p><code>ArrayBuffer.transfer()</code>方法允许你增长和移除 <code>ArrayBuffer</code> 对象。不需复制就能增长一个ArrayBuffer的功能，对于大的缓冲区来说，有速度优势 (类似realloc) 。当释放底层内存时，移除ArrayBuffer的功能给开发者提供了显式控制。这避免了必须丢弃所有引用和等待垃圾回收。</p> + +<h2 id="示例">示例</h2> + +<pre class="brush: js">var buf1 = new ArrayBuffer(40); +new Int32Array(buf1)[0] = 42; + +var buf2 = ArrayBuffer.transfer(buf1, 80); +buf1.byteLength; // 0 but if you use the polyfill then the value is still 40 +buf2.byteLength; // 80 +new Int32Array(buf2)[0]; // 42 + +var buf3 = ArrayBuffer.transfer(buf2, 0); +buf2.byteLength; // 0 but if you use the polyfill then the value is still 80 +buf3.byteLength; // 0 +</pre> + +<h2 id="Polyfill">Polyfill</h2> + +<p>You can partially work around this by inserting the following code at the beginning of your scripts, allowing use of much of the functionality of transfer<font face="Consolas, Liberation Mono, Courier, monospace">()</font> in implementations that do not natively support it. This is not the exact equivalent of this API, but this function transfers data from one ArrayBuffer to another ArrayBuffer.</p> + +<pre>if(!ArrayBuffer.transfer) { + ArrayBuffer.transfer = function (source, length) { + source = Object(source); + var dest = new ArrayBuffer(length); + if(!(source instanceof ArrayBuffer) || !(dest instanceof ArrayBuffer)) { + throw new TypeError("Source and destination must be ArrayBuffer instances"); + } + if(dest.byteLength >= source.byteLength) { + var nextOffset = 0; + var leftBytes = source.byteLength; + var wordSizes = [8, 4, 2, 1]; + wordSizes.forEach(function (_wordSize_) { + if (leftBytes >= _wordSize_) { + var done = transferWith(_wordSize_, source, dest, nextOffset, leftBytes); + nextOffset = done.nextOffset; + leftBytes = done.leftBytes; + } + }); + } + return dest; + function transferWith(wordSize, source, dest, nextOffset, leftBytes) { + var ViewClass = Uint8Array; + switch (wordSize) { + case 8: + ViewClass = Float64Array; + break; + case 4: + ViewClass = Float32Array; + break; + case 2: + ViewClass = Uint16Array; + break; + case 1: + ViewClass = Uint8Array; + break; + default: + ViewClass = Uint8Array; + break; + } + var view_source = new ViewClass(source, nextOffset, Math.trunc(leftBytes / wordSize)); + var view_dest = new ViewClass(dest, nextOffset, Math.trunc(leftBytes / wordSize)); + for(var i=0; i<view_dest.length; i++) { + view_dest[i] = view_source[i]; + } + return { + nextOffset : view_source.byteOffset + view_source.byteLength, + leftBytes : source.byteLength - (view_source.byteOffset + view_source.byteLength) + } + } + }; +}</pre> + +<h2 id="规范">规范</h2> + +<p>Not part of any current specification draft document, but <a href="https://esdiscuss.org/topic/sept-23-2014-meeting-notes">has been</a> <a href="https://gist.github.com/lukewagner/2735af7eea411e18cf20">proposed</a> for a future ECMA-262 edition.</p> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.ArrayBuffer.transfer")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li><a href="/en-US/docs/Web/JavaScript/Typed_arrays" title="en/JavaScript typed arrays">JavaScript typed arrays</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/asyncfunction/index.html b/files/zh-cn/web/javascript/reference/global_objects/asyncfunction/index.html new file mode 100644 index 0000000000..e24d75c33f --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/asyncfunction/index.html @@ -0,0 +1,121 @@ +--- +title: AsyncFunction +slug: Web/JavaScript/Reference/Global_Objects/AsyncFunction +tags: + - JavaScript + - Reference + - 实验性内容 + - 构造函数 +translation_of: Web/JavaScript/Reference/Global_Objects/AsyncFunction +--- +<div>{{JSRef}}</div> + +<div> </div> + +<p><code>AsyncFunction</code> 构造函数用来创建新的 {{jsxref("Statements/async_function", "异步函数")}} 对象，JavaScript 中每个异步函数都是 <code>AsyncFunction</code> 的对象。</p> + +<p>注意，<code>AsyncFunction</code> 并不是一个全局对象，需要通过下面的方法来获取：</p> + +<pre class="brush: js">Object.getPrototypeOf(async function(){}).constructor +</pre> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code>new AsyncFunction([<var>arg1</var>[, <var>arg2</var>[, ...<var>argN</var>]],] <var>functionBody</var>)</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>arg1, arg2, ... arg<em>N</em></code></dt> + <dd>函数的参数名，它们是符合 JavaScript 标示符规范的一个或多个用逗号隔开的字符串。例如 <code>x</code>、<code>theValue</code>、或 <code>a,b</code>。</dd> + <dt><code>functionBody</code></dt> + <dd>一段字符串形式的 JavaScript 语句，这些语句组成了新函数的定义。</dd> +</dl> + +<h2 id="描述">描述</h2> + +<p>执行 <code>AsyncFunction</code> 构造函数的时候，会创建一个 {{jsxref("Statements/async_function", "异步函数")}} 对象。但是这种方式不如先用 {{jsxref("Operators/async_function", "异步函数表达式")}} 定义一个异步函数，然后再调用其来创建 {{jsxref("Statements/async_function", "异步函数")}} 对象来的高效，因为第二种方式中异步函数是与其他代码一起被解释器解析的，而第一种方式的函数体是单独解析的。</p> + +<p>传递给 <code>AsyncFunction</code> 构造函数的所有参数，都会成为新函数中的变量，变量的名称和定义顺序与各参数相同。 </p> + +<div class="note"> +<p><strong>注意：使用</strong> <code>AsyncFunction</code> 构造函数创建的{{jsxref("Statements/async_function", "异步函数")}} 并不会在当前上下文中创建闭包，其作用域始终是全局的。因此运行的时候只能访问它们自己的本地变量和全局变量，但不能访问构造函数被调用的那个作用域中的变量。这是它与 {{jsxref("Global_Objects/eval", "eval")}} 不同的地方。</p> +</div> + +<p>调用 <code>AsyncFunction</code> 构造函数时可以省略 <code>new</code>，其效果是一样的。</p> + +<h2 id="属性">属性</h2> + +<dl> + <dt><code><strong>AsyncFunction.length</strong></code></dt> + <dd><code>AsyncFunction</code> 构造函数的 length 属性，值为 1。</dd> + <dt>{{jsxref("AsyncFunction.prototype")}}</dt> + <dd>通过原型对象可以为所有异步函数对象定义额外的属性。</dd> +</dl> + +<h2 id="AsyncFunction_原型对象"><code>AsyncFunction</code> 原型对象</h2> + +<h3 id="属性_2">属性</h3> + +<div>{{page('/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/AsyncFunction/prototype', '属性')}}</div> + +<h2 id="AsyncFunction_实例"><code>AsyncFunction</code> 实例</h2> + +<p><code>AsyncFunction</code> 实例继承了 {{jsxref("AsyncFunction.prototype")}} 的方法和属性。和所有构造函数一样，修改 <code>AsyncFunction</code> 构造函数的原型对象会同时对所有 <code>AsyncFunction</code> 实例上生效。</p> + +<h2 id="示例">示例</h2> + +<h3 id="通过_AsyncFunction_构造器创建一个异步函数">通过 <code>AsyncFunction</code> 构造器创建一个异步函数</h3> + +<pre class="brush: js">function resolveAfter2Seconds(x) { + return new Promise(resolve => { + setTimeout(() => { + resolve(x); + }, 2000); + }); +} + +var AsyncFunction = Object.getPrototypeOf(async function(){}).constructor; +var a = new AsyncFunction('a', + 'b', + 'return await resolveAfter2Seconds(a) + await resolveAfter2Seconds(b);'); +a(10, 20).then(v => { + console.log(v); // 4 秒后打印 30 +}); +</pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-async-function-objects', 'AsyncFunction object')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td>ES2017 中的初始定义</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div class="hidden">The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</div> + +<div>{{Compat("javascript.builtins.AsyncFunction")}}</div> + +<h2 id="参见">参见</h2> + +<ul> + <li>{{jsxref("Statements/async_function", "async function function")}}</li> + <li>{{jsxref("Operators/async_function", "async function expression")}}</li> + <li>{{jsxref("Global_Objects/Function", "Function")}}</li> + <li>{{jsxref("Statements/function", "function statement")}}</li> + <li>{{jsxref("Operators/function", "function expression")}}</li> + <li>{{jsxref("Functions_and_function_scope", "Functions and function scope", "", 1)}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/asyncfunction/prototype/index.html b/files/zh-cn/web/javascript/reference/global_objects/asyncfunction/prototype/index.html new file mode 100644 index 0000000000..9a8678680a --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/asyncfunction/prototype/index.html @@ -0,0 +1,57 @@ +--- +title: AsyncFunction.prototype +slug: Web/JavaScript/Reference/Global_Objects/AsyncFunction/prototype +translation_of: Web/JavaScript/Reference/Global_Objects/AsyncFunction/prototype +--- +<div>{{JSRef}}</div> + +<p><code><strong>AsyncFunction.prototype</strong></code> 属性表示 {{jsxref("AsyncFunction")}} 的原型对象。</p> + +<h2 id="描述">描述</h2> + +<p>{{jsxref("AsyncFunction")}} 对象继承自 <code>AsyncFunction.prototype</code>。<code>AsyncFunction.prototype</code> 不能被修改。</p> + +<h2 id="属性">属性</h2> + +<dl> + <dt><code><strong>AsyncFunction.constructor</strong></code></dt> + <dd>默认值为 {{jsxref("AsyncFunction")}}。</dd> + <dt><code><strong>AsyncFunction.prototype[@@toStringTag]</strong></code></dt> + <dd>返回 "AsyncFunction"。</dd> +</dl> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-async-function-constructor-prototype', 'AsyncFunction.prototype')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td>最初定义在ES2017.</td> + </tr> + </tbody> +</table> + +<h2 id="兼容性">兼容性</h2> + +<div> +<div> + + +<p>{{Compat("javascript.builtins.AsyncFunction.prototype")}}</p> +</div> +</div> + +<h2 id="参见">参见</h2> + +<ul> + <li>{{jsxref("AsyncFunction")}}</li> + <li>{{jsxref("Function")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/asynciterator/index.html b/files/zh-cn/web/javascript/reference/global_objects/asynciterator/index.html new file mode 100644 index 0000000000..9c14e462bd --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/asynciterator/index.html @@ -0,0 +1,119 @@ +--- +title: AsyncIterator +slug: Web/JavaScript/Reference/Global_Objects/AsyncIterator +tags: + - 异步迭代器 + - 类 +translation_of: Web/JavaScript/Reference/Global_Objects/AsyncIterator +--- +<p>{{JSRef}}{{Draft}}</p> + +<p><strong><code>AsyncIterator</code></strong> 全局对象是一个提供辅助方法的抽象类，与暴露在{{JSxRef("Array")}} 实例上的那些类似。</p> + +<h2 id="构造函数">构造函数</h2> + +<dl> + <dt>{{JSxRef("AsyncIterator.AsyncIterator", "AsyncIterator()")}} </dt> + <dd>一个抽象构造函数，仅能够通过 {{JSxRef("Operators/super", "super()")}} 来调用。</dd> +</dl> + +<h2 id="属性">属性</h2> + +<dl> + <dt><code>AsyncIterator.prototype</code></dt> + <dd><code>%AsyncIteratorPrototype%</code> 内部对象。</dd> +</dl> + +<h2 id="方法">方法</h2> + +<dl> + <dt>{{JSxRef("AsyncIterator.from()")}} </dt> + <dd>等同于在传入的对象上调用 <code>@@asyncIterator</code> 。</dd> +</dl> + +<h2 id="AsyncIterator_原型"><code>AsyncIterator</code> 原型</h2> + +<h3 id="原型属性">原型属性</h3> + +<dl> + <dt><code>AsyncIterator.prototype.constructor</code></dt> + <dd>指定创建对的象原型的函数.</dd> + <dt><code>AsyncIterator.prototype[@@toStringTag]</code> </dt> + <dd><code>字符串 "Iterator"</code>.</dd> +</dl> + +<h3 id="原型方法">原型方法</h3> + +<dl> + <dt>{{JSxRef("AsyncIterator.prototype.map()")}} </dt> + <dd>...</dd> + <dt>{{JSxRef("AsyncIterator.prototype.filter()")}} </dt> + <dd>...</dd> + <dt>{{JSxRef("AsyncIterator.prototype.take()")}} </dt> + <dd>...</dd> + <dt>{{JSxRef("AsyncIterator.prototype.drop()")}} </dt> + <dd>...</dd> + <dt>{{JSxRef("AsyncIterator.prototype.asIndexedPairs()")}} </dt> + <dd>...</dd> + <dt>{{JSxRef("AsyncIterator.prototype.flatMap()")}} </dt> + <dd>...</dd> + <dt>{{JSxRef("AsyncIterator.prototype.reduce()")}} </dt> + <dd>...</dd> + <dt>{{JSxRef("AsyncIterator.prototype.toArray()")}} </dt> + <dd>...</dd> + <dt>{{JSxRef("AsyncIterator.prototype.forEach()")}} </dt> + <dd>...</dd> + <dt>{{JSxRef("AsyncIterator.prototype.some()")}} </dt> + <dd>...</dd> + <dt>{{JSxRef("AsyncIterator.prototype.every()")}} </dt> + <dd>...</dd> + <dt>{{JSxRef("AsyncIterator.prototype.find()")}} </dt> + <dd>...</dd> + <dt>{{JSxRef("AsyncIterator.prototype.@@iterator()", "AsyncIterator.prototype[@@iterator]()")}}</dt> + <dd>返回该 <code>AsyncIterator</code> 实例。</dd> +</dl> + +<h2 id="实现方法">实现方法</h2> + +<dl> + <dt>{{JSxRef("AsyncIterator.prototype.next()", "<<var>implementation</var>>.prototype.next()")}}</dt> + <dd>获取 <code>AsyncIterator</code> 中的下一项</dd> + <dt>{{JSxRef("AsyncIterator.prototype.return()", "<<var>implementation</var>>.prototype.next()")}}{{Optional_Inline}}</dt> + <dd>返回给出的值，并结束迭代。</dd> + <dt>{{JSxRef("AsyncIterator.prototype.throw()", "<<var>implementation</var>>.prototype.next()")}}{{Optional_Inline}}</dt> + <dd>抛出一个迭代器错误（同时也终止了迭代器，除非是在该迭代器内部被捕获）。</dd> +</dl> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + </thead> + <tbody> + <tr> + <td><a href="https://tc39.es/proposal-iterator-helpers/#sec-asynciterator-constructor">ESNext Iterator Helpers Proposal</a></td> + <td><span class="spec-Draft">Stage 2 Draft</span></td> + <td>Initial definition</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.AsyncIterator")}}</p> + +<h2 id="另请参阅">另请参阅</h2> + +<ul> + <li>{{JSxRef("Iteration_protocols", "Iteration protocols", "", "1")}}</li> + <li>{{JSxRef("Generator")}}</li> + <li>{{JSxRef("Global_Objects/AsyncGenerator", "AsyncGenerator")}}</li> + <li>{{JSxRef("Iterator")}} </li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/atomics/add/index.html b/files/zh-cn/web/javascript/reference/global_objects/atomics/add/index.html new file mode 100644 index 0000000000..256ddc4019 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/atomics/add/index.html @@ -0,0 +1,84 @@ +--- +title: Atomics.add() +slug: Web/JavaScript/Reference/Global_Objects/Atomics/add +tags: + - Atomics + - JavaScript + - Shared Memory + - 共享内存 + - 方法 +translation_of: Web/JavaScript/Reference/Global_Objects/Atomics/add +--- +<div>{{JSRef}}</div> + +<p><code><strong>Atomics</strong></code><strong><code>.add()</code></strong> 静态方法会将给定的值加到数组里的某个特定位置上，并返回该位置的旧值。此原子操作保证在写上修改的值之前不会发生其他写操作。</p> + +<div>{{EmbedInteractiveExample("pages/js/atomics-add.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">Atomics.add(typedArray, index, value) +</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>typedArray</code></dt> + <dd>一个共享的整型 typed array。例如 {{jsxref("Int8Array")}}，{{jsxref("Uint8Array")}}，{{jsxref("Int16Array")}}，{{jsxref("Uint16Array")}}，{{jsxref("Int32Array")}}，或者 {{jsxref("Uint32Array")}}。</dd> + <dt><code>index</code></dt> + <dd><code>typedArray</code> 中的位置，该位置数值会被加总并更新。</dd> + <dt><code>value</code></dt> + <dd>增加的数字。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>给定位置的旧值（<code>typedArray[index]）</code>。</p> + +<h3 id="错误">错误</h3> + +<ul> + <li>假如 <code>typedArray</code> 不是允许的整型之一，则抛出 {{jsxref("TypeError")}}。</li> + <li><code><font face="Open Sans, Arial, sans-serif">假如 </font>typedArray</code> 不是一个shared typed array类型，则抛出 {{jsxref("TypeError")}}。</li> + <li>如果 <code>index</code> 超出了 <code>typedArray 的边界，则抛出</code> {{jsxref("RangeError")}}。</li> +</ul> + +<h2 id="示例">示例</h2> + +<pre class="brush: js">var sab = new SharedArrayBuffer(1024); +var ta = new Uint8Array(sab); + +Atomics.add(ta, 0, 12); // returns 0, the old value +Atomics.load(ta, 0); // 12</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('ESDraft', '#sec-atomics.add', 'Atomics.add')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td>Initial definition in ES2017.</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器支持">浏览器支持</h2> + + + +<p>{{Compat("javascript.builtins.Atomics.add")}}</p> + +<h2 id="相关">相关</h2> + +<ul> + <li>{{jsxref("Atomics")}}</li> + <li>{{jsxref("Atomics.sub()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/atomics/and/index.html b/files/zh-cn/web/javascript/reference/global_objects/atomics/and/index.html new file mode 100644 index 0000000000..87754093bc --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/atomics/and/index.html @@ -0,0 +1,130 @@ +--- +title: Atomics.and() +slug: Web/JavaScript/Reference/Global_Objects/Atomics/and +tags: + - Atomics + - JavaScript + - 共享内存 + - 实验性 + - 方法 +translation_of: Web/JavaScript/Reference/Global_Objects/Atomics/and +--- +<div>{{JSRef}} {{SeeCompatTable}}</div> + +<p><code><strong>Atomics</strong></code><strong><code>.and()</code></strong> 静态方法会将给定的值与数组上的值进行按位与操作，并将结果赋值给数组，然后返回数组该位置上的旧值。此原子操作保证在写上修改的值之前不会发生其他写操作。</p> + +<div>{{EmbedInteractiveExample("pages/js/atomics-and.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">Atomics.and(typedArray, index, value) +</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>typedArray</code></dt> + <dd>一个共享的整型 typed array。例如 {{jsxref("Int8Array")}}，{{jsxref("Uint8Array")}}，{{jsxref("Int16Array")}}，{{jsxref("Uint16Array")}}，{{jsxref("Int32Array")}}，或 {{jsxref("Uint32Array")}}。</dd> + <dt><code>index</code></dt> + <dd><code>按位与操作的 typedArray 的值在数组</code>上的索引。</dd> + <dt><code>value</code></dt> + <dd>给定的按位与操作的值。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>给定位置的旧值（<code>typedArray[index]）。</code></p> + +<h3 id="错误">错误</h3> + +<ul> + <li>假如 <code>typedArray</code> 不是允许的整型之一，则抛出 {{jsxref("TypeError")}}。</li> + <li><code><font face="Open Sans, Arial, sans-serif">假如 </font>typedArray</code> 不是一个贡献的 typed array，则抛出 {{jsxref("TypeError")}}。</li> + <li>如果 <code>index</code> 超出了 <code>typedArray 的边界，则抛出</code> {{jsxref("RangeError")}}。</li> +</ul> + +<h2 id="描述">描述</h2> + +<p>假如 a 和 b 都是 1，那么按位与运算（ a & b）仅产生1。与操作的真值表为：</p> + +<table class="standard-table"> + <thead> + <tr> + <th><code>a</code></th> + <th><code>b</code></th> + <th><code>a & b</code></th> + </tr> + </thead> + <tbody> + <tr> + <td>0</td> + <td>0</td> + <td>0</td> + </tr> + <tr> + <td>0</td> + <td>1</td> + <td>0</td> + </tr> + <tr> + <td>1</td> + <td>0</td> + <td>0</td> + </tr> + <tr> + <td>1</td> + <td>1</td> + <td>1</td> + </tr> + </tbody> +</table> + +<p>比如，一个按位与如 <code>5 & 1</code> 的结果是 <code>0001，其十进制就是</code>1<code>。</code></p> + +<pre>5 0101 +1 0001 + ---- +1 0001</pre> + +<h2 id="示例">示例</h2> + +<pre class="brush: js">var sab = new SharedArrayBuffer(1024); +var ta = new Uint8Array(sab); +ta[0] = 5; + +Atomics.and(ta, 0, 1); // returns 0, the old value +Atomics.load(ta, 0); // 1 +</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('Shared Memory', '#Atomics.and', 'Atomics.and')}}</td> + <td>{{Spec2('Shared Memory')}}</td> + <td>Initial definition.</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器支持">浏览器支持</h2> + + + +<p>{{Compat("javascript.builtins.Atomics.and")}}</p> + +<h2 id="相关">相关</h2> + +<ul> + <li>{{jsxref("Atomics")}}</li> + <li>{{jsxref("Atomics.or()")}}</li> + <li>{{jsxref("Atomics.xor()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/atomics/compareexchange/index.html b/files/zh-cn/web/javascript/reference/global_objects/atomics/compareexchange/index.html new file mode 100644 index 0000000000..1883180411 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/atomics/compareexchange/index.html @@ -0,0 +1,86 @@ +--- +title: Atomics.compareExchange() +slug: Web/JavaScript/Reference/Global_Objects/Atomics/compareExchange +tags: + - Atomics + - JavaScript + - 共享内存 + - 方法 +translation_of: Web/JavaScript/Reference/Global_Objects/Atomics/compareExchange +--- +<div>{{JSRef}} {{SeeCompatTable}}</div> + +<p><code><strong>Atomics</strong></code><strong><code>.compareExchange()</code></strong> 静态方法会在数组的值与期望值相等的时候，将给定的替换值替换掉数组上的值，然后返回旧值。此原子操作保证在写上修改的值之前不会发生其他写操作。</p> + +<div>{{EmbedInteractiveExample("pages/js/atomics-compareexchange.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">Atomics.compareExchange(typedArray, index, expectedValue, replacementValue) +</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>typedArray</code></dt> + <dd>一个共享的整型 typed array。例如 {{jsxref("Int8Array")}}，{{jsxref("Uint8Array")}}，{{jsxref("Int16Array")}}，{{jsxref("Uint16Array")}}，{{jsxref("Int32Array")}}，或 {{jsxref("Uint32Array")}}。</dd> + <dt><code>index</code></dt> + <dd><code>typedArray</code> 的索引。</dd> + <dt><code>expectedValue</code></dt> + <dd>用于比较的值。</dd> + <dt>replacementValue</dt> + <dd>将要替换上的值。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>给定位置的旧值(<code>typedArray[index]</code>).</p> + +<h3 id="错误">错误</h3> + +<ul> + <li>假如 <code>typedArray</code> 不是允许的整型之一，则抛出 {{jsxref("TypeError")}}。</li> + <li><code><font face="Open Sans, Arial, sans-serif">假如 </font>typedArray</code> 不是一个贡献的 typed array，则抛出 {{jsxref("TypeError")}}。</li> + <li>如果 <code>index</code> 超出了 <code>typedArray 的边界，则抛出</code> {{jsxref("RangeError")}}。</li> +</ul> + +<h2 id="示例">示例</h2> + +<pre class="brush: js">var sab = new SharedArrayBuffer(1024); +var ta = new Uint8Array(sab); +ta[0] = 7; + +Atomics.compareExchange(ta, 0, 7, 12); // returns 7, the old value +Atomics.load(ta, 0); // 12</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('Shared Memory', '#Atomics.compareExchange', 'Atomics.compareExchange')}}</td> + <td>{{Spec2('Shared Memory')}}</td> + <td>Initial definition.</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器支持">浏览器支持</h2> + + + +<p>{{Compat("javascript.builtins.Atomics.compareExchange")}}</p> + +<h2 id="相关">相关</h2> + +<ul> + <li>{{jsxref("Atomics")}}</li> + <li>{{jsxref("Atomics.exchange()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/atomics/exchange/index.html b/files/zh-cn/web/javascript/reference/global_objects/atomics/exchange/index.html new file mode 100644 index 0000000000..4502bf8a52 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/atomics/exchange/index.html @@ -0,0 +1,85 @@ +--- +title: Atomics.exchange() +slug: Web/JavaScript/Reference/Global_Objects/Atomics/exchange +tags: + - Atmoics + - Experimental + - JavaScript + - Method + - 共享内存 + - 实验性 +translation_of: Web/JavaScript/Reference/Global_Objects/Atomics/exchange +--- +<div>{{JSRef}} {{SeeCompatTable}}</div> + +<p><code><strong>Atomics</strong></code><strong><code>.exchange()</code></strong> 静态方法会用给定的值替换掉数组上的值，然后返回数组的旧值。此原子操作保证在写上修改的值之前不会发生其他写操作。</p> + +<div>{{EmbedInteractiveExample("pages/js/atomics-exchange.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">Atomics.exchange(typedArray, index, value) +</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>typedArray</code></dt> + <dd>一个共享的整型 typed array。例如 {{jsxref("Int8Array")}}，{{jsxref("Uint8Array")}}，{{jsxref("Int16Array")}}，{{jsxref("Uint16Array")}}，{{jsxref("Int32Array")}}，或 {{jsxref("Uint32Array")}}。</dd> + <dt><code>index</code></dt> + <dd>被替换的 <code>typedArray 值的索引。</code></dd> + <dt><code>value</code></dt> + <dd>去替换的值。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>给定位置的旧值(<code>typedArray[index]</code>).</p> + +<h3 id="错误">错误</h3> + +<ul> + <li>假如 <code>typedArray</code> 不是允许的整型之一，则抛出 {{jsxref("TypeError")}}。</li> + <li><code><font face="Open Sans, Arial, sans-serif">假如 </font>typedArray</code> 不是一个贡献的 typed array，则抛出 {{jsxref("TypeError")}}。</li> + <li>如果 <code>index</code> 超出了 <code>typedArray 的边界，则抛出</code> {{jsxref("RangeError")}}。</li> +</ul> + +<h2 id="示例">示例</h2> + +<pre class="brush: js">var sab = new SharedArrayBuffer(1024); +var ta = new Uint8Array(sab); + +Atomics.exchange(ta, 0, 12); // returns 0, the old value +Atomics.load(ta, 0); // 12</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('Shared Memory', '#Atomics.exchange', 'Atomics.exchange')}}</td> + <td>{{Spec2('Shared Memory')}}</td> + <td>Initial definition.</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器支持">浏览器支持</h2> + + + +<p>{{Compat("javascript.builtins.Atomics.exchange")}}</p> + +<h2 id="相关">相关</h2> + +<ul> + <li>{{jsxref("Atomics")}}</li> + <li>{{jsxref("Atomics.compareExchange()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/atomics/index.html b/files/zh-cn/web/javascript/reference/global_objects/atomics/index.html new file mode 100644 index 0000000000..4c80b3f868 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/atomics/index.html @@ -0,0 +1,151 @@ +--- +title: Atomics +slug: Web/JavaScript/Reference/Global_Objects/Atomics +tags: + - JavaScript +translation_of: Web/JavaScript/Reference/Global_Objects/Atomics +--- +<p>{{JSRef}}</p> + +<p><strong><code>Atomics</code></strong> 对象提供了一组静态方法对 {{jsxref("SharedArrayBuffer")}} 和 {{jsxref("ArrayBuffer")}} 对象进行原子操作。</p> + +<h2 id="描述">描述</h2> + +<p>这些原子操作属于 <code>Atomics</code> 模块。与一般的全局对象不同，<code>Atomics</code> 不是构造函数，因此不能使用 <a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Operators/new">new</a> 操作符调用，也不能将其当作函数直接调用。<code>Atomics</code> 的所有属性和方法都是静态的（与 {{jsxref("Math")}} 对象一样）。</p> + +<h3 id="原子操作">原子操作</h3> + +<p>多个共享内存的线程能够同时读写同一位置上的数据。原子操作会确保正在读或写的数据的值是符合预期的，即下一个原子操作一定会在上一个原子操作结束后才会开始，其操作过程不会中断。</p> + +<h3 id="等待和通知">等待和通知</h3> + +<p><code>wait()</code> 和 <code>notify()</code> 方法采用的是 Linux 上的 futexes 模型（“快速用户空间互斥量”），可以让进程一直等待直到某个特定的条件为真，主要用于实现阻塞。</p> + +<h2 id="方法">方法</h2> + +<dl> + <dt><span style="display: none;"> </span></dt> + <dt>{{jsxref("Atomics.add()")}}</dt> + <dd>将指定位置上的数组元素与给定的值相加，并返回相加前该元素的值。</dd> + <dt><strong>{{jsxref("Atomics.and()")}}</strong></dt> + <dd>将指定位置上的数组元素与给定的值相与，并返回与操作前该元素的值。</dd> + <dt>{{jsxref("Atomics.compareExchange()")}}</dt> + <dd>如果数组中指定的元素与给定的值相等，则将其更新为新的值，并返回该元素原先的值。</dd> + <dt>{{jsxref("Atomics.exchange()")}}</dt> + <dd>将数组中指定的元素更新为给定的值，并返回该元素更新前的值。</dd> + <dt>{{jsxref("Atomics.isLockFree()", "Atomics.isLockFree(size)")}}</dt> + <dd>可以用来检测当前系统是否支持硬件级的原子操作。对于指定大小的数组，如果当前系统支持硬件级的原子操作，则返回 <code>true</code>；否则就意味着对于该数组，<code>Atomics</code> 对象中的各原子操作都只能用锁来实现。此函数面向的是技术专家。</dd> + <dt>{{jsxref("Atomics.load()")}}</dt> + <dd>返回数组中指定元素的值。</dd> + <dt>{{jsxref("Atomics.notify()")}}</dt> + <dd>唤醒等待队列中正在数组指定位置的元素上等待的线程。返回值为成功唤醒的线程数量。</dd> + <dt>{{jsxref("Atomics.or()")}}</dt> + <dd>将指定位置上的数组元素与给定的值相或，并返回或操作前该元素的值。</dd> + <dt>{{jsxref("Atomics.store()")}}</dt> + <dd>将数组中指定的元素设置为给定的值，并返回<strong>该值</strong>。</dd> + <dt>{{jsxref("Atomics.sub()")}}</dt> + <dd>将指定位置上的数组元素与给定的值相减，并返回相减前该元素的值。</dd> + <dt>{{jsxref("Atomics.wait()")}}</dt> + <dd>检测数组中某个指定位置上的值是否仍然是给定值，是则保持挂起直到被唤醒或超时。返回值为 "<code>ok</code>"、"<code>not-equal</code>" 或 "<code>time-out</code>"。调用时，如果当前线程不允许阻塞，则会抛出异常（大多数浏览器都不允许在主线程中调用 <code>wait()</code>）。</dd> + <dt>{{jsxref("Atomics.xor()")}}</dt> + <dd>将指定位置上的数组元素与给定的值相异或，并返回异或操作前该元素的值。</dd> +</dl> + +<h2 id="示例">示例</h2> + +<h3 id="使用_Atomics">使用 Atomics</h3> + +<pre class="brush: js notranslate">const sab = new SharedArrayBuffer(1024); +const ta = new Uint8Array(sab); + +ta[0]; +// 0 + +ta[0] = 5; +// 5 + +Atomics.add(ta, 0, 12); +// 5 +Atomics.load(ta, 0); +// 17 ✅ +// 12 ❌ + +Atomics.and(ta, 0, 1); +// 17 +Atomics.load(ta, 0); +// 1 + +Atomics.compareExchange(ta, 0, 5, 12); +Atomics.load(ta, 0); // 12 + +Atomics.exchange(ta, 0, 12); +Atomics.load(ta, 0); // 12 + +Atomics.isLockFree(1); // true +Atomics.isLockFree(2); // true +Atomics.isLockFree(3); // false +Atomics.isLockFree(4); // true + +Atomics.or(ta, 0, 1); +Atomics.load(ta, 0); // 5 + +Atomics.store(ta, 0, 12); // 12 + +Atomics.sub(ta, 0, 2); +Atomics.load(ta, 0); // 3 + +Atomics.xor(ta, 0, 1); +Atomics.load(ta, 0); // 4 +</pre> + +<h3 id="Waiting_和_notifiying">Waiting 和 notifiying</h3> + +<p>给定一个共享的 <code>Int32Array</code>：</p> + +<pre class="brush: js notranslate">const sab = new SharedArrayBuffer(1024); +const int32 = new Int32Array(sab); +</pre> + +<p>读取线程正在休眠并位置0上等待。只要该位置应为0，它就不会继续。但是，一旦写入线程存储了新值，写入线程将通知它并返回新值（123）。</p> + +<pre class="brush: js notranslate">Atomics.wait(int32, 0, 0); +console.log(int32[0]); // 123 +</pre> + +<p>写入线程存储一个新值并再写入完成时通知等待线程：</p> + +<pre class="brush: js notranslate">console.log(int32[0]); // 0; +Atomics.store(int32, 0, 123); +Atomics.notify(int32, 0, 1);</pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Specification</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-atomics-object', 'Atomics')}}</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div class="hidden">The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</div> + +<p>{{Compat("javascript.builtins.Atomics")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("ArrayBuffer")}}</li> + <li><a href="/zh-CN/docs/Web/JavaScript/Typed_arrays">JavaScript typed arrays</a></li> + <li><a href="/zh-CN/docs/Web/API/Web_Workers_API">Web Workers</a></li> + <li><a href="https://github.com/lars-t-hansen/parlib-simple">parlib-simple </a>– a simple library providing synchronization and work distribution abstractions.</li> + <li><a href="https://github.com/tc39/ecmascript_sharedmem/blob/master/TUTORIAL.md">Shared Memory – a brief tutorial</a></li> + <li><a href="https://hacks.mozilla.org/2016/05/a-taste-of-javascripts-new-parallel-primitives/">A Taste of JavaScript’s New Parallel Primitives – Mozilla Hacks</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/atomics/islockfree/index.html b/files/zh-cn/web/javascript/reference/global_objects/atomics/islockfree/index.html new file mode 100644 index 0000000000..be8b32b587 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/atomics/islockfree/index.html @@ -0,0 +1,69 @@ +--- +title: Atomics.isLockFree() +slug: Web/JavaScript/Reference/Global_Objects/Atomics/isLockFree +translation_of: Web/JavaScript/Reference/Global_Objects/Atomics/isLockFree +--- +<div>{{JSRef}} {{SeeCompatTable}}</div> + +<p>静态方法 <code><strong>Atomics</strong></code><strong><code>.isLockFree()</code></strong> 用于校验是否能够使用原子操作的<code><a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/TypedArray/BYTES_PER_ELEMENT" title="TypedArray.BYTES_PER_ELEMENT 属性代表了强类型数组中每个元素所占用的字节数。">TypedArray</a></code>的标准字节长度之一. 若该字节长度为可处理的TypedArray标准字节长度之一则返回 <code>true.</code> TypedArray的标准字节长度参见 <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray/BYTES_PER_ELEMENT">BYTES_PER_ELEMENT</a></p> + +<div>{{EmbedInteractiveExample("pages/js/atomics-islockfree.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">Atomics.isLockFree(size) +</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>size</code></dt> + <dd>整形.字节长度,通常为<a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/TypedArray/BYTES_PER_ELEMENT" title="TypedArray.BYTES_PER_ELEMENT 属性代表了强类型数组中每个元素所占用的字节数。"><code>TypedArray.BYTES_PER_ELEMENT</code></a></dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p> {{jsxref("Boolean")}} 是否为能够使用原子操作的<code><a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/TypedArray/BYTES_PER_ELEMENT" title="TypedArray.BYTES_PER_ELEMENT 属性代表了强类型数组中每个元素所占用的字节数。">TypedArray</a></code>的标准字节长度之一.</p> + +<h2 id="示例">示例</h2> + +<pre class="brush: js">Atomics.isLockFree(1); // true +Atomics.isLockFree(2); // true +Atomics.isLockFree(3); // false +Atomics.isLockFree(4); // true +Atomics.isLockFree(5); // false +Atomics.isLockFree(6); // false +Atomics.isLockFree(7); // false +Atomics.isLockFree(8); // false +Atomics.isLockFree(<code>Float64Array.BYTES_PER_ELEMENT</code>); // false,<code>Atomics方法无法处理Float64Array</code></pre> + +<h2 id="Specifications">Specifications</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('Shared Memory', '#Atomics.isLockFree', 'Atomics.isLockFree')}}</td> + <td>{{Spec2('Shared Memory')}}</td> + <td>Initial definition.</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility">Browser compatibility</h2> + + + +<p>{{Compat("javascript.builtins.Atomics.isLockFree")}}</p> + +<h2 id="See_also">See also</h2> + +<ul> + <li>{{jsxref("Atomics")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/atomics/load/index.html b/files/zh-cn/web/javascript/reference/global_objects/atomics/load/index.html new file mode 100644 index 0000000000..2129a3a4ab --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/atomics/load/index.html @@ -0,0 +1,76 @@ +--- +title: Atomics.load() +slug: Web/JavaScript/Reference/Global_Objects/Atomics/load +translation_of: Web/JavaScript/Reference/Global_Objects/Atomics/load +--- +<div>{{JSRef}}</div> + +<p>静态方法 <code><strong>Atomics</strong></code><strong><code>.load()</code></strong> 返回一个数组当中给定位置的值。</p> + +<div>{{EmbedInteractiveExample("pages/js/atomics-load.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">Atomics.load(typedArray, index) +</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>typedArray</code></dt> + <dd>一个共享的整型数组。可以是 {{jsxref("Int8Array")}}，{{jsxref("Uint8Array")}}，{{jsxref("Int16Array")}}，{{jsxref("Uint16Array")}}，{{jsxref("Int32Array")}} 或 {{jsxref("Uint32Array")}}.</dd> + <dt><code>index</code></dt> + <dd>在 <code>typedArray</code> 中需要加载的位置<font face="consolas, Liberation Mono, courier, monospace"><span style="background-color: rgba(220, 220, 220, 0.5);">。</span></font></dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>给定位置的值 (<code>typedArray[index]</code>)。</p> + +<h3 id="异常">异常</h3> + +<ul> + <li>抛出 {{jsxref("TypeError")}}, 如果 <code>typedArray</code> 不是一个被允许的整型。</li> + <li>抛出 {{jsxref("TypeError")}}, 如果 <code>typedArray</code> 不是一个共享数组。</li> + <li>抛出 {{jsxref("RangeError")}}, 如果 <code>index</code> 超出 <code>typedArray</code> 的界限。</li> +</ul> + +<h2 id="示例">示例</h2> + +<pre class="brush: js">var sab = new SharedArrayBuffer(1024); +var ta = new Uint8Array(sab); + +Atomics.add(ta, 0, 12); +Atomics.load(ta, 0); // 12</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>{{SpecName('ESDraft', '#sec-atomics.load', 'Atomics.load')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td>Initial definition in ES2017.</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容">浏览器兼容</h2> + +<div class="hidden">本页的兼容性表格是通过数据生成的。 如果你愿意对这些数据做些贡献，请检出 <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> 然后给我们发一个 pull request。</div> + +<p>{{Compat("javascript.builtins.Atomics.load")}}</p> + +<h2 id="参阅">参阅</h2> + +<ul> + <li>{{jsxref("Atomics")}}</li> + <li>{{jsxref("Atomics.store()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/atomics/notify/index.html b/files/zh-cn/web/javascript/reference/global_objects/atomics/notify/index.html new file mode 100644 index 0000000000..bf2399192c --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/atomics/notify/index.html @@ -0,0 +1,93 @@ +--- +title: Atomics.notify() +slug: Web/JavaScript/Reference/Global_Objects/Atomics/notify +tags: + - Atomics + - JavaScript + - Method + - Shared Memory +translation_of: Web/JavaScript/Reference/Global_Objects/Atomics/notify +--- +<div>{{JSRef}}</div> + +<p>静态方法 <code><strong>Atomics</strong></code><strong><code>.notify()</code></strong> 提醒一些在等待队列中休眠的代理。</p> + +<div class="note"> +<p><strong>注意：</strong>本操作仅在共享的 {{jsxref("Int32Array")}} 下可用。</p> +</div> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox notranslate">Atomics.notify(typedArray, index, count) +</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>typedArray</code></dt> + <dd>一个共享的 {{jsxref("Int32Array")}}。</dd> + <dt><code>index</code></dt> + <dd><code>typedArray</code> 中要唤醒的目标索引。</dd> + <dt><code>count</code></dt> + <dd>要通知的正在休眠的代理的数量。默认是 {{jsxref("Infinity", "+Infinity")}}。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>被唤醒的代理的数量。</p> + +<h3 id="异常">异常</h3> + +<ul> + <li>若 <code>typedArray</code> 不是共享的 {{jsxref("Int32Array")}}，则抛出一个 {{jsxref("TypeError")}} 异常。</li> + <li>若 <code>index</code> 索引超出了 <code>typedArray</code> 的大小，则抛出一个 {{jsxref("RangeError")}} 异常。</li> +</ul> + +<h2 id="示例">示例</h2> + +<p>分配一个共享的 <code>Int32Array</code>：</p> + +<pre class="brush: js notranslate">var sab = new SharedArrayBuffer(1024); +var int32 = new Int32Array(sab); +</pre> + +<p>一个读线程会进入休眠并监视索引0处的值（默认为0）。只要索引0处的值不为0，读进程就会唤醒。但是，一旦写进程存储了一个新的值，写进程就会产生一个提醒并返回写入后的新值（123）。（这里示例有问题或者说对初学者不友好，如果直接在浏览器控制台运行下面代码会报错，因为我们不能尝试睡眠主线程，可以见 <a href="https://github.com/lizhongzhen11/lizz-blog/issues/125#notice">重学js —— 结构化数据之Atomics对象</a>，同时我在 <strong>codepen </strong>写了一个示例：<a href="https://codepen.io/lizhongzhen11/project/editor/AmzyaY#">Atomics.wait使用示例</a>）</p> + +<pre class="brush: js notranslate">Atomics.wait(int32, 0, 0); +console.log(int32[0]); // 123</pre> + +<p>写进程写入一个新值并告知等待进程已经写入成功了：</p> + +<pre class="brush: js notranslate">console.log(int32[0]); // 0; +Atomics.store(int32, 0, 123); +Atomics.notify(int32, 0, 1);</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>{{SpecName('ESDraft', '#sec-atomics.notify', 'Atomics.notify')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td>Initial definition in ES2017.</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.Atomics.notify")}}</p> + +<h2 id="相关文档">相关文档</h2> + +<ul> + <li>{{jsxref("Atomics")}}</li> + <li>{{jsxref("Atomics.wait()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/atomics/or/index.html b/files/zh-cn/web/javascript/reference/global_objects/atomics/or/index.html new file mode 100644 index 0000000000..286e89cc0a --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/atomics/or/index.html @@ -0,0 +1,129 @@ +--- +title: Atomics.or() +slug: Web/JavaScript/Reference/Global_Objects/Atomics/or +tags: + - Atomics + - JavaScript + - Method + - Shared Memory +translation_of: Web/JavaScript/Reference/Global_Objects/Atomics/or +--- +<div>{{JSRef}}</div> + +<p>静态方法 <code><strong>Atomics</strong></code><strong><code>.or()</code></strong> 用数组中指定位置的值进行一次按位或运算，并返回未计算时数组中指定位置处的值。这个atomic操作保证了在修改后的值被写回之前没有其它的写入操作发生。</p> + +<div>{{EmbedInteractiveExample("pages/js/atomics-or.html")}}</div> + + + +<h2 id="Syntax">Syntax</h2> + +<pre class="syntaxbox">Atomics.or(typedArray, index, value) +</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>typedArray</code></dt> + <dd>一个共享的int数组，类型为 {{jsxref("Int8Array")}}、{{jsxref("Uint8Array")}}、{{jsxref("Int16Array")}}、{{jsxref("Uint16Array")}}、{{jsxref("Int32Array")}} 或 {{jsxref("Uint32Array")}}。</dd> + <dt><code>index</code></dt> + <dd><code>typedArray</code> 中要进行按位或运算的索引。</dd> + <dt><code>value</code></dt> + <dd>要进行按位或运算的数。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p><code>typedArray[index]</code> 处运算前的值。</p> + +<h3 id="异常">异常</h3> + +<ul> + <li>若 <code>typedArray</code> 不是一个可用的int类型，则抛出一个 {{jsxref("TypeError")}} 异常。</li> + <li>若 <code>typedArray</code> 不是一个共享的数组类型，则抛出一个 {{jsxref("TypeError")}} 异常。</li> + <li>若 <code>index</code> 索引超出了 <code>typedArray</code> 的大小，则抛出一个 {{jsxref("RangeError")}} 异常。</li> +</ul> + +<h2 id="详情">详情</h2> + +<p>当 <code>a</code> 或者 <code>b</code> 为1时，按位或运算结果为1。或运算真值表如下：</p> + +<table class="standard-table"> + <thead> + <tr> + <th><code>a</code></th> + <th><code>b</code></th> + <th><code>a | b</code></th> + </tr> + </thead> + <tbody> + <tr> + <td>0</td> + <td>0</td> + <td>0</td> + </tr> + <tr> + <td>0</td> + <td>1</td> + <td>1</td> + </tr> + <tr> + <td>1</td> + <td>0</td> + <td>1</td> + </tr> + <tr> + <td>1</td> + <td>1</td> + <td>1</td> + </tr> + </tbody> +</table> + +<p>例如，让 <code>5 & 1</code> 进行按位或运算的结果是 <code>0101</code> ，也就是十进制的5：</p> + +<pre>5 0101 +1 0001 + ---- +5 0101 +</pre> + +<h2 id="示例">示例</h2> + +<pre class="brush: js">var sab = new SharedArrayBuffer(1024); +var ta = new Uint8Array(sab); +ta[0] = 2; + +Atomics.or(ta, 0, 1); // returns 2, the old value +Atomics.load(ta, 0); // 3</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>{{SpecName('ESDraft', '#sec-atomics.or', 'Atomics.or')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td>Initial definition in ES2017.</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.Atomics.or")}}</p> + +<h2 id="相关文档">相关文档</h2> + +<ul> + <li>{{jsxref("Atomics")}}</li> + <li>{{jsxref("Atomics.and()")}}</li> + <li>{{jsxref("Atomics.xor()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/atomics/store/index.html b/files/zh-cn/web/javascript/reference/global_objects/atomics/store/index.html new file mode 100644 index 0000000000..bfc5a03982 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/atomics/store/index.html @@ -0,0 +1,77 @@ +--- +title: Atomics.store() +slug: Web/JavaScript/Reference/Global_Objects/Atomics/store +translation_of: Web/JavaScript/Reference/Global_Objects/Atomics/store +--- +<div>{{JSRef}}</div> + +<p>静态的Atomics.store（）方法将给定的值存储在数组中的指定位置，并返回该值。.</p> + +<div>{{EmbedInteractiveExample("pages/js/atomics-store.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">Atomics.store(typedArray, index, value) +</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>typedArray</code></dt> + <dd>一个指定类型的shared数组. 类型为 {{jsxref("Int8Array")}}, {{jsxref("Uint8Array")}}, {{jsxref("Int16Array")}}, {{jsxref("Uint16Array")}}, {{jsxref("Int32Array")}}, 或者 {{jsxref("Uint32Array")}}其中一个.</dd> + <dt><code>index</code></dt> + <dd>typedArray中用来存储value的位置.</dd> + <dt><code>value</code></dt> + <dd>要存储的数字.</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>被存储的值.</p> + +<h3 id="异常">异常</h3> + +<ul> + <li>抛出一个{{jsxref("TypeError")}}异常, 如果 <code>typedArray</code> 不是上述给定的类型之一.</li> + <li>抛出一个{{jsxref("TypeError")}}异常, 如果 <code>typedArray</code> 不是一个指定类型的shared类型数组.</li> + <li>抛出一个{{jsxref("RangeError")}}异常, 如果 <code>index</code> 在 <code>typedArray</code>中越界了。</li> +</ul> + +<h2 id="示例">示例</h2> + +<pre class="brush: js">var sab = new SharedArrayBuffer(1024); +var ta = new Uint8Array(sab); + +Atomics.store(ta, 0, 12); // 12</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('ESDraft', '#sec-atomics.store', 'Atomics.store')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td>Initial definition in ES2017.</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div class="hidden">此页面上的兼容性表格由结构化数据生成。 如果您想为数据做出贡献，请查看 <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> 并向我们发送 pr（pull request）请求。</div> + +<p>{{Compat("javascript.builtins.Atomics.store")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Atomics")}}</li> + <li>{{jsxref("Atomics.load()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/atomics/sub/index.html b/files/zh-cn/web/javascript/reference/global_objects/atomics/sub/index.html new file mode 100644 index 0000000000..c5a43d3e35 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/atomics/sub/index.html @@ -0,0 +1,82 @@ +--- +title: Atomics.sub() +slug: Web/JavaScript/Reference/Global_Objects/Atomics/sub +translation_of: Web/JavaScript/Reference/Global_Objects/Atomics/sub +--- +<div>{{JSRef}}</div> + +<div><code><strong>Atomics.sub()</strong></code> 静态方法在数组中的给定位置减去给定值，并返回该位置的旧值。这个原子操作保证在修改后的值被写回之前不会发生其他写操作。</div> + +<div></div> + +<div>{{EmbedInteractiveExample("pages/js/atomics-sub.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">Atomics.sub(typedArray, index, value) +</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>typedArray</code></dt> + <dd>一个共享的整型 typed array。 例如 {{jsxref("Int8Array")}}, {{jsxref("Uint8Array")}}, {{jsxref("Int16Array")}}, {{jsxref("Uint16Array")}}, {{jsxref("Int32Array")}}, 或者 {{jsxref("Uint32Array")}}.</dd> + <dt><code>index</code></dt> + <dd>要被 <code>value</code> 值减去的 <code>typedArray</code> 索引位置。</dd> + <dt><code>value</code></dt> + <dd>要减去的数字。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>给定位置的旧值 (<code>typedArray[index]</code>)。</p> + +<h3 id="异常">异常</h3> + +<ul> + <li>假如 <code>typedArray</code> 不是允许的整型之一，则抛出 {{jsxref("TypeError")}}。</li> + <li>假如 <code>typedArray</code> 不是一个共享的整型 typed array，则抛出 {{jsxref("TypeError")}}。</li> + <li>如果 <code>index</code> 超出了 <code>typedArray</code> 的边界，则抛出 {{jsxref("RangeError")}}。</li> +</ul> + +<h2 id="例子">例子</h2> + +<pre class="brush: js">const sab = new SharedArrayBuffer(1024); +const ta = new Uint8Array(sab); +ta[0] = 48; + +Atomics.sub(ta, 0, 12); // returns 48, the old value +Atomics.load(ta, 0); // 36 +</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('ESDraft', '#sec-atomics.sub', 'Atomics.sub')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td>Initial definition in ES2017.</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器支持">浏览器支持</h2> + + + +<p>{{Compat("javascript.builtins.Atomics.sub")}}</p> + +<h2 id="相关">相关</h2> + +<ul> + <li>{{jsxref("Atomics")}}</li> + <li>{{jsxref("Atomics.add()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/atomics/wait/index.html b/files/zh-cn/web/javascript/reference/global_objects/atomics/wait/index.html new file mode 100644 index 0000000000..6a14b9260a --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/atomics/wait/index.html @@ -0,0 +1,95 @@ +--- +title: Atomics.wait() +slug: Web/JavaScript/Reference/Global_Objects/Atomics/wait +tags: + - Atomics + - JavaScript + - Method + - Shared Memory +translation_of: Web/JavaScript/Reference/Global_Objects/Atomics/wait +--- +<div>{{JSRef}}</div> + +<p>静态方法 <code><strong>Atomics</strong></code><strong><code>.wait()</code></strong> 确保了一个在 {{jsxref("Int32Array")}} 数组中给定位置的值没有发生变化、仍然是给定的值时进程将会睡眠，直到被唤醒或超时。该方法返回一个字符串，值为<code>"ok"</code>, <code>"not-equal"</code>, 或 <code>"timed-out"</code> 之一。</p> + +<div class="note"> +<p><strong>注意:</strong> 这项操作仅允许同一个共享内存的 {{jsxref("Int32Array")}} 配合使用并且无法运行在主线程中。</p> +</div> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">Atomics.wait(typedArray, index, value[, timeout]) +</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>typedArray</code></dt> + <dd>一个共享内存的 {{jsxref("Int32Array")}} 数组。</dd> + <dt><code>index</code></dt> + <dd>给定需要检测的 <code>typedArray</code> 数组的位置索引。</dd> + <dt><code>value</code></dt> + <dd>给定需要检测的位置索引的预期值。</dd> + <dt><code>timeout</code> {{optional_inline}}</dt> + <dd>超时前等待的毫秒数。 {{jsxref("Infinity")}}, 如未提供该参数，将为无穷大。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>一个 {{jsxref("String")}} 字符串，值为 "<code>ok</code>", "<code>not-equal</code>", 或 "<code>timed-out</code>" 三种之一。</p> + +<h3 id="异常">异常</h3> + +<ul> + <li>如果参数 <code>typedArray</code> 不是一个共享内存的 {{jsxref("Int32Array")}} 数组，将会抛出一个 {{jsxref("TypeError")}} 。</li> + <li>如果参数 <code>index</code> 超出了参数 <code>typedArray</code>的边界，将会抛出一个 {{jsxref("RangeError")}} 。</li> +</ul> + +<h2 id="示例">示例</h2> + +<p>创建一个共享内存的 <code>Int32Array</code> :</p> + +<pre class="brush: js">var sab = new SharedArrayBuffer(1024); +var int32 = new Int32Array(sab); +</pre> + +<p>检测给定的数组索引0的值，如果它如预期一般的等于我们给定的值0，则这个读取线程将会睡眠等待。一旦当有一个写入线程在这个位置存储了一个新值，它将会收到写入线程的通知并且返回新值 (123) :</p> + +<pre class="brush: js">Atomics.wait(int32, 0, 0); +console.log(int32[0]); // 123</pre> + +<p>一旦某个写入线程存储了一个新值到<code>int32</code> 的索引0位置，则通知给该等待线程：</p> + +<pre class="brush: js">console.log(int32[0]); // 0; +Atomics.store(int32, 0, 123); +Atomics.notify(int32, 0, 1);</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>{{SpecName('ESDraft', '#sec-atomics.wait', 'Atomics.wait')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td>Initial definition in ES2017.</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器支持">浏览器支持</h2> + +<div class="hidden">本页的支持列表生成自结构化的数据。如果你希望为这个数据做出贡献， 请检出 <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> 并发送一个拉取请求给我们。</div> + +<p>{{Compat("javascript.builtins.Atomics.wait")}}</p> + +<h2 id="相关参阅">相关参阅</h2> + +<ul> + <li>{{jsxref("Atomics")}}</li> + <li>{{jsxref("Atomics.notify()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/atomics/xor/index.html b/files/zh-cn/web/javascript/reference/global_objects/atomics/xor/index.html new file mode 100644 index 0000000000..83b0bdfb46 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/atomics/xor/index.html @@ -0,0 +1,126 @@ +--- +title: Atomics.xor() +slug: Web/JavaScript/Reference/Global_Objects/Atomics/xor +translation_of: Web/JavaScript/Reference/Global_Objects/Atomics/xor +--- +<div>{{JSRef}}</div> + +<div><code><strong>Atomics</strong></code><strong><code>.xor()</code></strong> 静态方法会在数组中给定位置进行一次按位异或操作，并返回该位置的旧值。这个原子操作保证在修改后的值被写回之前不会发生其他写操作。</div> + +<div></div> + +<div>{{EmbedInteractiveExample("pages/js/atomics-xor.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">Atomics.xor(typedArray, index, value) +</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>typedArray</code></dt> + <dd>一个共享的整型 typed array。例如 {{jsxref("Int8Array")}}, {{jsxref("Uint8Array")}}, {{jsxref("Int16Array")}}, {{jsxref("Uint16Array")}}, {{jsxref("Int32Array")}}, 或者 {{jsxref("Uint32Array")}}.</dd> + <dt><code>index</code></dt> + <dd><code>typedArray</code> 中需要进行按位异或的索引位置。</dd> + <dt><code>value</code></dt> + <dd>要进行按位异或的数字。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>给定位置的旧值 (<code>typedArray[index]</code>)。</p> + +<h3 id="异常">异常</h3> + +<ul> + <li>假如 <code>typedArray</code> 不是允许的整型之一，则抛出 {{jsxref("TypeError")}}。</li> + <li>假如 <code>typedArray</code> 不是一个共享的整型 typed array，则抛出 {{jsxref("TypeError")}}。</li> + <li>如果 <code>index</code> 超出了 <code>typedArray</code> 的边界，则抛出 {{jsxref("RangeError")}}。</li> +</ul> + +<h2 id="描述">描述</h2> + +<p>如果a和b不同，则按位异或操作产生1。异或操作的真值表如下：</p> + +<table class="standard-table"> + <thead> + <tr> + <th><code>a</code></th> + <th><code>b</code></th> + <th><code>a ^ b</code></th> + </tr> + </thead> + <tbody> + <tr> + <td>0</td> + <td>0</td> + <td>0</td> + </tr> + <tr> + <td>0</td> + <td>1</td> + <td>1</td> + </tr> + <tr> + <td>1</td> + <td>0</td> + <td>1</td> + </tr> + <tr> + <td>1</td> + <td>1</td> + <td>0</td> + </tr> + </tbody> +</table> + +<p>例如，按位异或 <code>5 & 1</code> 将返回 <code>0100</code>，而 <code>0100</code> 是十进制为 <code>4</code> 。</p> + +<pre>5 0101 +1 0001 + ---- +4 0100 +</pre> + +<h2 id="例子">例子</h2> + +<pre class="brush: js">const sab = new SharedArrayBuffer(1024); +const ta = new Uint8Array(sab); +ta[0] = 5; + +Atomics.xor(ta, 0, 1); // returns 5, the old value +Atomics.load(ta, 0); // 4</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('ESDraft', '#sec-atomics.xor', 'Atomics.xor')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td>Initial definition in ES2017.</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器支持">浏览器支持</h2> + + + +<p>{{Compat("javascript.builtins.Atomics.xor")}}</p> + +<h2 id="相关">相关</h2> + +<ul> + <li>{{jsxref("Atomics")}}</li> + <li>{{jsxref("Atomics.and()")}}</li> + <li>{{jsxref("Atomics.or()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/bigint/asintn/index.html b/files/zh-cn/web/javascript/reference/global_objects/bigint/asintn/index.html new file mode 100644 index 0000000000..cab753a464 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/bigint/asintn/index.html @@ -0,0 +1,73 @@ +--- +title: BigInt.asIntN() +slug: Web/JavaScript/Reference/Global_Objects/BigInt/asIntN +translation_of: Web/JavaScript/Reference/Global_Objects/BigInt/asIntN +--- +<div>{{JSRef}}</div> + +<p><strong><code>BigInt.asIntN</code></strong> 静态方法将 <code>BigInt</code> 值转换为一个 -<code>2<sup>width-1</sup></code> 与 <code>2<sup>width-1</sup>-1</code> 之间的有符号整数。</p> + +<div>{{EmbedInteractiveExample("pages/js/bigint-asintn.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">BigInt.asIntN(<var>width</var>, <var>bigint</var>);</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>width</code></dt> + <dd>可存储整数的位数。</dd> + <dt><code>bigint</code></dt> + <dd>要存储在指定位数上的整数。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p><code>bigint</code> 模(modulo) 2<sup><code>width</code></sup> 作为有符号整数的值。</p> + +<h2 id="例子">例子</h2> + +<h3 id="保持在64位范围内">保持在64位范围内</h3> + +<p><code>BigInt.asIntN()</code> 方法对于保持在64位(64-bit)算数范围内非常有用。</p> + +<pre class="brush: js">const max = 2n ** (64n - 1n) - 1n; + +BigInt.asIntN(64, max); +// ↪ 9223372036854775807n + +BigInt.asIntN(64, max + 1n); +// ↪ -9223372036854775808n +// negative because of overflow +</pre> + +<h2 id="标准">标准</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-bigint.asintn', 'BigInt.asIntN()')}}</td> + <td>{{Spec2('ESDraft')}}</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器支持">浏览器支持</h2> + + + +<p>{{Compat("javascript.builtins.BigInt.asIntN")}}</p> + +<h2 id="请参阅">请参阅</h2> + +<ul> + <li>{{JSxRef("BigInt")}}</li> + <li>{{JSxRef("BigInt.asUintN()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/bigint/asuintn/index.html b/files/zh-cn/web/javascript/reference/global_objects/bigint/asuintn/index.html new file mode 100644 index 0000000000..2c813a51ad --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/bigint/asuintn/index.html @@ -0,0 +1,72 @@ +--- +title: BigInt.asUintN() +slug: Web/JavaScript/Reference/Global_Objects/BigInt/asUintN +translation_of: Web/JavaScript/Reference/Global_Objects/BigInt/asUintN +--- +<div>{{JSRef}}</div> + +<p><strong><code>BigInt.asUintN</code></strong> 静态方法将 <code>BigInt</code> 转换为一个 0 和 2<sup>width</sup>-1 之间的无符号整数。</p> + +<div>{{EmbedInteractiveExample("pages/js/bigint-asuintn.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">BigInt.asUintN(<var>width</var>, <var>bigint</var>);</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>width</code></dt> + <dd>可存储整数的位数。</dd> + <dt><code>bigint</code></dt> + <dd> 要存储在指定位数上的整数。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p><code>bigint</code> 模(modulo) 2<sup><code>width</code></sup> 作为无符号整数的值。</p> + +<h2 id="例子">例子</h2> + +<h3 id="保持在64位范围内">保持在64位范围内</h3> + +<p><code>BigInt.asUintN()</code> 方法对于保持在64位(64-bit)算数范围内非常有用。</p> + +<pre class="brush: js">const max = 2n ** 64n - 1n; + +BigInt.asUintN(64, max); +// ↪ 18446744073709551615n + +BigInt.asUintN(64, max + 1n); +// ↪ 0n +// zero because of overflow</pre> + +<h2 id="标准">标准</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-bigint.asuintn', 'BigInt.asUintN()')}}</td> + <td>{{Spec2('ESDraft')}}</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器支持">浏览器支持</h2> + + + +<p>{{Compat("javascript.builtins.BigInt.asUintN")}}</p> + +<h2 id="请参阅">请参阅</h2> + +<ul> + <li>{{JSxRef("BigInt")}}</li> + <li>{{JSxRef("BigInt.asIntN()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/bigint/bigint/index.html b/files/zh-cn/web/javascript/reference/global_objects/bigint/bigint/index.html new file mode 100644 index 0000000000..7e7a2923f6 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/bigint/bigint/index.html @@ -0,0 +1,57 @@ +--- +title: BigInt() constructor +slug: Web/JavaScript/Reference/Global_Objects/BigInt/BigInt +translation_of: Web/JavaScript/Reference/Global_Objects/BigInt/BigInt +--- +<div>{{JSRef}}</div> + +<p> <strong><code>BigInt()</code></strong> 构造函数用来创建 {{jsxref("BigInt")}} 对象。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">BigInt(<em>value</em>); +</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>value</code></dt> + <dd>被创建的对象的数值。 可以是字符串或整数。</dd> +</dl> + +<div class="blockIndicator note"> +<p><strong>Note</strong>: <code>BigInt()</code> 不与 {{JSxRef("Operators/new", "new")}} 运算符一起使用。</p> +</div> + +<h2 id="例子">例子</h2> + +<pre class="brush: js">BigInt(123); +// 123n +</pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-bigint-constructor', 'BigInt constructor')}}</td> + <td>{{Spec2('ESDraft')}}</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.BigInt.BigInt")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("BigInt")}} class</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/bigint/index.html b/files/zh-cn/web/javascript/reference/global_objects/bigint/index.html new file mode 100644 index 0000000000..205b9f9952 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/bigint/index.html @@ -0,0 +1,272 @@ +--- +title: BigInt +slug: Web/JavaScript/Reference/Global_Objects/BigInt +translation_of: Web/JavaScript/Reference/Global_Objects/BigInt +--- +<p>{{JSRef}}</p> + +<p><strong><code>BigInt</code></strong> 是一种内置对象，它提供了一种方法来表示大于 <code>2<sup>53 </sup>- 1</code> 的整数。这原本是 Javascript中可以用 {{JSxRef("Number")}} 表示的最大数字。<strong><code>BigInt</code></strong> 可以表示任意大的整数。</p> + +<dl> +</dl> + +<h2 id="描述">描述</h2> + +<p>可以用在一个整数字面量后面加 <code>n</code> 的方式定义一个 <code>BigInt</code> ，如：<code>10n</code>，或者调用函数<code>BigInt()</code>。</p> + +<pre><code>const theBiggestInt = 9007199254740991n; + +const alsoHuge = BigInt(9007199254740991); +// ↪ 9007199254740991n + +const hugeString = BigInt("9007199254740991"); +// ↪ 9007199254740991n + +const hugeHex = BigInt("0x1fffffffffffff"); +// ↪ 9007199254740991n + +const hugeBin = BigInt("0b11111111111111111111111111111111111111111111111111111"); +// ↪ 9007199254740991n</code></pre> + +<p>它在某些方面类似于 {{jsxref("Global_Objects/Number", "Number")}} ，但是也有几个关键的不同点：不能用于 {{jsxref("Global_Objects/Math", "Math")}} 对象中的方法；不能和任何 {{jsxref("Global_Objects/Number", "Number")}} 实例混合运算，两者必须转换成同一种类型。在两种类型来回转换时要小心，因为 <code>BigInt</code> 变量在转换成 {{jsxref("Global_Objects/Number", "Number")}} 变量时可能会丢失精度。</p> + +<h3 id="类型信息">类型信息</h3> + +<p>使用 <code>typeof</code> 测试时， <code>BigInt</code> 对象返回 "bigint" ：</p> + +<pre><code>typeof 1n === 'bigint'; // true +typeof BigInt('1') === 'bigint'; // true</code></pre> + +<p>使用 <code>Object</code> 包装后， <code>BigInt</code> 被认为是一个普通 "object" ：</p> + +<pre><code>typeof Object(1n) === 'object'; // true</code></pre> + +<h3 id="运算">运算</h3> + +<p>以下操作符可以和 <code>BigInt</code> 一起使用： <code>+</code>、`<code>*</code>`、`<code>-</code>`、`<code>**</code>`、`<code>%</code>` 。除 <code>>>></code> （无符号右移）之外的 <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Bitwise_Operators">位操作</a> 也可以支持。因为 <code>BigInt</code> 都是有符号的， <code>>>></code> （无符号右移）不能用于 <code>BigInt</code>。<a href="https://github.com/tc39/proposal-bigint/blob/master/ADVANCED.md#dont-break-asmjs">为了兼容 asm.js </a>，<code>BigInt</code> 不支持单目 (<code>+</code>) 运算符。</p> + +<pre class="brush: js">const previousMaxSafe = BigInt(Number.MAX_SAFE_INTEGER); +// ↪ 9007199254740991n + +const maxPlusOne = previousMaxSafe + 1n; +// ↪ 9007199254740992n + +const theFuture = previousMaxSafe + 2n; +// ↪ 9007199254740993n, this works now! + +const multi = previousMaxSafe * 2n; +// ↪ 18014398509481982n + +const subtr = multi – 10n; +// ↪ 18014398509481972n + +const mod = multi % 10n; +// ↪ 2n + +const bigN = 2n ** 54n; +// ↪ 18014398509481984n + +bigN * -1n +// ↪ –18014398509481984n +</pre> + +<p><code>/</code> 操作符对于整数的运算也没问题。可是因为这些变量是 <code>BigInt</code> 而不是 <code>BigDecimal</code> ，该操作符结果会向零取整，也就是说不会返回小数部分。</p> + +<div class="blockIndicator warning"> +<p>当使用 <code>BigInt</code> 时，带小数的运算会被取整。</p> +</div> + +<pre class="brush: js">const expected = 4n / 2n; +// ↪ 2n + +const rounded = 5n / 2n; +// ↪ 2n, not 2.5n + +</pre> + +<h3 id="比较">比较</h3> + +<p><code>BigInt</code> 和 {{jsxref("Global_Objects/Number", "Number")}} 不是严格相等的，但是宽松相等的。</p> + +<pre class="brush: js">0n === 0 +// ↪ false + +0n == 0 +// ↪ true</pre> + +<p>{{jsxref("Global_Objects/Number", "Number")}} 和 <code>BigInt</code> 可以进行比较。</p> + +<pre class="brush: js">1n < 2 +// ↪ true + +2n > 1 +// ↪ true + +2 > 2 +// ↪ false + +2n > 2 +// ↪ false + +2n >= 2 +// ↪ true</pre> + +<p>两者也可以混在一个数组内并排序。</p> + +<pre class="brush: js">const mixed = [4n, 6, -12n, 10, 4, 0, 0n]; +// ↪ [4n, 6, -12n, 10, 4, 0, 0n] + +mixed.sort(); +// ↪ [-12n, 0, 0n, 10, 4n, 4, 6]</pre> + +<p>注意被 <code>Object</code> 包装的 <code>BigInt</code>s 使用 object 的比较规则进行比较，只用同一个对象在比较时才会相等。</p> + +<pre><code>0n === Object(0n); // false +Object(0n) === Object(0n); // false + +const o = Object(0n); +o === o // true</code></pre> + +<h3 id="条件">条件</h3> + +<p><code>BigInt</code> 在需要转换成 {{jsxref("Global_Objects/Boolean", "Boolean")}} 的时表现跟 {{jsxref("Global_Objects/Number", "Number")}} 类似：如通过 {{jsxref("Global_Objects/Boolean", "Boolean")}} 函数转换；用于 {{jsxref("Operators/Logical_Operators", "Logical Operators")}} <code>||</code>, `<code>&&</code>`, 和 <code>!</code> 的操作数；或者用于在像 {{jsxref("Statements/if...else", "if statement")}} 这样的条件语句中。</p> + +<pre class="brush: js">if (0n) { + console.log('Hello from the if!'); +} else { + console.log('Hello from the else!'); +} + +// ↪ "Hello from the else!" + +0n || 12n +// ↪ 12n + +0n && 12n +// ↪ 0n + +Boolean(0n) +// ↪ false + +Boolean(12n) +// ↪ true + +!12n +// ↪ false + +!0n +// ↪ true +</pre> + +<h2 id="构造器">构造器</h2> + +<dl> + <dt><code><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/BigInt/BigInt">BigInt()</a></code></dt> + <dd>创建{{jsxref("BigInt")}} 对象。</dd> +</dl> + +<h2 id="静态方法">静态方法</h2> + +<dl> + <dt>{{JSxRef("BigInt.asIntN()")}}</dt> + <dd>将 BigInt 值转换为一个 -2<sup>width-1</sup> 与 2<sup>width-1</sup>-1 之间的有符号整数。</dd> + <dt>{{JSxRef("BigInt.asUintN()")}}</dt> + <dd>将一个 BigInt 值转换为 0 与 2<sup>width</sup>-1 之间的无符号整数。</dd> +</dl> + +<h2 id="实例方法">实例方法</h2> + +<dl> + <dt>{{JSxRef("BigInt.prototype.toLocaleString()")}}</dt> + <dd>返回此数字的 language-sensitive 形式的字符串。覆盖 {{JSxRef("Object.prototype.toLocaleString()")}} 方法。</dd> + <dt>{{JSxRef("BigInt.prototype.toString()")}}</dt> + <dd>返回以指定基数(base)表示指定数字的字符串。覆盖 {{JSxRef("Object.prototype.toString()")}} 方法。</dd> + <dt>{{JSxRef("BigInt.prototype.valueOf()")}}</dt> + <dd>返回指定对象的基元值。 覆盖 {{JSxRef("Object.prototype.valueOf()")}} 方法。</dd> +</dl> + +<h2 id="使用建议">使用建议</h2> + +<h3 id="转化">转化</h3> + +<p>由于在 {{JSxRef("Number")}} 与 <code>BigInt</code> 之间进行转换会损失精度，因而建议仅在值可能大于2<sup>53</sup> 时使用 <code>BigInt</code> 类型，并且不在两种类型之间进行相互转换。</p> + +<h3 id="密码学">密码学</h3> + +<p>由于对 <code>BigInt</code> 的操作不是常数时间的，因而 <code>BigInt</code> <a href="https://www.chosenplaintext.ca/articles/beginners-guide-constant-time-cryptography.html">不适合用于密码学</a>。</p> + +<h3 id="在_JSON_中使用">在 JSON 中使用</h3> + +<p>对任何 <code>BigInt</code> 值使用 {{jsxref("JSON.stringify()")}} 都会引发 <code>TypeError</code>，因为默认情况下 <code>BigInt</code> 值不会在 <code>JSON</code> 中序列化。但是，如果需要，可以实现 <code>toJSON</code> 方法：</p> + +<pre><code>BigInt.prototype.toJSON = function() { return this.toString(); }</code></pre> + +<p><code>JSON.stringify</code> 现在生成如下字符串，而不是抛出异常:</p> + +<pre><code>JSON.stringify(BigInt(1)); +// '"1"'</code></pre> + +<h2 id="例子">例子</h2> + +<h3 id="Calculating_Primes">Calculating Primes</h3> + +<pre class="brush: js">function isPrime(p) { + for (let i = 2n; i * i <= p; i++) { + if (p % i === 0n) return false; + } + return true; +} + +// Takes a BigInt as an argument and returns a BigInt +function nthPrime(nth) { + let maybePrime = 2n; + let prime = 0n; + + while (nth >= 0n) { + if (isPrime(maybePrime)) { + nth -= 1n; + prime = maybePrime; + } + maybePrime += 1n; + } + + return prime; +} + +nthPrime(20n) +// ↪ 73n</pre> + +<h2 id="标准">标准</h2> + +<table> + <tbody> + <tr> + <th scope="col">标准</th> + <th scope="col">状态</th> + </tr> + <tr> + <td><a href="https://tc39.es/proposal-bigint/#sec-bigint-objects">BigInt</a></td> + <td>第4阶段</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> +<div class="hidden">The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</div> + +<p>{{Compat("javascript.builtins.BigInt")}}</p> + +<h3 id="实施进度">实施进度</h3> + +<p>下表提供了此功能的每日实现状态，因为此功能尚未达到跨浏览器稳定性。数据是通过在 Test262 中运行相关的特性测试生成的，<a href="https://github.com/tc39/test262">Test262</a> 是 JavaScript 的标准测试套件，在夜间构建，或者是每个浏览器的 JavaScript 引擎的最新版本中运行。</p> + +<p>{{EmbedTest262ReportResultsTable("BigInt")}}</p> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{JSxRef("Number")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/bigint/tolocalestring/index.html b/files/zh-cn/web/javascript/reference/global_objects/bigint/tolocalestring/index.html new file mode 100644 index 0000000000..434bceb0d9 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/bigint/tolocalestring/index.html @@ -0,0 +1,116 @@ +--- +title: BigInt.prototype.toLocaleString() +slug: Web/JavaScript/Reference/Global_Objects/BigInt/toLocaleString +translation_of: Web/JavaScript/Reference/Global_Objects/BigInt/toLocaleString +--- +<div>{{JSRef}}</div> + +<p><strong><code>toLocaleString()</code></strong> 方法返回一个字符串，该字符串具有此 <code>BigInt</code> 的 language-sensitive 表达形式。</p> + +<div>{{EmbedInteractiveExample("pages/js/bigint-tolocalestring.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><em>bigIntObj</em>.toLocaleString(</code><code>[locales [, options]])</code></pre> + +<h3 id="参数">参数</h3> + +<p><code>locales</code> 和 <code>options</code> 参数可自定义函数的行为，并允许应用程序指定应使用其格式约定的语言。在忽略 <code>locales</code> 和 <code>options</code> 参数的实现中，使用的 <code>locale</code> 和返回的字符串形式完全依赖于实现。</p> + +<div>{{page('/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/NumberFormat', '参数')}}</div> + +<h3 id="返回值">返回值</h3> + +<p>具有此 <code>BigInt</code> 的 language-sensitive 表示形式的字符串。</p> + +<h2 id="例子">例子</h2> + +<h3 id="Using_toLocaleString">Using <code>toLocaleString</code></h3> + +<p>在不指定语言环境的基本用法中，将返回默认语言环境中带默认选项的格式化字符串。</p> + +<pre class="brush: js">var bigint = 3500n; + +bigint.toLocaleString(); +// Displays "3,500" if in U.S. English locale +</pre> + +<h3 id="Using_locales">Using <code>locales</code></h3> + +<p>这个例子展示了本地化数字格式的一些变体。为了获得应用程序用户界面中使用的语言的格式，请确保使用 <code>locales</code> 参数指定该语言（可能还有一些备用语言）：</p> + +<pre class="brush: js">var bigint = 123456789123456789n; + +// German uses period for thousands +console.log(bigint.toLocaleString('de-DE')); +// → 123.456.789.123.456.789 + +// Arabic in most Arabic speaking countries uses <a href="https://en.wikipedia.org/wiki/Eastern_Arabic_numerals">Eastern Arabic</a> digits +console.log(bigint.toLocaleString('ar-EG')); +// → ١٢٣٬٤٥٦٬٧٨٩٬١٢٣٬٤٥٦٬٧٨٩ + +// India uses thousands/lakh/crore separators +console.log(bigint.toLocaleString('en-IN')); +// → 1,23,45,67,89,12,34,56,789 + +// the nu extension key requests a numbering system, e.g. Chinese decimal +console.log(bigint.toLocaleString('zh-Hans-CN-u-nu-hanidec')); +// → 一二三,四五六,七八九,一二三,四五六,七八九 + +// when requesting a language that may not be supported, such as +// Balinese, include a fallback language, in this case Indonesian +console.log(bigint.toLocaleString(['ban', 'id'])); +// → 123.456.789.123.456.789 +</pre> + +<h3 id="Using_options">Using <code>options</code></h3> + +<p><code>toLocaleString</code> 提供的结果可以使用 <code>options</code> 参数进行自定义：</p> + +<pre class="brush: js">var bigint = 123456789123456789n; + +// request a currency format +console.log(bigint.toLocaleString('de-DE', { style: 'currency', currency: 'EUR' })); +// → 123.456.789.123.456.789,00 € + +// the Japanese yen doesn't use a minor unit +console.log(bigint.toLocaleString('ja-JP', { style: 'currency', currency: 'JPY' })) +// → ￥123,456,789,123,456,789 + +// limit to three significant digits +console.log(bigint.toLocaleString('en-IN', { maximumSignificantDigits: 3 })); +// → 1,23,00,00,00,00,00,00,000 +</pre> + +<h2 id="性能">性能</h2> + +<p>格式化大量数字时，最好创建 {{jsxref("NumberFormat")}} 对象并使用其 {{jsxref("NumberFormat.format")}} 属性提供的函数。</p> + +<h2 id="标准">标准</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + </tr> + <tr> + <td><a href="https://tc39.es/ecma402/#sup-bigint.prototype.tolocalestring">BigInt</a></td> + <td>Stage 3</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器支持">浏览器支持</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.BigInt.toLocaleString")}}</p> + +<h2 id="请参阅">请参阅</h2> + +<ul> + <li>{{jsxref("BigInt.toString()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/bigint/tostring/index.html b/files/zh-cn/web/javascript/reference/global_objects/bigint/tostring/index.html new file mode 100644 index 0000000000..487fe80ad2 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/bigint/tostring/index.html @@ -0,0 +1,91 @@ +--- +title: BigInt.prototype.toString() +slug: Web/JavaScript/Reference/Global_Objects/BigInt/toString +translation_of: Web/JavaScript/Reference/Global_Objects/BigInt/toString +--- +<div>{{JSRef}}</div> + +<p><strong><code>toString()</code></strong> 方法返回一个字符串，表示指定 {{jsxref("BigInt")}} 对象。 后面的 "n" 不是字符串的一部分。</p> + +<div>{{EmbedInteractiveExample("pages/js/bigint-tostring.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><var>bigIntObj</var>.toString([<var>radix</var>])</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>radix</code>{{Optional_inline}}</dt> + <dd>可选，介于 2 到 36 之间的整数，指定用于表示数值的基数。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>表示指定 {{jsxref("BigInt")}} 对象的字符串。</p> + +<h3 id="异常">异常</h3> + +<dl> + <dt>{{jsxref("RangeError")}}</dt> + <dd>如果 <code>toString()</code> 的基数小于 2 或大于 36, 则抛出 {{jsxref("RangeError")}}。</dd> +</dl> + +<h2 id="描述">描述</h2> + +<p>{{jsxref("BigInt")}} 对象重写 {{jsxref("Object")}} 对象的 <code>toString()</code> 方法；它不继承 {{jsxref("Object.prototype.toString()")}}。对于 {{jsxref( "BigInt")}} 对象，<code>toString()</code> 方法返回指定基数中对象的字符串表示形式。</p> + +<p><code>toString()</code> 方法解析其第一个参数，并尝试返回指定基数(base)的字符串表示形式。对于大于 10 的参数，使用字母表中的字母表示大于 9 的数字。例如，对于十六进制数（以16为基数），使用 a 到 f。</p> + +<p>如果未指定基数，则假定首选基数为10。</p> + +<p>如果 <code>bigIntObj</code> 为负，则保留符号。即使基数是 2，情况也是如此；返回的字符串是 <code>bigIntObj</code> 的正二进制表示，前面是一个 <code>-</code> 符号，而不是 <code>bigIntObj</code> 的两个补码。</p> + +<h2 id="例子">例子</h2> + +<h3 id="Using_toString">Using <code>toString</code></h3> + +<pre class="brush: js">17n.toString(); // '17' +66n.toString(2); // '1000010' +254n.toString(16); // 'fe' +-10n.toString(2); // -1010' +-0xffn.toString(2); // '-11111111' +</pre> + +<h3 id="Negative-zero_BigInt">Negative-zero <code>BigInt</code></h3> + +<p>没有负零 <code>BigInt</code>，因为整数中没有负零。<code>-0.0</code> 是一个 IEEE 浮点概念，只出现在JavaScript {{jsxref("Number")}} 类型中。</p> + +<pre class="brush: js">(-0n).toString(); // '0' +BigInt(-0).toString(); // '0'</pre> + +<h2 id="标准">标准</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-bigint.prototype.tostring', 'BigInt.prototype.toString()')}}</td> + <td>{{Spec2('ESDraft')}}</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器支持">浏览器支持</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.BigInt.toString")}}</p> + +<h2 id="请参阅">请参阅</h2> + +<ul> + <li>{{jsxref("BigInt.prototype.toLocaleString()")}}</li> + <li>{{jsxref("BigInt.prototype.valueOf()")}}</li> + <li>{{jsxref("Number.prototype.toString()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/bigint/valueof/index.html b/files/zh-cn/web/javascript/reference/global_objects/bigint/valueof/index.html new file mode 100644 index 0000000000..0487cfbef3 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/bigint/valueof/index.html @@ -0,0 +1,55 @@ +--- +title: BigInt.prototype.valueOf() +slug: Web/JavaScript/Reference/Global_Objects/BigInt/valueOf +translation_of: Web/JavaScript/Reference/Global_Objects/BigInt/valueOf +--- +<div>{{JSRef}}</div> + +<p><strong><code>valueOf()</code></strong> 方法返回 {{jsxref("BigInt")}} 对象包装的原始值。</p> + +<div>{{EmbedInteractiveExample("pages/js/bigint-valueof.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>bigIntObj</var>.valueOf()</pre> + +<h3 id="返回值">返回值</h3> + +<p>表示指定 {{jsxref("BigInt")}} 对象的原始 BigInt 值。</p> + +<h2 id="例子">例子</h2> + +<h3 id="Using_valueOf">Using <code>valueOf</code></h3> + +<pre class="brush: js">typeof Object(1n); // object +typeof Object(1n).valueOf(); // bigint +</pre> + +<h2 id="标准">标准</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-bigint.prototype.valueof', 'BigInt.prototype.valueOf()')}}</td> + <td>{{Spec2('ESDraft')}}</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器支持">浏览器支持</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.BigInt.valueOf")}}</p> + +<h2 id="请参阅">请参阅</h2> + +<ul> + <li>{{jsxref("BigInt.prototype.toString()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/bigint64array/index.html b/files/zh-cn/web/javascript/reference/global_objects/bigint64array/index.html new file mode 100644 index 0000000000..23a2a114b6 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/bigint64array/index.html @@ -0,0 +1,173 @@ +--- +title: BigInt64Array +slug: Web/JavaScript/Reference/Global_Objects/BigInt64Array +translation_of: Web/JavaScript/Reference/Global_Objects/BigInt64Array +--- +<div> +<p id="JSRef">{{JSRef}}</p> + +<p id="BigInt64Array类型的数组代表由64位有符号整数组成的数组。如果需要控制字节顺序的话，请使用_jsxrefDataView_代替。内容初始化为0n。一旦建立，就可以使用对象的方法或使用标准数组索引语法（即使用中括号表示法）引用数组中的元素。"><strong><code>BigInt64Array</code></strong> 类型的数组代表由64位有符号整数组成的数组。如果需要控制字节顺序的话，请使用 {{jsxref("DataView")}} 代替。内容初始化为 <code>0n</code> 。一旦建立，就可以使用对象的方法或使用标准数组索引语法（即使用中括号表示法）引用数组中的元素。</p> +</div> + +<h2 id="构造函数">构造函数</h2> + +<p><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/BigInt64Array/BigInt64Array"><code>BigInt64Array()</code></a></p> + +<p> 添加一个新的<code>BigInt64Array</code>对象。</p> + +<h2 id="静态属性">静态属性</h2> + +<dl> + <dt>{{jsxref("TypedArray.BYTES_PER_ELEMENT", "BigInt64Array.BYTES_PER_ELEMENT")}}</dt> +</dl> + +<p> 返回一个元素大小的数字值，<code>BigInt64Array</code>返回 <code>8</code></p> + +<dl> + <dt>{{jsxref("TypedArray.name", "BigInt64Array.name")}}</dt> +</dl> + +<p> 返回构造函数名字的字符串值，如果是<code>BigInt64Array</code> 的话，就是"BigInt64Array".</p> + +<h2 id="实例属性">实例属性</h2> + +<dl> + <dt>{{jsxref("TypedArray.prototype.buffer", "BigInt64Array.prototype.buffer")}}</dt> + <dd>返回被<code>BigInt64Array</code>引用的{{jsxref("ArrayBuffer")}} 。这在BigInt64Array对象构建时期就被锁定了，所以是只读的。</dd> + <dt>{{jsxref("TypedArray.prototype.byteLength", "BigInt64Array.prototype.byteLength")}}</dt> + <dd>返回<code>BigInt64Array</code>从{jsxref（“ArrayBuffer”）}}开始的长度（以字节为单位）。这在构造时已经被固定，因此是只读的。</dd> + <dt>{{jsxref("TypedArray.prototype.byteOffset", "BigInt64Array.prototype.byteOffset")}}</dt> + <dd>返回 <code>BigInt64Array</code> 从{jsxref（“ArrayBuffer”）}}开始的偏移量（以字节为单位）。这在构造时已被固定的，因此是只读。</dd> + <dt>{{jsxref("TypedArray.prototype.length", "BigInt64Array.prototype.length")}}</dt> + <dd><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span> + <p>返回 <code>BigInt64Array</code> 中被<span style="display: none;"> </span>保留的元<span style="display: none;"> </span>素个数。这<span style="display: none;"> </span><span style="display: none;"> </span>在构造时是固定的，因此是只读<span style="display: none;"> </span>。<span style="display: none;"> </span><span style="display: none;"> </span><strong><span style="display: none;"> </span></strong></p> + + <p><span style="display: none;"> </span><span style="display: none;"> </span></p> + <span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span> + + <h2 id="sect1"><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span></h2> + </dd> +</dl> + +<h2 id="实例方法">实例方法</h2> + +<dl> + <dt>{{jsxref("TypedArray.copyWithin", "BigInt64Array.prototype.copyWithin()")}}</dt> + <dd>复制数组中的数组元素序列。另请参见{jsxref（“Array.prototype.copyWithin()")}}.</dd> + <dt>{{jsxref("TypedArray.entries", "BigInt64Array.prototype.entries()")}}</dt> + <dd>返回一个新的数组迭代器对象，该对象包含数组中每个索引的键/值对。另请参见{jsxref（“Array.prototype.entries()")}}.</dd> + <dt>{{jsxref("TypedArray.every", "BigInt64Array.prototype.every()")}}</dt> + <dd>测试数组中的所有元素是否通过函数提供的测试。另请参见{jsxref（“Array.prototype.every()")}}.</dd> + <dt>{{jsxref("TypedArray.fill", "BigInt64Array.prototype.fill()")}}</dt> + <dd> + <div class="trans-left"> + <div class="trans-input-wrap"> + <div class="input-wrap" dir="ltr" style="height: auto;">用静态值填充从起始索引到结束索引的数组的所有元素。另请参见{jsxref（“Array.prototype.fill()")}}</div> + </div> + </div> + </dd> + <dt>{{jsxref("TypedArray.filter", "BigInt64Array.prototype.filter()")}}</dt> + <dd>使用提供的筛选函数为其返回true的数组的所有元素创建一个新数组。另请参见{jsxref（“Array.prototype.filter()")}}</dd> + <dt>{{jsxref("TypedArray.find", "BigInt64Array.prototype.find()")}}</dt> + <dd>如果数组中的元素满足提供的测试函数，则返回数组中找到的值；如果未找到，则返回 <code>undefined</code> 。另请参见{jsxref（“Array.prototype.find()")}}.</dd> + <dt>{{jsxref("TypedArray.findIndex", "BigInt64Array.prototype.findIndex()")}}</dt> + <dd>如果数组中的元素满足提供的测试函数，则返回数组中找到的索引；如果未找到，则返回-1。另请参见{jsxref（“Array.prototype.findIndex()")}}.</dd> + <dt>{{jsxref("TypedArray.forEach", "BigInt64Array.prototype.forEach()")}}</dt> + <dd>为数组中的每个元素调用函数。另请参见{jsxref（“Array.prototype.forEach()")}}</dd> + <dt>{{jsxref("TypedArray.includes", "BigInt64Array.prototype.includes()")}}</dt> + <dd>确定类型化数组是否包含某个元素，并根据需要返回 <code>true</code> 或 <code>false</code> 。另请参见{jsxref（“Array.prototype.includes()")}}.</dd> + <dt>{{jsxref("TypedArray.indexOf", "BigInt64Array.prototype.indexOf()")}}</dt> + <dd>返回数组中元素的第一个（最小）索引，等于指定值；如果找不到，则返回-1。另请参见{jsxref（“Array.prototype.indexOf()")}}</dd> + <dt>{{jsxref("TypedArray.join", "BigInt64Array.prototype.join()")}}</dt> + <dd>将数组的所有元素联接为字符串。另请参见{jsxref（“Array.prototype.join()")}}</dd> + <dt>{{jsxref("TypedArray.keys", "BigInt64Array.prototype.keys()")}}</dt> + <dd>返回一个新的 <code>Array Iterator</code> ，它包含数组中每个索引的键。另请参见{jsxref（“Array.prototype.keys()")}}.</dd> + <dt>{{jsxref("TypedArray.lastIndexOf", "BigInt64Array.prototype.lastIndexOf()")}}</dt> + <dd>返回数组中元素的最后一个（最大）索引，等于指定值；如果找不到，则返回-1。另请参见{jsxref（“Array.prototype.lastIndexOf()")}}.</dd> + <dt>{{jsxref("TypedArray.map", "BigInt64Array.prototype.map()")}}</dt> + <dd>创建一个新数组，其中包含对此数组中的每个元素调用所提供函数的结果。另请参见{jsxref（“Array.prototype.map()")}}.</dd> + <dt>{{jsxref("TypedArray.reduce", "BigInt64Array.prototype.reduce()")}}</dt> + <dd>对累加器和数组的每个值（从左到右）应用一个函数，以便将其减少为单个值。另请参见{jsxref（“Array.prototype.reduce()")}}.</dd> + <dt>{{jsxref("TypedArray.reduceRight", "BigInt64Array.prototype.reduceRight()")}}</dt> + <dd>对累加器和数组的每个值（从右到左）应用一个函数，以便将其减少为单个值。另请参见{jsxref（“Array.prototype.reduceRight()")}}.</dd> + <dt>{{jsxref("TypedArray.reverse", "BigInt64Array.prototype.reverse()")}}</dt> + <dd>反转数组元素的顺序-第一个变为最后一个，最后一个变为第一个。另请参见{jsxref（“Array.prototype.reverse()")}}.</dd> + <dt>{{jsxref("TypedArray.set", "BigInt64Array.prototype.set()")}}</dt> + <dd>在 typed array 中存储多个值，从指定数组读取输入值。</dd> + <dt>{{jsxref("TypedArray.slice", "BigInt64Array.prototype.slice()")}}</dt> + <dd>提取数组的一部分并返回一个新数组。另请参见{jsxref（“Array.prototype.slice()")}}.</dd> + <dt>{{jsxref("TypedArray.some", "BigInt64Array.prototype.some()")}}</dt> + <dd>如果此数组中至少有一个元素满足提供的测试函数，则返回true。另请参见{jsxref（“Array.prototype.some()")}}.</dd> + <dt>{{jsxref("TypedArray.sort", "BigInt64Array.prototype.sort()")}}</dt> + <dd>对数组的元素进行就地排序并返回数组。另请参见{jsxref（“Array.prototype.sort()")}}.</dd> + <dt>{{jsxref("TypedArray.subarray", "BigInt64Array.prototype.subarray()")}}</dt> + <dd>从给定的起始和结束元素索引返回一个新的 <code>BigUint64Array</code> 。</dd> + <dt>{{jsxref("TypedArray.values", "BigInt64Array.prototype.values()")}}</dt> + <dd>返回一个新的 <code>Array Iterator</code> 对象，该对象包含数组中每个索引的值。另请参见{jsxref（“Array.prototype.values()")}}.</dd> + <dt>{{jsxref("TypedArray.toLocaleString", "BigInt64Array.prototype.toLocaleString()")}}</dt> + <dd>返回表示数组及其元素的本地化字符串。另请参见{jsxref（“Array.prototype.toLocaleString()")}}.</dd> + <dt>{{jsxref("TypedArray.toString", "BigInt64Array.prototype.toString()")}}</dt> + <dd>返回表示数组及其元素的字符串。另请参见{jsxref（“Array.prototype.toString()")}}.</dd> + <dt>{{jsxref("TypedArray.@@iterator", "BigInt64Array.prototype[@@iterator]()")}}</dt> + <dd>返回一个新的 <code>Array Iterator</code> 对象，该对象包含数组中每个索引的值。</dd> +</dl> + +<h2 id="例子">例子</h2> + +<h3 id="不同的方法去创建一个_BigInt64Array">不同的方法去创建一个 <code>BigInt64Array</code></h3> + +<pre class="brush: js notranslate">// From a length +var bigint64 = new BigInt64Array(2); +bigint64[0] = 42n; +console.log(bigint64[0]); // 42n +console.log(bigint64.length); // 2 +console.log(bigint64.BYTES_PER_ELEMENT); // 8 + +// From an array +var arr = new BigInt64Array([21n,31n]); +console.log(arr[1]); // 31n + +// From another TypedArray +var x = new BigInt64Array([21n, 31n]); +var y = new BigInt64Array(x); +console.log(y[0]); // 21n + +// From an ArrayBuffer +var buffer = new ArrayBuffer(32); +var z = new BigInt64Array(buffer, 0, 4); + +// From an iterable +var iterable = function*(){ yield* [1n, 2n, 3n]; }(); +var bigint64 = new BigInt64Array(iterable); +// BigInt64Array[1n, 2n, 3n]</pre> + +<h2 id="规格">规格</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Specification</th> + </tr> + </thead> + <tbody> + <tr> + <td> + <p>{{SpecName("ESDraft", "#sec-typedarray-objects", "BigInt64Array")}}</p> + </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div class="hidden">此页上的兼容性表是从结构化数据生成的。如果你想对数据有所贡献，请查看https://github.com/mdn/browser-compat-data并向我们发送请求。</div> + +<p>{{Compat("javascript.builtins.BigInt64Array")}}</p> + +<h2 id="参考">参考</h2> + +<ul> + <li><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/JavaScript/Typed_arrays" title="en/JavaScript typed arrays">JavaScript typed arrays</a></li> + <li>{{jsxref("BigUint64Array")}}</li> + <li>{{jsxref("DataView")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/biguint64array/index.html b/files/zh-cn/web/javascript/reference/global_objects/biguint64array/index.html new file mode 100644 index 0000000000..b689fe581e --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/biguint64array/index.html @@ -0,0 +1,164 @@ +--- +title: BigUint64Array +slug: Web/JavaScript/Reference/Global_Objects/BigUint64Array +translation_of: Web/JavaScript/Reference/Global_Objects/BigUint64Array +--- +<div> {{JSRef}}</div> + +<p><strong><code>BigUint64Array</code></strong> 类型数组表示一个平台字节顺序的64位无符号整型数组。如果想要控制字符顺序，请使用 {{jsxref("DataView")}} 替代。内容初始化为 <code>0n</code>. 创建之后可以使用对象中的方法或使用标准数组索引语法(括号表示法)来获取数组中的元素。</p> + +<h2 id="句法">句法</h2> + +<pre class="syntaxbox">new BigUint64Array(); +new BigUint64Array(length); +new BigUint64Array(typedArray); +new BigUint64Array(object); +new BigUint64Array(buffer [, byteOffset [, length]]);</pre> + +<p>更多有关构造方法和参数的信息，参见 <em><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray#Syntax">TypedArray</a></em>.</p> + +<h2 id="属性">属性</h2> + +<dl> + <dt>{{jsxref("TypedArray.BYTES_PER_ELEMENT", "BigUint64Array.BYTES_PER_ELEMENT")}}</dt> + <dd>返回一个元素容量的数字值. <code>8</code> in the case of a <code>BigUint64Array</code>.</dd> + <dt>BigUint64Array.length</dt> + <dd>Static length property whose value is 3. For the actual length (number of elements), see {{jsxref("TypedArray.prototype.length", "BigUint64Array.prototype.length")}}.</dd> + <dt>{{jsxref("TypedArray.name", "BigUint64Array.name")}}</dt> + <dd>Returns the string value of the constructor name. In the case of the <code>BigUint64Array</code> type: "BigUint64Array".</dd> + <dt>{{jsxref("TypedArray.prototype", "BigUint64Array.prototype")}}</dt> + <dd>Prototype for the <em>TypedArray</em> objects.</dd> +</dl> + +<h2 id="Methods">Methods</h2> + +<dl> + <dt>{{jsxref("TypedArray.from", "BigUint64Array.from()")}}</dt> + <dd>Creates a new <code>BigUint64Array</code> from an array-like or iterable object. See also {{jsxref("Array.from()")}}.</dd> + <dt>{{jsxref("TypedArray.of", "BigUint64Array.of()")}}</dt> + <dd>Creates a new <code>BigUint64Array</code> with a variable number of arguments. See also {{jsxref("Array.of()")}}.</dd> +</dl> + +<h2 id="BigUint64Array_prototype"><code>BigUint64Array</code> prototype</h2> + +<p>All <code>BigUint64Array</code> objects inherit from {{jsxref("TypedArray.prototype", "%TypedArray%.prototype")}}.</p> + +<h3 id="Properties">Properties</h3> + +<dl> + <dt><code>BigUint64Array.prototype.constructor</code></dt> + <dd>Returns the function that created an instance's prototype. This is the <code>BigUint64Array</code> constructor by default.</dd> + <dt>{{jsxref("TypedArray.prototype.buffer", "BigUint64Array.prototype.buffer")}} {{readonlyInline}}</dt> + <dd>Returns the {{jsxref("ArrayBuffer")}} referenced by the <code>BigUint64Array</code>. Fixed at construction time and thus <strong>read only</strong>.</dd> + <dt>{{jsxref("TypedArray.prototype.byteLength", "BigUint64Array.prototype.byteLength")}} {{readonlyInline}}</dt> + <dd>Returns the length (in bytes) of the <code>BigUint64Array</code> from the start of its {{jsxref("ArrayBuffer")}}. Fixed at construction time and thus <strong>read only.</strong></dd> + <dt>{{jsxref("TypedArray.prototype.byteOffset", "BigUint64Array.prototype.byteOffset")}} {{readonlyInline}}</dt> + <dd>Returns the offset (in bytes) of the <code>BigUint64Array</code> from the start of its {{jsxref("ArrayBuffer")}}. Fixed at construction time and thus <strong>read only.</strong></dd> + <dt>{{jsxref("TypedArray.prototype.length", "BigUint64Array.prototype.length")}} {{readonlyInline}}</dt> + <dd>Returns the number of elements hold in the <code>BigUint64Array</code>. Fixed at construction time and thus <strong>read only.</strong></dd> +</dl> + +<h3 id="Methods_2">Methods</h3> + +<dl> + <dt>{{jsxref("TypedArray.copyWithin", "BigUint64Array.prototype.copyWithin()")}}</dt> + <dd>Copies a sequence of array elements within the array. See also {{jsxref("Array.prototype.copyWithin()")}}.</dd> + <dt>{{jsxref("TypedArray.entries", "BigUint64Array.prototype.entries()")}}</dt> + <dd>Returns a new <code>Array Iterator</code> object that contains the key/value pairs for each index in the array. See also {{jsxref("Array.prototype.entries()")}}.</dd> + <dt>{{jsxref("TypedArray.every", "BigUint64Array.prototype.every()")}}</dt> + <dd>Tests whether all elements in the array pass the test provided by a function. See also {{jsxref("Array.prototype.every()")}}.</dd> + <dt>{{jsxref("TypedArray.fill", "BigUint64Array.prototype.fill()")}}</dt> + <dd>Fills all the elements of an array from a start index to an end index with a static value. See also {{jsxref("Array.prototype.fill()")}}.</dd> + <dt>{{jsxref("TypedArray.filter", "BigUint64Array.prototype.filter()")}}</dt> + <dd>Creates a new array with all of the elements of this array for which the provided filtering function returns true. See also {{jsxref("Array.prototype.filter()")}}.</dd> + <dt>{{jsxref("TypedArray.find", "BigUint64Array.prototype.find()")}}</dt> + <dd>Returns the found value in the array, if an element in the array satisfies the provided testing function or <code>undefined</code> if not found. See also {{jsxref("Array.prototype.find()")}}.</dd> + <dt>{{jsxref("TypedArray.findIndex", "BigUint64Array.prototype.findIndex()")}}</dt> + <dd>Returns the found index in the array, if an element in the array satisfies the provided testing function or -1 if not found. See also {{jsxref("Array.prototype.findIndex()")}}.</dd> + <dt>{{jsxref("TypedArray.forEach", "BigUint64Array.prototype.forEach()")}}</dt> + <dd>Calls a function for each element in the array. See also {{jsxref("Array.prototype.forEach()")}}.</dd> + <dt>{{jsxref("TypedArray.includes", "BigUint64Array.prototype.includes()")}}</dt> + <dd>Determines whether a typed array includes a certain element, returning <code>true</code> or <code>false</code> as appropriate. See also {{jsxref("Array.prototype.includes()")}}.</dd> + <dt>{{jsxref("TypedArray.indexOf", "BigUint64Array.prototype.indexOf()")}}</dt> + <dd>Returns the first (least) index of an element within the array equal to the specified value, or -1 if none is found. See also {{jsxref("Array.prototype.indexOf()")}}.</dd> + <dt>{{jsxref("TypedArray.join", "BigUint64Array.prototype.join()")}}</dt> + <dd>Joins all elements of an array into a string. See also {{jsxref("Array.prototype.join()")}}.</dd> + <dt>{{jsxref("TypedArray.keys", "BigUint64Array.prototype.keys()")}}</dt> + <dd>Returns a new <code>Array Iterator</code> that contains the keys for each index in the array. See also {{jsxref("Array.prototype.keys()")}}.</dd> + <dt>{{jsxref("TypedArray.lastIndexOf", "BigUint64Array.prototype.lastIndexOf()")}}</dt> + <dd>Returns the last (greatest) index of an element within the array equal to the specified value, or -1 if none is found. See also {{jsxref("Array.prototype.lastIndexOf()")}}.</dd> + <dt>{{jsxref("TypedArray.map", "BigUint64Array.prototype.map()")}}</dt> + <dd>Creates a new array with the results of calling a provided function on every element in this array. See also {{jsxref("Array.prototype.map()")}}.</dd> + <dt>{{jsxref("TypedArray.reduce", "BigUint64Array.prototype.reduce()")}}</dt> + <dd>Apply a function against an accumulator and each value of the array (from left-to-right) as to reduce it to a single value. See also {{jsxref("Array.prototype.reduce()")}}.</dd> + <dt>{{jsxref("TypedArray.reduceRight", "BigUint64Array.prototype.reduceRight()")}}</dt> + <dd>Apply a function against an accumulator and each value of the array (from right-to-left) as to reduce it to a single value. See also {{jsxref("Array.prototype.reduceRight()")}}.</dd> + <dt>{{jsxref("TypedArray.reverse", "BigUint64Array.prototype.reverse()")}}</dt> + <dd>Reverses the order of the elements of an array — the first becomes the last, and the last becomes the first. See also {{jsxref("Array.prototype.reverse()")}}.</dd> + <dt>{{jsxref("TypedArray.set", "BigUint64Array.prototype.set()")}}</dt> + <dd>Stores multiple values in the typed array, reading input values from a specified array.</dd> + <dt>{{jsxref("TypedArray.slice", "BigUint64Array.prototype.slice()")}}</dt> + <dd>Extracts a section of an array and returns a new array. See also {{jsxref("Array.prototype.slice()")}}.</dd> + <dt>{{jsxref("TypedArray.some", "BigUint64Array.prototype.some()")}}</dt> + <dd>Returns true if at least one element in this array satisfies the provided testing function. See also {{jsxref("Array.prototype.some()")}}.</dd> + <dt>{{jsxref("TypedArray.sort", "BigUint64Array.prototype.sort()")}}</dt> + <dd>Sorts the elements of an array in place and returns the array. See also {{jsxref("Array.prototype.sort()")}}.</dd> + <dt>{{jsxref("TypedArray.subarray", "BigUint64Array.prototype.subarray()")}}</dt> + <dd>Returns a new <code>BigUint64Array</code> from the given start and end element index.</dd> + <dt>{{jsxref("TypedArray.values", "BigUint64Array.prototype.values()")}}</dt> + <dd>Returns a new <code>Array Iterator</code> object that contains the values for each index in the array. See also {{jsxref("Array.prototype.values()")}}.</dd> + <dt>{{jsxref("TypedArray.toLocaleString", "BigUint64Array.prototype.toLocaleString()")}}</dt> + <dd>Returns a localized string representing the array and its elements. See also {{jsxref("Array.prototype.toLocaleString()")}}.</dd> + <dt>{{jsxref("TypedArray.toString", "BigUint64Array.prototype.toString()")}}</dt> + <dd>Returns a string representing the array and its elements. See also {{jsxref("Array.prototype.toString()")}}.</dd> + <dt>{{jsxref("TypedArray.@@iterator", "BigUint64Array.prototype[@@iterator]()")}}</dt> + <dd>Returns a new <code>Array Iterator</code> object that contains the values for each index in the array.</dd> +</dl> + +<h2 id="Examples">Examples</h2> + +<p>Different ways to create a <code>BigUint64Array</code>:</p> + +<pre class="brush: js">// From a length +var biguint64 = new BigUint64Array(2); +biguint64[0] = 42n; +console.log(biguint64[0]); // 42n +console.log(biguint64.length); // 2 +console.log(biguint64.BYTES_PER_ELEMENT); // 8 + +// From an array +var arr = new BigUint64Array([21n,31n]); +console.log(arr[1]); // 31n + +// From another TypedArray +var x = new BigUint64Array([21n, 31n]); +var y = new BigUint64Array(x); +console.log(y[0]); // 21n + +// From an ArrayBuffer +var buffer = new ArrayBuffer(32); +var z = new BigUint64Array(buffer, 0, 4); + +// From an iterable +var iterable = function*(){ yield* [1n, 2n, 3n]; }(); +var biguint64 = new BigUint64Array(iterable); +// BigUint64Array[1n, 2n, 3n] +</pre> + +<h2 id="Specifications">Specifications</h2> + +<p><a href="https://tc39.github.io/proposal-bigint/#sec-typedarrays-and-dataview">BigInt proposal</a></p> + +<h2 id="Browser_compatibility">Browser compatibility</h2> + + + +<p>{{Compat("javascript.builtins.BigUint64Array")}}</p> + +<h2 id="See_also">See also</h2> + +<ul> + <li><a href="/en-US/docs/Web/JavaScript/Typed_arrays" title="en/JavaScript typed arrays">JavaScript typed arrays</a></li> + <li>{{jsxref("BigInt64Array")}}</li> + <li>{{jsxref("DataView")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/boolean/index.html b/files/zh-cn/web/javascript/reference/global_objects/boolean/index.html new file mode 100644 index 0000000000..66b0fb1417 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/boolean/index.html @@ -0,0 +1,120 @@ +--- +title: Boolean +slug: Web/JavaScript/Reference/Global_Objects/Boolean +tags: + - Boolean + - Constructor + - JavaScript +translation_of: Web/JavaScript/Reference/Global_Objects/Boolean +--- +<p>{{JSRef}}</p> + +<p><strong><code>Boolean</code></strong>对象是一个布尔值的对象包装器。</p> + +<h2 id="描述">描述</h2> + +<p>如果需要，作为第一个参数传递的值将转换为布尔值。如果省略或值<code>0</code>，<code>-0</code>，{{jsxref("null")}}，<code>false</code>，{{jsxref("NaN")}}，{{jsxref("undefined")}}，或空字符串（<code>""</code>），该对象具有的初始值<code>false</code>。所有其他值，包括任何对象，空数组（<code>[]</code>）或字符串<code>"false"</code>，都会创建一个初始值为<code>true</code>的对象。</p> + +<p>注意不要将基本类型中的布尔值 <code>true</code> 和 <code>false</code> 与值为 <code>true</code> 和 <code>false</code> 的 <code>Boolean</code> 对象弄混了。</p> + +<p>其值不是{{jsxref("undefined")}}或{{jsxref("null")}}的任何对象（包括其值为<code>false</code>的布尔对象）在传递给条件语句时都将计算为<code>true</code>。 例如，以下{{jsxref("Statements/if...else", "if")}}语句中的条件评估为<code>true</code>：</p> + +<pre class="brush: js notranslate">var x = new Boolean(false); +if (x) { + // 这里的代码会被执行 +} +</pre> + +<p>基本类型的布尔值不受此规则影响。例如下面的 {{jsxref("Statements/if...else", "if")}} 语句的条件为假：</p> + +<pre class="brush: js notranslate">var x = false; +if (x) { + // 这里的代码不会执行 +} +</pre> + +<p>不要用创建 <code>Boolean</code> 对象的方式将一个非布尔值转化成布尔值，直接将 <code>Boolean</code> 当做转换函数来使用即可，或者使用<a href="/zh-CN/docs/Web/JavaScript/Reference/Operators/Logical_Operators#%E9%80%BB%E8%BE%91%E9%9D%9E%EF%BC%88!%EF%BC%89">双重非（!!）运算符</a>：</p> + +<pre class="brush: js notranslate">var x = Boolean(expression); // 推荐 +var x = !!(expression); // 推荐 +var x = new Boolean(expression); // 不太好 +</pre> + +<p>对于任何对象，即使是值为 <code>false</code> 的 <code>Boolean</code> 对象，当将其传给 <code>Boolean</code> 函数时，生成的 <code>Boolean</code> 对象的值都是 <code>true</code>。</p> + +<pre class="brush: js notranslate">var myFalse = new Boolean(false); // true +var g = new Boolean(myFalse); // true +var myString = new String("Hello"); +var s = new Boolean(myString); // true +</pre> + +<p>最后，不要在应该使用基本类型布尔值的地方使用 <code>Boolean</code> 对象。</p> + +<div class="blockIndicator note"> +<p><strong>注意：</strong>当将非标准属性<a href="https://wiki.developer.mozilla.org/en-US/docs/Web/API/Document#Properties">document.all</a>用作此构造函数的参数时，结果是值为<code>false</code>的布尔对象。 此属性是旧属性，是非标准属性，不应使用。</p> +</div> + +<h2 id="构造器">构造器</h2> + +<dl> + <dt><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean/Boolean"><code>Boolean()</code></a></dt> + <dd>创建一个新的<code>Boolean</code> 对象。</dd> +</dl> + +<h2 id="实例方法">实例方法</h2> + +<dl> + <dt>{{jsxref("Boolean.prototype.toString()")}}</dt> + <dd>根据对象的值返回字符串<code>"true"</code>或<code>"false"</code>。 重写{{jsxref("Object.prototype.toString()")}}方法。</dd> + <dt>{{jsxref("Boolean.prototype.valueOf()")}}</dt> + <dd>返回{{jsxref("Boolean")}}对象的原始值。 重写{{jsxref("Object.prototype.valueOf()")}}方法。</dd> +</dl> + +<h2 id="示例">示例</h2> + +<h3 id="创建值为_false_的_Boolean_对象">创建值为 <code>false</code> 的 <code>Boolean</code> 对象</h3> + +<pre class="brush: js notranslate">var bNoParam = new Boolean(); +var bZero = new Boolean(0); +var bNull = new Boolean(null); +var bEmptyString = new Boolean(''); +var bfalse = new Boolean(false); +</pre> + +<h3 id="创建值为_true_的_Boolean_对象">创建值为 <code>true</code> 的 <code>Boolean</code> 对象</h3> + +<pre class="brush: js notranslate">var btrue = new Boolean(true); +var btrueString = new Boolean('true'); +var bfalseString = new Boolean('false'); +var bSuLin = new Boolean('Su Lin'); +var bArrayProto = new Boolean([]); +var bObjProto = new Boolean({}); +</pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <td>规范</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-boolean-objects', 'Boolean')}}</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性"><br> + 浏览器兼容性</h2> + +<div class="hidden">The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</div> + +<p>{{Compat("javascript.builtins.Boolean")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Boolean.prototype")}}</li> + <li>{{Glossary("Boolean")}}</li> + <li><a href="http://en.wikipedia.org/wiki/Boolean_data_type">Boolean data type (Wikipedia)</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/boolean/prototype/index.html b/files/zh-cn/web/javascript/reference/global_objects/boolean/prototype/index.html new file mode 100644 index 0000000000..a29fd8eb9a --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/boolean/prototype/index.html @@ -0,0 +1,75 @@ +--- +title: Boolean.prototype +slug: Web/JavaScript/Reference/Global_Objects/Boolean/prototype +tags: + - Boolean + - JavaScript + - Property + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Boolean +--- +<p>{{JSRef}}</p> + +<p><strong><code>Boolean.prototype</code></strong> 属性表示{{jsxref("Boolean")}} 构造函数的原型。</p> + +<div>{{js_property_attributes(0,0,0)}}</div> + +<h2 id="Description" name="Description" style="margin-bottom: 20px; line-height: 30px;">描述</h2> + +<p>{{jsxref("Boolean")}}实例继承自<code>Boolean.prototype</code>。你可以使用构造函数的原型对象向所有{{jsxref("Boolean")}}实例添加属性或方法。</p> + +<h2 id="属性" style="margin-bottom: 20px; line-height: 30px;">属性</h2> + +<dl> + <dt><code>Boolean.prototype.constructor</code></dt> + <dd>返回创建了实例原型的函数。默认为{{jsxref("Boolean")}}函数。</dd> +</dl> + +<h2 id="方法" style="margin-bottom: 20px; line-height: 30px;">方法</h2> + +<dl> + <dt>{{jsxref("Boolean.prototype.toSource()")}} {{ Non-standard_inline() }}</dt> + <dd>返回包含{{jsxref("Boolean")}}对象源码的字符串；你可以使用这个字符串来创建一个等价的对象。覆盖了{{jsxref("Object.prototype.toSource()")}} 方法。</dd> + <dt>{{jsxref("Boolean.prototype.toString()")}}</dt> + <dd>根据对象的值来返回一个字符串：<code>"true"</code> 或 <code>"false"</code>。覆盖了 {{jsxref("Object.prototype.toString()")}} 方法。</dd> + <dt>{{jsxref("Boolean.prototype.valueOf()")}}</dt> + <dd>返回{{jsxref("Boolean")}}对象的原始值。覆盖了 {{jsxref("Object.prototype.valueOf()")}} 方法。</dd> +</dl> + +<h2 id="规范" style="margin-bottom: 20px; line-height: 30px;">规范</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('ES1')}}</td> + <td>{{Spec2('ES1')}}</td> + <td>Initial definition. Implemented in JavaScript 1.0.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.6.3.1', 'Boolean.prototype')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-boolean.prototype', 'Boolean.prototype')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-boolean.prototype', 'Boolean.prototype')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容" style="margin-bottom: 20px; line-height: 30px;">浏览器兼容</h2> + +<div class="hidden">The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</div> + +<p>{{Compat("javascript.builtins.Boolean.prototype")}}</p> diff --git a/files/zh-cn/web/javascript/reference/global_objects/boolean/tosource/index.html b/files/zh-cn/web/javascript/reference/global_objects/boolean/tosource/index.html new file mode 100644 index 0000000000..2086ce07c6 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/boolean/tosource/index.html @@ -0,0 +1,59 @@ +--- +title: Boolean.prototype.toSource() +slug: Web/JavaScript/Reference/Global_Objects/Boolean/toSource +tags: + - JavaScript + - Method + - Prototype + - 布尔 +translation_of: Web/JavaScript/Reference/Global_Objects/Boolean/toSource +--- +<div>{{JSRef}} {{non-standard_header}}</div> + +<p><span class="short_text" id="result_box" lang="zh-CN"><span>toSource（）方法返回一个表示对象的源码的字符串。</span></span></p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>booleanObj</var>.toSource() +Boolean.toSource()</pre> + +<h3 id="返回值">返回值</h3> + +<p><span class="short_text" id="result_box" lang="zh-CN"><span>表示对象的源码的字符串。</span></span></p> + +<h2 id="描述">描述</h2> + +<p><span class="short_text" id="result_box" lang="zh-CN"><span>toSource方法返回以下值：</span></span></p> + +<ul> + <li><span id="result_box" lang="zh-CN"><span>对于内置的</span></span> {{jsxref("Boolean")}} <span lang="zh-CN"><span>对象，toSource返回以下字符串，表示源代码不可用：</span></span> + + <pre class="brush: js">function Boolean() { + [native code] +} +</pre> + </li> + <li><span class="short_text" id="result_box" lang="zh-CN"><span>对于</span></span> {{jsxref("Boolean")}}<span class="short_text" lang="zh-CN"><span> 的实例，toSource返回一个表示源代码的字符串。</span></span></li> +</ul> + +<p><span class="short_text" id="result_box" lang="zh-CN"><span>此方法通常由JavaScript在内部调用，而不是在代码中显式调用。</span></span></p> + +<h2 id="规范"><span class="short_text" id="result_box" lang="zh-CN"><span>规范</span></span></h2> + +<p><span id="result_box" lang="zh-CN"><span>不是任何标准的一部分。</span> <span>在JavaScript 1.3中实现。</span></span></p> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> +<div> + + +<p>{{Compat("javascript.builtins.Boolean.toSource")}}</p> +</div> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Object.prototype.toSource()")}} {{non-standard_inline}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/boolean/tostring/index.html b/files/zh-cn/web/javascript/reference/global_objects/boolean/tostring/index.html new file mode 100644 index 0000000000..6245e953dc --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/boolean/tostring/index.html @@ -0,0 +1,87 @@ +--- +title: Boolean.prototype.toString() +slug: Web/JavaScript/Reference/Global_Objects/Boolean/toString +tags: + - Boolean + - JavaScript + - Method + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Boolean/toString +--- +<div>{{JSRef}}</div> + +<p><code><strong>toString()</strong></code> 方法返回指定的布尔对象的字符串形式。</p> + +<div>{{EmbedInteractiveExample("pages/js/boolean-tostring.html")}}</div> + + + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><var>bool</var>.toString()</pre> + +<h3 id="返回值">返回值</h3> + +<p>表示特定{{jsxref("Boolean")}}对象的字符串。</p> + +<h2 id="Description" name="Description">描述</h2> + +<p>{{jsxref("Boolean")}} 对象覆盖了 {{jsxref("Object")}} 对象的 <code>toString</code> 方法。并没有继承 {{jsxref("Object.prototype.toString()")}}。对于布尔对象，<code>toString</code> 方法返回该对象的字符串形式。</p> + +<p>当一个{{jsxref("Boolean")}}对象作为文本值或进行字符串连接时，JavaScript 会自动调用其 <code>toString</code> 方法。</p> + +<p>对于{{jsxref("Boolean")}}对象或值，内置的 <code>toString</code> 方法返回字符串 "<code>true</code>" 或 "<code>false</code>"，具体返回哪个取决于布尔对象的值。</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用_toString">使用 <code>toString</code></h3> + +<p>下面的代码，<code>flag.toString</code> 返回 "<code>true</code>"：</p> + +<pre class="brush: js">var flag = new Boolean(true) +var myVar = flag.toString() +</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('ES1')}}</td> + <td>{{Spec2('ES1')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.6.4.2', 'Boolean.prototype.toString')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-boolean.prototype.tostring', 'Boolean.prototype.toString')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-boolean.prototype.tostring', 'Boolean.prototype.toString')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容">浏览器兼容</h2> + +<div class="hidden">The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</div> + +<p>{{Compat("javascript.builtins.Boolean.toString")}}</p> + +<h2 id="See_Also" name="See_Also">相关链接</h2> + +<ul> + <li>{{jsxref("Object.prototype.toString()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/boolean/valueof/index.html b/files/zh-cn/web/javascript/reference/global_objects/boolean/valueof/index.html new file mode 100644 index 0000000000..068e594b92 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/boolean/valueof/index.html @@ -0,0 +1,83 @@ +--- +title: Boolean.prototype.valueOf() +slug: Web/JavaScript/Reference/Global_Objects/Boolean/valueOf +tags: + - Boolean + - JavaScript + - Method + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Boolean/valueOf +--- +<div>{{JSRef}}</div> + +<p><code><strong>valueOf()</strong></code> 方法返回一个{{jsxref("Boolean")}}对象的原始值。</p> + +<div>{{EmbedInteractiveExample("pages/js/boolean-valueof.html")}}</div> + + + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code><var>bool</var>.valueOf()</code></pre> + +<h3 id="返回值">返回值</h3> + +<p>给定{{jsxref("Boolean")}}对象的原始值</p> + +<h2 id="Description" name="Description">描述</h2> + +<p>{{jsxref("Boolean")}}的 <code>valueOf</code> 方法返回一个{{jsxref("Boolean")}}对象或{{jsxref("Boolean")}}字面量的原始值作为布尔数据类型。</p> + +<p>该方法通常在 JavaScript 内部调用，而不是在代码中显式调用。</p> + +<h2 id="Examples" name="Examples">示例</h2> + +<h3 id="Example:_Using_valueOf" name="Example:_Using_valueOf">使用 <code>valueOf</code></h3> + +<pre class="brush: js">x = new Boolean(); +myVar = x.valueOf() // assigns false to myVar +</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('ES1')}}</td> + <td>{{Spec2('ES1')}}</td> + <td>Initial definition. Implemented in JavaScript 1.1.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.6.4.3', 'Boolean.prototype.valueOf')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-boolean.prototype.valueof', 'Boolean.prototype.valueOf')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-boolean.prototype.valueof', 'Boolean.prototype.valueOf')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容">浏览器兼容</h2> + +<div class="hidden">The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</div> + +<p>{{Compat("javascript.builtins.Boolean.valueOf")}}</p> + +<h2 id="See_Also" name="See_Also">相关链接</h2> + +<ul> + <li>{{jsxref("Object.prototype.valueOf()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/dataview/buffer/index.html b/files/zh-cn/web/javascript/reference/global_objects/dataview/buffer/index.html new file mode 100644 index 0000000000..a8324d6dd2 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/dataview/buffer/index.html @@ -0,0 +1,64 @@ +--- +title: DataView.prototype.buffer +slug: Web/JavaScript/Reference/Global_Objects/DataView/buffer +translation_of: Web/JavaScript/Reference/Global_Objects/DataView/buffer +--- +<div>{{JSRef}}</div> + +<p> <strong><code>buffer</code></strong> 属性描述了在构造时被 DataView 引用的 {{jsxref("ArrayBuffer")}}。</p> + +<div>{{EmbedInteractiveExample("pages/js/dataview-buffer.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>dataview</var>.buffer</pre> + +<h2 id="描述">描述</h2> + +<p><code>buffer</code> 属性是一个访问器(accessor)属性，它的 set 属性为 undefined，这意味着它是只读的。值在 <code>DataView 被创建时就确定了，且不能改变。</code></p> + +<h2 id="示例">示例</h2> + +<h3 id="使用buffer属性"><code>使用buffer属性</code></h3> + +<pre class="brush:js">var buffer = new ArrayBuffer(8); +var dataview = new DataView(buffer); +dataview.buffer; // ArrayBuffer { byteLength: 8 } +</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('ES6', '#sec-get-dataview.prototype.buffer', 'DataView.prototype.buffer')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-get-dataview.prototype.buffer', 'DataView.prototype.buffer')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.DataView.buffer")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("DataView")}}</li> + <li>{{jsxref("ArrayBuffer")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/dataview/bytelength/index.html b/files/zh-cn/web/javascript/reference/global_objects/dataview/bytelength/index.html new file mode 100644 index 0000000000..a581506c44 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/dataview/bytelength/index.html @@ -0,0 +1,70 @@ +--- +title: DataView.prototype.byteLength +slug: Web/JavaScript/Reference/Global_Objects/DataView/byteLength +translation_of: Web/JavaScript/Reference/Global_Objects/DataView/byteLength +--- +<div>{{JSRef}}</div> + +<p> <strong><code>byteLength</code></strong> 属性描述了视图从它的 {{jsxref("ArrayBuffer")}} 开始的字节长度。</p> + +<div>{{EmbedInteractiveExample("pages/js/dataview-bytelength.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>dataview</var>.byteLength</pre> + +<h2 id="描述">描述</h2> + +<p><code>byteLength</code> 属性是一个获取(accessor)属性，它的 set 属性为 undefined，这意味着它是只读的。值在 <code>DataView 被创建时就确定了，且不能改变。如果</code> <code>DataView</code> 没有指定偏移量或byteLength，那么被引用的 <code>ArrayBuffer 的字节长度将被返回。</code></p> + +<h2 id="Examples">Examples</h2> + +<h3 id="Using_the_byteLength_property">Using the <code>byteLength</code> property</h3> + +<pre class="brush:js">var buffer = new ArrayBuffer(8); +var dataview = new DataView(buffer); +dataview.byteLength; // 8 (matches the byteLength of the buffer) + +var dataview2 = new DataView(buffer, 1, 5); +dataview2.byteLength; // 5 (as specified when constructing the DataView) + +var dataview3 = new DataView(buffer, 2); +dataview3.byteLength; // 6 (due to the offset of the constructed DataView) +</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('ES6', '#sec-get-dataview.prototype.bytelength', 'DataView.prototype.byteLength')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-get-dataview.prototype.bytelength', 'DataView.prototype.byteLength')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.DataView.byteLength")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("DataView")}}</li> + <li>{{jsxref("ArrayBuffer")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/dataview/byteoffset/index.html b/files/zh-cn/web/javascript/reference/global_objects/dataview/byteoffset/index.html new file mode 100644 index 0000000000..9335006969 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/dataview/byteoffset/index.html @@ -0,0 +1,67 @@ +--- +title: DataView.prototype.byteOffset +slug: Web/JavaScript/Reference/Global_Objects/DataView/byteOffset +translation_of: Web/JavaScript/Reference/Global_Objects/DataView/byteOffset +--- +<div>{{JSRef}}</div> + +<p> <strong><code>byteOffset</code></strong> 属性描述了从 {{jsxref("ArrayBuffer")}} 开始的字节偏移量。</p> + +<div>{{EmbedInteractiveExample("pages/js/dataview-byteoffset.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>dataview</var>.byteOffset</pre> + +<h2 id="描述">描述</h2> + +<p> <code>byteOffset</code> 属性是一个获取(accessor)属性，它的 set 属性为 undefined，这意味着它是只读的。值在 <code>DataView 被创建时就确定了，且不能改变。</code></p> + +<h2 id="示例">示例</h2> + +<h3 id="使用_byteOffset_属性"><code>使用 byteOffset 属性</code></h3> + +<pre class="brush:js">var buffer = new ArrayBuffer(8); +var dataview = new DataView(buffer); +dataview.byteOffset; // 0 (没有指定偏移量) + +var dataview2 = new DataView(buffer, 3); +dataview2.byteOffset; // 3 (在构造DataView时指定) +</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('ES6', '#sec-get-dataview.prototype.byteoffset', 'DataView.prototype.byteOffset')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-get-dataview.prototype.byteoffset', 'DataView.prototype.byteOffset')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.DataView.byteOffset")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("DataView")}}</li> + <li>{{jsxref("ArrayBuffer")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/dataview/getbigint64/index.html b/files/zh-cn/web/javascript/reference/global_objects/dataview/getbigint64/index.html new file mode 100644 index 0000000000..cf90669761 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/dataview/getbigint64/index.html @@ -0,0 +1,91 @@ +--- +title: getBigInt64() +slug: Web/JavaScript/Reference/Global_Objects/DataView/getBigInt64 +tags: + - DataView + - JavaScript + - Prototype + - getBigInt64() + - 大整型 +translation_of: Web/JavaScript/Reference/Global_Objects/DataView/getBigInt64 +--- +<div>{{JSRef}}</div> + +<div></div> + +<p><strong><code>getBigInt64()</code></strong> 方法从 {{jsxref("DataView")}}开始获取一个指定偏移量的有符号64位整数 (long long) 。</p> + +<div>{{EmbedInteractiveExample("pages/js/dataview-getbigint64.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>dataview</var>.getBigInt64(byteOffset [, littleEndian])</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt>byteOffset</dt> + <dd>偏移量，以字节为单位。指明视图开始读取数据的偏移量。</dd> + <dt>littleEndian</dt> + <dd>{{optional_inline}} 指明该64位整型数值的存储方式（ {{Glossary("Endianness", "大小端模式")}}） 。 如果为 <code>false</code> 或 <code>undefined</code>, 则按大端方式读取数据。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>一个 {{jsxref("BigInt")}}.</p> + +<h3 id="异常抛出">异常抛出</h3> + +<dl> + <dt>{{jsxref("RangeError")}}</dt> + <dd>如果 <code>byteOffset</code> 设置的偏移量超出了视图的范围，则抛出该异常。</dd> +</dl> + +<h2 id="简介">简介</h2> + +<ul> + <li>没有对齐约束;</li> + <li>可以从任何偏移量获取多字节值。</li> +</ul> + +<h2 id="例子">例子</h2> + +<h3 id="使用_getBigInt64_方法">使用 <code>getBigInt64</code> 方法</h3> + +<pre class="brush:js">var buffer = new ArrayBuffer(8); +var dataview = new DataView(buffer); +dataview.getBigInt64(0); // 0n +</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 href="https://tc39.github.io/proposal-bigint/#sec-dataview.prototype.getbigint64">DataView.prototype.getBigInt64 proposal</a></td> + <td></td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.DataView.getBigInt64")}}</p> + +<h2 id="另请参阅">另请参阅</h2> + +<ul> + <li>{{jsxref("DataView")}}</li> + <li>{{jsxref("ArrayBuffer")}}</li> + <li>{{jsxref("BigInt")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/dataview/getbiguint64/index.html b/files/zh-cn/web/javascript/reference/global_objects/dataview/getbiguint64/index.html new file mode 100644 index 0000000000..d418df1366 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/dataview/getbiguint64/index.html @@ -0,0 +1,80 @@ +--- +title: DataView.prototype.getBigUint64() +slug: Web/JavaScript/Reference/Global_Objects/DataView/getBigUint64 +translation_of: Web/JavaScript/Reference/Global_Objects/DataView/getBigUint64 +--- +<div>{{JSRef}}</div> + +<p><strong><code>getBigUint64()</code></strong>方法，从{{jsxref("DataView")}}的指定偏移量位置获取一个无符号64位整数(unsigned long long)。</p> + +<div>{{EmbedInteractiveExample("pages/js/dataview-getbiguint64.html")}}</div> + +<p class="hidden">上述交互例程存储在github仓库中. 如果你想贡献这段交互代码， 请克隆<a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> ，然后给我们提交一个pull request.</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>dataview</var>.getBigUint64(byteOffset [, littleEndian])</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt>byteOffset</dt> + <dd>偏移量，按<strong>字节</strong>偏移，从DataView读取一个整数</dd> + <dt>littleEndian</dt> + <dd>{{optional_inline}} 指出64位整数以 {{Glossary("Endianness", "little- or big-endian")}} 类型存储. 如果值为 <code>false</code> or <code>undefined</code>, 读取一个大端数值.</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>A {{jsxref("BigInt")}}.</p> + +<h3 id="异常">异常</h3> + +<dl> + <dt>{{jsxref("RangeError")}}</dt> + <dd>Thrown if the <code>byteOffset</code> is set such that it would read beyond the end of the view.</dd> +</dl> + +<h2 id="Description">Description</h2> + +<p>There is no alignment constraint; multi-byte values may be fetched from any offset.</p> + +<h2 id="Examples">Examples</h2> + +<h3 id="Using_the_getBigUint64_method">Using the <code>getBigUint64</code> method</h3> + +<pre class="brush:js">var buffer = new ArrayBuffer(8); +var dataview = new DataView(buffer); +dataview.getBigUint64(0); // 0n +</pre> + +<h2 id="Specifications">Specifications</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 href="https://tc39.es/proposal-bigint/#sec-dataview.prototype.getbiguint64">DataView.prototype.getBigUint64 proposal</a></td> + <td></td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility">Browser compatibility</h2> + + + +<p>{{Compat("javascript.builtins.DataView.getBigUint64")}}</p> + +<h2 id="See_also">See also</h2> + +<ul> + <li>{{jsxref("DataView")}}</li> + <li>{{jsxref("ArrayBuffer")}}</li> + <li>{{jsxref("BigInt")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/dataview/getfloat32/index.html b/files/zh-cn/web/javascript/reference/global_objects/dataview/getfloat32/index.html new file mode 100644 index 0000000000..b43d4df38c --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/dataview/getfloat32/index.html @@ -0,0 +1,94 @@ +--- +title: DataView.prototype.getFloat32() +slug: Web/JavaScript/Reference/Global_Objects/DataView/getFloat32 +tags: + - DataView + - getFloat32 +translation_of: Web/JavaScript/Reference/Global_Objects/DataView/getFloat32 +--- +<div>{{JSRef}}</div> + +<p><strong><code>getFloat32()</code></strong>方法从相对于{{jsxref("DataView")}} 的起始位置偏移 n 个字节处获取一个32-bit浮点数(单精度浮点数，4个字节).</p> + +<div>{{EmbedInteractiveExample("pages/js/dataview-getfloat32.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>dataview</var>.getFloat32(byteOffset [, littleEndian])</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt>byteOffset</dt> + <dd>偏移量, 单位为字节, 为从视图的开始位置到读取数值的位置的偏移。</dd> + <dt>littleEndian</dt> + <dd>{{optional_inline}} 表示这个32位浮点数是否以 {{Glossary("Endianness", "little- or big-endian")}} 格式存储，如果设置为 false 或者不指定，将用big-endian格式读取数值。</dd> +</dl> + +<h3 id="返回">返回</h3> + +<dl> + <dd>一个带符号的32位浮点数。</dd> +</dl> + +<h3 id="抛出错误">抛出错误</h3> + +<dl> + <dt>{{jsxref("RangeError")}}</dt> + <dd>如果byteOffset 设置导致读数值时超出了视图的末尾就会抛出错误。</dd> +</dl> + +<h2 id="说明">说明</h2> + +<dl> + <dd>没有对齐约束; 多字节值可以从任何偏移处获取。</dd> +</dl> + +<h2 id="例子">例子</h2> + +<pre class="brush:js">var buffer = new ArrayBuffer(8); +var dataview = new DataView(buffer); +dataview.getFloat32(1); // 0 +</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('Typed Array')}}</td> + <td>{{Spec2('Typed Array')}}</td> + <td>Superseded by ECMAScript 6.</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-dataview.prototype.getfloat32', 'DataView.prototype.getFloat32')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition in an ECMA standard.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-dataview.prototype.getfloat32', 'DataView.prototype.getFloat32')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器支持">浏览器支持</h2> + + + +<p>{{Compat("javascript.builtins.DataView.getFloat32")}}</p> + +<h2 id="另见">另见</h2> + +<ul> + <li>{{jsxref("DataView")}}</li> + <li>{{jsxref("ArrayBuffer")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/dataview/getfloat64/index.html b/files/zh-cn/web/javascript/reference/global_objects/dataview/getfloat64/index.html new file mode 100644 index 0000000000..885acb9421 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/dataview/getfloat64/index.html @@ -0,0 +1,91 @@ +--- +title: DataView.prototype.getFloat64() +slug: Web/JavaScript/Reference/Global_Objects/DataView/getFloat64 +translation_of: Web/JavaScript/Reference/Global_Objects/DataView/getFloat64 +--- +<div>{{JSRef}}</div> + +<p><strong><code>getFloat64()</code></strong><code>方法</code><code>从</code><a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/DataView" title="DataView 视图提供了一种用于向 ArrayBuffer 读写数据的底层接口。"><code>DataView</code></a>相对于起始位置偏移 n 个字节处开始，获取一个64-bit数(双精度浮点型，8个字节).</p> + +<div>{{EmbedInteractiveExample("pages/js/dataview-getfloat64.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>dataview</var>.getFloat64(byteOffset [, littleEndian])</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt>byteOffset</dt> + <dd>偏移量, 单位为字节, 从头开始计算.</dd> + <dt>littleEndian</dt> + <dd>{{optional_inline}} Indicates whether the 64-bit float is stored in {{Glossary("Endianness", "little- or big-endian")}} format. If false or undefined, a big-endian value is read.</dd> +</dl> + +<h3 id="返回">返回</h3> + +<dl> + <dd>一个双精度浮点型64位数.</dd> +</dl> + +<h3 id="抛出错误">抛出错误</h3> + +<dl> + <dt>{{jsxref("RangeError")}}</dt> + <dd>如果byteOffset超出了视图能储存的值，就会抛出错误.</dd> +</dl> + +<h2 id="描述">描述</h2> + +<dl> + <dd>没有对齐约束; 多字节值可以从任何偏移量获取.</dd> +</dl> + +<h2 id="例子">例子</h2> + +<pre class="brush:js">var buffer = new ArrayBuffer(8); +var dataview = new DataView(buffer); +dataview.getFloat64(1); // 0 +</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('Typed Array')}}</td> + <td>{{Spec2('Typed Array')}}</td> + <td>Superseded by ECMAScript 6.</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-dataview.prototype.getfloat64', 'DataView.prototype.getFloat64')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition in ECMA standard.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-dataview.prototype.getfloat64', 'DataView.prototype.getFloat64')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器支持">浏览器支持</h2> + + + +<p>{{Compat("javascript.builtins.DataView.getFloat64")}}</p> + +<h2 id="另见">另见</h2> + +<ul> + <li>{{jsxref("DataView")}}</li> + <li>{{jsxref("ArrayBuffer")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/dataview/getint16/index.html b/files/zh-cn/web/javascript/reference/global_objects/dataview/getint16/index.html new file mode 100644 index 0000000000..060f88b722 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/dataview/getint16/index.html @@ -0,0 +1,94 @@ +--- +title: DataView.prototype.getInt16() +slug: Web/JavaScript/Reference/Global_Objects/DataView/getInt16 +tags: + - 类型化 + - 类型化数组 +translation_of: Web/JavaScript/Reference/Global_Objects/DataView/getInt16 +--- +<div>{{JSRef}}</div> + +<p><strong><code>getInt16()</code></strong><code>方法</code><code>从</code>{{jsxref("DataView")}}相对于起始位置偏移 n 个字节处开始，获取一个16-bit数(短整型，2个字节).</p> + +<div>{{EmbedInteractiveExample("pages/js/dataview-getint16.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>dataview</var>.getInt16(byteOffset [, littleEndian])</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt>byteOffset</dt> + <dd>偏移量, 单位为字节, 从头开始计算.</dd> + <dt>littleEndian</dt> + <dd>{{optional_inline}} 表示该 16 位整数是否以 {{Glossary("Endianness", "little- or big-endian")}} 格式存储的（就是使用的字节序格式，具体参考链接页面）；如果传入的值为 <code>true</code>，就表示使用 little-endian（低字节序），如果传入的值为 <code>false</code> 或者 <code>undefined</code>，则会使用 big-endian（高字节序） 方式读值。</dd> +</dl> + +<h3 id="返回">返回</h3> + +<dl> + <dd>一个短整型16位数.</dd> +</dl> + +<h3 id="抛出错误">抛出错误</h3> + +<dl> + <dt>{{jsxref("RangeError")}}</dt> + <dd>如果byteOffset超出了视图能储存的值，就会抛出错误.</dd> +</dl> + +<h2 id="描述">描述</h2> + +<dl> + <dd> 没有对齐约束; 多字节值可以从任何偏移量获取.</dd> +</dl> + +<h2 id="例子">例子</h2> + +<pre class="brush:js">var buffer = new ArrayBuffer(8); +var dataview = new DataView(buffer); +dataview.getInt16(1); // 0 +</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('Typed Array')}}</td> + <td>{{Spec2('Typed Array')}}</td> + <td>Superseded by ECMAScript 6.</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-dataview.prototype.getint16', 'DataView.prototype.getInt16')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition in an ECMA standard.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-dataview.prototype.getint16', 'DataView.prototype.getInt16')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器支持">浏览器支持</h2> + + + +<p>{{Compat("javascript.builtins.DataView.getInt16")}}</p> + +<h2 id="另见">另见</h2> + +<ul> + <li>{{jsxref("DataView")}}</li> + <li>{{jsxref("ArrayBuffer")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/dataview/getint32/index.html b/files/zh-cn/web/javascript/reference/global_objects/dataview/getint32/index.html new file mode 100644 index 0000000000..616d2b1977 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/dataview/getint32/index.html @@ -0,0 +1,91 @@ +--- +title: DataView.prototype.getInt32() +slug: Web/JavaScript/Reference/Global_Objects/DataView/getInt32 +translation_of: Web/JavaScript/Reference/Global_Objects/DataView/getInt32 +--- +<div>{{JSRef}}</div> + +<p><strong><code>getInt32()</code></strong><code>方法</code><code>从</code><a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/DataView" title="DataView 视图提供了一种用于向 ArrayBuffer 读写数据的底层接口。"><code>DataView</code></a>相对于起始位置偏移 n 个字节处开始，获取一个32-bit数(长整型，4个字节).</p> + +<div>{{EmbedInteractiveExample("pages/js/dataview-getint32.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>dataview</var>.getInt32(byteOffset [, littleEndian])</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt>byteOffset</dt> + <dd>偏移量, 单位为字节, 从头开始计算.</dd> + <dt>littleEndian</dt> + <dd>{{optional_inline}} Indicates whether the 32-bit int is stored in {{Glossary("Endianness", "little- or big-endian")}} format. If false or undefined, a big-endian value is read.</dd> +</dl> + +<h3 id="返回">返回</h3> + +<dl> + <dd>一个长整型32位数.</dd> +</dl> + +<h3 id="抛出错误">抛出错误</h3> + +<dl> + <dt>{{jsxref("RangeError")}}</dt> + <dd>如果byteOffset超出了视图能储存的值，就会抛出错误.</dd> +</dl> + +<h2 id="描述">描述</h2> + +<dl> + <dd> 没有对齐约束; 多字节值可以从任何偏移量获取.</dd> +</dl> + +<h2 id="例子">例子</h2> + +<pre class="brush:js">var buffer = new ArrayBuffer(8); +var dataview = new DataView(buffer); +dataview.getInt32(1); // 0 +</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('Typed Array')}}</td> + <td>{{Spec2('Typed Array')}}</td> + <td>Superseded by ECMAScript 6.</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-dataview.prototype.getint32', 'DataView.prototype.getInt32')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition in an ECMA standard.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-dataview.prototype.getint32', 'DataView.prototype.getInt32')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器支持">浏览器支持</h2> + + + +<p>{{Compat("javascript.builtins.DataView.getInt32")}}</p> + +<h2 id="另见">另见</h2> + +<ul> + <li>{{jsxref("DataView")}}</li> + <li>{{jsxref("ArrayBuffer")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/dataview/getint8/index.html b/files/zh-cn/web/javascript/reference/global_objects/dataview/getint8/index.html new file mode 100644 index 0000000000..0a8a5da6a2 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/dataview/getint8/index.html @@ -0,0 +1,86 @@ +--- +title: DataView.prototype.getInt8() +slug: Web/JavaScript/Reference/Global_Objects/DataView/getInt8 +tags: + - 类型化 + - 类型化数组 +translation_of: Web/JavaScript/Reference/Global_Objects/DataView/getInt8 +--- +<div>{{JSRef}}</div> + +<p><strong><code>getInt8()</code></strong><code>方法</code><code>从</code>{{jsxref("DataView")}}相对于起始位置偏移 n 个字节处开始，获取一个有符号的 8-bit 整数(一个字节)。</p> + +<div>{{EmbedInteractiveExample("pages/js/dataview-getint8.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>dataview</var>.getInt8(byteOffset)</pre> + +<h2 id="参数">参数</h2> + +<dl> + <dt>byteOffset</dt> + <dd>偏移量, 单位为字节, 从起始位置开始计算.</dd> +</dl> + +<h3 id="抛出错误">抛出错误</h3> + +<dl> + <dt>{{jsxref("RangeError")}}</dt> + <dd>如果byteOffset超出了视图能储存的值，就会抛出错误.</dd> +</dl> + +<h2 id="描述">描述</h2> + +<dl> + <dd> 没有对齐约束; 多字节值可以从任何偏移量获取.</dd> +</dl> + +<h2 id="例子">例子</h2> + +<pre class="brush:js">var buffer = new ArrayBuffer(8); +var dataview = new DataView(buffer); +dataview.getInt8(1); // 0 +</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>{{SpecName('Typed Array')}}</td> + <td>{{Spec2('Typed Array')}}</td> + <td>Superseded by ECMAScript 6.</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-dataview.prototype.getint8', 'DataView.prototype.getInt8')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition in an ECMA standard.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-dataview.prototype.getint8', 'DataView.prototype.getInt8')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.DataView.getInt8")}}</p> + +<h2 id="相关内容">相关内容</h2> + +<ul> + <li>{{jsxref("DataView")}}</li> + <li>{{jsxref("ArrayBuffer")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/dataview/getuint16/index.html b/files/zh-cn/web/javascript/reference/global_objects/dataview/getuint16/index.html new file mode 100644 index 0000000000..6ed5b252da --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/dataview/getuint16/index.html @@ -0,0 +1,94 @@ +--- +title: DataView.prototype.getUint16() +slug: Web/JavaScript/Reference/Global_Objects/DataView/getUint16 +tags: + - 类型化 + - 类型化数组 +translation_of: Web/JavaScript/Reference/Global_Objects/DataView/getUint16 +--- +<div>{{JSRef}}</div> + +<p><strong><code>getUint16()</code></strong><code>方法</code><code>从</code><a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/DataView" title="DataView 视图提供了一种用于向 ArrayBuffer 读写数据的底层接口。"><code>DataView</code></a>相对于起始位置偏移 n 个字节处开始，获取一个16-bit数(无符号短整型，2个字节).</p> + +<div>{{EmbedInteractiveExample("pages/js/dataview-getuint16.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>dataview</var>.getUint16(byteOffset [, littleEndian])</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt>byteOffset</dt> + <dd>偏移量, 单位为字节, 从头开始计算.</dd> + <dt>littleEndian</dt> + <dd>{{optional_inline}} Indicates whether the 16-bit int is stored in {{Glossary("Endianness", "little- or big-endian")}} format. If false or undefined, a big-endian value is read.</dd> +</dl> + +<h3 id="返回">返回</h3> + +<dl> + <dd>一个无符号短整型16位数.</dd> +</dl> + +<h3 id="抛出错误">抛出错误</h3> + +<dl> + <dt>{{jsxref("RangeError")}}</dt> + <dd>如果byteOffset超出了视图能储存的值，就会抛出错误.</dd> +</dl> + +<h2 id="描述">描述</h2> + +<dl> + <dd>没有对齐约束; 多字节值可以从任何偏移量获取.</dd> +</dl> + +<h2 id="例子">例子</h2> + +<pre class="brush:js">var buffer = new ArrayBuffer(8); +var dataview = new DataView(buffer); +dataview.getUint16(1); // 0 +</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('Typed Array')}}</td> + <td>{{Spec2('Typed Array')}}</td> + <td>Superseded by ECMAScript 6.</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-dataview.prototype.getuint16', 'DataView.prototype.getUint16')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition in an ECMA standard.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-dataview.prototype.getuint16', 'DataView.prototype.getUint16')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器支持">浏览器支持</h2> + + + +<p>{{Compat("javascript.builtins.DataView.getUint16")}}</p> + +<h2 id="另见">另见</h2> + +<ul> + <li>{{jsxref("DataView")}}</li> + <li>{{jsxref("ArrayBuffer")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/dataview/getuint32/index.html b/files/zh-cn/web/javascript/reference/global_objects/dataview/getuint32/index.html new file mode 100644 index 0000000000..3affb0312a --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/dataview/getuint32/index.html @@ -0,0 +1,91 @@ +--- +title: DataView.prototype.getUint32() +slug: Web/JavaScript/Reference/Global_Objects/DataView/getUint32 +translation_of: Web/JavaScript/Reference/Global_Objects/DataView/getUint32 +--- +<div>{{JSRef}}</div> + +<p><strong><code>getUint32()</code></strong><code>方法</code><code>从</code><a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/DataView" title="DataView 视图提供了一种用于向 ArrayBuffer 读写数据的底层接口。"><code>DataView</code></a>相对于起始位置偏移 n 个字节处开始，获取一个32-bit数(无符号长整型，4个字节).</p> + +<div>{{EmbedInteractiveExample("pages/js/dataview-getuint32.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>dataview</var>.getUint32(byteOffset [, littleEndian])</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt>byteOffset</dt> + <dd>偏移量, 单位为字节, 从头开始计算.</dd> + <dt>littleEndian</dt> + <dd>{{optional_inline}} Indicates whether the 32-bit int is stored in {{Glossary("Endianness", "little- or big-endian")}} format. If false or undefined, a big-endian value is read.</dd> +</dl> + +<h3 id="返回">返回</h3> + +<dl> + <dd>一个无符号长整型32位数.</dd> +</dl> + +<h3 id="抛出错误">抛出错误</h3> + +<dl> + <dt>{{jsxref("RangeError")}}</dt> + <dd>如果byteOffset超出了视图能储存的值，就会抛出错误.</dd> +</dl> + +<h2 id="描述">描述</h2> + +<dl> + <dd>没有对齐约束; 多字节值可以从任何偏移量获取.</dd> +</dl> + +<h2 id="例子">例子</h2> + +<pre class="brush:js">var buffer = new ArrayBuffer(8); +var dataview = new DataView(buffer); +dataview.getUint32(1); // 0 +</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('Typed Array')}}</td> + <td>{{Spec2('Typed Array')}}</td> + <td>Superseded by ECMAScript 6.</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-dataview.prototype.getuint32', 'DataView.prototype.getUint32')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition in an ECMA standard.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-dataview.prototype.getuint32', 'DataView.prototype.getUint32')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器支持">浏览器支持</h2> + + + +<p>{{Compat("javascript.builtins.DataView.getUint32")}}</p> + +<h2 id="另见">另见</h2> + +<ul> + <li>{{jsxref("DataView")}}</li> + <li>{{jsxref("ArrayBuffer")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/dataview/getuint8/index.html b/files/zh-cn/web/javascript/reference/global_objects/dataview/getuint8/index.html new file mode 100644 index 0000000000..4e26ade311 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/dataview/getuint8/index.html @@ -0,0 +1,86 @@ +--- +title: DataView.prototype.getUint8() +slug: Web/JavaScript/Reference/Global_Objects/DataView/getUint8 +tags: + - 类型化 + - 类型化数组 +translation_of: Web/JavaScript/Reference/Global_Objects/DataView/getUint8 +--- +<div>{{JSRef}}</div> + +<p><strong><code>getUint8()</code></strong><code>方法</code><code>从</code>{{jsxref("DataView")}}相对于起始位置偏移 n 个字节处开始，获取一个无符号的8-bit整数(一个字节).</p> + +<div>{{EmbedInteractiveExample("pages/js/dataview-getuint8.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>dataview</var>.getUint8(byteOffset)</pre> + +<h2 id="参数">参数</h2> + +<dl> + <dt>byteOffset</dt> + <dd>偏移量, 单位为字节, 从头开始计算.</dd> +</dl> + +<h3 id="抛出错误">抛出错误</h3> + +<dl> + <dt>{{jsxref("RangeError")}}</dt> + <dd>如果byteOffset超出了视图能储存的值，就会抛出错误.</dd> +</dl> + +<h2 id="描述">描述</h2> + +<dl> + <dd> 没有对齐约束; 多字节值可以从任何偏移量获取.</dd> +</dl> + +<h2 id="例子">例子</h2> + +<pre class="brush:js">var buffer = new ArrayBuffer(8); +var dataview = new DataView(buffer); +dataview.getUint8(1); // 0 +</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>{{SpecName('Typed Array')}}</td> + <td>{{Spec2('Typed Array')}}</td> + <td>Superseded by ECMAScript 6.</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-dataview.prototype.getuint8', 'DataView.prototype.getUint8')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition in an ECMA standard.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-dataview.prototype.getuint8', 'DataView.prototype.getUint8')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.DataView.getUint8")}}</p> + +<h2 id="相关内容">相关内容</h2> + +<ul> + <li>{{jsxref("DataView")}}</li> + <li>{{jsxref("ArrayBuffer")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/dataview/index.html b/files/zh-cn/web/javascript/reference/global_objects/dataview/index.html new file mode 100644 index 0000000000..7bd1755475 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/dataview/index.html @@ -0,0 +1,166 @@ +--- +title: DataView +slug: Web/JavaScript/Reference/Global_Objects/DataView +tags: + - DataView + - JavaScript + - TypedArrays + - 构造器 +translation_of: Web/JavaScript/Reference/Global_Objects/DataView +--- +<div>{{JSRef}}</div> + +<p><strong><code>DataView</code></strong> 视图是一个可以从 二进制{{jsxref("ArrayBuffer")}} 对象中读写多种数值类型的底层接口，使用它时，不用考虑不同平台的<a href="/zh-CN/docs/Glossary/Endianness">字节序</a>问题。</p> + +<div>{{EmbedInteractiveExample("pages/js/dataview-constructor.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">new DataView(<var>buffer</var> [, <var>byteOffset</var> [, <var>byteLength</var>]])</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code><var>buffer</var></code></dt> + <dd>一个 已经存在的{{jsxref("ArrayBuffer")}} 或 {{jsxref("SharedArrayBuffer")}} {{experimental_inline}} 对象，<code>DataView</code> 对象的数据源。</dd> + <dt><code><var>byteOffset</var></code> {{optional_inline}}</dt> + <dd>此 <code>DataView</code> 对象的第一个字节在 buffer 中的字节偏移。如果未指定，则默认从第一个字节开始。</dd> + <dt><code><var>byteLength</var></code> {{optional_inline}}</dt> + <dd>此 DataView 对象的字节长度。如果未指定，这个视图的长度将匹配buffer的长度。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>一个表示指定数据缓存区的新<code>DataView</code> 对象。（这句话也许不是非常有助于说明清楚）</p> + +<p>你可以把返回的对象想象成一个二进制字节缓存区 array buffer 的“解释器”——它知道如何在读取或写入时正确地转换字节码。这意味着它能在二进制层面处理整数与浮点转化、字节顺序等其他有关的细节问题。</p> + +<h3 id="异常">异常</h3> + +<dl> + <dt><code>{{jsxref("RangeError")}}</code></dt> + <dd>如果 <code>byteOffset</code> 或者 <code>byteLength </code>参数的值导致视图超出了 buffer 的结束位置就会抛出此异常。<br> + 例如，假设 buffer （缓冲对象）是 16 字节长度，<code>byteOffset</code> 参数为 8，<code>byteLength</code> 参数为 10，这个错误就会抛出，这是因为结果视图试图超出 buffer 对象的总长度 2 个字节。</dd> +</dl> + +<h2 id="描述">描述</h2> + +<h3 id="Endianness（字节序）">Endianness（字节序）</h3> + +<p>需要多个字节来表示的数值，在存储时其字节在内存中的相对顺序依据平台架构的不同而不同，参照 {{Glossary("Endianness")}}。而使用 DataView 的访问函数时，不需要考虑平台架构中所使用的是哪种字节序。</p> + +<pre class="brush: js">var littleEndian = (function() { + var buffer = new ArrayBuffer(2); + new DataView(buffer).setInt16(0, 256, true /* 设置值时，使用小端字节序 */); + // Int16Array 使用系统字节序（由此可以判断系统字节序是否为小端字节序） + return new Int16Array(buffer)[0] === 256; +})(); +console.log(littleEndian); // 返回 true 或 false +</pre> + +<h3 id="64_位整数值">64 位整数值</h3> + +<p>因为 JavaScript 目前不包含对 64 位整数值支持的标准，所以 <code>DataView</code> 不提供原生的 64 位操作。作为变通，您可以实现自己的 <code>getUint64()</code> 函数，以获得精度高达 {{jsxref("Number.MAX_SAFE_INTEGER")}} 的值，可以满足某些特定情况的需求。</p> + +<pre class="brush: js">function getUint64(dataview, byteOffset, littleEndian) { + // 将 64 位整数值分成两份 32 位整数值 + const left = dataview.getUint32(byteOffset, littleEndian); + const right = dataview.getUint32(byteOffset+4, littleEndian); + + // 合并两个 32 位整数值 + const combined = littleEndian? left + 2**32*right : 2**32*left + right; + + if (!Number.isSafeInteger(combined)) + console.warn(combined, 'exceeds MAX_SAFE_INTEGER. Precision may be lost'); + + return combined; +} +</pre> + +<p>或者，如果需要填满 64 位，可以创建一个 {{jsxref("BigInt")}}。此外，尽管原生 BigInt 要比用户端的库中模拟的 BigInt 快得多，但在 JavaScript 中，BigInt 总是比 32 位整数慢得多，这是因为 BigInt 的大小是可变的。</p> + +<pre class="brush: js">const BigInt = window.BigInt, bigThirtyTwo = BigInt(32), bigZero = BigInt(0); +function getUint64BigInt(dataview, byteOffset, littleEndian) { + // 将 64 位整数值分成两份 32 位整数值 + const left = BigInt(dataview.getUint32(byteOffset|0, !!littleEndian)>>>0); + const right = BigInt(dataview.getUint32((byteOffset|0) + 4|0, !!littleEndian)>>>0); + + // 合并两个 32 位整数值并返回 + return littleEndian ? (right<<bigThirtyTwo)|left : (left<<bigThirtyTwo)|right; +}</pre> + +<h2 id="属性">属性</h2> + +<p>所有 <code>DataView</code> 实例都继承自 {{jsxref("DataView.prototype")}}，并且允许向 DataView 对象中添加额外属性。</p> + +<div>{{page('zh-CN/Web/JavaScript/Reference/Global_Objects/DataView/prototype', '属性')}}</div> + +<h2 id="方法">方法</h2> + +<div>{{page('zh-CN/Web/JavaScript/Reference/Global_Objects/DataView/prototype', '方法')}}</div> + +<h2 id="示例">示例</h2> + +<pre class="brush: js">var buffer = new ArrayBuffer(16); +var view = new DataView(buffer, 0); + +view.setInt16(1, 42); +view.getInt16(1); // 42 +</pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">规范名称</th> + <th scope="col">状态</th> + <th scope="col">注释</th> + </tr> + </thead> + <tbody> + <tr> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-dataview-constructor', 'DataView')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-dataview-constructor', 'DataView')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>ECMA 标准中的初始版本</td> + </tr> + <tr> + <td>{{SpecName('Typed Array')}}</td> + <td>{{Spec2('Typed Array')}}</td> + <td>Superseded by ECMAScript 6</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.DataView")}}</p> + +<h2 id="兼容性提示">兼容性提示</h2> + +<p>从 FireFox 40 开始，DataView 对象需要通过 {{jsxref("Operators/new", "new")}} 操作符来构造。如果不使用 <code>new</code> 而是直接将 <code>DataView()</code> 作为函数调用的话，会抛出 {{jsxref("TypeError")}} 异常。</p> + +<pre class="brush: js example-bad">var dv = DataView(buffer, 0); +// 抛出异常，错误信息翻译为：禁止在不用 new 的情况下直接调用 DataView 的构造函数。 +// TypeError: calling a builtin DataView constructor without new is forbidden</pre> + +<pre class="brush: js example-good">var dv = new DataView(buffer, 0);</pre> + +<h2 id="请参阅">请参阅</h2> + +<ul> + <li><a class="link-https" href="https://github.com/jDataView/jDataView">jDataView</a>：DataView 的垫片（polyfill）库，使其能够用于所有浏览器及 Node.js 环境。同时，该库还对 DataView 进行了一些扩展。</li> + <li>{{jsxref("ArrayBuffer")}}</li> + <li>{{jsxref("SharedArrayBuffer")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/dataview/prototype/index.html b/files/zh-cn/web/javascript/reference/global_objects/dataview/prototype/index.html new file mode 100644 index 0000000000..84488ad734 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/dataview/prototype/index.html @@ -0,0 +1,102 @@ +--- +title: DataView.prototype +slug: Web/JavaScript/Reference/Global_Objects/DataView/prototype +tags: + - DataView属性 +translation_of: Web/JavaScript/Reference/Global_Objects/DataView +--- +<div>{{JSRef}}</div> + +<p><code><strong>DataView</strong></code><strong><code>.prototype</code></strong> 表示{{jsxref("DataView")}}的原型</p> + +<div>{{js_property_attributes(0,0,0)}}</div> + +<h2 id="描述">描述</h2> + +<p><code>DataView</code> 的实例从<font face="Consolas, Liberation Mono, Courier, monospace">DataView.prototype</font>继承。就像所有的构造器，你可以修改原型来改变生成的<code>DataView</code>实例。</p> + +<h2 id="属性">属性</h2> + +<dl> + <dt>{{jsxref("DataView.prototype.constructor")}}</dt> + <dd>指定用来生成原型的构造函数.初始化值是标准内置DataView构造器.</dd> + <dt>{{jsxref("DataView.prototype.buffer")}} {{readonlyInline}}</dt> + <dd>被视图引入的{{jsxref("ArrayBuffer")}}.创建实例的时候已固化因此是只读的.</dd> + <dt>{{jsxref("DataView.prototype.byteLength")}} {{readonlyInline}}</dt> + <dd>从 {{jsxref("ArrayBuffer")}}中读取的字节长度. 创建实例的时候已固化因此是只读的.</dd> + <dt>{{jsxref("DataView.prototype.byteOffset")}} {{readonlyInline}}</dt> + <dd>从 {{jsxref("ArrayBuffer")}}读取时的偏移字节长度. 创建实例的时候已固化因此是只读的.</dd> +</dl> + +<h2 id="方法">方法</h2> + +<h3 id="读">读</h3> + +<dl> + <dt>{{jsxref("DataView.prototype.getInt8()")}}</dt> + <dd><code>从</code>{{jsxref("DataView")}}起始位置以byte为计数的指定偏移量(byteOffset)处获取一个8-bit数(一个字节).</dd> + <dt>{{jsxref("DataView.prototype.getUint8()")}}</dt> + <dd><code>从</code>{{jsxref("DataView")}}起始位置以byte为计数的指定偏移量(byteOffset)处获取一个8-bit数(无符号字节).</dd> + <dt>{{jsxref("DataView.prototype.getInt16()")}}</dt> + <dd><code>从</code>{{jsxref("DataView")}}起始位置以byte为计数的指定偏移量(byteOffset)处获取一个16-bit数(短整型).</dd> + <dt>{{jsxref("DataView.prototype.getUint16()")}}</dt> + <dd><code>从</code>{{jsxref("DataView")}}起始位置以byte为计数的指定偏移量(byteOffset)处获取一个16-bit数(无符号短整型).</dd> + <dt>{{jsxref("DataView.prototype.getInt32()")}}</dt> + <dd><code>从</code>{{jsxref("DataView")}}起始位置以byte为计数的指定偏移量(byteOffset)处获取一个32-bit数(长整型).</dd> + <dt>{{jsxref("DataView.prototype.getUint32()")}}</dt> + <dd><code>从</code>{{jsxref("DataView")}}起始位置以byte为计数的指定偏移量(byteOffset)处获取一个32-bit数(无符号长整型).</dd> + <dt>{{jsxref("DataView.prototype.getFloat32()")}}</dt> + <dd><code>从</code>{{jsxref("DataView")}}起始位置以byte为计数的指定偏移量(byteOffset)处获取一个32-bit数(浮点型).</dd> + <dt>{{jsxref("DataView.prototype.getFloat64()")}}</dt> + <dd><code>从</code>{{jsxref("DataView")}}起始位置以byte为计数的指定偏移量(byteOffset)处获取一个64-bit数(双精度浮点型).</dd> +</dl> + +<h3 id="写">写</h3> + +<dl> + <dt>{{jsxref("DataView.prototype.setInt8()")}}</dt> + <dd><code>从</code>{{jsxref("DataView")}}起始位置以byte为计数的指定偏移量(byteOffset)处储存一个8-bit数(一个字节).</dd> + <dt>{{jsxref("DataView.prototype.setUint8()")}}</dt> + <dd><code>从</code>{{jsxref("DataView")}}起始位置以byte为计数的指定偏移量(byteOffset)处储存一个8-bit数(无符号字节).</dd> + <dt>{{jsxref("DataView.prototype.setInt16()")}}</dt> + <dd><code>从</code>{{jsxref("DataView")}}起始位置以byte为计数的指定偏移量(byteOffset)处储存一个16-bit数(短整型).</dd> + <dt>{{jsxref("DataView.prototype.setUint16()")}}</dt> + <dd><code>从</code>{{jsxref("DataView")}}起始位置以byte为计数的指定偏移量(byteOffset)处储存一个16-bit数(无符号短整型).</dd> + <dt>{{jsxref("DataView.prototype.setInt32()")}}</dt> + <dd><code>从</code>{{jsxref("DataView")}}起始位置以byte为计数的指定偏移量(byteOffset)处储存一个32-bit数(长整型).</dd> + <dt>{{jsxref("DataView.prototype.setUint32()")}}</dt> + <dd><code>从</code>{{jsxref("DataView")}}起始位置以byte为计数的指定偏移量(byteOffset)处储存一个32-bit数(无符号长整型).</dd> + <dt>{{jsxref("DataView.prototype.setFloat32()")}}</dt> + <dd><code>从</code>{{jsxref("DataView")}}起始位置以byte为计数的指定偏移量(byteOffset)处储存一个32-bit数(浮点型).</dd> + <dt>{{jsxref("DataView.prototype.setFloat64()")}}</dt> + <dd><code>从</code>{{jsxref("DataView")}}起始位置以byte为计数的指定偏移量(byteOffset)处储存一个64-bit数(双精度浮点型).</dd> +</dl> + +<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('ES6', '#sec-dataview.prototype', 'DataView.prototype')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器支持">浏览器支持</h2> + + + +<p>{{Compat("javascript.builtins.DataView.prototype")}}</p> + +<h2 id="另见">另见</h2> + +<ul> + <li>{{jsxref("DataView")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/dataview/setbigint64/index.html b/files/zh-cn/web/javascript/reference/global_objects/dataview/setbigint64/index.html new file mode 100644 index 0000000000..5e9b6596d4 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/dataview/setbigint64/index.html @@ -0,0 +1,84 @@ +--- +title: DataView.prototype.setBigInt64() +slug: Web/JavaScript/Reference/Global_Objects/DataView/setBigInt64 +tags: + - BigInt + - DataView + - setBigInt64 +translation_of: Web/JavaScript/Reference/Global_Objects/DataView/setBigInt64 +--- +<div>{{JSRef}}</div> + +<p><strong><code>setBigInt64()</code></strong>方法在距{{jsxref("DataView")}} 的起始位置的指定字节偏移处存储一个带符号的64位整数（long long类型）值。</p> + +<div>{{EmbedInteractiveExample("pages/js/dataview-setbigint64.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>dataview</var>.setBigInt64(byteOffset, value [, littleEndian])</pre> + +<h3 id="参数说明">参数说明</h3> + +<dl> + <dt>byteOffset</dt> + <dd>字节偏移量，为从视图的起始位置到数据存储位置的字节字节偏移量。</dd> + <dt></dt> + <dt>value</dt> + <dd><span class="blob-code-inner blob-code-marker">作为一个</span>{{jsxref("BigInt")}}类型设置的数值。满足一个带符号的64位整数的最大可能数值是 <code><span class="blob-code-inner blob-code-marker">2n ** (64n -1n) - 1n</span></code><span class="blob-code-inner blob-code-marker"> (<code>9223372036854775807n</code>)。当发生溢出时，将会变成负数(</span><code>-9223372036854775808n</code><span class="blob-code-inner blob-code-marker">)。</span></dd> + <dt>littleEndian</dt> + <dd>{{optional_inline}} 为可选参数，表示这个64位整数是否以{{Glossary("Endianness", "little-endian 或者big-endian")}}格式存储。如果设置为<code>false</code> 或者未指定（<code>undefined</code>），将会写入一个big-endian（大端模式：高位字节排放在内存的低地址端，低位字节排放在内存的高地址端）格式的数值。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>{{jsxref("undefined")}}.</p> + +<h3 id="抛出的错误">抛出的错误</h3> + +<dl> + <dt>{{jsxref("RangeError")}}</dt> + <dd>如果 <code>byteOffset</code>设置导致存储该数值时超出了视图的末尾位置，将会抛出错误。</dd> +</dl> + +<h2 id="例子">例子</h2> + +<h3 id="使用_setBigInt64_方法">使用 <code>setBigInt64</code> 方法</h3> + +<pre class="brush:js">var buffer = new ArrayBuffer(8); +var dataview = new DataView(buffer); +dataview.setBigInt64(0, 3n); +dataview.getBigInt64(0); // 3n +</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>{{SpecName('ESDraft', '#sec-dataview.prototype.setbigint64', 'DataView.prototype.setBigInt64()')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.DataView.setBigInt64")}}</p> + +<h2 id="请参阅">请参阅</h2> + +<ul> + <li>{{jsxref("DataView")}}</li> + <li>{{jsxref("ArrayBuffer")}}</li> + <li>{{jsxref("BigInt")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/dataview/setbiguint64/index.html b/files/zh-cn/web/javascript/reference/global_objects/dataview/setbiguint64/index.html new file mode 100644 index 0000000000..bd2bfef8f4 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/dataview/setbiguint64/index.html @@ -0,0 +1,83 @@ +--- +title: DataView.prototype.setBigUint64() +slug: Web/JavaScript/Reference/Global_Objects/DataView/setBigUint64 +tags: + - BigInt + - DataView + - setBigUint64 +translation_of: Web/JavaScript/Reference/Global_Objects/DataView/setBigUint64 +--- +<div>{{JSRef}}</div> + +<p><strong><code>setBigUint64()</code> </strong>方法在距DataView 的起始位置的指定字节偏移处存储一个无符号的64位整数（unsigned long long类型）值。</p> + +<div>{{EmbedInteractiveExample("pages/js/dataview-setbiguint64.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>dataview</var>.setBigUint64(byteOffset, value [, littleEndian])</pre> + +<h3 id="参数说明">参数说明</h3> + +<dl> + <dt>byteOffset</dt> + <dd>字节偏移量，为从视图的起始位置到数据存储位置的字节字节偏移量。</dd> + <dt>value</dt> + <dd>作为一个BigInt类型设置的数值。满足一个无符号的64位整数的最大可能数值是 <code><span class="blob-code-inner blob-code-marker">2n ** 64n - 1n</span></code><span class="blob-code-inner blob-code-marker"> (</span><code>18446744073709551615n</code><span class="blob-code-inner blob-code-marker">)</span>。当发生溢出时，将会变成0。</dd> + <dt>littleEndian</dt> + <dd>为可选参数，表示这个64位整数是否以little-endian 或者big-endian格式存储。如果设置为false 或者未指定（undefined），将会写入一个big-endian（大端模式：高位字节排放在内存的低地址端，低位字节排放在内存的高地址端）格式的数值。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>{{jsxref("undefined")}}.</p> + +<h3 id="抛出的错误">抛出的错误</h3> + +<dl> + <dt>{{jsxref("RangeError")}}</dt> + <dd>如果 byteOffset设置导致存储该数值时超出了视图的末尾位置，将会抛出错误。</dd> +</dl> + +<h2 id="例子">例子</h2> + +<h3 id="使用_setBigUint64_方法">使用 <code>setBigUint64</code> 方法</h3> + +<pre class="brush:js">var buffer = new ArrayBuffer(8); +var dataview = new DataView(buffer); +dataview.setBigUint64(0, 3n); +dataview.getBigUint64(0); // 3n +</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>{{SpecName('ESDraft', '#sec-dataview.prototype.setbiguint64', 'DataView.prototype.setBigUint64()')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.DataView.setBigUint64")}}</p> + +<h2 id="请参阅">请参阅</h2> + +<ul> + <li>{{jsxref("DataView")}}</li> + <li>{{jsxref("ArrayBuffer")}}</li> + <li>{{jsxref("BigInt")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/dataview/setfloat32/index.html b/files/zh-cn/web/javascript/reference/global_objects/dataview/setfloat32/index.html new file mode 100644 index 0000000000..418718aef2 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/dataview/setfloat32/index.html @@ -0,0 +1,86 @@ +--- +title: DataView.prototype.setFloat32() +slug: Web/JavaScript/Reference/Global_Objects/DataView/setFloat32 +translation_of: Web/JavaScript/Reference/Global_Objects/DataView/setFloat32 +--- +<div>{{JSRef}}</div> + +<p><strong><code>setFloat32()</code></strong><code>从</code><a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/DataView" title="DataView 视图提供了一种用于向 ArrayBuffer 读写数据的底层接口。"><code>DataView</code></a>起始位置以byte为计数的指定偏移量(byteOffset)处储存一个32-bit数(浮点型).</p> + +<p>{{EmbedInteractiveExample("pages/js/dataview-setfloat32.html")}}</p> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>dataview</var>.setFloat32(byteOffset, value [, littleEndian])</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt>byteOffset</dt> + <dd>偏移量,从头开始计算,单位为字节.</dd> + <dt>value</dt> + <dd>设置的数值.</dd> + <dt>littleEndian</dt> + <dd>{{optional_inline}} Indicates whether the 32-bit float is stored in {{Glossary("Endianness", "little- or big-endian")}} format. If false or undefined, a big-endian value is written.</dd> +</dl> + +<h3 id="返回">返回</h3> + +<p>{{jsxref("undefined")}}.</p> + +<h3 id="抛出错误">抛出错误</h3> + +<dl> + <dt>{{jsxref("RangeError")}}</dt> + <dd>如果byteOffset超出了视图能储存的值,就会抛出错误.</dd> +</dl> + +<h2 id="例子">例子</h2> + +<pre class="brush:js">var buffer = new ArrayBuffer(8); +var dataview = new DataView(buffer); +dataview.setFloat32(1, 3); +dataview.getFloat32(1); // 3 +</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('Typed Array')}}</td> + <td>{{Spec2('Typed Array')}}</td> + <td>Superseded by ECMAScript 6.</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-dataview.prototype.setfloat32', 'DataView.prototype.setFloat32')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition in an ECMA standard.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-dataview.prototype.setfloat32', 'DataView.prototype.setFloat32')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器支持">浏览器支持</h2> + + + +<p>{{Compat("javascript.builtins.DataView.setFloat32")}}</p> + +<h2 id="相关内容">相关内容</h2> + +<ul> + <li>{{jsxref("DataView")}}</li> + <li>{{jsxref("ArrayBuffer")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/dataview/setfloat64/index.html b/files/zh-cn/web/javascript/reference/global_objects/dataview/setfloat64/index.html new file mode 100644 index 0000000000..1f46fddbf0 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/dataview/setfloat64/index.html @@ -0,0 +1,86 @@ +--- +title: DataView.prototype.setFloat64() +slug: Web/JavaScript/Reference/Global_Objects/DataView/setFloat64 +translation_of: Web/JavaScript/Reference/Global_Objects/DataView/setFloat64 +--- +<div>{{JSRef}}</div> + +<p><strong><code>setFloat64()</code></strong><code>从</code><a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/DataView" title="DataView 视图提供了一种用于向 ArrayBuffer 读写数据的底层接口。"><code>DataView</code></a>起始位置以byte为计数的指定偏移量(byteOffset)处储存一个64-bit数(双精度浮点型).</p> + +<div>{{EmbedInteractiveExample("pages/js/dataview-setfloat64.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>dataview</var>.setFloat64(byteOffset, value [, littleEndian])</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt>byteOffset</dt> + <dd>偏移量,从头开始计算,单位为字节.</dd> + <dt>value</dt> + <dd>设置的数值.</dd> + <dt>littleEndian</dt> + <dd>{{optional_inline}} Indicates whether the 64-bit float is stored in {{Glossary("Endianness", "little- or big-endian")}} format. If false or undefined, a big-endian value is written.</dd> +</dl> + +<h3 id="返回">返回</h3> + +<p>{{jsxref("undefined")}}.</p> + +<h3 id="抛出错误">抛出错误</h3> + +<dl> + <dt>{{jsxref("RangeError")}}</dt> + <dd>如果byteOffset超出了视图能储存的值,就会抛出错误.</dd> +</dl> + +<h2 id="例子">例子</h2> + +<pre class="brush:js">var buffer = new ArrayBuffer(8); +var dataview = new DataView(buffer); +dataview.setFloat64(0, 3); +dataview.getFloat64(0); // 3 +</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('Typed Array')}}</td> + <td>{{Spec2('Typed Array')}}</td> + <td>Superseded by ECMAScript 6.</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-dataview.prototype.setfloat64', 'DataView.prototype.setFloat64')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition in an ECMA standard.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-dataview.prototype.setfloat64', 'DataView.prototype.setFloat64')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器支持">浏览器支持</h2> + + + +<p>{{Compat("javascript.builtins.DataView.setFloat64")}}</p> + +<h2 id="相关内容">相关内容</h2> + +<ul> + <li>{{jsxref("DataView")}}</li> + <li>{{jsxref("ArrayBuffer")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/dataview/setint16/index.html b/files/zh-cn/web/javascript/reference/global_objects/dataview/setint16/index.html new file mode 100644 index 0000000000..92d8deb975 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/dataview/setint16/index.html @@ -0,0 +1,86 @@ +--- +title: DataView.prototype.setInt16() +slug: Web/JavaScript/Reference/Global_Objects/DataView/setInt16 +translation_of: Web/JavaScript/Reference/Global_Objects/DataView/setInt16 +--- +<div>{{JSRef}}</div> + +<p><strong><code>setInt16()</code></strong><code>从</code><a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/DataView" title="DataView 视图提供了一种用于向 ArrayBuffer 读写数据的底层接口。"><code>DataView</code></a>起始位置以byte为计数的指定偏移量(byteOffset)处储存一个16-bit数(短整型).</p> + +<div>{{EmbedInteractiveExample("pages/js/dataview-setint16.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>dataview</var>.setInt16(byteOffset, value [, littleEndian])</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt>byteOffset</dt> + <dd>偏移量,从头开始计算,单位为字节.</dd> + <dt>value</dt> + <dd>设置的数值.</dd> + <dt>littleEndian</dt> + <dd>{{optional_inline}} Indicates whether the 16-bit int is stored in {{Glossary("Endianness", "little- or big-endian")}} format. If false or undefined, a big-endian value is written.</dd> +</dl> + +<h3 id="返回">返回</h3> + +<p>{{jsxref("undefined")}}.</p> + +<h3 id="抛出错误">抛出错误</h3> + +<dl> + <dt>{{jsxref("RangeError")}}</dt> + <dd>如果byteOffset超出了视图能储存的值,就会抛出错误.</dd> +</dl> + +<h2 id="例子">例子</h2> + +<pre class="brush:js">var buffer = new ArrayBuffer(8); +var dataview = new DataView(buffer); +dataview.setInt16(1, 3); +dataview.getInt16(1); // 3 +</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('Typed Array')}}</td> + <td>{{Spec2('Typed Array')}}</td> + <td>Superseded by ECMAScript 6.</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-dataview.prototype.setint16', 'DataView.prototype.setInt16')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition in an ECMA standard.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-dataview.prototype.setint16', 'DataView.prototype.setInt16')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器支持">浏览器支持</h2> + + + +<p>{{Compat("javascript.builtins.DataView.setInt16")}}</p> + +<h2 id="相关内容">相关内容</h2> + +<ul> + <li>{{jsxref("DataView")}}</li> + <li>{{jsxref("ArrayBuffer")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/dataview/setint32/index.html b/files/zh-cn/web/javascript/reference/global_objects/dataview/setint32/index.html new file mode 100644 index 0000000000..0bbd9d2b7f --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/dataview/setint32/index.html @@ -0,0 +1,86 @@ +--- +title: DataView.prototype.setInt32() +slug: Web/JavaScript/Reference/Global_Objects/DataView/setInt32 +translation_of: Web/JavaScript/Reference/Global_Objects/DataView/setInt32 +--- +<div>{{JSRef}}</div> + +<p><strong><code>setInt32()</code></strong><code>从</code><a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/DataView" title="DataView 视图提供了一种用于向 ArrayBuffer 读写数据的底层接口。"><code>DataView</code></a>起始位置以byte为计数的指定偏移量(byteOffset)处储存一个32-bit数(长整型).</p> + +<div>{{EmbedInteractiveExample("pages/js/dataview-setint32.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>dataview</var>.setInt32(byteOffset, value [, littleEndian])</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt>byteOffset</dt> + <dd>偏移量,从头开始计算,单位为字节.</dd> + <dt>value</dt> + <dd>设置的数值.</dd> + <dt>littleEndian</dt> + <dd>{{optional_inline}} Indicates whether the 32-bit int is stored in {{Glossary("Endianness", "little- or big-endian")}} format. If false or undefined, a big-endian value is written.</dd> +</dl> + +<h3 id="返回">返回</h3> + +<p>{{jsxref("undefined")}}.</p> + +<h3 id="抛出错误">抛出错误</h3> + +<dl> + <dt>{{jsxref("RangeError")}}</dt> + <dd>如果byteOffset超出了视图能储存的值,就会抛出错误.</dd> +</dl> + +<h2 id="例子">例子</h2> + +<pre class="brush:js">var buffer = new ArrayBuffer(8); +var dataview = new DataView(buffer); +dataview.setInt32(1, 3); +dataview.getInt32(1); // 3 +</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('Typed Array')}}</td> + <td>{{Spec2('Typed Array')}}</td> + <td>Superseded by ECMAScript 6.</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-dataview.prototype.setint32', 'DataView.prototype.setInt32')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition in an ECMA standard.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-dataview.prototype.setint32', 'DataView.prototype.setInt32')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器支持">浏览器支持</h2> + + + +<p>{{Compat("javascript.builtins.DataView.setInt32")}}</p> + +<h2 id="相关">相关</h2> + +<ul> + <li>{{jsxref("DataView")}}</li> + <li>{{jsxref("ArrayBuffer")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/dataview/setint8/index.html b/files/zh-cn/web/javascript/reference/global_objects/dataview/setint8/index.html new file mode 100644 index 0000000000..dc7c7b30e4 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/dataview/setint8/index.html @@ -0,0 +1,80 @@ +--- +title: DataView.prototype.setInt8() +slug: Web/JavaScript/Reference/Global_Objects/DataView/setInt8 +translation_of: Web/JavaScript/Reference/Global_Objects/DataView/setInt8 +--- +<div>{{JSRef}}</div> + +<p><strong><code>setInt8()</code></strong><code>从</code><a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/DataView" title="DataView 视图提供了一种用于向 ArrayBuffer 读写数据的底层接口。"><code>DataView</code></a>起始位置以byte为计数的指定偏移量(byteOffset)处储存一个8-bit数(一个字节).</p> + +<div>{{EmbedInteractiveExample("pages/js/dataview-setint8.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>dataview</var>.setInt8(byteOffset, value)</pre> + +<h2 id="参数">参数</h2> + +<dl> + <dt>byteOffset</dt> + <dd>偏移量，从头开始计算，单位为字节</dd> + <dt>value</dt> + <dd>设置的整数值</dd> + <dt> + <h3 id="返回">返回</h3> + + <p>{{jsxref("undefined")}}.</p> + </dt> +</dl> + +<h3 id="抛出的错误">抛出的错误</h3> + +<dl> + <dt>{{jsxref("RangeError")}}</dt> + <dd>如果byteOffset超出了视图能储存的值，就会抛出错误</dd> +</dl> + +<h2 id="例子">例子</h2> + +<pre class="brush:js">var buffer = new ArrayBuffer(8); +var dataview = new DataView(buffer); +dataview.setInt8(1, 3); +dataview.getInt8(1); // 3 +</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('Typed Array')}}</td> + <td>{{Spec2('Typed Array')}}</td> + <td>Superseded by ECMAScript 6.</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-dataview.prototype.setint8', 'DataView.prototype.setInt8')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition in an ECMA standard.</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.DataView.setInt8")}}</p> + +<h2 id="相关内容">相关内容</h2> + +<ul> + <li>{{jsxref("DataView")}}</li> + <li>{{jsxref("ArrayBuffer")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/dataview/setuint16/index.html b/files/zh-cn/web/javascript/reference/global_objects/dataview/setuint16/index.html new file mode 100644 index 0000000000..4bcfd257e3 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/dataview/setuint16/index.html @@ -0,0 +1,86 @@ +--- +title: DataView.prototype.setUint16() +slug: Web/JavaScript/Reference/Global_Objects/DataView/setUint16 +translation_of: Web/JavaScript/Reference/Global_Objects/DataView/setUint16 +--- +<div>{{JSRef}}</div> + +<p><strong><code>setUint16()</code></strong><code>从</code><a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/DataView" title="DataView 视图提供了一种用于向 ArrayBuffer 读写数据的底层接口。"><code>DataView</code></a>起始位置以byte为计数的指定偏移量(byteOffset)处储存一个16-bit数(无符号短整型).</p> + +<div>{{EmbedInteractiveExample("pages/js/dataview-setuint16.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>dataview</var>.setUint16(byteOffset, value [, littleEndian])</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt>byteOffset</dt> + <dd>偏移量,从头开始计算,单位为字节.</dd> + <dt>value</dt> + <dd>设置的数值.</dd> + <dt>littleEndian</dt> + <dd>{{optional_inline}} Indicates whether the 16-bit int is stored in {{Glossary("Endianness", "little- or big-endian")}} format. If false or undefined, a big-endian value is written.</dd> +</dl> + +<h3 id="返回">返回</h3> + +<p>{{jsxref("undefined")}}.</p> + +<h3 id="抛出错误">抛出错误</h3> + +<dl> + <dt>{{jsxref("RangeError")}}</dt> + <dd>如果byteOffset超出了视图能储存的值,就会抛出错误.</dd> +</dl> + +<h2 id="例子">例子</h2> + +<pre class="brush:js">var buffer = new ArrayBuffer(8); +var dataview = new DataView(buffer); +dataview.setUint16(1, 3); +dataview.getUint16(1); // 3 +</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('Typed Array')}}</td> + <td>{{Spec2('Typed Array')}}</td> + <td>Superseded by ECMAScript 6.</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-dataview.prototype.setuint16', 'DataView.prototype.setUint16')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition in an ECMA standard.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-dataview.prototype.setuint16', 'DataView.prototype.setUint16')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器支持">浏览器支持</h2> + + + +<p>{{Compat("javascript.builtins.DataView.setUint16")}}</p> + +<h2 id="相关内容">相关内容</h2> + +<ul> + <li>{{jsxref("DataView")}}</li> + <li>{{jsxref("ArrayBuffer")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/dataview/setuint32/index.html b/files/zh-cn/web/javascript/reference/global_objects/dataview/setuint32/index.html new file mode 100644 index 0000000000..73857cb03c --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/dataview/setuint32/index.html @@ -0,0 +1,86 @@ +--- +title: DataView.prototype.setUint32() +slug: Web/JavaScript/Reference/Global_Objects/DataView/setUint32 +translation_of: Web/JavaScript/Reference/Global_Objects/DataView/setUint32 +--- +<div>{{JSRef}}</div> + +<p><strong><code>setUint32()</code></strong><code>从</code><a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/DataView" title="DataView 视图提供了一种用于向 ArrayBuffer 读写数据的底层接口。"><code>DataView</code></a>起始位置以byte为计数的指定偏移量(byteOffset)处储存一个32-bit数(无符号长整型).</p> + +<div>{{EmbedInteractiveExample("pages/js/dataview-setuint32.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>dataview</var>.setUint32(byteOffset, value [, littleEndian])</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt>byteOffset</dt> + <dd>偏移量,从头开始计算,单位为字节.</dd> + <dt>value</dt> + <dd>设置的数值.</dd> + <dt>littleEndian</dt> + <dd>{{optional_inline}} Indicates whether the 32-bit int is stored in {{Glossary("Endianness", "little- or big-endian")}} format. If false or undefined, a big-endian value is written.</dd> +</dl> + +<h3 id="返回">返回</h3> + +<p>{{jsxref("undefined")}}.</p> + +<h3 id="抛出错误">抛出错误</h3> + +<dl> + <dt>{{jsxref("RangeError")}}</dt> + <dd>如果byteOffset超出了视图能储存的值,就会抛出错误.</dd> +</dl> + +<h2 id="例子">例子</h2> + +<pre class="brush:js">var buffer = new ArrayBuffer(8); +var dataview = new DataView(buffer); +dataview.setUint32(1, 3); +dataview.getUint32(1); // 3 +</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('Typed Array')}}</td> + <td>{{Spec2('Typed Array')}}</td> + <td>Superseded by ECMAScript 6.</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-dataview.prototype.setuint32', 'DataView.prototype.setUint32')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition in an ECMA standard.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-dataview.prototype.setuint32', 'DataView.prototype.setUint32')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器支持">浏览器支持</h2> + + + +<p>{{Compat("javascript.builtins.DataView.setUint32")}}</p> + +<h2 id="相关内容">相关内容</h2> + +<ul> + <li>{{jsxref("DataView")}}</li> + <li>{{jsxref("ArrayBuffer")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/dataview/setuint8/index.html b/files/zh-cn/web/javascript/reference/global_objects/dataview/setuint8/index.html new file mode 100644 index 0000000000..895ad521f4 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/dataview/setuint8/index.html @@ -0,0 +1,84 @@ +--- +title: DataView.prototype.setUint8() +slug: Web/JavaScript/Reference/Global_Objects/DataView/setUint8 +translation_of: Web/JavaScript/Reference/Global_Objects/DataView/setUint8 +--- +<div>{{JSRef}}</div> + +<p><strong><code>setUint8()</code></strong><code>从</code><a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/DataView" title="DataView 视图提供了一种用于向 ArrayBuffer 读写数据的底层接口。"><code>DataView</code></a>起始位置以byte为计数的指定偏移量(byteOffset)处储存一个8-bit数(无符号字节).</p> + +<div>{{EmbedInteractiveExample("pages/js/dataview-setuint8.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>dataview</var>.setUint8(byteOffset, value)</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt>byteOffset</dt> + <dd>偏移量，从头开始计算，单位为字节</dd> + <dt>value</dt> + <dd>设置的数值</dd> +</dl> + +<h3 id="返回">返回</h3> + +<p>{{jsxref("undefined")}}.</p> + +<h3 id="抛出错误">抛出错误</h3> + +<dl> + <dt>{{jsxref("RangeError")}}</dt> + <dd>如果byteOffset超出了视图能储存的值，就会抛出错误.</dd> +</dl> + +<h2 id="例子">例子</h2> + +<pre class="brush:js">var buffer = new ArrayBuffer(8); +var dataview = new DataView(buffer); +dataview.setUint8(1, 3); +dataview.getUint8(1); // 3 +</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('Typed Array')}}</td> + <td>{{Spec2('Typed Array')}}</td> + <td>Superseded by ECMAScript 6.</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-dataview.prototype.setuint8', 'DataView.prototype.setUint8')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition in an ECMA standard.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-dataview.prototype.setuint8', 'DataView.prototype.setUint8')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器支持">浏览器支持</h2> + + + +<p>{{Compat("javascript.builtins.DataView.setUint8")}}</p> + +<h2 id="相关内容">相关内容</h2> + +<ul> + <li>{{jsxref("DataView")}}</li> + <li>{{jsxref("ArrayBuffer")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/date/@@toprimitive/index.html b/files/zh-cn/web/javascript/reference/global_objects/date/@@toprimitive/index.html new file mode 100644 index 0000000000..5bf2e177ee --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/date/@@toprimitive/index.html @@ -0,0 +1,61 @@ +--- +title: 'Date.prototype[@@toPrimitive]' +slug: Web/JavaScript/Reference/Global_Objects/Date/@@toPrimitive +translation_of: Web/JavaScript/Reference/Global_Objects/Date/@@toPrimitive +--- +<div>{{JSRef}}</div> + +<p><code><strong>[@@toPrimitive]()</strong></code> 方法可以转换一个 <code>Date</code> 对象到一个原始值。</p> + +<h2 id="用法">用法</h2> + +<pre class="syntaxbox"><var>Date()[Symbol.toPrimitive](hint); +</var></pre> + +<h3 id="返回值">返回值</h3> + +<p>给出的 {{jsxref("Date")}} 的原始值。根据传入参数的不同，可以返回 string 或 number 类型。</p> + +<h2 id="说明">说明</h2> + +<p>{{jsxref("Date")}} 对象的 <code>[@@toPrimitive]()</code> 方法可以返回一个原始值，或是 string，或是number。</p> + +<p>如果 <code>hint</code> 是 <code>"string"</code> 或 <code>"default"</code>，<code>[@@toPrimitive]()</code> 将会调用 {{jsxref("Object.prototype.toString()", "toString")}}。如果 <code>toString</code> 属性不存在，则调用 {{jsxref("Object.prototype.valueOf()", "valueOf")}}。如果 <code>valueOf</code> 也不存在，则抛出一个{{jsxref("TypeError")}}。</p> + +<p>如果 <code>hint</code> 是 <code>"number"</code>，<code>[@@toPrimitive]()</code> 会首先尝试 <code>valueOf</code>，若失败再尝试 <code>toString</code>。</p> + +<p>当期望一个原始值却收到一个对象时，JavaScript 可以自动的调用 <code>[@@toPrimitive]()</code> 方法来将一个对象转化成原始值，所以你很少会需要自己调用这个方法。</p> + +<h2 id="Specifications">Specifications</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('ES6', '#sec-date.prototype-@@toprimitive', 'Date.prototype.@@toPrimitive')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-date.prototype-@@toprimitive', 'Date.prototype.@@toPrimitive')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility">Browser compatibility</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Date.@@toPrimitive")}}</p> + +<h2 id="See_also">See also</h2> + +<ul> + <li>{{jsxref("Symbol.toPrimitive")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/date/date/index.html b/files/zh-cn/web/javascript/reference/global_objects/date/date/index.html new file mode 100644 index 0000000000..47f7d4bd7d --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/date/date/index.html @@ -0,0 +1,108 @@ +--- +title: Date() constructor +slug: Web/JavaScript/Reference/Global_Objects/Date/Date +translation_of: Web/JavaScript/Reference/Global_Objects/Date/Date +--- +<div>{{JSRef}}</div> + +<p><span class="seoSummary">Creates a JavaScript <strong><code>Date</code></strong> instance that represents a single moment in time in a platform-independent format.</span> <code>Date</code> objects contain a <code>Number</code> that represents milliseconds since 1 January 1970 UTC.</p> + +<div>{{EmbedInteractiveExample("pages/js/date-constructor.html")}}</div> + + + +<h2 id="Syntax">Syntax</h2> + +<pre class="syntaxbox">new Date() +new Date(<var>value</var>) +new Date(<var>dateString</var>) +new Date(<var>year</var>, <var>monthIndex</var> [, <var>day</var> [, <var>hours</var> [, <var>minutes</var> [, <var>seconds</var> [, <var>milliseconds</var>]]]]]) +</pre> + +<div class="blockIndicator note"> +<p><strong>Note:</strong> The only correct way to instantiate a new <code>Date</code> object is by using the {{jsxref("new")}} operator. If you simply call the <code>Date</code> object directly, such as <code>now = Date()</code>, the returned value is a string rather than a <code>Date</code> object.</p> +</div> + +<h3 id="Parameters">Parameters</h3> + +<p>There are four basic forms for the <code>Date()</code> constructor:</p> + +<ol> + <li> + <h4 id="No_parameters">No parameters</h4> + + <p>When no parameters are provided, the newly-created <code>Date</code> object represents the current date and time as of the time of instantiation.</p> + </li> + <li> + <h4 id="Time_value_or_timestamp_number">Time value or timestamp number</h4> + + <dl> + <dt><code><var>value</var></code></dt> + <dd>An integer value representing the number of milliseconds since January 1, 1970, 00:00:00 UTC (the ECMAScript epoch, equivalent to the UNIX epoch), with leap seconds ignored. Keep in mind that most <a href="http://pubs.opengroup.org/onlinepubs/9699919799/basedefs/V1_chap04.html#tag_04_16">UNIX Timestamp</a> functions are only accurate to the nearest second.</dd> + </dl> + </li> + <li> + <h4 id="Timestamp_string">Timestamp string</h4> + + <dl> + <dt><code><var>dateString</var></code></dt> + <dd>A string value representing a date, specified in a format recognized by the {{jsxref("Date.parse()")}} method. (These formats are <a href="http://tools.ietf.org/html/rfc2822#page-14">IETF-compliant RFC 2822 timestamps</a>, and also strings in a <a href="http://www.ecma-international.org/ecma-262/5.1/#sec-15.9.1.15">version of ISO8601</a>.) + <div class="note"> + <p><strong>Note:</strong> Parsing of date strings with the <code>Date</code> constructor (and <code>Date.parse()</code>, which works the same way) is <em>strongly discouraged</em> due to browser differences and inconsistencies.</p> + + <ul> + <li>Support for <a href="https://tools.ietf.org/html/rfc2822">RFC 2822</a> format strings is by convention only.</li> + <li>Support for ISO 8601 formats differs in that date-only strings (e.g. <code>"1970-01-01"</code>) are treated as UTC, not local.</li> + </ul> + </div> + </dd> + </dl> + </li> + <li> + <h4 id="Individual_date_and_time_component_values">Individual date and time component values</h4> + + <p>Given at least a year and month, this form of <code>Date()</code> returns a <code>Date</code> object whose component values (year, month, day, hour, minute, second, and millisecond) all come from the following parameters. Any missing fields are given the lowest possible value (<code>1</code> for <code><var>day</var></code> and <code>0</code> for every other component).</p> + + <dl> + <dt><code><var>year</var></code></dt> + <dd> + <p>Integer value representing the year.</p> + + <p>Values from <code>0</code> to <code>99</code> map to the years <code>1900</code> to <code>1999</code>. All other values are the actual year. See the <a href="#Two_digit_years_map_to_1900_-_1999">example below</a>.</p> + </dd> + <dt><code><var>monthIndex</var></code></dt> + <dd>Integer value representing the month, beginning with <code>0</code> for January to <code>11</code> for December.</dd> + <dt><code><var>day</var></code> {{optional_inline}}</dt> + <dd>Integer value representing the day of the month. The default is <code>1</code>.</dd> + <dt><code><var>hours</var></code> {{optional_inline}}</dt> + <dd>Integer value representing the hour of the day. The default is <code>0</code> (midnight).</dd> + <dt><code><var>minutes</var></code> {{optional_inline}}</dt> + <dd>Integer value representing the minute segment of a time. The default is <code>0</code> minutes past the hour.</dd> + <dt><code><var>seconds</var></code> {{optional_inline}}</dt> + <dd>Integer value representing the second segment of a time. The default is <code>0</code> seconds past the minute.</dd> + <dt><code><var>milliseconds</var></code> {{optional_inline}}</dt> + <dd>Integer value representing the millisecond segment of a time. The default is <code>0</code> milliseconds past the second.</dd> + </dl> + </li> +</ol> + +<h2 id="Specifications">Specifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Specification</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-date-constructor', 'Date')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility">Browser compatibility</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Date.Date")}}</p> diff --git a/files/zh-cn/web/javascript/reference/global_objects/date/getdate/index.html b/files/zh-cn/web/javascript/reference/global_objects/date/getdate/index.html new file mode 100644 index 0000000000..2c27867870 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/date/getdate/index.html @@ -0,0 +1,78 @@ +--- +title: Date.prototype.getDate() +slug: Web/JavaScript/Reference/Global_Objects/Date/getDate +translation_of: Web/JavaScript/Reference/Global_Objects/Date/getDate +--- +<p>{{JSRef("Global_Objects", "Date")}}</p> + +<p>根据本地时间，返回一个指定的日期对象为一个月中的哪一日（从1--31）。</p> + +<div>{{EmbedInteractiveExample("pages/js/date-getdate.html")}}</div> + + + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox language-html" style="margin-bottom: 0px; padding: 1em; border-left-width: 6px; border-left-style: solid; font-family: Consolas, Monaco, 'Andale Mono', monospace; font-size: 14px; text-shadow: none; direction: ltr; white-space: normal; background-color: rgba(212, 221, 228, 0.498039);"><code class="language-html" style="font-family: Consolas, Monaco, 'Andale Mono', monospace; color: inherit; text-shadow: none; direction: ltr;">dateObj.getDate()</code></pre> + +<h2 id="Parameters" name="Parameters">参数</h2> + +<p>无</p> + +<h2 id="Description" name="Description">描述</h2> + +<p><code>getDate() </code>返回一个1 到 31的整数值。</p> + +<h2 id="Examples" name="Examples">例子</h2> + +<h3 id="Example:_Using_getDate" name="Example:_Using_getDate">例子: 使用getDate()<code>方法</code></h3> + +<p>下面第二条语句将值25赋给 day 变量，该值<span style="line-height: 1.5;">基于日期对象 </span><code style="font-style: normal; line-height: 1.5;">Xmax95</code><span style="line-height: 1.5;">的值。</span></p> + +<pre class="brush:js language-js" style="padding: 1em 0px 1em 30px; border-left-width: 6px; border-left-style: solid; font-family: Consolas, Monaco, 'Andale Mono', monospace; font-size: 14px; text-shadow: none; direction: ltr; white-space: normal; background-color: rgba(234, 239, 242, 0.247059);"><code class="language-js" style="font-family: Consolas, Monaco, 'Andale Mono', monospace; color: inherit; text-shadow: none; direction: ltr; white-space: pre;"><span class="keyword token" style="color: #0077aa;">var</span> Xmas95 <span class="operator token" style="background: rgba(255, 255, 255, 0.498039); color: #a67f59;">=</span> <span class="keyword token" style="color: #0077aa;">new</span> <span class="class-name token">Date</span><span class="punctuation token" style="color: #999999;">(</span><span class="string token" style="color: #669900;">"December 25, 1995 23:15:00"</span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span> +<span class="keyword token" style="color: #0077aa;">var</span> day <span class="operator token" style="background: rgba(255, 255, 255, 0.498039); color: #a67f59;">=</span> Xmas95<span class="punctuation token" style="color: #999999;">.</span><span class="function token">getDate<span class="punctuation token" style="color: #999999;">(</span></span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span> + +<span class="function token">alert<span class="punctuation token" style="color: #999999;">(</span></span>day<span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span><span class="comment token" style="color: #708090; display: inherit;"> // 25</span></code></pre> + +<h2 id="规范" style="margin-bottom: 20px; line-height: 30px;">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范版本</th> + <th scope="col">规范状态</th> + <th scope="col">注解</th> + </tr> + <tr> + <td>ECMAScript 1st Edition. Implemented in JavaScript 1.1</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.9.5.14', 'Date.prototype.getDate')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-date.prototype.getdate', 'Date.prototype.getDate')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> + <p> </p> + </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性" style="margin-bottom: 20px; line-height: 30px;">浏览器兼容性</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Date.getDate")}}</p> + +<h2 id="See_Also" name="See_Also" style="margin-bottom: 20px; line-height: 30px;">相关链接</h2> + +<ul> + <li>{{jsxref("Date.prototype.getUTCDate()")}}</li> + <li>{{jsxref("Date.prototype.getUTCDay()")}}</li> + <li>{{jsxref("Date.prototype.setDate()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/date/getday/index.html b/files/zh-cn/web/javascript/reference/global_objects/date/getday/index.html new file mode 100644 index 0000000000..20147639c4 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/date/getday/index.html @@ -0,0 +1,88 @@ +--- +title: Date.prototype.getDay() +slug: Web/JavaScript/Reference/Global_Objects/Date/getDay +translation_of: Web/JavaScript/Reference/Global_Objects/Date/getDay +--- +<p>{{JSRef}}</p> + +<p><strong><code>getDay()</code></strong> 方法根据本地时间，返回一个具体日期中一周的第几天，0 表示星期天。对于某个月中的第几天，参考{{jsxref("Date.prototype.getDate()")}}.</p> + +<div>{{EmbedInteractiveExample("pages/js/date-getday.html")}}</div> + + + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox language-html" style="margin-bottom: 0px; padding: 1em; border-left-width: 6px; border-left-style: solid; font-family: Consolas, Monaco, 'Andale Mono', monospace; font-size: 14px; text-shadow: none; direction: ltr; white-space: normal; background-color: rgba(212, 221, 228, 0.498039);"><code class="language-html" style="font-family: Consolas, Monaco, 'Andale Mono', monospace; color: inherit; text-shadow: none; direction: ltr;"><em>dateObj</em>.getDay()</code> +</pre> + +<h3 id="Description" name="Description">返回值</h3> + +<p>根据本地时间，返回一个0到6之间的整数值，代表星期几： 0 代表星期日， 1 代表星期一，2 代表星期二， 依次类推。</p> + +<h2 id="Examples" name="Examples">例子</h2> + +<h3 id="Example_Using_getDay" name="Example:_Using_getDay">使用<code>getDay()</code></h3> + +<p>下面第二条语句，基于{{jsxref("Date")}}对象 <code>Xmas95</code> 的值，把 1 赋值给 <code>weekday</code>。也就是说1995年12月25日是星期一。</p> + +<pre class="brush:js language-js" style="padding: 1em 0px 1em 30px; border-left-width: 6px; border-left-style: solid; font-family: Consolas, Monaco, 'Andale Mono', monospace; font-size: 14px; text-shadow: none; direction: ltr; white-space: normal; background-color: rgba(234, 239, 242, 0.247059);"><code class="language-js" style="font-family: Consolas, Monaco, 'Andale Mono', monospace; color: inherit; text-shadow: none; direction: ltr; white-space: pre;"><span class="keyword token" style="color: #0077aa;">var</span> Xmas95 <span class="operator token" style="background: rgba(255, 255, 255, 0.498039); color: #a67f59;">=</span> <span class="keyword token" style="color: #0077aa;">new</span> <span class="class-name token">Date</span><span class="punctuation token" style="color: #999999;">(</span><span class="string token" style="color: #669900;">"December 25, 1995 23:15:30"</span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span> +<span class="keyword token" style="color: #0077aa;">var</span> weekday <span class="operator token" style="background: rgba(255, 255, 255, 0.498039); color: #a67f59;">=</span> Xmas95<span class="punctuation token" style="color: #999999;">.</span><span class="function token">getDay<span class="punctuation token" style="color: #999999;">(</span></span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span> + +<span class="function token">console.log<span class="punctuation token" style="color: #999999;">(</span></span>weekday<span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span><span class="comment token" style="color: #708090; display: inherit;"> // 1</span></code></pre> + +<div class="blockIndicator note"> +<p dir="ltr">注意：如果需要，可以使用{{jsxref("DateTimeFormat", "Intl.DateTimeFormat")}}与一个额外的<code>options</code> 参数，从而返回这天的全称（如<code>"Monday"</code>）.使用此方法，结果会更加国际化：</p> + +<pre class="brush: js"><code>var options = { weekday: 'long'}; +console.log(new Intl.DateTimeFormat('en-US', options).format(Xmas95)); +// Monday +console.log(new Intl.DateTimeFormat('de-DE', options).format(Xmas95)); +// Montag</code></pre> +</div> + +<h2 id="规范" style="margin-bottom: 20px; line-height: 30px;">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范版本</th> + <th scope="col">规范状态</th> + <th scope="col">注解</th> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-date.prototype.getday', 'Date.prototype.getDay')}}<span style="display: none;"> </span><span style="display: none;"> </span></td> + <td>{{Spec2('ESDraft')}} </td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-date.prototype.getday', 'Date.prototype.getDay')}} </td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.9.5.16', 'Date.prototype.getDay')}} </td> + <td>{{Spec2('ES5.1')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES1')}}</td> + <td>{{Spec2('ES1')}}</td> + <td>Initial definition. Implemented in JavaScript 1.0.</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性" style="margin-bottom: 20px; line-height: 30px;">浏览器兼容性</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Date.getDay")}}</p> + +<h2 id="See_Also" name="See_Also" style="margin-bottom: 20px; line-height: 30px;">相关链接</h2> + +<ul> + <li>{{jsxref("Date.prototype.getUTCDate()")}}</li> + <li>{{jsxref("Date.prototype.getUTCDay()")}}</li> + <li>{{jsxref("Date.prototype.setDate()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/date/getfullyear/index.html b/files/zh-cn/web/javascript/reference/global_objects/date/getfullyear/index.html new file mode 100644 index 0000000000..10a0870fac --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/date/getfullyear/index.html @@ -0,0 +1,89 @@ +--- +title: Date.prototype.getFullYear() +slug: Web/JavaScript/Reference/Global_Objects/Date/getFullYear +tags: + - Date + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Date/getFullYear +--- +<p>{{JSRef}}</p> + +<p><strong><code>getFullYear()</code></strong> 方法根据本地时间返回指定日期的年份。</p> + +<p>此方法替代 {{jsxref("Date.prototype.getYear()", "getYear()")}} 。</p> + +<div>{{EmbedInteractiveExample("pages/js/date-getfullyear.html")}}</div> + + + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre style="margin-bottom: 0px; padding: 1em; border-left-width: 6px; border-left-style: solid; font-family: Consolas, Monaco, 'Andale Mono', monospace; font-size: 14px; text-shadow: none; direction: ltr; white-space: normal; background-color: rgba(212, 221, 228, 0.498039);"><code class="language-html" style="font-family: Consolas, Monaco, 'Andale Mono', monospace; color: inherit; text-shadow: none; direction: ltr;">dateObj.getFullYear()</code> +</pre> + +<h3 id="Description" name="Description">返回值</h3> + +<p>根据当地时间，返回一个对应于给定日期的年份数字。</p> + +<h2 id="描述">描述</h2> + +<p><code>getFullYear()</code>返回的值是绝对数。 对于1000到9999之间的日期，<code>getFullYear()</code>返回一个四位数字，如1995。使用此函数确保在2000年后兼容。</p> + +<h2 id="Examples" name="Examples">例子</h2> + +<h3 id="Example:_Using_getFullYear" name="Example:_Using_getFullYear">使用<code>getFullYear()</code></h3> + +<p>下面的例子将当前年份的四位数值分配给变量<code>year</code>。</p> + +<pre class="brush: js">var today = new Date(); +var year = today.getFullYear(); +</pre> + +<h2 id="规范" style="margin-bottom: 20px; line-height: 30px;">规范</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('ES1')}}</td> + <td>{{Spec2('ES1')}}</td> + <td>Initial definition. Implemented in JavaScript 1.3.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.9.5.10', 'Date.prototype.getFullYear')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-date.prototype.getfullyear', 'Date.prototype.getFullYear')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-date.prototype.getfullyear', 'Date.prototype.getFullYear')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性" style="margin-bottom: 20px; line-height: 30px;">浏览器兼容性</h2> + +<div class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>and send us a pull request.</div> + +<p>{{Compat("javascript.builtins.Date.getFullYear")}}</p> + +<h2 id="See_Also" name="See_Also" style="margin-bottom: 20px; line-height: 30px;">相关链接</h2> + +<ul> + <li>{{jsxref("Date.prototype.getUTCFullYear()")}}</li> + <li>{{jsxref("Date.prototype.setFullYear()")}}</li> + <li>{{jsxref("Date.prototype.getYear()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/date/gethours/index.html b/files/zh-cn/web/javascript/reference/global_objects/date/gethours/index.html new file mode 100644 index 0000000000..9eb86dc04a --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/date/gethours/index.html @@ -0,0 +1,75 @@ +--- +title: Date.prototype.getHours() +slug: Web/JavaScript/Reference/Global_Objects/Date/getHours +translation_of: Web/JavaScript/Reference/Global_Objects/Date/getHours +--- +<p>{{JSRef("Global_Objects", "Date")}}</p> + +<p><strong><code>getHours()</code></strong> 方法根据本地时间，返回一个指定的日期对象的小时。</p> + +<div>{{EmbedInteractiveExample("pages/js/date-gethours.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox language-html" style="margin-bottom: 0px; padding: 1em; border-left-width: 6px; border-left-style: solid; font-family: Consolas, Monaco, 'Andale Mono', monospace; font-size: 14px; text-shadow: none; direction: ltr; white-space: normal; background-color: rgba(212, 221, 228, 0.498039);"><var>dateObj</var>.getHours()</pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<p>无</p> + +<h3 id="Description" name="Description">返回值</h3> + +<p><code>getHours</code>返回一个0 到 23之间的整数值。</p> + +<h2 id="Examples" name="Examples">例子</h2> + +<h3 id="Example:_Using_getHours" name="Example:_Using_getHours">例子:使用<code>getHours</code>方法</h3> + +<p>下面第二条语句，基于日期对象 <code>Xmas95 </code>的值，把 23 赋值给了变量 <code>hours。</code></p> + +<pre class="brush:js language-js" style="padding: 1em 0px 1em 30px; border-left-width: 6px; border-left-style: solid; font-family: Consolas, Monaco, 'Andale Mono', monospace; font-size: 14px; text-shadow: none; direction: ltr; white-space: normal; background-color: rgba(234, 239, 242, 0.247059);"><code class="language-js" style="font-family: Consolas, Monaco, 'Andale Mono', monospace; color: inherit; text-shadow: none; direction: ltr; white-space: pre;"><span class="keyword token" style="color: #0077aa;">var</span> Xmas95 <span class="operator token" style="background: rgba(255, 255, 255, 0.498039); color: #a67f59;">=</span> <span class="keyword token" style="color: #0077aa;">new</span> <span class="class-name token">Date</span><span class="punctuation token" style="color: #999999;">(</span><span class="string token" style="color: #669900;">"December 25, 1995 23:15:00"</span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span> +<span class="keyword token" style="color: #0077aa;">var</span> hours <span class="operator token" style="background: rgba(255, 255, 255, 0.498039); color: #a67f59;">=</span> Xmas95<span class="punctuation token" style="color: #999999;">.</span><span class="function token">getHours<span class="punctuation token" style="color: #999999;">(</span></span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span> + +<span class="function token">alert<span class="punctuation token" style="color: #999999;">(</span></span>hours<span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span><span class="comment token" style="color: #708090; display: inherit;"> // 23</span></code></pre> + +<h2 id="规范" style="margin-bottom: 20px; line-height: 30px;">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范版本</th> + <th scope="col">规范状态</th> + <th scope="col">注解</th> + </tr> + <tr> + <td>ECMAScript 1st Edition. Implemented in JavaScript 1.0</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.9.5.18', 'Date.prototype.getHours')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-date.prototype.gethours', 'Date.prototype.getHours')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性" style="margin-bottom: 20px; line-height: 30px;">浏览器兼容性</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Date.getHours")}}</p> + +<h2 id="See_Also" name="See_Also" style="margin-bottom: 20px; line-height: 30px;">相关链接</h2> + +<ul> + <li>{{jsxref("Date.prototype.getUTCHours()")}}</li> + <li>{{jsxref("Date.prototype.setHours()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/date/getmilliseconds/index.html b/files/zh-cn/web/javascript/reference/global_objects/date/getmilliseconds/index.html new file mode 100644 index 0000000000..5c2b81b6e2 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/date/getmilliseconds/index.html @@ -0,0 +1,76 @@ +--- +title: Date.prototype.getMilliseconds() +slug: Web/JavaScript/Reference/Global_Objects/Date/getMilliseconds +translation_of: Web/JavaScript/Reference/Global_Objects/Date/getMilliseconds +--- +<p>{{JSRef("Global_Objects", "Date")}}</p> + +<p>getMilliseconds() 方法，根据本地时间，返回一个指定的日期对象的毫秒数。</p> + +<div>{{EmbedInteractiveExample("pages/js/date-getmilliseconds.html")}}</div> + + + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox language-html" style="margin-bottom: 0px; padding: 1em; border-left-width: 6px; border-left-style: solid; font-family: Consolas, Monaco, 'Andale Mono', monospace; font-size: 14px; text-shadow: none; direction: ltr; white-space: normal; background-color: rgba(212, 221, 228, 0.498039);"><var>dateObj</var>.getMilliseconds()</pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<p>无</p> + +<h3 id="Description" name="Description">描述</h3> + +<p><code>getMilliseconds() </code>方法返回一个0 到 999的整数。</p> + +<h2 id="Examples" name="Examples">例子</h2> + +<h3 id="Example:_Using_getMilliseconds" name="Example:_Using_getMilliseconds">例子：使用<code>getMilliseconds</code>方法</h3> + +<p>下例中，将当前时间的毫秒数赋值给变量 <code>ms</code>。</p> + +<pre class="brush: js language-js" style="padding: 1em 0px 1em 30px; border-left-width: 6px; border-left-style: solid; font-family: Consolas, Monaco, 'Andale Mono', monospace; font-size: 14px; text-shadow: none; direction: ltr; white-space: normal; background-color: rgba(234, 239, 242, 0.247059);"><code class="language-js" style="font-family: Consolas, Monaco, 'Andale Mono', monospace; color: inherit; text-shadow: none; direction: ltr; white-space: pre;"><span class="keyword token" style="color: #0077aa;">var</span> ms<span class="punctuation token" style="color: #999999;">;</span> +Today <span class="operator token" style="background: rgba(255, 255, 255, 0.498039); color: #a67f59;">=</span> <span class="keyword token" style="color: #0077aa;">new</span> <span class="class-name token">Date</span><span class="punctuation token" style="color: #999999;">(</span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span> +ms <span class="operator token" style="background: rgba(255, 255, 255, 0.498039); color: #a67f59;">=</span> Today<span class="punctuation token" style="color: #999999;">.</span><span class="function token">getMilliseconds<span class="punctuation token" style="color: #999999;">(</span></span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span></code></pre> + +<h2 id="规范" style="margin-bottom: 20px; line-height: 30px;">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范版本</th> + <th scope="col">规范状态</th> + <th scope="col">注解</th> + </tr> + <tr> + <td>ECMAScript 1st Edition. Implemented in JavaScript 1.3</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.9.5.24', 'Date.prototype.getMilliseconds')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-date.prototype.getmilliseconds', 'Date.prototype.getMilliseconds')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性" style="margin-bottom: 20px; line-height: 30px;">浏览器兼容性</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Date.getMilliseconds")}}</p> + +<h2 id="See_Also" name="See_Also" style="margin-bottom: 20px; line-height: 30px;">相关链接</h2> + +<p id=".E7.9B.B8.E5.85.B3.E9.93.BE.E6.8E.A5"> </p> + +<ul> + <li>{{jsxref("Date.prototype.getUTCMilliseconds()")}}</li> + <li>{{jsxref("Date.prototype.setMilliseconds()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/date/getminutes/index.html b/files/zh-cn/web/javascript/reference/global_objects/date/getminutes/index.html new file mode 100644 index 0000000000..74ace83ef7 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/date/getminutes/index.html @@ -0,0 +1,73 @@ +--- +title: Date.prototype.getMinutes() +slug: Web/JavaScript/Reference/Global_Objects/Date/getMinutes +translation_of: Web/JavaScript/Reference/Global_Objects/Date/getMinutes +--- +<p>{{JSRef("Global_Objects", "Date")}}</p> + +<p><strong><code>getMinutes()</code></strong> 方法根据本地时间，返回一个指定的日期对象的分钟数。</p> + +<div>{{EmbedInteractiveExample("pages/js/date-getminutes.html")}}</div> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox language-html" style="margin-bottom: 0px; padding: 1em; border-left-width: 6px; border-left-style: solid; font-family: Consolas, Monaco, 'Andale Mono', monospace; font-size: 14px; text-shadow: none; direction: ltr; white-space: normal; background-color: rgba(212, 221, 228, 0.498039);"><code class="language-html" style="font-family: Consolas, Monaco, 'Andale Mono', monospace; color: inherit; text-shadow: none; direction: ltr;">dateObj.getMinutes()</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<p>无</p> + +<h3 id="Description" name="Description">描述</h3> + +<p><code>getMinutes </code>返回一个0 到 59的整数值。</p> + +<h2 id="Examples" name="Examples">例子</h2> + +<h3 id="Example:_Using_getMinutes" name="Example:_Using_getMinutes">例子：使用<code>getMinutes方法</code></h3> + +<p>下例中，第二行语句运行过后，变量 <code>minutes </code>的值为15，也就是说 <code>Xmas95 </code>这个日期对象的值为某时15分某秒。</p> + +<pre class="brush:js language-js" style="padding: 1em 0px 1em 30px; border-left-width: 6px; border-left-style: solid; font-family: Consolas, Monaco, 'Andale Mono', monospace; font-size: 14px; text-shadow: none; direction: ltr; white-space: normal; background-color: rgba(234, 239, 242, 0.247059);"><code class="language-js" style="font-family: Consolas, Monaco, 'Andale Mono', monospace; color: inherit; text-shadow: none; direction: ltr; white-space: pre;"><span class="keyword token" style="color: #0077aa;">var</span> Xmas95 <span class="operator token" style="background: rgba(255, 255, 255, 0.498039); color: #a67f59;">=</span> <span class="keyword token" style="color: #0077aa;">new</span> <span class="class-name token">Date</span><span class="punctuation token" style="color: #999999;">(</span><span class="string token" style="color: #669900;">"December 25, 1995 23:15:00"</span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span> +<span class="keyword token" style="color: #0077aa;">var</span> minutes <span class="operator token" style="background: rgba(255, 255, 255, 0.498039); color: #a67f59;">=</span> Xmas95<span class="punctuation token" style="color: #999999;">.</span><span class="function token">getMinutes<span class="punctuation token" style="color: #999999;">(</span></span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span></code></pre> + +<p dir="ltr"><strong style="font-size: 2.142857142857143rem; font-weight: 700; letter-spacing: -1px; line-height: 30px;">规范</strong></p> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范版本</th> + <th scope="col">规范状态</th> + <th scope="col">注解</th> + </tr> + <tr> + <td>ECMAScript 1st Edition. Implemented in JavaScript 1.0</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.9.5.20', 'Date.prototype.getMinutes')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-date.prototype.getminutes', 'Date.prototype.getMinutes')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性" style="margin-bottom: 20px; line-height: 30px;">浏览器兼容性</h2> + +<p> </p> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Date.getMinutes")}}</p> + +<h2 id="See_Also" name="See_Also" style="margin-bottom: 20px; line-height: 30px;">相关链接</h2> + +<ul> + <li>{{jsxref("Date.prototype.getUTCMinutes()")}}</li> + <li>{{jsxref("Date.prototype.setMinutes()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/date/getmonth/index.html b/files/zh-cn/web/javascript/reference/global_objects/date/getmonth/index.html new file mode 100644 index 0000000000..bf2d68f24d --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/date/getmonth/index.html @@ -0,0 +1,89 @@ +--- +title: Date.prototype.getMonth() +slug: Web/JavaScript/Reference/Global_Objects/Date/getMonth +tags: + - Date + - JavaScript + - Prototype + - 原型 + - 参考 + - 方法 +translation_of: Web/JavaScript/Reference/Global_Objects/Date/getMonth +--- +<div>{{JSRef}}</div> + +<p>根据本地时间，返回一个指定的日期对象的月份，为基于0的值（0表示一年中的第一月）。</p> + +<div>{{EmbedInteractiveExample("pages/js/date-getmonth.html")}}</div> + + + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox language-html">dateObj.getMonth()</pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<p>无</p> + +<h3 id="Description" name="Description">返回值</h3> + +<p><code>getMonth</code>返回一个0 到 11的整数值： 0 代表一月份，1 代表二月份， 2 代表三月份，依次类推。</p> + +<h2 id="Examples" name="Examples">例子</h2> + +<h3 id="Example:_Using_getMonth" name="Example:_Using_getMonth">使用 <code>getMonth()</code></h3> + +<p>下面第二条语句，基于 {{jsxref("Date")}} 对象 Xmas95 的值，把11赋值给变量 <code>month。</code></p> + +<pre class="brush:js language-js">var Xmas95 = new Date('December 25, 1995 23:15:30'); +var month = Xmas95.getMonth(); + +console.log(month); // 11</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>{{SpecName('ES1')}}</td> + <td>{{Spec2('ES1')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.9.5.12', 'Date.prototype.getMonth')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-date.prototype.getmonth', 'Date.prototype.getMonth')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-date.prototype.getmonth', 'Date.prototype.getMonth')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Date.getMonth")}}</p> +</div> + +<h2 id="See_Also" name="See_Also" style="margin-bottom: 20px; line-height: 30px;">相关链接</h2> + +<ul> + <li>{{jsxref("Date.prototype.getUTCMonth()")}}</li> + <li>{{jsxref("Date.prototype.setMonth()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/date/getseconds/index.html b/files/zh-cn/web/javascript/reference/global_objects/date/getseconds/index.html new file mode 100644 index 0000000000..4edaa5e02c --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/date/getseconds/index.html @@ -0,0 +1,77 @@ +--- +title: Date.prototype.getSeconds() +slug: Web/JavaScript/Reference/Global_Objects/Date/getSeconds +translation_of: Web/JavaScript/Reference/Global_Objects/Date/getSeconds +--- +<p>{{JSRef("Global_Objects", "Date")}}</p> + +<p><strong><code>getSeconds()</code></strong> 方法根据本地时间，返回一个指定的日期对象的秒数。</p> + +<div>{{EmbedInteractiveExample("pages/js/date-getseconds.html")}}</div> + + + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox language-html" style="margin-bottom: 0px; padding: 1em; border-left-width: 6px; border-left-style: solid; font-family: Consolas, Monaco, 'Andale Mono', monospace; font-size: 14px; text-shadow: none; direction: ltr; white-space: normal; background-color: rgba(212, 221, 228, 0.498039);"><code class="language-html" style="font-family: Consolas, Monaco, 'Andale Mono', monospace; color: inherit; text-shadow: none; direction: ltr;">dateObj.getSeconds()</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<p>无</p> + +<h3 id="Description" name="Description">描述</h3> + +<p>该方法返回一个 0 到 59 的整数值。</p> + +<h2 id="Examples" name="Examples">例子</h2> + +<h3 id="Example:_Using_getSeconds" name="Example:_Using_getSeconds">例子: 使用<code>getSeconds方法</code></h3> + +<p>下面第二条语句，基于日期对象 <code>Xmas95</code> 的值，把 30 赋值给变量 <code>secs</code>。</p> + +<pre class="brush:js language-js" style="padding: 1em 0px 1em 30px; border-left-width: 6px; border-left-style: solid; font-family: Consolas, Monaco, 'Andale Mono', monospace; font-size: 14px; text-shadow: none; direction: ltr; white-space: normal; background-color: rgba(234, 239, 242, 0.247059);"><code class="language-js" style="font-family: Consolas, Monaco, 'Andale Mono', monospace; color: inherit; text-shadow: none; direction: ltr; white-space: pre;"><span class="keyword token" style="color: #0077aa;">var</span> Xmas95 <span class="operator token" style="background: rgba(255, 255, 255, 0.498039); color: #a67f59;">=</span> <span class="keyword token" style="color: #0077aa;">new</span> <span class="class-name token">Date</span><span class="punctuation token" style="color: #999999;">(</span><span class="string token" style="color: #669900;">"December 25, 1995 23:15:30"</span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span> +<span class="keyword token" style="color: #0077aa;">var</span> secs <span class="operator token" style="background: rgba(255, 255, 255, 0.498039); color: #a67f59;">=</span> Xmas95<span class="punctuation token" style="color: #999999;">.</span><span class="function token">getSeconds<span class="punctuation token" style="color: #999999;">(</span></span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span></code></pre> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 0px; background: transparent;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 19px; background: transparent;"> </div> + +<h2 id="规范" style="margin-bottom: 20px; line-height: 30px;">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范版本</th> + <th scope="col">规范状态</th> + <th scope="col">注解</th> + </tr> + <tr> + <td>ECMAScript 1st Edition. Implemented in JavaScript 1.0</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.9.5.22', 'Date.prototype.getSeconds')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-date.prototype.getseconds', 'Date.prototype.getSeconds')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性" style="margin-bottom: 20px; line-height: 30px;">浏览器兼容性</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Date.getSeconds")}}</p> + +<h2 id="See_Also" name="See_Also" style="margin-bottom: 20px; line-height: 30px;">相关链接</h2> + +<ul> + <li>{{jsxref("Date.prototype.getUTCSeconds()")}}</li> + <li>{{jsxref("Date.prototype.setSeconds()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/date/gettime/index.html b/files/zh-cn/web/javascript/reference/global_objects/date/gettime/index.html new file mode 100644 index 0000000000..3bac439efa --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/date/gettime/index.html @@ -0,0 +1,97 @@ +--- +title: Date.prototype.getTime() +slug: Web/JavaScript/Reference/Global_Objects/Date/getTime +tags: + - Date + - JavaScript + - 原型 + - 方法 +translation_of: Web/JavaScript/Reference/Global_Objects/Date/getTime +--- +<div>{{JSRef}}</div> + +<p><code><strong>getTime()</strong></code> 方法返回一个时间的格林威治时间数值。</p> + +<p>你可以使用这个方法把一个日期时间赋值给另一个{{jsxref("Date")}} 对象。这个方法的功能和 {{jsxref("Date.valueof", "valueOf()")}} 方法一样。</p> + +<div>{{EmbedInteractiveExample("pages/js/date-gettime.html")}}</div> + + + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code>dateObj.getTime() </code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<p>无。</p> + +<h3 id="Description" name="Description">返回值</h3> + +<p><code>getTime</code> 方法的返回值一个数值，表示从1970年1月1日0时0分0秒（UTC，即协调世界时）距离该日期对象所代表时间的毫秒数。</p> + +<h2 id="Examples" name="Examples">例子</h2> + +<h3 id="使用_getTime()_复制日期对象">使用 getTime() 复制日期对象</h3> + +<p>创建一个拥有相同时间值的日期对象。</p> + +<pre class="brush: js">var birthday = new Date(1991, 9, 17); +var copy = new Date(); +copy.setTime(birthday.getTime()); +</pre> + +<h3 id="测量代码执行时间">测量代码执行时间</h3> + +<p>连续调用两个新生成的日期对象的 getTime 方法，根据两次调用的返回值求得时间差。这可以用于计算某些操作的执行时间。避免生成不必要的{{jsxref("Date")}}对象另见{{jsxref("Date.now()")}} </p> + +<pre class="brush:js">var end, start, i; + +start = new Date(); +for (i = 0; i < 1000; i++) { + Math.sqrt(i); +} +end = new Date(); + +console.log("Operation took " + (end.getTime() - start.getTime()) + " msec");</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>{{SpecName('ES1')}}</td> + <td>{{Spec2('ES1')}}</td> + <td>初始定义</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.9.5.9', 'Date.prototype.getTime')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-date.prototype.gettime', 'Date.prototype.getTime')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Date.getTime")}}</p> + +<h2 id="See_Also" name="See_Also">相关链接</h2> + +<ul> + <li>{{jsxref("Date.prototype.setTime()")}}</li> + <li>{{jsxref("Date.prototype.valueOf()")}}</li> + <li>{{jsxref("Date.now()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/date/gettimezoneoffset/index.html b/files/zh-cn/web/javascript/reference/global_objects/date/gettimezoneoffset/index.html new file mode 100644 index 0000000000..3f7ed584aa --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/date/gettimezoneoffset/index.html @@ -0,0 +1,65 @@ +--- +title: Date.prototype.getTimezoneOffset() +slug: Web/JavaScript/Reference/Global_Objects/Date/getTimezoneOffset +translation_of: Web/JavaScript/Reference/Global_Objects/Date/getTimezoneOffset +--- +<div>{{JSRef("Global_Objects", "Date")}}</div> + +<p><code><strong>getTimezoneOffset()</strong></code> 方法返回协调世界时（UTC）相对于当前时区的时间差值，单位为分钟。</p> + +<div>{{EmbedInteractiveExample("pages/js/date-gettimezoneoffset.html")}}</div> + + + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox language-html" style="margin-bottom: 0px; padding: 1em; border-left-width: 6px; border-left-style: solid; font-family: Consolas, Monaco, 'Andale Mono', monospace; font-size: 14px; text-shadow: none; direction: ltr; white-space: normal; background-color: rgba(212, 221, 228, 0.498039);"><code class="language-html" style="font-family: Consolas, Monaco, 'Andale Mono', monospace; color: inherit; text-shadow: none; direction: ltr;">dateObj.getTimezoneOffset()</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<p>无</p> + +<h3 id="Description" name="Description">返回值</h3> + +<p>时区偏差（time-zone offset）表示协调世界时（UTC）与本地时区之间的差值，单位为分钟。需要注意的是如果本地时区先于协调世界时，则该差值为正值，如果后于协调世界时则为负值。例如你所在时区为 UTC+10（澳大利亚东部标准时间），将会返回 -600。对于同一个时区，夏令时（Daylight Saving Time）将会改变这个值。</p> + +<h2 id="Examples" name="Examples">例子</h2> + +<h3 id="Example_Using_getTimezoneOffset" name="Example:_Using_getTimezoneOffset">例子： 使用<code>getTimezoneOffset方法</code></h3> + +<pre class="brush:js">var x = new Date(); +var currentTimeZoneOffsetInHours = x.getTimezoneOffset() / 60; +</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>ECMAScript 1st Edition. Implemented in JavaScript 1.0</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.9.5.26', 'Date.prototype.getTimezoneOffset')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-date.prototype.gettimezoneoffset', 'Date.prototype.getTimezoneOffset')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Date.getTimezoneOffset")}}</p> diff --git a/files/zh-cn/web/javascript/reference/global_objects/date/getutcdate/index.html b/files/zh-cn/web/javascript/reference/global_objects/date/getutcdate/index.html new file mode 100644 index 0000000000..c39ec91325 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/date/getutcdate/index.html @@ -0,0 +1,75 @@ +--- +title: Date.prototype.getUTCDate() +slug: Web/JavaScript/Reference/Global_Objects/Date/getUTCDate +translation_of: Web/JavaScript/Reference/Global_Objects/Date/getUTCDate +--- +<div>{{JSRef("Global_Objects", "Date")}}</div> + +<p><strong><code>getUTCDate()</code></strong> 方法以世界时为标准，返回一个指定的日期对象为一个月中的第几天</p> + +<div>{{EmbedInteractiveExample("pages/js/date-getutcdate.html")}}</div> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code><var>dateObj</var>.getUTCDate()</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<p>无</p> + +<h3 id="Returns" name="Returns">返回值</h3> + +<p><code>getUTCDate()</code> 返回一个 1 到 31 的整数值</p> + +<h2 id="Examples" name="Examples">例子</h2> + +<h3 id="Example:_Using_getUTCDate" name="Example:_Using_getUTCDate">例子: 使用 <code>getUTCDate()</code> 方法</h3> + +<p>下面的例子是把当前日期的天数部分赋值给变量 <code>day</code>.</p> + +<pre class="brush: js">var today = new Date(); +var day = today.getUTCDate(); +</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>ECMAScript 1st Edition.</td> + <td>Standard</td> + <td>Initial definition. Implemented in JavaScript 1.3.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.9.5.15', 'Date.prototype.getUTCDate')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-date.prototype.getutcdate', 'Date.prototype.getUTCDate')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Date.getUTCDate")}}</p> +</div> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("Date.prototype.getDate()")}}</li> + <li>{{jsxref("Date.prototype.getUTCDay()")}}</li> + <li>{{jsxref("Date.prototype.setUTCDate()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/date/getutcday/index.html b/files/zh-cn/web/javascript/reference/global_objects/date/getutcday/index.html new file mode 100644 index 0000000000..82acb18189 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/date/getutcday/index.html @@ -0,0 +1,77 @@ +--- +title: Date.prototype.getUTCDay() +slug: Web/JavaScript/Reference/Global_Objects/Date/getUTCDay +translation_of: Web/JavaScript/Reference/Global_Objects/Date/getUTCDay +--- +<div>{{JSRef("Global_Objects", "Date")}}</div> + +<p><strong><code>getUTCDay()</code></strong> 方法以世界时为标准，返回一个指定的日期对象为一星期中的第几天，其中 0 代表星期天。</p> + +<div>{{EmbedInteractiveExample("pages/js/date-getutcday.html")}}</div> + + + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code><var>dateObj</var>.getUTCDay()</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<p>无。</p> + +<h3 id="Returns" name="Returns">返回值</h3> + +<p><code>getUTCDay()</code> 方法返回一个对应一星期中第几天的整数：0 代表星期天，1 代表星期一，2 代表星期二，依次类推。</p> + +<h2 id="Examples" name="Examples">例子</h2> + +<h3 id="Example:_Using_getUTCDay" name="Example:_Using_getUTCDay">例子: 使用 <code>getUTCDay()</code> 方法</h3> + +<p>下面的例子是把当前日期的星期部分赋值给变量 <code>weekday</code>。</p> + +<pre class="brush: js">var today = new Date(); +var weekday = today.getUTCDay(); +</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>ECMAScript 1st Edition.</td> + <td>Standard</td> + <td>Initial definition. Implemented in JavaScript 1.3.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.9.5.17', 'Date.prototype.getUTCDay')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-date.prototype.getutcday', 'Date.prototype.getUTCDay')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Date.getUTCDay")}}</p> +</div> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("Date.prototype.getUTCDate()")}}</li> + <li>{{jsxref("Date.prototype.getDay()")}}</li> + <li>{{jsxref("Date.prototype.setUTCDate()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/date/getutcfullyear/index.html b/files/zh-cn/web/javascript/reference/global_objects/date/getutcfullyear/index.html new file mode 100644 index 0000000000..8f19fa4845 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/date/getutcfullyear/index.html @@ -0,0 +1,76 @@ +--- +title: Date.prototype.getUTCFullYear() +slug: Web/JavaScript/Reference/Global_Objects/Date/getUTCFullYear +translation_of: Web/JavaScript/Reference/Global_Objects/Date/getUTCFullYear +--- +<div>{{JSRef("Global_Objects", "Date")}}</div> + +<p><strong><code>getUTCFullYear()</code></strong> 以世界时为标准，返回一个指定的日期对象的年份。</p> + +<div>{{EmbedInteractiveExample("pages/js/date-getutcfullyear.html")}}</div> + + + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code><var>dateObj</var>.getUTCFullYear()</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<p>无。</p> + +<h3 id="Returns" name="Returns">返回值</h3> + +<p><code>getUTCFullYear()</code> 返回一个绝对数值，符合 Year-2000 标准，例如 1995。</p> + +<h2 id="Examples" name="Examples">例子</h2> + +<h3 id="Example:_Using_getUTCFullYear" name="Example:_Using_getUTCFullYear">例子: 使用 <code>getUTCFullYear()</code> 方法</h3> + +<p>下面的例子是把当前年份的四位数值复制给变量 <code>year</code>。</p> + +<pre class="brush: js">var today = new Date(); +var year = today.getUTCFullYear(); +</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>ECMAScript 1st Edition.</td> + <td>Standard</td> + <td>Initial definition. Implemented in JavaScript 1.3.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.9.5.11', 'Date.prototype.getUTCFullYear')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-date.prototype.getutcfullyear', 'Date.prototype.getUTCFullYear')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Date.getUTCFullYear")}}</p> +</div> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("Date.prototype.getFullYear()")}}</li> + <li>{{jsxref("Date.prototype.setFullYear()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/date/getutchours/index.html b/files/zh-cn/web/javascript/reference/global_objects/date/getutchours/index.html new file mode 100644 index 0000000000..85c105c875 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/date/getutchours/index.html @@ -0,0 +1,76 @@ +--- +title: Date.prototype.getUTCHours() +slug: Web/JavaScript/Reference/Global_Objects/Date/getUTCHours +translation_of: Web/JavaScript/Reference/Global_Objects/Date/getUTCHours +--- +<div>{{JSRef("Global_Objects", "Date")}}</div> + +<p><strong><code>getUTCHours()</code></strong> 方法以世界时为标准，返回一个指定的日期对象的小时数。</p> + +<div>{{EmbedInteractiveExample("pages/js/date-getutchours.html")}}</div> + + + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code><var>dateObj</var>.getUTCHours()</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<p>无。</p> + +<h3 id="Returns" name="Returns">返回值</h3> + +<p><code>getUTCHours()</code> 返回一个 0 到 23 的整数。</p> + +<h2 id="Examples" name="Examples">例子</h2> + +<h3 id="Example:_Using_getUTCHours" name="Example:_Using_getUTCHours">例子: 使用 <code>getUTCHours()</code> 方法</h3> + +<p>下例将当前时间的小时部分赋值给变量 <code>hours</code>。</p> + +<pre class="brush: js">var today = new Date(); +var hours = today.getUTCHours(); +</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>ECMAScript 1st Edition.</td> + <td>Standard</td> + <td>Initial definition. Implemented in JavaScript 1.3.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.9.5.19', 'Date.prototype.getUTCHours')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-date.prototype.getutchours', 'Date.prototype.getUTCHours')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Date.getUTCHours")}}</p> +</div> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("Date.prototype.getHours()")}}</li> + <li>{{jsxref("Date.prototype.setUTCHours()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/date/getutcmilliseconds/index.html b/files/zh-cn/web/javascript/reference/global_objects/date/getutcmilliseconds/index.html new file mode 100644 index 0000000000..a77a980836 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/date/getutcmilliseconds/index.html @@ -0,0 +1,74 @@ +--- +title: Date.prototype.getUTCMilliseconds() +slug: Web/JavaScript/Reference/Global_Objects/Date/getUTCMilliseconds +translation_of: Web/JavaScript/Reference/Global_Objects/Date/getUTCMilliseconds +--- +<div>{{JSRef("Global_Objects", "Date")}}</div> + +<p><strong><code>getUTCMilliseconds()</code></strong> 方法以世界时为标准，返回一个指定的日期对象的毫秒数。</p> + +<div>{{EmbedInteractiveExample("pages/js/date-getutcmilliseconds.html")}}</div> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code><var>dateObj</var>.getUTCMilliseconds()</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<p>无。</p> + +<h3 id="Returns" name="Returns">返回值</h3> + +<p><code>getUTCMilliseconds()</code> 返回一个 0 到 999 的整数。</p> + +<h2 id="Examples" name="Examples">例子</h2> + +<h3 id="Example:_Using_getUTCMilliseconds" name="Example:_Using_getUTCMilliseconds">例子: 使用 <code>getUTCMilliseconds()</code> 方法</h3> + +<p>下例将当前时间的毫秒部分赋值给变量 <code>milliseconds</code>。</p> + +<pre class="brush: js">var today = new Date(); +var milliseconds = today.getUTCMilliseconds(); +</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>ECMAScript 1st Edition.</td> + <td>Standard</td> + <td>Initial definition. Implemented in JavaScript 1.3.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.9.5.25', 'Date.prototype.getUTCMilliseconds')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-date.prototype.getutcmilliseconds', 'Date.prototype.getUTCMilliseconds')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Date.getUTCMilliseconds")}}</p> +</div> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("Date.prototype.getMilliseconds()")}}</li> + <li>{{jsxref("Date.prototype.setUTCMilliseconds()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/date/getutcminutes/index.html b/files/zh-cn/web/javascript/reference/global_objects/date/getutcminutes/index.html new file mode 100644 index 0000000000..f4df8aff72 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/date/getutcminutes/index.html @@ -0,0 +1,74 @@ +--- +title: Date.prototype.getUTCMinutes() +slug: Web/JavaScript/Reference/Global_Objects/Date/getUTCMinutes +translation_of: Web/JavaScript/Reference/Global_Objects/Date/getUTCMinutes +--- +<div>{{JSRef("Global_Objects", "Date")}}</div> + +<p><strong><code>getUTCMinutes()</code></strong> 方法以世界时为标准，返回一个指定的日期对象的分钟数。</p> + +<div>{{EmbedInteractiveExample("pages/js/date-getutcminutes.html")}}</div> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code><var>dateObj</var>.getUTCMinutes()</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<p>无。</p> + +<h3 id="Returns" name="Returns">返回值</h3> + +<p><code>getUTCMinutes()</code> 返回一个 0 到 59 的整数。</p> + +<h2 id="Examples" name="Examples">例子</h2> + +<h3 id="Example:_Using_getUTCMinutes" name="Example:_Using_getUTCMinutes">例子: 使用 <code>getUTCMinutes()</code> 方法</h3> + +<p>下例将当前时间的分钟部分赋值给变量 <code>minutes</code>。</p> + +<pre class="brush: js">var today = new Date(); +var minutes = today.getUTCMinutes(); +</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>ECMAScript 1st Edition.</td> + <td>Standard</td> + <td>Initial definition. Implemented in JavaScript 1.3.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.9.5.21', 'Date.prototype.getUTCMinutes')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-date.prototype.getutcminutes', 'Date.prototype.getUTCMinutes')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Date.getUTCMinutes")}}</p> +</div> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("Date.prototype.getMinutes()")}}</li> + <li>{{jsxref("Date.prototype.setUTCMinutes()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/date/getutcmonth/index.html b/files/zh-cn/web/javascript/reference/global_objects/date/getutcmonth/index.html new file mode 100644 index 0000000000..015b513a72 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/date/getutcmonth/index.html @@ -0,0 +1,76 @@ +--- +title: Date.prototype.getUTCMonth() +slug: Web/JavaScript/Reference/Global_Objects/Date/getUTCMonth +translation_of: Web/JavaScript/Reference/Global_Objects/Date/getUTCMonth +--- +<div>{{JSRef("Global_Objects", "Date")}}</div> + +<p><strong><code>getUTCMonth()</code></strong> 方法以世界时为标准，返回一个指定的日期对象的月份，它是从 0 开始计数的（0 代表一年的第一个月）。</p> + +<div>{{EmbedInteractiveExample("pages/js/date-getutcmonth.html")}}</div> + + + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code><var>dateObj</var>.getUTCMonth()</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<p>无。</p> + +<h3 id="Returns" name="Returns">返回值</h3> + +<p><code>getUTCMonth()</code> 返回一个 0 到 11 的整数，分别对应以下月份：0 代表一月，1 代表二月，2 代表三月，依次类推。</p> + +<h2 id="Examples" name="Examples">例子</h2> + +<h3 id="Example:_Using_getUTCMonth" name="Example:_Using_getUTCMonth">例子: 使用 <code>getUTCMonth()</code> 方法</h3> + +<p>下例将当前时间的月份赋值给变量 <code>month</code>。</p> + +<pre class="brush: js">var today = new Date(); +var month = today.getUTCMonth(); +</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>ECMAScript 1st Edition.</td> + <td>Standard</td> + <td>Initial definition. Implemented in JavaScript 1.3.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.9.5.13', 'Date.prototype.getUTCMonth')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-date.prototype.getutcmonth', 'Date.prototype.getUTCMonth')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Date.getUTCMonth")}}</p> +</div> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("Date.prototype.getMonth()")}}</li> + <li>{{jsxref("Date.prototype.setUTCMonth()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/date/getutcseconds/index.html b/files/zh-cn/web/javascript/reference/global_objects/date/getutcseconds/index.html new file mode 100644 index 0000000000..84f2e82ff3 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/date/getutcseconds/index.html @@ -0,0 +1,74 @@ +--- +title: Date.prototype.getUTCSeconds() +slug: Web/JavaScript/Reference/Global_Objects/Date/getUTCSeconds +translation_of: Web/JavaScript/Reference/Global_Objects/Date/getUTCSeconds +--- +<div>{{JSRef("Global_Objects", "Date")}}</div> + +<p><strong><code>getUTCSeconds()</code></strong> 方法以世界时为标准，返回一个指定的日期对象的秒数。</p> + +<div>{{EmbedInteractiveExample("pages/js/date-getutcseconds.html")}}</div> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code><var>dateObj</var>.getUTCSeconds()</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<p>无。</p> + +<h3 id="Returns" name="Returns">返回值</h3> + +<p><code>getUTCSeconds()</code> 返回一个 0 到 59 的整数。</p> + +<h2 id="Examples" name="Examples">例子</h2> + +<h3 id="Example:_Using_getUTCSeconds" name="Example:_Using_getUTCSeconds">例子: 使用 <code>getUTCSeconds()</code> 方法</h3> + +<p>下例将当前时间的秒数部分赋值给变量 <code>seconds</code>。</p> + +<pre class="brush: js">var today = new Date(); +var seconds = today.getUTCSeconds(); +</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>ECMAScript 1st Edition.</td> + <td>Standard</td> + <td>Initial definition. Implemented in JavaScript 1.3.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.9.5.23', 'Date.prototype.getUTCSeconds')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-date.prototype.getutcseconds', 'Date.prototype.getUTCSeconds')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Date.getUTCSeconds")}}</p> +</div> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("Date.prototype.getSeconds()")}}</li> + <li>{{jsxref("Date.prototype.setUTCSeconds()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/date/getyear/index.html b/files/zh-cn/web/javascript/reference/global_objects/date/getyear/index.html new file mode 100644 index 0000000000..29f69b85d5 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/date/getyear/index.html @@ -0,0 +1,114 @@ +--- +title: Date.prototype.getYear() +slug: Web/JavaScript/Reference/Global_Objects/Date/getYear +translation_of: Web/JavaScript/Reference/Global_Objects/Date/getYear +--- +<div>{{JSRef("Global_Objects", "Date")}} {{Deprecated_header("")}}</div> + +<p>getYear() 方法返回指定的本地日期的年份。因为 <code>getYear</code> 不返回千禧年[full years] ("year 2000 problem")，所以这个方法不再被使用，现在替换为 {{jsxref("Date.getFullYear", "getFullYear")}} .</p> + +<h2 id="Syntax" name="Syntax">Syntax</h2> + +<pre class="syntaxbox"><code>dateObj.getYear() </code></pre> + +<h3 id="Parameters" name="Parameters">Parameters</h3> + +<p>None.</p> + +<h3 id="Description" name="Description">Returns</h3> + +<p>The <code>getYear</code> method returns the year minus 1900; thus:</p> + +<ul> + <li>For years greater than or equal to 2000, the value returned by <code>getYear</code> is 100 or greater. For example, if the year is 2026, <code>getYear</code> returns 126.</li> + <li>For years between and including 1900 and 1999, the value returned by <code>getYear</code> is between 0 and 99. For example, if the year is 1976, <code>getYear</code> returns 76.</li> + <li>For years less than 1900, the value returned by <code>getYear</code> is less than 0. For example, if the year is 1800, <code>getYear</code> returns -100.</li> +</ul> + +<p>To take into account years before and after 2000, you should use {{jsxref("Date.getFullYear", "getFullYear()")}} instead of <code>getYear</code> so that the year is specified in full.</p> + +<h2 id="Backward_Compatibility" name="Backward_Compatibility">Backward Compatibility</h2> + +<h3 id="JavaScript_1.2_and_earlier" name="JavaScript_1.2_and_earlier">Behaviour in JavaScript 1.2 and earlier</h3> + +<p>The <code>getYear</code> method returns either a 2-digit or 4-digit year:</p> + +<ul> + <li>For years between and including 1900 and 1999, the value returned by <code>getYear</code> is the year minus 1900. For example, if the year is 1976, the value returned is 76.</li> + <li>For years less than 1900 or greater than 1999, the value returned by <code>getYear</code> is the four-digit year. For example, if the year is 1856, the value returned is 1856. If the year is 2026, the value returned is 2026.</li> +</ul> + +<h2 id="Examples" name="Examples">Examples</h2> + +<h3 id="Example:_Years_between_1900_and_1999" name="Example:_Years_between_1900_and_1999">Example: Years between 1900 and 1999</h3> + +<p>The second statement assigns the value 95 to the variable <code>year</code>.</p> + +<pre class="brush:js">var Xmas = new Date("December 25, 1995 23:15:00"); +var year = Xmas.getYear(); // returns 95 +</pre> + +<h3 id="Example:_Years_above_1999" name="Example:_Years_above_1999">Example: Years above 1999</h3> + +<p>The second statement assigns the value 100 to the variable <code>year</code>.</p> + +<pre class="brush:js">var Xmas = new Date("December 25, 2000 23:15:00"); +var year = Xmas.getYear(); // returns 100 +</pre> + +<h3 id="Example:_Years_below_1900" name="Example:_Years_below_1900">Example: Years below 1900</h3> + +<p>The second statement assigns the value -100 to the variable <code>year</code>.</p> + +<pre class="brush:js">var Xmas = new Date("December 25, 1800 23:15:00"); +var year = Xmas.getYear(); // returns -100 +</pre> + +<h3 id="Example:_Setting_and_getting_a_year_between_1900_and_1999" name="Example:_Setting_and_getting_a_year_between_1900_and_1999">Example: Setting and getting a year between 1900 and 1999</h3> + +<p>The second statement assigns the value 95 to the variable <code>year</code>, representing the year 1995.</p> + +<pre class="brush:js">var Xmas.setYear(95); +var year = Xmas.getYear(); // returns 95 +</pre> + +<h2 id="Specifications">Specifications</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>ECMAScript 1st Edition. Implemented in JavaScript 1.0</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-B.2.4', 'Date.prototype.getYear')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td>Defined in the (informative) compatibility annex.</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-date.prototype.getyear', 'Date.prototype.getYear')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Defined in the (normative) annex for additional features for web browsers.</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility">Browser compatibility</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Date.getYear")}}</p> + +<h2 id="See_Also" name="See_Also">See also</h2> + +<ul> + <li>{{jsxref("Date.prototype.getFullYear()")}}</li> + <li>{{jsxref("Date.prototype.getUTCFullYear()")}}</li> + <li>{{jsxref("Date.prototype.setYear()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/date/index.html b/files/zh-cn/web/javascript/reference/global_objects/date/index.html new file mode 100644 index 0000000000..9cacee3238 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/date/index.html @@ -0,0 +1,248 @@ +--- +title: Date +slug: Web/JavaScript/Reference/Global_Objects/Date +tags: + - Date + - JavaScript + - 日期 + - 时间 +translation_of: Web/JavaScript/Reference/Global_Objects/Date +--- +<p>{{JSRef}}</p> + +<p>创建一个 JavaScript <code>Date</code> 实例，该实例呈现时间中的某个时刻。<code>Date</code> 对象则基于 <a href="http://pubs.opengroup.org/onlinepubs/9699919799/basedefs/V1_chap04.html#tag_04_16">Unix Time Stamp</a>，即自1970年1月1日（UTC）起经过的毫秒数。</p> + +<div>{{EmbedInteractiveExample("pages/js/date-constructor.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox notranslate">new Date(); +new Date(<var>value</var>); +new Date(<var>dateString</var>); +new Date(<var>year</var>, <var>monthIndex</var> [, <var>day</var> [, <var>hours</var> [, <var>minutes</var> [, <var>seconds</var> [, <var>milliseconds</var>]]]]]);</pre> + +<div class="note"> +<p>创建一个新<code>Date</code>对象的唯一方法是通过{{jsxref("Operators/new", "new")}} 操作符，例如：<code>let now = new Date();</code><br> + 若将它作为常规函数调用（即不加 {{jsxref("Operators/new", "new")}} 操作符），将返回一个字符串，而非 <code>Date</code> 对象。 </p> +</div> + +<h3 id="参数">参数</h3> + +<p><code>Date()</code>构造函数有四种基本形式</p> + +<h4 id="没有参数">没有参数</h4> + +<p>如果没有提供参数，那么新创建的Date对象表示实例化时刻的日期和时间。</p> + +<h4 id="Unix时间戳">Unix时间戳</h4> + +<dl> + <dt><code>value</code></dt> + <dd>一个 Unix 时间戳（<a href="http://pubs.opengroup.org/onlinepubs/9699919799/basedefs/V1_chap04.html#tag_04_16">Unix Time Stamp</a>），它是一个整数值，表示自1970年1月1日00:00:00 UTC（the Unix epoch）以来的毫秒数，忽略了闰秒。请注意大多数 Unix 时间戳功能仅精确到最接近的秒。</dd> + <dt> + <h4 id="时间戳字符串">时间戳字符串</h4> + </dt> + <dt><code>dateString</code></dt> + <dd>表示日期的字符串值。该字符串应该能被 {{jsxref("Date.parse()")}} 正确方法识别（即符合 <a href="http://tools.ietf.org/html/rfc2822#page-14" style="white-space: pre-line;">IETF-compliant RFC 2822 timestamps</a> 或 <a href="http://www.ecma-international.org/ecma-262/5.1/#sec-15.9.1.15">version of ISO8601</a>）。 + <div class="note"> + <p><strong>注意:</strong> 由于浏览器之间的差异与不一致性，强烈不推荐使用<code>Date</code>构造函数来解析日期字符串 (或使用与其等价的<code>Date.parse</code>)。对 RFC 2822 格式的日期仅有约定俗称的支持。 对 ISO 8601 格式的支持中，仅有日期的串 (例如 "1970-01-01") 会被处理为 UTC 而不是本地时间，与其他格式的串的处理不同。</p> + </div> + </dd> +</dl> + +<h4 id="分别提供日期与时间的每一个成员">分别提供日期与时间的每一个成员</h4> + +<p>当至少提供了年份与月份时，这一形式的 <code>Date() </code>返回的 <code>Date </code>对象中的每一个成员都来自下列参数。没有提供的成员将使用最小可能值（对日期为<code>1</code>，其他为<code>0</code>）。</p> + +<dl> + <dt><code>year</code></dt> + <dd>表示年份的整数值。 0到99会被映射至1900年至1999年，其它值代表实际年份。参见 {{anch("Two_digit_years_map_to_1900_-_1999", "示例")}}。</dd> + <dt><code>monthIndex</code></dt> + <dd>表示月份的整数值，从 0（1月）到 11（12月）。</dd> + <dt>date{{optional_inline}}</dt> + <dd>表示一个月中的第几天的整数值，从1开始。默认值为1。</dd> + <dt><code>hours</code> {{optional_inline}}</dt> + <dd>表示一天中的小时数的整数值 (24小时制)。默认值为0（午夜）。</dd> + <dt><code>minutes</code> {{optional_inline}}</dt> + <dd>表示一个完整时间（如 01:10:00）中的分钟部分的整数值。默认值为0。</dd> + <dt><code>seconds</code> {{optional_inline}}</dt> + <dd>表示一个完整时间（如 01:10:00）中的秒部分的整数值。默认值为0。</dd> + <dt><code>milliseconds</code> {{optional_inline}}</dt> + <dd>表示一个完整时间的毫秒部分的整数值。默认值为0。</dd> +</dl> + +<h2 id="使用注释">使用注释</h2> + +<div class="note"> +<p><strong>注意 参数</strong><code>monthIndex</code> 是从“0”开始计算的，这就意味着一月份为“0”，十二月份为“11”。</p> +</div> + +<div class="note"> +<p><strong>注意：</strong>当Date作为构造函数调用并传入多个参数时，如果数值大于合理范围时（如月份为 13 或者分钟数为 70），相邻的数值会被调整。比如 new Date(2013, 13, 1)等于new Date(2014, 1, 1)，它们都表示日期2014-02-01（注意月份是从0开始的）。其他数值也是类似，new Date(2013, 2, 1, 0, 70)等于new Date(2013, 2, 1, 1, 10)，都表示同一个时间：<code>2013-03-01T01:10:00</code>。</p> +</div> + +<div class="note"> +<p><strong>注意：</strong>当Date作为构造函数调用并传入多个参数时，所定义参数代表的是当地时间。如果需要使用世界协调时 UTC，使用 <code>new Date({{jsxref("Date.UTC()", "Date.UTC(...)")}})</code> 和相同参数。</p> +</div> + +<h2 id="简介">简介</h2> + +<ul> + <li>如果没有输入任何参数，则Date的构造器会依据系统设置的当前时间来创建一个Date对象。</li> + <li>如果提供了至少两个参数，其余的参数均会默认设置为 1（如果没有指定 day 参数）或者 0（如果没有指定 day 以外的参数）。</li> + <li>JavaScript的时间由世界标准时间（UTC）1970年1月1日开始，用毫秒计时，一天由 86,400,000 毫秒组成。<code>Date</code> 对象的范围是 -100,000,000 天至 100,000,000 天（等效的毫秒值）。</li> + <li><code>Date</code> 对象为跨平台提供了统一的行为。时间属性可以在不同的系统中表示相同的时刻，而如果使用了本地时间对象，则反映当地的时间。</li> + <li><code>Date</code> 对象支持多个处理 UTC 时间的方法，也相应地提供了应对当地时间的方法。UTC，也就是我们所说的格林威治时间，指的是time中的世界时间标准。而当地时间则是指执行JavaScript的客户端电脑所设置的时间。</li> + <li>以一个函数的形式来调用 <code>Date</code> 对象（即不使用 {{jsxref("Operators/new", "new")}} 操作符）会返回一个代表当前日期和时间的字符串。</li> +</ul> + +<h2 id="属性">属性</h2> + +<dl> + <dt>{{jsxref("Date.prototype")}}</dt> + <dd>允许为 <code>Date</code> 对象添加属性。</dd> + <dt><code>Date.length</code></dt> + <dd><code>Date.length</code> 的值是 7。这是该构造函数可接受的参数个数。</dd> +</dl> + +<h2 id="方法">方法</h2> + +<dl> + <dt>{{jsxref("Date.now()")}}</dt> + <dd>返回自 1970-1-1 00:00:00 UTC（世界标准时间）至今所经过的毫秒数。</dd> + <dt>{{jsxref("Date.parse()")}}</dt> + <dd>解析一个表示日期的字符串，并返回从 1970-1-1 00:00:00 所经过的毫秒数。 + <div class="note"> + <p><strong>注意:</strong> 由于浏览器差异和不一致，强烈建议不要使用<code>Date.parse</code>解析字符串。</p> + </div> + </dd> + <dt>{{jsxref("Date.UTC()")}}</dt> + <dd>接受和构造函数最长形式的参数相同的参数（从2到7），并返回从 1970-01-01 00:00:00 UTC 开始所经过的毫秒数。</dd> +</dl> + +<h2 id="JavaScript_Date_实例">JavaScript <code>Date</code> 实例</h2> + +<p>所有的 <code>Date</code> 实例都继承自 {{jsxref("Date.prototype")}}。修改 <code>Date </code>构造函数的原型对象会影响到所有的 <code>Date</code> 实例。</p> + +<h3 id="实例属性">实例属性</h3> + +<dl> + <dt><code>Date.prototype.constructor</code></dt> + <dd>返回创建了实例的构造函数，默认是 {{jsxref("Date")}} 构造函数。</dd> +</dl> + +<h3 id="实例方法">实例方法</h3> + +<p>{{ page("/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Date/prototype", "Methods") }}</p> + +<h2 id="例子">例子</h2> + +<h3 id=">例子：创建一个日期对象的几种方法">>例子：创建一个日期对象的几种方法</h3> + +<p>下例展示了用来创建一个日期对象的多种方法。</p> + +<div class="note"> +<p><strong>注意:</strong> 由于浏览器差异和不一致性，强烈建议不要使用<code>Date</code>构造函数（和<code>Date.parse</code>，它们是等效的）解析日期字符串。</p> +</div> + +<pre class="brush: js notranslate">var today = new Date(); +var birthday = new Date('December 17, 1995 03:24:00'); +var birthday = new Date('1995-12-17T03:24:00'); +var birthday = new Date(1995, 11, 17); +var birthday = new Date(1995, 11, 17, 3, 24, 0); +</pre> + +<h3 id="例子：将两位数年份映射为_1900_-_1999_年">例子：将两位数年份映射为 1900 - 1999 年</h3> + +<p>为了创建和获取 0 到 99 之间的年份，应使用 {{jsxref("Date.prototype.setFullYear()")}} 和 {{jsxref("Date.prototype.getFullYear()")}} 方法。</p> + +<pre class="brush: js notranslate">var date = new Date(98, 1); // Sun Feb 01 1998 00:00:00 GMT+0000 (GMT) + +// 已弃用的方法, 同样将 98 映射为 1998 +date.setYear(98); // Sun Feb 01 1998 00:00:00 GMT+0000 (GMT) + +date.setFullYear(98); // Sat Feb 01 0098 00:00:00 GMT+0000 (BST) +</pre> + +<h3 id="例子：计算经过的时间">例子：计算经过的时间</h3> + +<p>下例展示了如何以毫秒精度计算两个日期对象的时间差：</p> + +<p>由于不同日期、月份、年份长度的不同（日期长度不同来自夏令时的切换），使用大于秒、分钟、小时的单位表示经过的时间会遇到很多问题，在使用前需要经过详尽的调研。</p> + +<pre class="brush: js notranslate">// 使用 Date 对象 +var start = Date.now(); + +// 调用一个消耗一定时间的方法： +doSomethingForALongTime(); +var end = Date.now(); +var elapsed = end - start; // 以毫秒计的运行时长</pre> + +<pre class="brush: js notranslate">// 使用内建的创建方法 +var start = new Date(); + +// 调用一个消耗一定时间的方法： +doSomethingForALongTime(); +var end = new Date(); +var elapsed = end.getTime() - start.getTime(); // 运行时间的毫秒值</pre> + +<pre class="brush: js notranslate" dir="ltr">// to test a function and get back its return +function printElapsedTime (fTest) { + var nStartTime = Date.now(), + vReturn = fTest(), + nEndTime = Date.now(); + alert("Elapsed time: " + String(nEndTime - nStartTime) + " milliseconds"); + return vReturn; +} +yourFunctionReturn = printElapsedTime(yourFunction); +</pre> + +<div class="note"> +<p>注意：在支持 {{domxref("window.performance", "Web Performance API")}} 的高精细度（high-resolution）时间功能的浏览器中，{{domxref("Performance.now()")}} 提供的所经过的时间比 {{jsxref("Date.now()")}} 更加可靠、精确。</p> +</div> + +<h3 id="获取自_Unix_起始时间以来经过的秒数">获取自 Unix 起始时间以来经过的秒数</h3> + +<pre class="brush: js notranslate">var seconds = Math.floor(Date.now() / 1000);</pre> + +<p>注意此处需要返回一个整数 （仅做除法得到的不是整数），并且需要返回实际已经经过的秒数（所以这里使用了{{jsxref("Math.floor()")}}而不是{{jsxref("Math.round()")}}).</p> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范版本</th> + <th scope="col">规范状态</th> + <th scope="col">注解</th> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-date-objects', 'Date')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-date-objects', 'Date')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.9', 'Date')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES1')}}</td> + <td>{{Spec2('ES1')}}</td> + <td>Initial definition. Implemented in JavaScript 1.1.</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Date")}}</p> diff --git a/files/zh-cn/web/javascript/reference/global_objects/date/now/index.html b/files/zh-cn/web/javascript/reference/global_objects/date/now/index.html new file mode 100644 index 0000000000..317ecc8b69 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/date/now/index.html @@ -0,0 +1,101 @@ +--- +title: Date.now() +slug: Web/JavaScript/Reference/Global_Objects/Date/now +tags: + - Date + - JavaScript + - Method + - polyfill + - 参考 + - 方法 + - 时间 +translation_of: Web/JavaScript/Reference/Global_Objects/Date/now +--- +<div>{{JSRef}}</div> + +<p><strong><code>Date.now()</code></strong> 方法返回自 1970 年 1 月 1 日 00:00:00 (UTC) 到当前时间的毫秒数。</p> + +<div>{{EmbedInteractiveExample("pages/js/date-now.html")}}</div> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">var timeInMs = Date.now(); +</pre> + +<h3 id="返回值">返回值</h3> + +<p>一个 {{jsxref("Number")}}，表示自 UNIX 纪元开始（1970 年 1 月 1 日 00:00:00 (UTC)）到当前时间的毫秒数。</p> + +<h2 id="描述">描述</h2> + +<p>因为 <code>now()</code> 是 {{jsxref("Date")}} 的一个静态函数，所以必须以 <code>Date.now()</code> 的形式来使用。</p> + +<h2 id="时间精度被降低"><span class="tlid-translation translation" lang="zh-CN"><span title="">时间精度被降低</span></span></h2> + +<p><span class="tlid-translation translation" lang="zh-CN"><span title="">为了提供针对定时攻击和指纹追踪的保护，</span></span><code>Date.now()</code> <span class="tlid-translation translation" lang="zh-CN"><span title="">的精度可能会根据浏览器的高级设置项目而被取整。</span></span><br> + 在 Firefox 中，默认启用 <code>privacy.reduceTimerPrecision</code> 设置项，在 Firefox 59 中，默认被取整至 20 微秒；在 Firefox 60 中，则被取整至 2 毫秒。</p> + +<pre class="brush: js">// reduced time precision (2ms) in Firefox 60 +Date.now() +// 1519211809934 +// 1519211810362 +// 1519211811670 +// ... + + +// reduced time precision with `privacy.resistFingerprinting` enabled +Date.now(); +// 1519129853500 +// 1519129858900 +// 1519129864400 +// ... +</pre> + +<p>在 Firefox 中，还可以通过启用 <code>privacy.resistFingerprinting</code> 来进一步降低精度。启用后，精度将为 100 毫秒或者 <code>privacy.resistFingerprinting.reduceTimerPrecision.microseconds</code> 的值，取决于这两个值中哪一个更大，也就是，精度更低一些。</p> + +<h2 id="Polyfill">Polyfill</h2> + +<p>该方法在 ECMA-262 第五版中被标准化，可以通过下面的代码端来兼容那些不支持该方法的引擎：</p> + +<pre class="brush: js">if (!Date.now) { + Date.now = function now() { + return new Date().getTime(); + }; +} +</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>{{SpecName('ES5.1', '#sec-15.9.4.4', 'Date.now')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td>初始定义。在 JavaScript 1.5 中实现</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-date.now', 'Date.now')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> <br> + </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Date.now")}}</p> + +<h2 id="参见">参见</h2> + +<ul> + <li>{{domxref("Performance.now()")}} — 提供了精确到亚毫秒（sub-millisecond）的时间戳，用于衡量网页性能。</li> + <li>{{domxref("console.time")}} / {{domxref("console.timeEnd")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/date/parse/index.html b/files/zh-cn/web/javascript/reference/global_objects/date/parse/index.html new file mode 100644 index 0000000000..701f6fc103 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/date/parse/index.html @@ -0,0 +1,184 @@ +--- +title: Date.parse() +slug: Web/JavaScript/Reference/Global_Objects/Date/parse +tags: + - Date + - JavaScript + - Method + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Date/parse +--- +<div>{{JSRef("Global_Objects", "Date")}}</div> + +<p><code><strong>Date.parse()</strong></code> 方法解析一个表示某个日期的字符串，并返回从1970-1-1 00:00:00 UTC 到该日期对象（该日期对象的UTC时间）的毫秒数，如果该字符串无法识别，或者一些情况下，包含了不合法的日期数值（如：2015-02-31），则返回值为NaN。</p> + +<p>不推荐在ES5之前使用Date.parse方法，因为字符串的解析完全取决于实现。直到至今，不同宿主在如何解析日期字符串上仍存在许多差异，因此最好还是手动解析日期字符串（在需要适应不同格式时库能起到很大帮助）。 </p> + +<div>{{EmbedInteractiveExample("pages/js/date-parse.html")}}</div> + + + +<h2 id="Syntax" name="Syntax">语法</h2> + +<p>显式调用：</p> + +<pre class="syntaxbox"><code>Date.parse(dateString)</code></pre> + +<p><code>隐式调用：</code></p> + +<pre class="syntaxbox"><code>new Date(<var>dateString</var>).getTime()</code> +</pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>dateString</code></dt> + <dd>一个符合 <a class="external" href="http://tools.ietf.org/html/rfc2822#page-14" title="http://tools.ietf.org/html/rfc2822#page-14">RFC2822</a> 或 ISO 8601 日期格式的字符串（其他格式也许也支持，但结果可能与预期不符）。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<dl> + <dd>一个表示从1970-1-1 00:00:00 UTC到给定日期字符串所表示时间的毫秒数的数值。如果参数不能解析为一个有效的日期，则返回{{jsxref("NaN")}}。</dd> +</dl> + +<h2 id="Description" name="Description">描述</h2> + +<p><code>parse</code> 方法接受一个日期字符串（例如 "<code>Dec 25, 1995</code>"），并返回从1970-1-1 00:00:00 UTC到该日期字符串所表示日期的毫秒数。该方法在基于字符串值设置日期值时很有用，例如结合使用{{jsxref("Global_Objects/Date/setTime", "setTime()")}} 方法和 {{jsxref("Global_Objects/Date", "Date()")}} 构造函数。</p> + +<p><code>parse</code> 方法接受一个表示时间的字符串，返回相应的时间值。该方法可以接受符合 RFC2822 / IETF 日期语法 (<a class="external" href="http://tools.ietf.org/html/rfc2822#page-14" title="http://tools.ietf.org/html/rfc2822#page-14">RFC2822 Section 3.3</a>) 的字符串，如 "<code>Mon, 25 Dec 1995 13:30:00 GMT</code>"。该方法能够理解美国大陆时区的缩写，但是为了更通用，应该使用时区偏移，如 "<code>Mon, 25 Dec 1995 13:30:00 +0430</code>" （格林威治的子午线向东偏移4小时30分钟）。如果没有指定时区，默认使用本地时区。</p> + +<p>GMT 和 UTC 被看作相等。 如果 <a class="external" href="http://tools.ietf.org/html/rfc2822#page-14" title="http://tools.ietf.org/html/rfc2822#page-14">RFC2822 Section 3.3</a> 格式中不包含时区信息时，会以本地时区来解析日期字符串。</p> + +<p>由于在解析日期字符串时存在偏差会导致结果不一致，因此推荐始终手动解析日期字符串，特别是不同的ECMAScript实现会把诸如“2015-10-12 12:00:00”的字符串解析为NaN，UTC或者本地时间。</p> + +<h3 id="ECMAScript_5_ISO-8601_日期格式支持">ECMAScript 5 <span class="caps">ISO</span>-8601 日期格式支持</h3> + +<p>另外，日期时间字符串也可以使用 <a href="http://www.w3.org/TR/NOTE-datetime" title="http://www.w3.org/TR/NOTE-datetime">ISO 8601</a> 格式。例如，"<code>2011-10-10</code>" （仅日期）或 "<code>2011-10-10T14:48:00</code>" （日期和时间）能够作为参数被传递和解析。 如果参数字符串只包含日期格式，那么将会使用UTC时区来解析该参数。而如果是<a href="http://www.w3.org/TR/NOTE-datetime" title="http://www.w3.org/TR/NOTE-datetime">ISO 8601</a> 格式中规定的时间加日期的格式，则将会被作为本地时区处理。</p> + +<p>虽然在日期字符串解析过程中会使用时区修饰符，但返回值总会是从由NaN表示的1970-1-1 00:00:00 UTC到该日期字符串所表示日期的毫秒数。</p> + +<p>由于 <code>parse()</code> 是 {{jsxref("Date")}} 的一个静态方法 , 所以应该使用 <code>Date.parse()</code> 来调用，而不是作为 {{jsxref("Date")}} 的实例方法。</p> + +<h3 id="Differences in assumed time-zone" name="Differences in assumed time-zone">默认时区的区别</h3> + +<p>当输入为 "<code>March 7, 2014</code>" 时， <code>parse()</code> 将默认使用本地时区。但如果使用 ISO 格式如 <code>"2014-03-07"</code> ，则会被默认为 UTC (ES5 和 ECMAScript 2015) 时区。 因此除非系统本地时区为 UTC，由这些字符串解析出的 {{jsxref("Date")}} 对象可能会因为 ECMAScript 版本不同而代表不同的时间。这意味着两个看起来等效的字符串可能因为它们的格式不同而被转换成不同的值。</p> + +<h3 id="引擎相关的日期格式">引擎相关的日期格式</h3> + +<p>ECMAScript 规范规定：如果一个字符串不符合标准格式，则函数可以使用任何由引擎决定的策略或解析算法。 <code>Date.parse()</code> 对于因包含有无效元素而无法识别的 ISO 格式字符串或者日期应该返回 {{jsxref("NaN")}} 。</p> + +<p>但是， 在如 ECMA-262 规范中定义的情况，如果因为无效值而导致日期字符串不能被识别为 ISO 格式时，根据浏览器和给定的值不同，返回值可以是，也可以不是 {{jsxref("NaN")}} 。比如：</p> + +<pre class="brush: js line-numbers language-js"><code class="language-js"><span class="comment token">// 包含无效值的非 ISO 格式字符串</span> +<span class="keyword token">new</span> <span class="class-name token">Date</span><span class="punctuation token">(</span><span class="string token">'23/25/2014'</span><span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre> + +<p>在 Firefox 30 中会被识别为本地时区的2015年12月25日，而在 Safari 7 中则是无效日期。但是，如果字符串被识别为 ISO 格式并且包含无效值，则在所有遵循 ES5 或者更新标准的浏览器中都会返回 {{jsxref("NaN")}} 。</p> + +<pre class="brush: js line-numbers language-js"><code class="language-js"><span class="comment token">// 包含无效值的 ISO 格式字符串</span> +<span class="keyword token">new</span> <span class="class-name token">Date</span><span class="punctuation token">(</span><span class="string token">'2014-25-23'</span><span class="punctuation token">)</span><span class="punctuation token">.</span><span class="function token">toISOString</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">;</span> +<span class="comment token">// 在所有遵循 ES5的浏览器中返回 "RangeError: invalid date"</span></code></pre> + +<p>SpiderMonkey 的引擎策略可以在 <a href="http://mxr.mozilla.org/mozilla-central/source/js/src/jsdate.cpp?rev=64553c483cd1#889"><code>jsdate.cpp</code></a> 中找到。字符串 <code>"10 06 2014"</code> 可以作为非 ISO 格式字符串使用自定义处理方式的例子。参见这篇关于解析如何进行的<a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1023155#c6">粗略纲要</a>。</p> + +<pre class="brush: js line-numbers language-js"><code class="language-js"><span class="keyword token">new</span> <span class="class-name token">Date</span><span class="punctuation token">(</span><span class="string token">'10 06 2014'</span><span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre> + +<p>将会被解析为本地时间 2014年10月6日，而不是6月10日。另一个例子</p> + +<pre class="brush: js line-numbers language-js"><code class="language-js"><span class="keyword token">new</span> <span class="class-name token">Date</span><span class="punctuation token">(</span><span class="string token">'foo-bar 2014'</span><span class="punctuation token">)</span><span class="punctuation token">.</span><span class="function token">toString</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">;</span> +<span class="comment token">// 返回: "Invalid Date"</span> + +Date<span class="punctuation token">.</span><span class="function token">parse</span><span class="punctuation token">(</span><span class="string token">'foo-bar 2014'</span><span class="punctuation token">)</span><span class="punctuation token">;</span> +<span class="comment token">// 返回: NaN</span></code></pre> + +<h2 id="Examples" name="Examples">例子</h2> + +<h3 id="Example:_Using_parse" name="Example:_Using_parse">例子：使用 <code>Date.parse()</code></h3> + +<p>如果 <code>IPOdate</code> 是一个已经存在的 {{jsxref("Date")}} 对象，则可以把其设置为本地时间 1995年8月9日。如下：</p> + +<pre class="brush: js line-numbers language-js"><code class="language-js">IPOdate<span class="punctuation token">.</span><span class="function token">setTime</span><span class="punctuation token">(</span>Date<span class="punctuation token">.</span><span class="function token">parse</span><span class="punctuation token">(</span><span class="string token">'Aug 9, 1995'</span><span class="punctuation token">)</span><span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre> + +<p>其他一些解析非标准格式日期的例子：</p> + +<pre class="brush: js">Date.parse("Aug 9, 1995"); +</pre> + +<p>在时区 GMT-0300 中返回 807937200000 ，在其他时区中返回另外的值，因为未指定时区并且不是 ISO 格式，所以默认使用本地时区。</p> + +<pre class="brush: js">Date.parse("Wed, 09 Aug 1995 00:00:00 GMT"); +</pre> + +<p>因为指定了时区 GMT (UTC)，所以不管本地时区如何，总是返回 <code>807926400000</code> 。</p> + +<pre class="brush: js">Date.parse("Wed, 09 Aug 1995 00:00:00"); +</pre> + +<p>在时区 GMT-0300 中返回 807937200000 ，在其他时区中返回另外的值，因为没有时区标志并且不是 ISO 格式，所以作为本地时区处理。</p> + +<pre class="brush: js">Date.parse("Thu, 01 Jan 1970 00:00:00 GMT"); +</pre> + +<p>因为指定了时区 GMT (UTC)，所以不管本地时区如何，总是返回<code> 0</code> 。</p> + +<pre class="brush: js">Date.parse("Thu, 01 Jan 1970 00:00:00"); +</pre> + +<p>在时区 GMT-0400 中返回 <code>14400000</code>，在其他时区中返回另外的值，因为未指定时区并且不是 ISO 格式，所以使用本地时区处理。</p> + +<pre class="brush: js">Date.parse("Thu, 01 Jan 1970 00:00:00 GMT-0400"); +</pre> + +<p>因为指定了时区 GMT (UTC)，所以不管本地时区如何，总是返回<code> </code><code>14400000</code> 。</p> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范版本</th> + <th scope="col">规范状态</th> + <th scope="col">注解</th> + </tr> + <tr> + <td>ECMAScript 1st Edition. Implemented in JavaScript 1.0</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.9.4.2', 'Date.parse')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td>ISO 8601 format added</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-date.parse', 'Date.parse')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-date.parse', 'Date.parse')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p> </p> + +<div class="hidden"> +<p>The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>and send us a pull request.</p> +</div> + +<p>{{Compat("javascript.builtins.Date.parse")}}</p> + +<h2 id="See_also" name="See_also">兼容性提示</h2> + +<p>Firefox 49 {{geckoRelease(49)}} 修改了解析2位数年份的方式，从和 Internet Explorer 一致改为和 Google Chrome 浏览器一致。现在，2位数的年份小于等于 <code>50</code> 的将会被解析为21世纪的年份。比如， <code>04/16/17</code> ，在之前会被解析为 1917年4月16日，现在将被解析为 2017年4月16日。为了避免任何可能的同步问题或者有歧义的年份，推荐使用 ISO 8601 格式如 "2017-04-16" ({{bug(1265136)}})。</p> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("Date.UTC()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/date/prototype/index.html b/files/zh-cn/web/javascript/reference/global_objects/date/prototype/index.html new file mode 100644 index 0000000000..198a479453 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/date/prototype/index.html @@ -0,0 +1,180 @@ +--- +title: Date.prototype +slug: Web/JavaScript/Reference/Global_Objects/Date/prototype +tags: + - Date + - JavaScript + - Property +translation_of: Web/JavaScript/Reference/Global_Objects/Date +--- +<div>{{JSRef}}</div> + +<p><strong><code>Date.prototype</code></strong> 属性表示{{jsxref("Date")}}构造函数的原型。</p> + +<div>{{js_property_attributes(0,0,1)}}</div> + +<h2 id="Description" name="Description">描述</h2> + +<p>{{jsxref("Date")}}实例继承自<code>Date.prototype</code>。可以通过修改构造函数的原型对象来影响 {{jsxref("Date")}}实例继承的属性和方法。</p> + +<p>为了兼容千禧年计算（也即考虑到 2000 年），应该总是指定完整的年份，例如，使用 1998，而不是 98。为了方便以完整的格式指定年份， JavaScript 包含了相应的方法{{jsxref("Global_Objects/Date/getFullYear", "getFullYear()")}}，{{jsxref("Global_Objects/Date/setFullYear", "setFullYear()")}}， {{jsxref("Global_Objects/Date/getUTCFullYear", "getUTCFullYear()")}} 和{{jsxref("Global_Objects/Date/setUTCFullYear", "setUTCFullYear()")}}。</p> + +<p>从 ECMAScript 6 开始，<code>Date.prototype</code>本身就是一个普通的对象。不是{{jsxref("Date")}}的实例。</p> + +<h2 id="Properties" name="Properties">属性</h2> + +<dl> + <dt><code>Date.prototype.constructor</code></dt> + <dd>返回创建该实例的函数。默认是<code>Date</code>构造函数。</dd> +</dl> + +<h2 id="Methods" name="Methods">方法</h2> + +<h3 id="Getter">Getter</h3> + +<dl> + <dt>{{jsxref("Date.prototype.getDate()")}}</dt> + <dd>根据本地时间返回指定日期对象的月份中的第几天（1-31）。</dd> + <dt>{{jsxref("Date.prototype.getDay()")}}</dt> + <dd>根据本地时间返回指定日期对象的星期中的第几天（0-6）。</dd> + <dt>{{jsxref("Date.prototype.getFullYear()")}}</dt> + <dd>根据本地时间返回指定日期对象的年份（四位数年份时返回四位数字）。</dd> + <dt>{{jsxref("Date.prototype.getHours()")}}</dt> + <dd>根据本地时间返回指定日期对象的小时（0-23）。</dd> + <dt>{{jsxref("Date.prototype.getMilliseconds()")}}</dt> + <dd>根据本地时间返回指定日期对象的毫秒（0-999）。</dd> + <dt>{{jsxref("Date.prototype.getMinutes()")}}</dt> + <dd>根据本地时间返回指定日期对象的分钟（0-59）。</dd> + <dt>{{jsxref("Date.prototype.getMonth()")}}</dt> + <dd>根据本地时间返回指定日期对象的月份（0-11）。</dd> + <dt>{{jsxref("Date.prototype.getSeconds()")}}</dt> + <dd>根据本地时间返回指定日期对象的秒数（0-59）。</dd> + <dt>{{jsxref("Date.prototype.getTime()")}}</dt> + <dd>返回从1970-1-1 00:00:00 UTC（协调世界时）到该日期经过的毫秒数，对于1970-1-1 00:00:00 UTC之前的时间返回负值。</dd> + <dt>{{jsxref("Date.prototype.getTimezoneOffset()")}}</dt> + <dd>返回当前时区的时区偏移。</dd> + <dt>{{jsxref("Date.prototype.getUTCDate()")}}</dt> + <dd>根据世界时返回特定日期对象一个月的第几天（1-31）.</dd> + <dt>{{jsxref("Date.prototype.getUTCDay()")}}</dt> + <dd>根据世界时返回特定日期对象一个星期的第几天（0-6）.</dd> + <dt>{{jsxref("Date.prototype.getUTCFullYear()")}}</dt> + <dd>根据世界时返回特定日期对象所在的年份（4位数）.</dd> + <dt>{{jsxref("Date.prototype.getUTCHours()")}}</dt> + <dd>根据世界时返回特定日期对象当前的小时（0-23）.</dd> + <dt>{{jsxref("Date.prototype.getUTCMilliseconds()")}}</dt> + <dd>根据世界时返回特定日期对象的毫秒数（0-999）.</dd> + <dt>{{jsxref("Date.prototype.getUTCMinutes()")}}</dt> + <dd>根据世界时返回特定日期对象的分钟数（0-59）.</dd> + <dt>{{jsxref("Date.prototype.getUTCMonth()")}}</dt> + <dd>根据世界时返回特定日期对象的月份（0-11）.</dd> + <dt>{{jsxref("Date.prototype.getUTCSeconds()")}}</dt> + <dd>根据世界时返回特定日期对象的秒数（0-59）.</dd> + <dt>{{jsxref("Date.prototype.getYear()")}}{{deprecated_inline}}</dt> + <dd>根据特定日期返回年份 (通常 2-3 位数). 使用 {{jsxref("Global_Objects/Date/getFullYear", "getFullYear()")}} .</dd> +</dl> + +<h3 id="Setter">Setter</h3> + +<dl> + <dt>{{jsxref("Date.prototype.setDate()")}}</dt> + <dd>根据本地时间为指定的日期对象设置月份中的第几天。</dd> + <dt>{{jsxref("Date.prototype.setFullYear()")}}</dt> + <dd>根据本地时间为指定日期对象设置完整年份（四位数年份是四个数字）。</dd> + <dt>{{jsxref("Date.prototype.setHours()")}}</dt> + <dd>根据本地时间为指定日期对象设置小时数。</dd> + <dt>{{jsxref("Date.prototype.setMilliseconds()")}}</dt> + <dd>根据本地时间为指定日期对象设置毫秒数。</dd> + <dt>{{jsxref("Date.prototype.setMinutes()")}}</dt> + <dd>根据本地时间为指定日期对象设置分钟数。</dd> + <dt>{{jsxref("Date.prototype.setMonth()")}}</dt> + <dd>根据本地时间为指定日期对象设置月份。</dd> + <dt>{{jsxref("Date.prototype.setSeconds()")}}</dt> + <dd>根据本地时间为指定日期对象设置秒数。</dd> + <dt>{{jsxref("Date.prototype.setTime()")}}</dt> + <dd>通过指定从 1970-1-1 00:00:00 UTC 开始经过的毫秒数来设置日期对象的时间，对于早于 1970-1-1 00:00:00 UTC的时间可使用负值。</dd> + <dt>{{jsxref("Date.prototype.setUTCDate()")}}</dt> + <dd>根据世界时设置 Date 对象中月份的一天 (1 ~ 31)。</dd> + <dt>{{jsxref("Date.prototype.setUTCFullYear()")}}</dt> + <dd>根据世界时设置 Date 对象中的年份（四位数字）。</dd> + <dt>{{jsxref("Date.prototype.setUTCHours()")}}</dt> + <dd>根据世界时设置 Date 对象中的小时 (0 ~ 23)。</dd> + <dt>{{jsxref("Date.prototype.setUTCMilliseconds()")}}</dt> + <dd>根据世界时设置 Date 对象中的毫秒 (0 ~ 999)。</dd> + <dt>{{jsxref("Date.prototype.setUTCMinutes()")}}</dt> + <dd>根据世界时设置 Date 对象中的分钟 (0 ~ 59)。</dd> + <dt>{{jsxref("Date.prototype.setUTCMonth()")}}</dt> + <dd>根据世界时设置 Date 对象中的月份 (0 ~ 11)。</dd> + <dt>{{jsxref("Date.prototype.setUTCSeconds()")}}</dt> + <dd>根据世界时设置 Date 对象中的秒钟 (0 ~ 59)。</dd> + <dt>{{jsxref("Date.prototype.setYear()")}} {{deprecated_inline}}</dt> + <dd>setYear() 方法用于设置年份。请使用 {{jsxref("Global_Objects/Date/setFullYear", "setFullYear()")}} 方法代替。</dd> +</dl> + +<h3 id="Conversion_getter">Conversion getter</h3> + +<dl> + <dt>{{jsxref("Date.prototype.toDateString()")}}</dt> + <dd>以人类易读（human-readable）的形式返回该日期对象日期部分的字符串。</dd> + <dt>{{jsxref("Date.prototype.toISOString()")}}</dt> + <dd>把一个日期转换为符合 ISO 8601 扩展格式的字符串。</dd> + <dt>{{jsxref("Date.prototype.toJSON()")}}</dt> + <dd>使用 {{jsxref("Global_Objects/Date/toISOString", "toISOString()")}} 返回一个表示该日期的字符串。为了在 {{jsxref("JSON.stringify()")}} 方法中使用。</dd> + <dt>{{jsxref("Date.prototype.toGMTString()")}} {{deprecated_inline}}</dt> + <dd>返回一个基于 GMT (UT) 时区的字符串来表示该日期。请使用 {{jsxref("Global_Objects/Date/toUTCString", "toUTCString()")}} 方法代替。</dd> + <dt>{{jsxref("Date.prototype.toLocaleDateString()")}}</dt> + <dd>返回一个表示该日期对象日期部分的字符串，该字符串格式与系统设置的地区关联（locality sensitive）。</dd> + <dt>{{jsxref("Date.prototype.toLocaleFormat()")}} {{non-standard_inline}}</dt> + <dd>使用格式字符串将日期转换为字符串。</dd> + <dt>{{jsxref("Date.prototype.toLocaleString()")}}</dt> + <dd>返回一个表示该日期对象的字符串，该字符串与系统设置的地区关联（locality sensitive）。覆盖了 {{jsxref("Global_Objects/Object/toLocaleString", "Object.prototype.toLocaleString()")}} 方法。</dd> + <dt>{{jsxref("Date.prototype.toLocaleTimeString()")}}</dt> + <dd>返回一个表示该日期对象时间部分的字符串，该字符串格式与系统设置的地区关联（locality sensitive）。</dd> + <dt>{{jsxref("Date.prototype.toSource()")}}{{non-standard_inline}}</dt> + <dd>返回一个与{{jsxref("Date")}}等价的原始字符串对象，你可以使用这个值去生成一个新的对象。重写了 {{jsxref("Object.prototype.toSource()")}} 这个方法。</dd> + <dt>{{jsxref("Date.prototype.toString()")}}</dt> + <dd>返回一个表示该日期对象的字符串。覆盖了{{jsxref("Object.prototype.toString()")}} 方法。</dd> + <dt>{{jsxref("Date.prototype.toTimeString()")}}</dt> + <dd>以人类易读格式返回日期对象时间部分的字符串。</dd> + <dt>{{jsxref("Date.prototype.toUTCString()")}}</dt> + <dd>把一个日期对象转换为一个以UTC时区计时的字符串。</dd> + <dt>{{jsxref("Date.prototype.valueOf()")}}</dt> + <dd>返回一个日期对象的原始值。覆盖了 {{jsxref("Object.prototype.valueOf()")}} 方法。</dd> +</dl> + +<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('ES1')}}</td> + <td>{{Spec2('ES1')}}</td> + <td>Initial definition. Implemented in JavaScript 1.1.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.9.5', 'Date.prototype')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-properties-of-the-date-prototype-object', 'Date.prototype')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-properties-of-the-date-prototype-object', 'Date.prototype')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Date.prototype")}}</p> diff --git a/files/zh-cn/web/javascript/reference/global_objects/date/setdate/index.html b/files/zh-cn/web/javascript/reference/global_objects/date/setdate/index.html new file mode 100644 index 0000000000..e044a3b9f3 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/date/setdate/index.html @@ -0,0 +1,79 @@ +--- +title: Date.prototype.setDate() +slug: Web/JavaScript/Reference/Global_Objects/Date/setDate +translation_of: Web/JavaScript/Reference/Global_Objects/Date/setDate +--- +<div>{{JSRef("Global_Objects", "Date")}}</div> + +<p><code><strong>setDate()</strong></code> 方法根据本地时间来指定一个日期对象的天数。</p> + +<div>{{EmbedInteractiveExample("pages/js/date-setdate.html")}}</div> + + + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code><var>dateObj</var>.setDate(<em>dayValue</em>)</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>dayValue</code></dt> + <dd>一个整数，表示该月的第几天。</dd> +</dl> + +<h2 id="Description" name="Description">描述</h2> + +<p>如果 <code>dayValue</code> 超出了月份的合理范围，<code>setDate</code> 将会相应地更新 <code>Date</code> 对象。</p> + +<p>例如，如果为 <code>dayValue</code> 指定0，那么日期就会被设置为上个月的最后一天。</p> + +<p>如果dayValue被设置为负数，日期会设置为上个月最后一天往前数这个负数绝对值天数后的日期。-1会设置为上月最后一天的前一天（译者注：例如当前为4月，如果setDate(-2),则为3月29日）</p> + +<h2 id="Examples" name="Examples">例子</h2> + +<h3 id="Example_Using_setDate" name="Example:_Using_setDate">例子：使用<code>setDate</code>方法</h3> + +<pre class="brush:js">var theBigDay = new Date(1962, 6, 7); // 1962-07-07 +theBigDay.setDate(24); // 1962-07-24 +theBigDay.setDate(32); // 1962-08-01</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>ECMAScript 1st Edition. Implemented in JavaScript 1.0</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.9.5.36', 'Date.prototype.setDate')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-date.prototype.setdate', 'Date.prototype.setDate')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Date.setDate")}}</p> + +<h2 id="See_Also" name="See_Also">相关链接</h2> + +<ul> + <li>{{jsxref("Date.prototype.getDate()")}}</li> + <li>{{jsxref("Date.prototype.setUTCDate()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/date/setfullyear/index.html b/files/zh-cn/web/javascript/reference/global_objects/date/setfullyear/index.html new file mode 100644 index 0000000000..7f6b70ac9a --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/date/setfullyear/index.html @@ -0,0 +1,81 @@ +--- +title: Date.prototype.setFullYear() +slug: Web/JavaScript/Reference/Global_Objects/Date/setFullYear +translation_of: Web/JavaScript/Reference/Global_Objects/Date/setFullYear +--- +<div>{{JSRef("Global_Objects", "Date")}}</div> + +<p><code><strong>setFullYear()</strong></code> 方法根据本地时间为一个日期对象设置年份。</p> + +<div>{{EmbedInteractiveExample("pages/js/date-setfullyear.html")}}</div> + + + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox language-html" style="margin-bottom: 0px; padding: 1em; border-left-width: 6px; border-left-style: solid; font-family: Consolas, Monaco, 'Andale Mono', monospace; font-size: 14px; text-shadow: none; direction: ltr; white-space: normal; background-color: rgba(212, 221, 228, 0.498039);"><code class="language-html" style="font-family: Consolas, Monaco, 'Andale Mono', monospace; color: inherit; text-shadow: none; direction: ltr;">dateObj.setFullYear(yearValue[, monthValue[, dayValue]])</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>yearValue</code></dt> + <dd>指定年份的整数值，例如1995。</dd> + <dt><code>monthValue</code></dt> + <dd>一个0到11之间的整数值，表示从一月到十二月。</dd> + <dt><code>dayValue</code></dt> + <dd>一个1到31之间的整数值，表示月份中的第几天。如果你指定了 <code>dayValue</code> 参数，就必须同时指定 <code>monthValue</code>。</dd> +</dl> + +<h2 id="Description" name="Description">描述</h2> + +<p>如果没有指定 <code>monthValue</code> 和<code>dayValue</code> 参数，将会使用 <code>getMonth</code> 和<code>getDate</code> 方法的返回值。</p> + +<p>如果有一个参数超出了合理的范围，<code>setFullYear</code> 方法会更新其他参数值，日期对象的日期值也会被相应更新。 例如，为 <code>monthValue </code>指定 15， 则年份会加1，月份值会为3。</p> + +<h2 id="Examples" name="Examples">例子</h2> + +<h3 id="Example:_Using_setFullYear" name="Example:_Using_setFullYear">例子：使用<code>setFullYear</code>方法</h3> + +<pre class="brush:js language-js" style="padding: 1em 0px 1em 30px; border-left-width: 6px; border-left-style: solid; font-family: Consolas, Monaco, 'Andale Mono', monospace; font-size: 14px; text-shadow: none; direction: ltr; white-space: normal; background-color: rgba(234, 239, 242, 0.247059);"><code class="language-js" style="font-family: Consolas, Monaco, 'Andale Mono', monospace; color: inherit; text-shadow: none; direction: ltr; white-space: pre;"><span class="keyword token" style="color: #0077aa;">var</span> theBigDay <span class="operator token" style="background: rgba(255, 255, 255, 0.498039); color: #a67f59;">=</span> <span class="keyword token" style="color: #0077aa;">new</span> <span class="class-name token">Date</span><span class="punctuation token" style="color: #999999;">(</span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span> +theBigDay<span class="punctuation token" style="color: #999999;">.</span><span class="function token">setFullYear<span class="punctuation token" style="color: #999999;">(</span></span><span class="number token" style="color: #990055;">1997</span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span></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>ECMAScript 1st Edition. Implemented in JavaScript 1.3</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.9.5.40', 'Date.prototype.setFullYear')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-date.prototype.setfullyear', 'Date.prototype.setFullYear')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Date.setFullYear")}}</p> + +<h2 id="See_Also" name="See_Also">相关链接</h2> + +<ul> + <li>{{jsxref("Date.prototype.getUTCFullYear()")}}</li> + <li>{{jsxref("Date.prototype.setUTCFullYear()")}}</li> + <li>{{jsxref("Date.prototype.setYear()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/date/sethours/index.html b/files/zh-cn/web/javascript/reference/global_objects/date/sethours/index.html new file mode 100644 index 0000000000..f23dab9d13 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/date/sethours/index.html @@ -0,0 +1,88 @@ +--- +title: Date.prototype.setHours() +slug: Web/JavaScript/Reference/Global_Objects/Date/setHours +translation_of: Web/JavaScript/Reference/Global_Objects/Date/setHours +--- +<div>{{JSRef("Global_Objects", "Date")}}</div> + +<p><code><strong>setHours()</strong></code> 方法根据本地时间为一个日期对象设置小时数，返回从1970-01-01 00:00:00 UTC 到更新后的 {{jsxref("Global_Objects/Date", "日期")}} 对象实例所表示时间的毫秒数。</p> + +<div>{{EmbedInteractiveExample("pages/js/date-sethours.html")}}</div> + + + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox">dateObj.setHours(<em>hoursValue</em>[, <em>minutesValue</em>[, <em>secondsValue</em><span style="line-height: normal;">[</span><span style="line-height: normal;">, </span><em>msValue</em><span style="line-height: normal;">]]])</span> +</pre> + +<h3 id="Versions_prior_to_JavaScript_1.3" name="Versions_prior_to_JavaScript_1.3">JavaScript 1.3版本之前</h3> + +<pre class="syntaxbox"><code>dateObj.setHours(<em>hoursValue</em>) </code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>hoursValue</code></dt> + <dd>一个 0 到 23 的整数，表示小时。</dd> + <dt><code>minutesValue</code></dt> + <dd>一个 0 到 59 的整数，表示分钟。</dd> + <dt><code>secondsValue</code></dt> + <dd>一个 0 到 59 的整数，表示秒数。如果指定了 <code>secondsValue</code> 参数，则必须同时指定 <code>minutesValue </code>参数。</dd> + <dt><code>msValue</code></dt> + <dd>一个 0 到 999 的数字，表示微秒数，如果指定了 <code>msValue</code> 参数，则必须同时指定 <code>minutesValue</code> 和 <code>secondsValue</code> 参数。</dd> +</dl> + +<h2 id="Description" name="Description">描述</h2> + +<p>如果不指定 <code>minutesValue</code>，<code>secondsValue</code> 和 <code>msValue</code> 参数，则会使用{{jsxref("Date.getMinutes", "getMinutes()")}}，{{jsxref("Date.getSeconds", "getSeconds()")}} 和{{jsxref("Date.getMilliseconds", "getMilliseconds()")}} 方法的返回值。</p> + +<p>如果有一个参数超出了合理范围，<code>setHours</code> 会相应地更新日期对象中的日期信息。例如，如果为 <code>secondsValue</code> 指定了 100，则分钟会加 1，然后秒数使用 40。</p> + +<h2 id="Examples" name="Examples">例子</h2> + +<h3 id="Example:_Using_setHours" name="Example:_Using_setHours">例子：使用<code>setHours方法</code></h3> + +<pre class="brush:js">var theBigDay = new Date(); +theBigDay.setHours(7); +</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>ECMAScript 1st Edition. Implemented in JavaScript 1.0</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.9.5.34', 'Date.prototype.setHours')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-date.prototype.sethours', 'Date.prototype.setHours')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Date.setHours")}}</p> + +<h2 id="See_Also" name="See_Also">相关链接</h2> + +<ul> + <li>{{jsxref("Date.prototype.getHours()")}}</li> + <li>{{jsxref("Date.prototype.setUTCHours()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/date/setmilliseconds/index.html b/files/zh-cn/web/javascript/reference/global_objects/date/setmilliseconds/index.html new file mode 100644 index 0000000000..8eac30a518 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/date/setmilliseconds/index.html @@ -0,0 +1,75 @@ +--- +title: Date.prototype.setMilliseconds() +slug: Web/JavaScript/Reference/Global_Objects/Date/setMilliseconds +translation_of: Web/JavaScript/Reference/Global_Objects/Date/setMilliseconds +--- +<div>{{JSRef("Global_Objects", "Date")}}</div> + +<p><code><strong>setMilliseconds()</strong></code> 方法会根据本地时间设置一个日期对象的豪秒数。</p> + +<div>{{EmbedInteractiveExample("pages/js/date-setmilliseconds.html")}}</div> + + + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><var>dateObj</var>.setMilliseconds(<em>millisecondsValue</em>)</pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>millisecondsValue</code></dt> + <dd>一个 0 到 999 的数字，表示豪秒数。</dd> +</dl> + +<h2 id="Description" name="Description">描述</h2> + +<p>如果指定的数字超出了合理范围，则日期对象的时间信息会被相应地更新。例如，如果指定了 1005，则秒数加 1，豪秒数为 5。</p> + +<h2 id="Examples" name="Examples">例子</h2> + +<h3 id="Example:_Using_setMilliseconds" name="Example:_Using_setMilliseconds">例子：使用<code>setMilliseconds</code></h3> + +<pre class="brush:js">var theBigDay = new Date(); +theBigDay.setMilliseconds(100); +</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>ECMAScript 1st Edition. Implemented in JavaScript 1.3</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.9.5.28', 'Date.prototype.setMilliseconds')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-date.prototype.setmilliseconds', 'Date.prototype.setMilliseconds')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Date.setMilliseconds")}}</p> + +<h2 id="See_Also" name="See_Also">相关链接</h2> + +<ul> + <li>{{jsxref("Date.prototype.getMilliseconds()")}}</li> + <li>{{jsxref("Date.prototype.setUTCMilliseconds()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/date/setminutes/index.html b/files/zh-cn/web/javascript/reference/global_objects/date/setminutes/index.html new file mode 100644 index 0000000000..13421b2817 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/date/setminutes/index.html @@ -0,0 +1,91 @@ +--- +title: Date.prototype.setMinutes() +slug: Web/JavaScript/Reference/Global_Objects/Date/setMinutes +translation_of: Web/JavaScript/Reference/Global_Objects/Date/setMinutes +--- +<div>{{JSRef("Global_Objects", "Date")}}</div> + +<p><code><strong>setMinutes()</strong></code> 方法根据本地时间为一个日期对象设置分钟数。</p> + +<div>{{EmbedInteractiveExample("pages/js/date-setminutes.html")}}</div> + + + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><var>dateObj</var>.setMinutes(<em>minutesValue</em>[, <em>secondsValue</em>[, <em>msValue</em>]])</pre> + +<h3 id="Versions_prior_to_JavaScript_1.3" name="Versions_prior_to_JavaScript_1.3"> JavaScript 1.3之前版本</h3> + +<pre class="syntaxbox"><var>dateObj</var>.setMinutes(<em>minutesValue</em>)</pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>minutesValue</code></dt> + <dd>一个 0 到 59 的整数，表示分钟数。</dd> +</dl> + +<dl> + <dt><code>secondsValue</code></dt> + <dd>一个 0 到 59 的整数，表示秒数。如果指定了 <code>secondsValue</code> 参数，则必须同时指定 <code>minutesValue</code> 参数。</dd> +</dl> + +<dl> + <dt><code>msValue</code></dt> + <dd>一个 0 到 999 的数字，表示微秒数，如果指定了 <code>msValue</code> 参数，则必须同时指定 <code>minutesValue</code> 和<code>secondsValue</code> 参数。</dd> +</dl> + +<h2 id="Description" name="Description">描述</h2> + +<p>如果没有指定 <code>secondsValue</code> 和 <code>msValue</code> 参数，就会使用 {{jsxref("Date.getSeconds", "getSeconds()")}} 和 {{jsxref("Date.getMilliseconds", "getmilliseconds()")}} 方法的返回值。</p> + +<p>如果有一个指定的参数超出了合理范围，<code>setMinutes</code> 会相应地更新日期对象中的时间信息。例如，为 <code>secondsValue</code> 指定 100，分钟数将会加 1，而秒数会为 40。</p> + +<h2 id="Examples" name="Examples">例子</h2> + +<h3 id="Example:_Using_setMinutes" name="Example:_Using_setMinutes">例子：使用<code>setMinutes方法</code></h3> + +<pre class="brush: js">var theBigDay = new Date(); +theBigDay.setMinutes(45); +</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>ECMAScript 1st Edition. Implemented in JavaScript 1.0</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.9.5.32', 'Date.prototype.setMinutes')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-date.prototype.setminutes', 'Date.prototype.setMinutes')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Date.setMinutes")}}</p> + +<h2 id="See_Also" name="See_Also">相关链接</h2> + +<ul> + <li>{{jsxref("Date.prototype.getMinutes()")}}</li> + <li>{{jsxref("Date.prototype.setUTCMinutes()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/date/setmonth/index.html b/files/zh-cn/web/javascript/reference/global_objects/date/setmonth/index.html new file mode 100644 index 0000000000..010cf5f428 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/date/setmonth/index.html @@ -0,0 +1,86 @@ +--- +title: Date.prototype.setMonth() +slug: Web/JavaScript/Reference/Global_Objects/Date/setMonth +translation_of: Web/JavaScript/Reference/Global_Objects/Date/setMonth +--- +<div>{{JSRef("Global_Objects", "Date")}}</div> + +<p><code><strong>setMonth()</strong></code> 方法根据本地时间为一个设置年份的日期对象设置月份。</p> + +<div>{{EmbedInteractiveExample("pages/js/date-setmonth.html")}}</div> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><var>dateObj</var>.setMonth(<em>monthValue</em>[, <em>dayValue</em>])</pre> + +<h3 id="Versions_prior_to_JavaScript_1.3" name="Versions_prior_to_JavaScript_1.3">JavaScript 1.3版本之前</h3> + +<pre class="syntaxbox"><var>dateObj</var>.setMonth(<em>monthValue</em>)</pre> + +<h3 id="Parameter" name="Parameter">参数</h3> + +<dl> + <dt><code>monthValue</code></dt> + <dd>介于 0 到 11 之间的整数（表示一月到十二月）。</dd> +</dl> + +<dl> + <dt><code>dayValue</code></dt> + <dd>从 1 到 31 之间的整数，表示月份中的第几天。0为上个月最后一天</dd> + <dt>返回值！</dt> + <dd>基于 1 January 1970 00:00:00 UTC 开始计算的毫秒数</dd> +</dl> + +<h2 id="Description" name="Description">描述</h2> + +<p>如果不指定 <code>dayValue</code> 参数，就会使用 {{jsxref("Date.getDate", "getDate")}} 方法的返回值。</p> + +<p>如果有一个指定的参数超出了合理范围，<code>setMonth</code> 会相应地更新日期对象中的日期信息。<font face="Courier New, Andale Mono, monospace">例如，为</font> <code>monthValue</code> 指定 15，则年份会加 1，月份将会使用 3。</p> + +<h2 id="Examples" name="Examples">例子</h2> + +<h3 id="Example_Using_setMonth" name="Example:_Using_setMonth">例子：使用<code>setMonth方法</code></h3> + +<pre class="brush: js">var theBigDay = new Date(); +theBigDay.setMonth(6); +</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>ECMAScript 1st Edition. Implemented in JavaScript 1.0</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.9.5.38', 'Date.prototype.setMonth')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-date.prototype.setmonth', 'Date.prototype.setMonth')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Date.setMonth")}}</p> + +<h2 id="See_Also" name="See_Also">相关链接</h2> + +<ul> + <li>{{jsxref("Date.prototype.getMonth()")}}</li> + <li>{{jsxref("Date.prototype.setUTCMonth()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/date/setseconds/index.html b/files/zh-cn/web/javascript/reference/global_objects/date/setseconds/index.html new file mode 100644 index 0000000000..5ace67cce9 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/date/setseconds/index.html @@ -0,0 +1,83 @@ +--- +title: Date.prototype.setSeconds() +slug: Web/JavaScript/Reference/Global_Objects/Date/setSeconds +translation_of: Web/JavaScript/Reference/Global_Objects/Date/setSeconds +--- +<div>{{JSRef("Global_Objects", "Date")}}</div> + +<p><code><strong>setSeconds()</strong></code> 方法根据本地时间设置一个日期对象的秒数。</p> + +<div>{{EmbedInteractiveExample("pages/js/date-setseconds.html")}}</div> + + + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><var>dateObj</var>.setSeconds(<em>secondsValue</em>[, <em>msValue</em>])</pre> + +<h3 id="JavaScript_1.3之前版本">JavaScript 1.3之前版本</h3> + +<pre class="syntaxbox"><var>dateObj</var>.setSeconds(<em>secondsValue</em>)</pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>secondsValue</code></dt> + <dd>一个 0 到 59 的整数。</dd> + <dt><code>msValue</code></dt> + <dd>一个 0 到 999 的数字，表示微秒数。</dd> +</dl> + +<h2 id="Description" name="Description">描述</h2> + +<p>如果没有指定 <code>msValue</code> 参数，就会使用 {{jsxref("Date.getMilliseconds", "getMilliseconds()")}} 方法的返回值。</p> + +<p>如果一个参数超出了合理范围， <code>setSeconds</code> 方法会相应地更新日期对象的时间信息。例如，为 <code>secondsValue</code> 指定 100，则日期对象的分钟数会相应地加 1，秒数将会使用 40。</p> + +<h2 id="Examples" name="Examples">例子</h2> + +<h3 id="Example:_Using_setSeconds" name="Example:_Using_setSeconds">例子：使用<code>setSeconds方法</code></h3> + +<pre class="brush:js">var theBigDay = new Date(); +theBigDay.setSeconds(30) +</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>ECMAScript 1st Edition. Implemented in JavaScript 1.0</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.9.5.30', 'Date.prototype.setSeconds')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-date.prototype.setseconds', 'Date.prototype.setSeconds')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Date.setSeconds")}}</p> + +<h2 id="See_Also" name="See_Also">相关链接</h2> + +<ul> + <li>{{jsxref("Date.prototype.getSeconds()")}}</li> + <li>{{jsxref("Date.prototype.setUTCSeconds()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/date/settime/index.html b/files/zh-cn/web/javascript/reference/global_objects/date/settime/index.html new file mode 100644 index 0000000000..85fe608f8e --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/date/settime/index.html @@ -0,0 +1,80 @@ +--- +title: Date.prototype.setTime() +slug: Web/JavaScript/Reference/Global_Objects/Date/setTime +translation_of: Web/JavaScript/Reference/Global_Objects/Date/setTime +--- +<div>{{JSRef("Global_Objects", "Date")}}</div> + +<p><code><strong>setTime()</strong></code> 方法以一个表示从1970-1-1 00:00:00 UTC计时的毫秒数为来为 <code>Date</code> 对象设置时间。</p> + +<div>{{EmbedInteractiveExample("pages/js/date-settime.html")}}</div> + + + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><var>dateObj</var>.setTime(<em>timeValue</em>)</pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>timeValue</code></dt> + <dd>一个整数，表示从1970-1-1 00:00:00 UTC开始计时的毫秒数。</dd> + <dt> + <h3 id="Parameters" name="Parameters">返回值</h3> + </dt> + <dd>UTC 1970年1月1日00:00:00与更新日期之间的毫秒数（实际上是自变量的值）。</dd> +</dl> + +<h2 id="Description" name="Description">描述</h2> + +<p>使用 <code>setTime</code> 方法用来把一个日期时间赋值给另一个 <code>Date </code>对象。</p> + +<h2 id="Examples" name="Examples">例子</h2> + +<h3 id="Example_Using_setTime" name="Example:_Using_setTime">例子：使用<code>setTime</code></h3> + +<pre>theBigDay = new Date("July 1, 1999"); +sameAsBigDay = new Date(); +sameAsBigDay.setTime(theBigDay.getTime()); +</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>ECMAScript 1st Edition. Implemented in JavaScript 1.0</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.9.5.27', 'Date.prototype.setTime')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-date.prototype.settime', 'Date.prototype.setTime')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Date.setTime")}}</p> + +<h2 id="See_Also" name="See_Also">相关链接</h2> + +<ul> + <li>{{jsxref("Date.prototype.getTime()")}}</li> + <li>{{jsxref("Date.prototype.setUTCHours()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/date/setutcdate/index.html b/files/zh-cn/web/javascript/reference/global_objects/date/setutcdate/index.html new file mode 100644 index 0000000000..8f0a425e96 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/date/setutcdate/index.html @@ -0,0 +1,77 @@ +--- +title: Date.prototype.setUTCDate() +slug: Web/JavaScript/Reference/Global_Objects/Date/setUTCDate +translation_of: Web/JavaScript/Reference/Global_Objects/Date/setUTCDate +--- +<div>{{JSRef("Global_Objects", "Date")}}</div> + +<p><strong><code>setUTCDate()</code></strong> 方法就是根据全球时间设置特定date对象的日期。</p> + +<div>{{EmbedInteractiveExample("pages/js/date-setutcdate.html")}}</div> + + + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code><var>dateObj</var>.setUTCDate(<var>dayValue</var>)</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>dayValue</code></dt> + <dd>一个1-31的整形数字，用来指定日期。</dd> +</dl> + +<h2 id="Description" name="Description">描述</h2> + +<p>如果你指定的参数超出了范围，setUTCDate()会尝试更新对应的{{jsxref("Global_Objects/Date", "Date")}} 中的日期信息。例如，如果你使用了40来作为参数，但是{{jsxref("Global_Objects/Date", "Date")}} 中存储的月份为6月，那么日期将被改写为10且月份被增到7月。</p> + +<h2 id="Examples" name="Examples">示例</h2> + +<h3 id="Example:_Using_setUTCDate" name="Example:_Using_setUTCDate">使用Using <code>setUTCDate()</code></h3> + +<pre class="brush: js">var theBigDay = new Date(); +theBigDay.setUTCDate(20); +</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>ECMAScript 1st Edition.</td> + <td>Standard</td> + <td>Initial definition. Implemented in JavaScript 1.3.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.9.5.37', 'Date.prototype.setUTCDate')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-date.prototype.setutcdate', 'Date.prototype.setUTCDate')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容">浏览器兼容</h2> + +<div> +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Date.setUTCDate")}}</p> +</div> + +<h2 id="See_also" name="See_also">相关内容</h2> + +<ul> + <li>{{jsxref("Date.prototype.getUTCDate()")}}</li> + <li>{{jsxref("Date.prototype.setDate()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/date/setutcfullyear/index.html b/files/zh-cn/web/javascript/reference/global_objects/date/setutcfullyear/index.html new file mode 100644 index 0000000000..cf971aa9c2 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/date/setutcfullyear/index.html @@ -0,0 +1,94 @@ +--- +title: Date.prototype.setUTCFullYear() +slug: Web/JavaScript/Reference/Global_Objects/Date/setUTCFullYear +tags: + - Date + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Date/setUTCFullYear +--- +<div>{{JSRef}}</div> + +<p><strong><code>setUTCFullYear()</code></strong> 方法根据世界标准时间为一个具体日期设置年份。</p> + +<div>{{EmbedInteractiveExample("pages/js/date-setutcfullyear.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><var>dateObj</var>.setUTCFullYear(<var>yearValue</var>[, <var>monthValue</var>[, <var>dayValue</var>]])</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>yearValue</code></dt> + <dd>指定年份整数值，例如，1995</dd> + <dt><code>monthValue</code></dt> + <dd>可选。指定一个0-11之间的整数值，代表从一月到十二月。</dd> + <dt><code>dayValue</code></dt> + <dd>可选。指定一个1-31之间的整数值，代表月份中的第几天。如果你指定了dayValue参数，那么你必须指定monthValue参数。</dd> +</dl> + +<h2 id="描述">描述</h2> + +<p>如果你没有指定具体的<code>monthValue和dayValue，</code>将会使用 <code>getUTCMonth</code> 和<code>getUTCDate</code> 方法的返回值。</p> + +<p>如果你指定的参数超出了期待范围，<code>setUTCFullYear()方法将会根据Date对象，更新其他参数和日期信息。例如，如果你将monthValue设定为15，年份会增加1，月份值则为为3。</code></p> + +<h2 id="例子">例子</h2> + +<h3 id="使用_setUTCFullYear()">使用 <code>setUTCFullYear()</code></h3> + +<pre class="brush: js">var theBigDay = new Date(); +theBigDay.setUTCFullYear(1997); +</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>{{SpecName('ES1')}}</td> + <td>{{Spec2('ES1')}}</td> + <td>初始定义。 在 JavaScript 1.3实施。</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.9.5.41', 'Date.prototype.setUTCFullYear')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-date.prototype.setutcfullyear', 'Date.prototype.setUTCFullYear')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-date.prototype.setutcfullyear', 'Date.prototype.setUTCFullYear')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Date.setUTCFullYear")}}</p> +</div> + +<p><span style="font-size: 30.002px; letter-spacing: -1px; line-height: 30.002px;"><strong>相关连接</strong></span></p> + +<ul> + <li>{{jsxref("Date.prototype.getUTCFullYear()")}}</li> + <li>{{jsxref("Date.prototype.setFullYear()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/date/setutchours/index.html b/files/zh-cn/web/javascript/reference/global_objects/date/setutchours/index.html new file mode 100644 index 0000000000..16d4989a4b --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/date/setutchours/index.html @@ -0,0 +1,94 @@ +--- +title: Date.prototype.setUTCHours() +slug: Web/JavaScript/Reference/Global_Objects/Date/setUTCHours +translation_of: Web/JavaScript/Reference/Global_Objects/Date/setUTCHours +--- +<div>{{JSRef}}</div> + +<p>The <strong><code>setUTCHours()</code></strong> method sets the hour for a specified date according to universal time, and returns the number of milliseconds since 1 January 1970 00:00:00 UTC until the time represented by the updated {{jsxref("Date")}} instance.</p> + +<div>{{EmbedInteractiveExample("pages/js/date-setutchours.html")}}</div> + + + +<h2 id="Syntax">Syntax</h2> + +<pre class="syntaxbox"><code><var>dateObj</var>.setUTCHours(<var>hoursValue</var>[, <var>minutesValue</var>[, <var>secondsValue</var>[, <var>msValue</var>]]])</code></pre> + +<h3 id="参数"> 参数</h3> + +<dl> + <dt><code>hoursValue</code></dt> + <dd>表示小时的整数，取值0到23之间。</dd> + <dt><code>minutesValue</code></dt> + <dd>可选参数。表示分钟的整数，取值0到59之间。</dd> + <dt><code>secondsValue</code></dt> + <dd>可选参数。表示秒数的整数，取值0到59之间。如果指定了该参数，就要同时指定<code>minutesValue这个参数。</code></dd> + <dt><code>msValue</code></dt> + <dd>可选参数。表示毫秒的整数，取值0到999之间。如果指定了该参数，就要指定<code>minutesValue和secondsValue这两个参数。</code></dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>返回从1970-01-01 00:00:00 UTC 到更新后的日期所表示时间的毫秒数。</p> + +<h2 id="描述">描述</h2> + +<p>If you do not specify the <code>minutesValue</code>, <code>secondsValue</code>, and <code>msValue</code> parameters, the values returned from the {{jsxref("Date.prototype.getUTCMinutes()", "getUTCMinutes()")}}, {{jsxref("Date.prototype.getUTCSeconds()", "getUTCSeconds()")}}, and {{jsxref("Date.prototype.getUTCMilliseconds()", "getUTCMilliseconds()")}} methods are used.</p> + +<p>If a parameter you specify is outside of the expected range, <code>setUTCHours()</code> attempts to update the date information in the {{jsxref("Date")}} object accordingly. For example, if you use 100 for <code>secondsValue</code>, the minutes will be incremented by 1 (<code>minutesValue + 1</code>), and 40 will be used for seconds.</p> + +<h2 id="例子">例子</h2> + +<h3 id="使用_setUTCHours()">使用 <code>setUTCHours()</code></h3> + +<pre class="brush: js">var theBigDay = new Date(); +theBigDay.setUTCHours(8); +</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('ES1')}}</td> + <td>{{Spec2('ES1')}}</td> + <td>Initial definition. Implemented in JavaScript 1.3.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.9.5.35', 'Date.prototype.setUTCHours')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-date.prototype.setutchours', 'Date.prototype.setUTCHours')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-date.prototype.setutchours', 'Date.prototype.setUTCHours')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Date.setUTCHours")}}</p> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Date.prototype.getUTCHours()")}}</li> + <li>{{jsxref("Date.prototype.setHours()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/date/setutcmilliseconds/index.html b/files/zh-cn/web/javascript/reference/global_objects/date/setutcmilliseconds/index.html new file mode 100644 index 0000000000..b3059be4cb --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/date/setutcmilliseconds/index.html @@ -0,0 +1,84 @@ +--- +title: Date.prototype.setUTCMilliseconds() +slug: Web/JavaScript/Reference/Global_Objects/Date/setUTCMilliseconds +translation_of: Web/JavaScript/Reference/Global_Objects/Date/setUTCMilliseconds +--- +<div>{{JSRef}}</div> + +<p><strong><code>setUTCMilliseconds()</code></strong> 方法会根据世界时来设置指定时间的毫秒数。</p> + +<div>{{EmbedInteractiveExample("pages/js/date-setutcmilliseconds.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><var>dateObj</var>.setUTCMilliseconds(<var>millisecondsValue</var>)</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>millisecondsValue</code></dt> + <dd>0 - 999 之间的数值，代表毫秒数。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>返回更新后的时间距 1970 年 1 月 1 日 00:00:00 (UTC) 的毫秒数。</p> + +<h2 id="描述">描述</h2> + +<p>如果传递的参数超出了指定的范围，<code>setUTCMilliseconds() 方法会相应地尝试更新储存在 </code>{{jsxref("Date")}} 的时间信息。例如，假设你传递参数的值是 1100，存储在 {{jsxref("Date")}} 的秒数会加 1，然后使用 100 来作为毫秒数。</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用_setUTCMilliseconds()_方法">使用 <code>setUTCMilliseconds() 方法</code></h3> + +<pre class="brush: js">var theBigDay = new Date(); +theBigDay.setUTCMilliseconds(500); +</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>{{SpecName('ES1')}}</td> + <td>{{Spec2('ES1')}}</td> + <td>初始定义。于 JavaScript 1.3 实现。</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.9.5.29', 'Date.prototype.setUTCMilliseconds')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-date.prototype.setutcmilliseconds', 'Date.prototype.setUTCMilliseconds')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-date.prototype.setutcmilliseconds', 'Date.prototype.setUTCMilliseconds')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Date.setUTCMilliseconds")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Date.prototype.getUTCMilliseconds()")}}</li> + <li>{{jsxref("Date.prototype.setMilliseconds()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/date/setutcminutes/index.html b/files/zh-cn/web/javascript/reference/global_objects/date/setutcminutes/index.html new file mode 100644 index 0000000000..7ea6d1ed0b --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/date/setutcminutes/index.html @@ -0,0 +1,92 @@ +--- +title: Date.prototype.setUTCMinutes() +slug: Web/JavaScript/Reference/Global_Objects/Date/setUTCMinutes +translation_of: Web/JavaScript/Reference/Global_Objects/Date/setUTCMinutes +--- +<div>{{JSRef}}</div> + +<div> </div> + +<p><strong><code>setUTCMinutes()</code></strong>方法会根据世界协调时（UTC）来设置指定日期的分钟数。</p> + +<div>{{EmbedInteractiveExample("pages/js/date-setutcminutes.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><var>dateObj</var>.setUTCMinutes(<var>minutesValue</var>[, <var>secondsValue</var>[, <var>msValue</var>]])</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>minutesValue</code></dt> + <dd>必填，表示要设置的分钟数，是一个介于0和59之间的整数。</dd> + <dt><code>secondsValue</code></dt> + <dd>可选参数，表示要设置的秒数，同样也是一个介于0和59之间的整数，如果你传入了这个参数，那么你就必须要传入上一个参数（<strong><code>minutesValue</code></strong>）。</dd> + <dt><code>msValue</code></dt> + <dd>可选参数，表示要设置的毫秒数，这是一个介于0和999之间的数字，如果你传入了这个参数，那么你就必须要传入前面两个参数（<strong><code>minutesValue</code></strong>和<strong><code>secondsValue</code></strong>）。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>返回从UTC时间1970年1月1日0时0分0秒至设置后的时间的毫秒数。</p> + +<h2 id="说明">说明</h2> + +<p>如果你没有传入后两个参数（<strong><code>minutesValue</code></strong>和<strong><code>msValue</code></strong>），这两个参数会分别使用{{jsxref("Date.prototype.getUTCSeconds()", "getUTCSeconds()")}}和{{jsxref("Date.prototype.getUTCMilliseconds()", "getUTCMilliseconds()")}}这两个方法返回的值。</p> + +<p>如果你传入的参数值在上文所述范围之外的话，<code><strong>setUTCMinutes()</strong></code>方法会尝试修改日期对象中的其他信息，比如说你为<code><strong>secondsValue</strong></code>这个参数传入了100（译者注：规定范围是[0, 59]），那么第一个参数（<code><strong>minutesValue</strong></code>）就会被加1，而秒数则变成了40。</p> + +<h2 id="例子">例子</h2> + +<h3 id="使用_setUTCMinutes()">使用 <code>setUTCMinutes()</code></h3> + +<pre class="brush: js">var theBigDay = new Date(); +theBigDay.setUTCMinutes(43); +</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>{{SpecName('ES1')}}</td> + <td>{{Spec2('ES1')}}</td> + <td>首次被定义，在JavaScript 1.3版本被实现。</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.9.5.33', 'Date.prototype.setUTCMinutes')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-date.prototype.setutcminutes', 'Date.prototype.setUTCMinutes')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-date.prototype.setutcminutes', 'Date.prototype.setUTCMinutes')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Date.setUTCMinutes")}}</p> + +<h2 id="相关知识">相关知识</h2> + +<ul> + <li>{{jsxref("Date.prototype.getUTCMinutes()")}}</li> + <li>{{jsxref("Date.prototype.setMinutes()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/date/setutcmonth/index.html b/files/zh-cn/web/javascript/reference/global_objects/date/setutcmonth/index.html new file mode 100644 index 0000000000..0e3ffb7782 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/date/setutcmonth/index.html @@ -0,0 +1,90 @@ +--- +title: Date.prototype.setUTCMonth() +slug: Web/JavaScript/Reference/Global_Objects/Date/setUTCMonth +translation_of: Web/JavaScript/Reference/Global_Objects/Date/setUTCMonth +--- +<div>{{JSRef}}</div> + +<p><strong><code>setUTCMonth()方法根据通用的时间来设置一个准确的月份</code></strong></p> + +<div>{{EmbedInteractiveExample("pages/js/date-setutcmonth.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><var>dateObj</var>.setUTCMonth(<var>monthValue</var>[, <var>dayValue</var>])</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>monthValue</code></dt> + <dd>一个0-11的整数，代表1月到12月。</dd> + <dt><code>dayValue</code></dt> + <dd>可选参数：一个1-31的整数，代表一个月的天数。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>这个数值是从1970年1月1号 00:00:00到当前时间的毫秒数（国际通用时间）</p> + +<h2 id="描述">描述</h2> + +<p>如果你没有明确书写<code>dayValue</code> 这个参数，那么就会从{{jsxref("Date.prototype.getUTCDate()", "getUTCDate()")}} 方法返回对应的数值.</p> + +<p>如果你写了一个超过在规定的范围内的参数. <code>setUTCMonth()就会试图相应的更新时间信息在Data对象中。例如，如果你用15作为</code>monthValue的值，那么年份就会加1，并且月份会变成3.（15=12+3）</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用_setUTCMonth()">使用 <code>setUTCMonth()</code></h3> + +<pre class="brush: js">var theBigDay = new Date(); +theBigDay.setUTCMonth(11); +</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>{{SpecName('ES1')}}</td> + <td>{{Spec2('ES1')}}</td> + <td>最初定义并使用在javascript 1.3版本中</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.9.5.39', 'Date.prototype.setUTCMonth')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-date.prototype.setutcmonth', 'Date.prototype.setUTCMonth')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-date.prototype.setutcmonth', 'Date.prototype.setUTCMonth')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Date.setUTCMonth")}}</p> +</div> + +<h2 id="更多">更多</h2> + +<ul> + <li>{{jsxref("Date.prototype.getUTCMonth()")}}</li> + <li>{{jsxref("Date.prototype.setMonth()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/date/setutcseconds/index.html b/files/zh-cn/web/javascript/reference/global_objects/date/setutcseconds/index.html new file mode 100644 index 0000000000..fce240e115 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/date/setutcseconds/index.html @@ -0,0 +1,92 @@ +--- +title: Date.prototype.setUTCSeconds() +slug: Web/JavaScript/Reference/Global_Objects/Date/setUTCSeconds +tags: + - 日期 +translation_of: Web/JavaScript/Reference/Global_Objects/Date/setUTCSeconds +--- +<div>{{JSRef}}</div> + +<p><code><font face="Open Sans, Arial, sans-serif">此 </font><strong>setUTCSeconds()</strong></code> 方法为一个依据国际通用时间的特定日期设置秒数。</p> + +<div>{{EmbedInteractiveExample("pages/js/date-setutcseconds.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><var>dateObj</var>.setUTCSeconds(<var>secondsValue</var>[, <var>msValue</var>])</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>secondsValue</code></dt> + <dd>一个在0到59之间的整数，表示秒数。</dd> + <dt><code>msValue</code></dt> + <dd>可选参数。一个0到999之间的数字，代表毫秒数。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>一个毫秒数，表示从国际通用时间1970年00:00:00到设置的时间值之间的时间跨度。</p> + +<h2 id="描述">描述</h2> + +<p>如果你没有设置msValue参数的值， 那么返回的值来自{{jsxref("Date.prototype.getUTCMilliseconds()", "getUTCMilliseconds()")}} 方法。</p> + +<p>如果你指定的值超出了范围, <code>setUTCSeconds()</code> 因此会更新{{jsxref("Date")}} 对象中date的相关信息 . 举个例子, 如果你设置secondsValue为100, {{jsxref("Date")}} 对象中的分钟数会增加1， 并且秒数会变成40.</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用_setUTCSeconds()">使用 <code>setUTCSeconds()</code></h3> + +<pre class="brush: js">var theBigDay = new Date(); +theBigDay.setUTCSeconds(20); +</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>{{SpecName('ES1')}}</td> + <td>{{Spec2('ES1')}}</td> + <td>初始化设定. 从 JavaScript 1.3继承.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.9.5.31', 'Date.prototype.setUTCSeconds')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-date.prototype.setutcseconds', 'Date.prototype.setUTCSeconds')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-date.prototype.setutcseconds', 'Date.prototype.setUTCSeconds')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Date.setUTCSeconds")}}</p> +</div> + +<h2 id="另见">另见</h2> + +<ul> + <li>{{jsxref("Date.prototype.getUTCSeconds()")}}</li> + <li>{{jsxref("Date.prototype.setSeconds()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/date/setyear/index.html b/files/zh-cn/web/javascript/reference/global_objects/date/setyear/index.html new file mode 100644 index 0000000000..7999ad0022 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/date/setyear/index.html @@ -0,0 +1,72 @@ +--- +title: Date.prototype.setYear() +slug: Web/JavaScript/Reference/Global_Objects/Date/setYear +tags: + - JavaScript + - 已废弃 + - 日期 +translation_of: Web/JavaScript/Reference/Global_Objects/Date/setYear +--- +<div>{{JSRef}} {{deprecated_header}}</div> + +<p><strong><code>setYear()</code></strong> 方法根据一个本地时间为一个确定的日期对象设置年份。由于<code>setYear()</code> 并不设置完整年份（"正是千年虫问题"），本方法已经完全被{{jsxref("Date.prototype.setFullYear()","setFullYear()")}} 方法所取代。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><var>dateObj</var>.setYear(<var>yearValue</var>)</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>yearValue</code></dt> + <dd>一个整数。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>介于1970年1月1日 00:00:00 UTC时间与更新后日期的毫秒数。</p> + +<h2 id="描述">描述</h2> + +<p>如果<code>yearValue</code> 是介于0到99(包含99)之间的整数，则目标对象 <code>dateObj</code> 的年份被设置为 <code>1900 + yearValue</code>。否则，目标对象 <code>dateObj</code> 的年份被设置为 <code>yearValue</code>.</p> + +<h2 id="例子">例子</h2> + +<h3 id="使用_setYear">使用 <code>setYear()</code></h3> + +<p>例子前两行（除去声明）将年份设置为1996。 第三行将年份设置为2000.</p> + +<pre class="brush: js">var theBigDay = new Date(); + +theBigDay.setYear(96); +theBigDay.setYear(1996); +theBigDay.setYear(2000); +</pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范</th> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-date.prototype.setyear', 'Date.prototype.setYear')}}</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Date.setYear")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Date.prototype.getFullYear()")}}</li> + <li>{{jsxref("Date.prototype.getUTCFullYear()")}}</li> + <li>{{jsxref("Date.prototype.setFullYear()")}}</li> + <li>{{jsxref("Date.prototype.setUTCFullYear()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/date/todatestring/index.html b/files/zh-cn/web/javascript/reference/global_objects/date/todatestring/index.html new file mode 100644 index 0000000000..e2216ea015 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/date/todatestring/index.html @@ -0,0 +1,72 @@ +--- +title: Date.prototype.toDateString() +slug: Web/JavaScript/Reference/Global_Objects/Date/toDateString +translation_of: Web/JavaScript/Reference/Global_Objects/Date/toDateString +--- +<div>{{JSRef("Global_Objects", "Date")}}</div> + +<p><code><strong>toDateString()</strong></code> 方法以美式英语和人类易读的形式返回一个日期对象日期部分的字符串。</p> + +<div>{{EmbedInteractiveExample("pages/js/date-todatestring.html")}}</div> + + + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code><var>dateObj</var>.toDateString()</code></pre> + +<h2 id="Description" name="Description">描述</h2> + +<p>{{jsxref("Global_Objects/Date", "Date")}} 对象实例引用一个具体的时间点。调用 {{jsxref("Date.toString", "toString")}} 方法会以美式英语和人类易读的形式返回日期对象的格式化字符串。在 <a href="/en-US/docs/SpiderMonkey" title="SpiderMonkey">SpiderMonkey</a> 里，该字符串由日期部分（年月日）和其后的时间部分（时分秒及时区）组成。有时需要获取日期部分的字符串，这可以由 <code>toDateString</code> 方法完成。</p> + +<p>The <code>toDateString</code> method is especially useful because compliant engines implementing <a href="/en-US/docs/ECMAScript" title="ECMAScript">ECMA-262</a> may differ in the string obtained from <code>toString</code> for <code>Date</code> objects, as the format is implementation-dependent and simple string slicing approaches may not produce consistent results across multiple engines.</p> + +<h2 id="Example" name="Example">例子</h2> + +<h3 id="Example:_A_basic_usage_of_toDateString" name="Example:_A_basic_usage_of_toDateString">例子：<code>toDateString</code> 方法的简单使用</h3> + +<pre class="brush:js">var d = new Date(1993, 6, 28, 14, 39, 7); + +println(d.toString()); // prints Wed Jul 28 1993 14:39:07 GMT-0600 (PDT) +println(d.toDateString()); // prints Wed Jul 28 1993</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>ECMAScript 3rd Edition.</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.9.5.3', 'Date.prototype.toDateString')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-date.prototype.todatestring', 'Date.prototype.toDateString')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Date.toDateString")}}</p> + +<h2 id="See_Also" name="See_Also">相关链接</h2> + +<ul> + <li>{{jsxref("Date.prototype.toLocaleDateString()")}}</li> + <li>{{jsxref("Date.prototype.toTimeString()")}}</li> + <li>{{jsxref("Date.prototype.toString()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/date/togmtstring/index.html b/files/zh-cn/web/javascript/reference/global_objects/date/togmtstring/index.html new file mode 100644 index 0000000000..4dd44803b4 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/date/togmtstring/index.html @@ -0,0 +1,67 @@ +--- +title: Date.prototype.toGMTString() +slug: Web/JavaScript/Reference/Global_Objects/Date/toGMTString +translation_of: Web/JavaScript/Reference/Global_Objects/Date/toGMTString +--- +<div>{{JSRef("Global_Objects", "Date")}} {{ Deprecated_header() }}</div> + +<p>The <code><strong>toGMTString()</strong></code> method converts a date to a string, using Internet GMT conventions. The exact format of the value returned by <code>toGMTString</code> varies according to the platform and browser, in general it should represent a human readable date string.</p> + +<p><strong>Note</strong>: <code>toGMTString</code> is deprecated and should no longer be used, it's only there for backwards compatibility, use {{jsxref("Date.toUTCString", "toUTCString()")}} instead.</p> + +<h2 id="Syntax" name="Syntax">Syntax</h2> + +<pre class="syntaxbox"><var>dateObj</var>.toGMTString()</pre> + +<h2 id="Examples" name="Examples">Examples</h2> + +<h3 id="Example:_Using_toGMTString" name="Example:_Using_toGMTString">Example: Using <code>toGMTString</code></h3> + +<p>In this example, the <code>toGMTString</code> method converts the date to GMT (UTC) using the operating system's time-zone offset and returns a string value that is similar to the following form. The exact format depends on the platform.</p> + +<pre class="brush: js">var today = new Date(); +var str = today.toGMTString(); // deprecated! use toUTCString() + +console.log(str); // Mon, 18 Dec 1995 17:28:35 GMT +</pre> + +<h2 id="Specifications">Specifications</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>ECMAScript 1st Edition. Implemented in JavaScript 1.0</td> + <td>Standard</td> + <td>Initial definition, but already declared as deprecated.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-B.2.6', 'Date.prototype.toGMTString')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td>Defined in the (informative) compatibility annex.</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-date.prototype.togmtstring', 'Date.prototype.toGMTString')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Defined in the (normative) annex for additional features for web browsers.</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility">Browser compatibility</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Date.toGMTString")}}</p> + +<h2 id="See_Also" name="See_Also">See also</h2> + +<ul> + <li>{{jsxref("Date.prototype.toLocaleDateString()")}}</li> + <li>{{jsxref("Date.prototype.toTimeString()")}}</li> + <li>{{jsxref("Date.prototype.toUTCString()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/date/toisostring/index.html b/files/zh-cn/web/javascript/reference/global_objects/date/toisostring/index.html new file mode 100644 index 0000000000..b93bd8c745 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/date/toisostring/index.html @@ -0,0 +1,89 @@ +--- +title: Date.prototype.toISOString() +slug: Web/JavaScript/Reference/Global_Objects/Date/toISOString +translation_of: Web/JavaScript/Reference/Global_Objects/Date/toISOString +--- +<div>{{JSRef}}</div> + +<p><code><strong>toISOString()</strong></code> 方法返回一个 ISO（<a href="http://en.wikipedia.org/wiki/ISO_8601">ISO 8601 Extended Format</a>）格式的字符串： <strong>YYYY-MM-DDTHH:mm:ss.sssZ</strong>。时区总是UTC（协调世界时），加一个后缀“Z”标识。</p> + +<div>{{EmbedInteractiveExample("pages/js/date-toisostring.html")}}</div> + + + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><var>dateObj</var>.toISOString()</pre> + +<h2 id="例子">例子</h2> + +<pre class="brush: js">var today = new Date("05 October 2011 14:48 UTC"); +alert(today.toISOString()); // 返回2011-10-05T14:48:00.000Z +</pre> + +<p>上例使用了非标准字符串的解析，该字符串在某些旧的浏览器（如IE）中可能无法被正确解析。</p> + +<h2 id="Description" name="Description">Polyfill</h2> + +<p>该方法在ECMA-262第5版中被标准化。对于那些不支持此方法的JS引擎可以通过加上下面的代码实现：</p> + +<pre class="brush:js">if ( !Date.prototype.toISOString ) { + ( function() { + + function pad(number) { + if ( number < 10 ) { + return '0' + number; + } + return number; + } + + Date.prototype.toISOString = function() { + return this.getUTCFullYear() + + '-' + pad( this.getUTCMonth() + 1 ) + + '-' + pad( this.getUTCDate() ) + + 'T' + pad( this.getUTCHours() ) + + ':' + pad( this.getUTCMinutes() ) + + ':' + pad( this.getUTCSeconds() ) + + '.' + (this.getUTCMilliseconds() / 1000).toFixed(3).slice(2, 5) + + 'Z'; + }; + + }() ); +}</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>{{SpecName('ES5.1', '#sec-15.9.5.43', 'Date.prototype.toISOString')}}<br> + Implemented in JavaScript 1.8</td> + <td>{{Spec2('ES5.1')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-date.prototype.toisostring', 'Date.prototype.toISOString')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Date.toISOString")}}</p> + +<h2 id="See_Also" name="See_Also">相关链接</h2> + +<ul> + <li>{{jsxref("Date.prototype.toLocaleDateString()")}}</li> + <li>{{jsxref("Date.prototype.toTimeString()")}}</li> + <li>{{jsxref("Date.prototype.toUTCString()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/date/tojson/index.html b/files/zh-cn/web/javascript/reference/global_objects/date/tojson/index.html new file mode 100644 index 0000000000..689d7b3642 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/date/tojson/index.html @@ -0,0 +1,73 @@ +--- +title: Date.prototype.toJSON() +slug: Web/JavaScript/Reference/Global_Objects/Date/toJSON +translation_of: Web/JavaScript/Reference/Global_Objects/Date/toJSON +--- +<div>{{JSRef}}</div> + +<p><strong><code>toJSON()</code></strong> 方法返回 {{jsxref("Date")}} 对象的字符串形式。</p> + +<div>{{EmbedInteractiveExample("pages/js/date-tojson.html")}}</div> + + + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code><var>dateObj</var>.toJSON()</code> +</pre> + +<h2 id="Description" name="Description">描述</h2> + +<p>{{jsxref("Date")}} 实例引用一个具体的时间点。 调用 <code>toJSON()</code> 返回一个 JSON 格式字符串(使用 {{jsxref("Date.prototype.toISOString()", "toISOString()")}})，表示该日期对象的值。默认情况下，这个方法常用于 {{Glossary("JSON")}}序列化{{jsxref("Date")}}对象。</p> + +<h2 id="Example" name="Example">样例</h2> + +<h3 id="Example:_Using_toJSON" name="Example:_Using_toJSON"><code>toJSON()</code> 样例</h3> + +<pre class="brush:js">var date = new Date(); +console.log(date); //Thu Nov 09 2017 18:54:04 GMT+0800 (中国标准时间) + +var jsonDate = (date).toJSON(); +console.log(jsonDate); //"2017-11-09T10:51:11.395Z" + +var backToDate = new Date(jsonDate); +console.log(backToDate); //Thu Nov 09 2017 18:54:04 GMT+0800 (中国标准时间) +</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>{{SpecName('ES5.1', '#sec-15.9.5.44', 'Date.prototype.toJSON')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td>首次定义，于 JavaScript 1.8.5 版本实现。</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-date.prototype.tojson', 'Date.prototype.toJSON')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Date.toJSON")}}</p> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Date.prototype.toLocaleDateString()")}}</li> + <li>{{jsxref("Date.prototype.toTimeString()")}}</li> + <li>{{jsxref("Date.prototype.toUTCString()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/date/tolocaledatestring/index.html b/files/zh-cn/web/javascript/reference/global_objects/date/tolocaledatestring/index.html new file mode 100644 index 0000000000..b5dfe22d12 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/date/tolocaledatestring/index.html @@ -0,0 +1,155 @@ +--- +title: Date.prototype.toLocaleDateString() +slug: Web/JavaScript/Reference/Global_Objects/Date/toLocaleDateString +translation_of: Web/JavaScript/Reference/Global_Objects/Date/toLocaleDateString +--- +<div>{{JSRef("Global_Objects", "Date")}}</div> + +<p><code><strong>toLocaleDateString()</strong></code> 方法返回该日期对象日期部分的字符串，该字符串格式因不同语言而不同。新增的参数 <code>locales</code> 和 <code>options</code> 使程序能够指定使用哪种语言格式化规则，允许定制该方法的表现（behavior）。在旧版本浏览器中， <code>locales</code> 和 <code>options</code> 参数被忽略，使用的语言环境和返回的字符串格式是各自独立实现的。</p> + +<div>{{EmbedInteractiveExample("pages/js/date-tolocaledatestring.html")}}</div> + + + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><var>dateObj</var>.toLocaleDateString([locales [, options]])</pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<p> 查看<a href="#Browser_Compatibility" title="#Browser_Compatibility">浏览器兼容性</a>小节，看下哪些浏览器支持 <code>locales</code> 和 <code>options</code> 参数，还可以参看<a href="#Example:_Checking_for_support_for_locales_and_options_arguments">例子： 检测 <code>locales</code> 和 <code>options</code> 参数支持情况</a>。</p> + +<p>{{page('zh-CN/docs/JavaScript/Reference/Global_Objects/DateTimeFormat','Parameters')}}</p> + +<p>The default value for each date-time component property is <code>undefined</code>, but if the <code>weekday</code>, <code>year</code>, <code>month</code>, <code>day</code> properties are all <code>undefined</code>, then <code>year</code>, <code>month</code>, and <code>day</code> are assumed to be "numeric".</p> + +<h2 id="Examples" name="Examples">例子</h2> + +<h3 id="Example:_Using_toLocaleDateString" name="Example:_Using_toLocaleDateString">例子：使用<code>toLocaleDateString</code></h3> + +<p>没有指定语言环境（locale）时，返回一个使用默认语言环境和格式设置（options）的格式化字符串。</p> + +<pre class="brush:js">var date = new Date(Date.UTC(2012, 11, 12, 3, 0, 0)); + +// toLocaleDateString without arguments depends on the implementation, +// the default locale, and the default time zone +date.toLocaleDateString(); +// → "12/11/2012" if run in en-US locale with time zone America/Los_Angeles</pre> + +<h3 id="Example:_Checking_for_support_for_locales_and_options_arguments" name="Example:_Checking_for_support_for_locales_and_options_arguments">例子：检测 <code>locales</code> 和 <code>options</code> 参数支持情况</h3> + +<p><code>locales</code> 和 <code>options</code> 参数不是所有的浏览器都支持。为了检测一种实现环境（implementation）是否支持它们，可以使用不合法的语言标签，如果实现环境支持该参数，则会抛出一个 <code>RangeError</code> 异常，反之会忽略参数。</p> + +<pre class="brush: js">function toLocaleDateStringSupportsLocales() { + try { + new Date().toLocaleDateString("i"); + } catch (e) { + return e.name === "RangeError"; + } + return false; +} +</pre> + +<h3 id="Example:_Using_locales" name="Example:_Using_locales">例子：使用<code>locales</code></h3> + +<p>下例展示了本地化日期格式的一些变化。为了在应用的用户界面得到某种语言的日期格式，必须确保使用 <code>locales</code> 参数指定了该语言（可能还需要设置某些回退语言）。</p> + +<pre class="brush: js">var date = new Date(Date.UTC(2012, 11, 20, 3, 0, 0)); + +// formats below assume the local time zone of the locale; +// America/Los_Angeles for the US + +// US English uses month-day-year order +alert(date.toLocaleDateString("en-US")); +// → "12/19/2012" + +// British English uses day-month-year order +alert(date.toLocaleDateString("en-GB")); +// → "20/12/2012" + +// Korean uses year-month-day order +alert(date.toLocaleDateString("ko-KR")); +// → "2012. 12. 20." + +// Arabic in most Arabic speaking countries uses real Arabic digits +alert(date.toLocaleDateString("ar-EG")); +// → "<span dir="rtl">٢٠/١٢/٢٠١٢</span>" + +// for Japanese, applications may want to use the Japanese calendar, +// where 2012 was the year 24 of the Heisei era +alert(date.toLocaleDateString("ja-JP-u-ca-japanese")); +// → "24/12/20" + +// when requesting a language that may not be supported, such as +// Balinese, include a fallback language, in this case Indonesian +alert(date.toLocaleDateString(["ban", "id"])); +// → "20/12/2012" +</pre> + +<h3 id="Example:_Using_options" name="Example:_Using_options">例子：使用<code>options</code></h3> + +<p>可以使用 <code>options </code>参数来自定义 <code>toLocaleDateString</code> 方法返回的字符串。</p> + +<pre class="brush: js">var date = new Date(Date.UTC(2012, 11, 20, 3, 0, 0)); + +// request a weekday along with a long date +var options = {weekday: "long", year: "numeric", month: "long", day: "numeric"}; +alert(date.toLocaleDateString("de-DE", options)); +// → "Donnerstag, 20. Dezember 2012" + +// an application may want to use UTC and make that visible +options.timeZone = "UTC"; +options.timeZoneName = "short"; +alert(date.toLocaleDateString("en-US", options)); +// → "Thursday, December 20, 2012, GMT" +</pre> + +<h2 id="Performance" name="Performance">性能</h2> + +<p>当格式化大量日期时，最好创建一个 <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/DateTimeFormat" title="/en-US/docs/JavaScript/Reference/Global_Objects/DateTimeFormat"><code>Intl.DateTimeFormat</code></a> 对象，然后使用该对象 <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/DateTimeFormat/format" title="/en-US/docs/JavaScript/Reference/Global_Objects/DateTimeFormat/format"><code>format</code></a> 属性提供的方法。</p> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范版本</th> + <th scope="col">规范状态</th> + <th scope="col">注解</th> + </tr> + <tr> + <td>ECMAScript 3rd Edition. Implemented in JavaScript 1.0</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', 'sec-15.9.5.6', 'Date.prototype.toLocaleDateString')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-date.prototype.tolocaledatestring', 'Date.prototype.toLocaleDateString')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + <tr> + <td><a href="http://www.ecma-international.org/ecma-402/1.0/#sec-13.3.2">ECMAScript Internationalization API Specification, 1<sup>st</sup> Edition</a></td> + <td>Standard</td> + <td>Defines <code>locales</code> and <code>options</code> arguments.</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Date.toLocaleDateString")}}</p> + +<h2 id="See_Also" name="See_Also">相关链接</h2> + +<ul> + <li>{{jsxref("Global_Objects/DateTimeFormat", "DateTimeFormat")}}</li> + <li>{{jsxref("Date.prototype.toLocaleString()")}}</li> + <li>{{jsxref("Date.prototype.toLocaleTimeString()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/date/tolocaleformat/index.html b/files/zh-cn/web/javascript/reference/global_objects/date/tolocaleformat/index.html new file mode 100644 index 0000000000..40c72fc476 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/date/tolocaleformat/index.html @@ -0,0 +1,73 @@ +--- +title: Date.prototype.toLocaleFormat() +slug: Web/JavaScript/Reference/Global_Objects/Date/toLocaleFormat +tags: + - Date + - 非标准 +translation_of: Archive/Web/JavaScript/Date.toLocaleFormat +--- +<div>{{JSRef}} {{non-standard_header}}</div> + +<p>非标准方法 <strong><code>toLocaleFormat()</code></strong> 按特定的格式将一个日期转换成一个字符串。 {{jsxref("Global_Objects/DateTimeFormat", "Intl.DateTimeFormat")}} 是符合标准的格式化日期的替代方法。另见更新的(newer)版本的 {{jsxref("Date.prototype.toLocaleDateString()")}}方法.</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><var>dateObj</var>.toLocaleFormat(<var>formatString</var>)</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>formatString</code></dt> + <dd>与C语言中的 <a class="external" href="http://www.opengroup.org/onlinepubs/007908799/xsh/strftime.html"><code>strftime()</code></a> 方法的参数形式要求相同的格式字符串。</dd> +</dl> + +<h2 id="描述">描述</h2> + +<p><code>toLocaleFormat()</code> 方法通过格式化生成的日期或时间提供了更好的软件层面的控制(provides greater software control over the formatting of the generated date and/or time)。用操作系统的地点来月份和星期几的名称本地化。然而，However, ordering of the day and month and other localization tasks are not handled automatically since you have control over the order in which they occur. You should take care that the format string is localized properly according to the user's system settings. Be aware that the locale used is not necessarily the same as the locale of the browser.</p> + +<p>Extension and XULRunner developers should know that just loading the format string from a <code>.dtd</code> or <code>.properties</code> file using a <code>chrome://<em>somedomain</em>/locale/<em>somefile.ext</em></code> URI should be <strong>avoided</strong>, as the <code>.dtd</code>/<code>.properties</code> file and the <code>toLocaleFormat()</code> method does not not necessarily use the same locale, which could result in odd looking or even ambiguous or unreadable dates.</p> + +<p>Also note that the behavior of the used locale depends on the platform, and the user might customize the locale used, so using the system locale the choose the format string might in some cases not even be adequate. You might consider using some of the more general <code>toLocale*</code> methods of the {{jsxref("Global_Objects/Date", "Date")}} object or doing your own custom localization of the date to be displayed using some of the <code>get*</code> methods of the {{jsxref("Global_Objects/Date", "Date")}} object instead of using this method.</p> + +<h2 id="示例">示例</h2> + +<h3 id="Using_toLocaleFormat()">Using <code>toLocaleFormat()</code></h3> + +<pre class="brush: js">var today = new Date(); +var date = today.toLocaleFormat('%A, %B %e, %Y'); // Bad example +</pre> + +<p>In this example, <code>toLocaleFormat()</code> returns a string such as "Wednesday, October 3, 2007". Note that the format string in this example is not properly localized, which will result in the problems described above.</p> + +<h2 id="腻子(Polyfill)">腻子(Polyfill)</h2> + +<p>When using the <a href="https://github.com/abritinthebay/datejs/wiki/Format-Specifiers">DateJS</a> library you can polyfill {{jsxref("Date.prototype.toLocaleDateString()")}} like this:</p> + +<pre class="brush: js">if (!Date.prototype.toLocaleFormat) { + (function() { + Date.prototype.toLocaleFormat = function(formatString) { + return this.format(formatString); + }; + }()); +}</pre> + +<h2 id="标准">标准</h2> + +<p>不属于任何标准。在JavaScript 1.6中被实现。</p> + +<h2 id="兼容性">兼容性</h2> + +<div> +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Date.toLocaleFormat")}}</p> +</div> + +<h2 id="另见">另见</h2> + +<ul> + <li>{{jsxref("Global_Objects/DateTimeFormat", "Intl.DateTimeFormat")}}</li> + <li>{{jsxref("Date.prototype.toLocaleString()")}}</li> + <li>{{jsxref("Date.prototype.toLocaleDateString()")}}</li> + <li>{{jsxref("Date.prototype.toLocaleTimeString()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/date/tolocalestring/index.html b/files/zh-cn/web/javascript/reference/global_objects/date/tolocalestring/index.html new file mode 100644 index 0000000000..75e2834be5 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/date/tolocalestring/index.html @@ -0,0 +1,161 @@ +--- +title: Date.prototype.toLocaleString() +slug: Web/JavaScript/Reference/Global_Objects/Date/toLocaleString +translation_of: Web/JavaScript/Reference/Global_Objects/Date/toLocaleString +--- +<div>{{JSRef("Global_Objects", "Date")}}</div> + +<p><code><strong>toLocaleString()</strong></code> <span style="line-height: 1.5;">方法返回该日期对象的字符串，该字符串格式因不同语言而不同。新增的参数 </span><code style="font-style: normal; line-height: 1.5;">locales</code><span style="line-height: 1.5;"> 和 </span><code style="font-style: normal; line-height: 1.5;">options</code><span style="line-height: 1.5;"> 使程序能够指定使用哪种语言格式化规则，允许定制该方法的表现（behavior）。在旧版本浏览器中， </span><code style="font-style: normal; line-height: 1.5;">locales</code><span style="line-height: 1.5;"> 和 </span><code style="font-style: normal; line-height: 1.5;">options</code><span style="line-height: 1.5;"> 参数被忽略，使用的语言环境和返回的字符串格式是各自独立实现的。</span></p> + +<div>{{EmbedInteractiveExample("pages/js/date-tolocalestring.html")}}</div> + + + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><var>dateObj.toLocaleString([locales [, options]])</var></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<p>查看<a href="#Browser_Compatibility" title="#Browser_Compatibility">浏览器兼容性</a>小节，看下哪些浏览器支持 <code style="font-style: normal;">locales</code> 和 <code style="font-style: normal;">options</code> 参数，还可以参看<a href="#Example:_Checking_for_support_for_locales_and_options_arguments">例子：检测 <code>locales</code> 和 <code>options</code> 参数支持情况</a>。</p> + +<p>{{page('zh-CN/docs/JavaScript/Reference/Global_Objects/DateTimeFormat','Parameters')}}</p> + +<p>每个日期时间组件的默认值都是undefined, 但是如果 <code>weekday</code>, <code>year</code>, <code>month</code>, <code>day</code>, <code>hour</code>, <code>minute</code>, <code>second</code> 属性都是 <code>undefined</code>, 那么 <code>year</code>, <code>month</code>, <code>day</code>, <code>hour</code>, <code>minute<font face="Open Sans, Arial, sans-serif"> 和 </font></code><code>second</code> 的值都被认为是 "numeric".</p> + +<h3 id="返回值">返回值</h3> + +<p>根据当地语言规定返回代表着时间的字符串。</p> + +<h2 id="Examples" name="Examples">例子</h2> + +<h3 id="Example:_Using_toLocaleString" name="Example:_Using_toLocaleString">例子：使用 <code>toLocaleString</code></h3> + +<p>没有指定语言环境（locale）时，返回一个使用默认语言环境和格式设置（options）的格式化字符串。</p> + +<pre class="brush:js">var date = new Date(Date.UTC(2012, 11, 12, 3, 0, 0)); + +// toLocaleString 不包含参数的返回值取决于实现, +// 默认的区域(locale),和默认的时区(time zone) +date.toLocaleString(); +// → 如果是在en-US区域和America/Los_Angeles时区运行返回值为"12/11/2012, 7:00:00 PM"</pre> + +<h3 id="Example:_Checking_for_support_for_locales_and_options_arguments" name="Example:_Checking_for_support_for_locales_and_options_arguments">例子：检测 <code>locales</code> 和 <code>options</code> 参数支持情况</h3> + +<p><code style="font-style: normal;">locales</code> 和 <code style="font-style: normal;">options</code> 参数不是所有的浏览器都支持。为了检测一种实现环境（implementation）是否支持它们，可以使用不合法的语言标签，如果实现环境支持该参数，则会抛出一个 <code style="font-style: normal;">RangeError</code> 异常，反之会忽略参数。</p> + +<pre class="brush: js">function toLocaleStringSupportsLocales() { + try { + new Date().toLocaleString("i"); + } catch (e) { + return e.name === "RangeError"; + } + return false; +} +</pre> + +<h3 id="Example:_Using_locales" name="Example:_Using_locales">例子：使用 <code>locales</code> 参数</h3> + +<p>下例展示了本地化日期格式的一些变化。为了在应用的用户界面得到某种语言的日期和时间格式，必须确保使用 <code style="font-style: normal;">locales</code> 参数指定了该语言（可能还需要设置某些回退语言）。</p> + +<pre class="brush: js">var date = new Date(Date.UTC(2012, 11, 20, 3, 0, 0)); + +//假定本地时区是 America/Los_Angeles(美国时区) +//en-US(美利坚英语)使用 month-day-year 的顺序展示年月日 +alert(date.toLocaleString("en-US")); +// → "12/19/2012, 7:00:00 PM" + +// en-GB(不列颠英语)使用 day-month-year 顺序展示年月日 +alert(date.toLocaleString("en-GB")); +// → "20/12/2012 03:00:00" + +// 韩语使用 year-month-day 顺序展示年月日 +alert(date.toLocaleString("ko-KR")); +// → "2012. 12. 20. 오후 12:00:00" + +// 大多数阿拉伯语国家的阿拉伯语使用阿拉伯数字 +alert(date.toLocaleString("ar-EG")); +// → "<span dir="rtl">٢٠/١٢/٢٠١٢ ٥:٠٠:٠٠ ص</span>" + +//在日本，应用可能想要使用日本日历, +//2012 是平成24年（平成是是日本天皇明仁的年号,由1989年1月8日起开始计算直至现在） +alert(date.toLocaleString("ja-JP-u-ca-japanese")); +// → "24/12/20 12:00:00" + +//当请求一个语言可能不支持，如巴厘(ban)，若有备用的语言印尼语(id)， +//那么将使用印尼语(id) +alert(date.toLocaleString(["ban", "id"])); +// → "20/12/2012 11.00.00" +</pre> + +<h3 id="Example:_Using_options" name="Example:_Using_options">例子：使用 <code>options</code> 参数</h3> + +<p>可以使用 <code style="font-style: normal;">options </code>参数来自定义 <code style="font-style: normal;">toLocaleString</code> 方法返回的字符串。</p> + +<pre class="brush: js">var date = new Date(Date.UTC(2012, 11, 20, 3, 0, 0)); + +//请求参数(options)中包含参数星期(weekday)，并且该参数的值为长类型(long) +var options = {weekday: "long", year: "numeric", month: "long", day: "numeric"}; +alert(date.toLocaleString("de-DE", options)); +// → "Donnerstag, 20. Dezember 2012" + +//一个应用使用 世界标准时间(UTC),并且UTC使用短名字(short)展示 +options.timeZone = "UTC"; +options.timeZoneName = "short";//若不写这一行那么仍然显示的是世界标准时间；但是GMT三个字母不会显示 +alert(date.toLocaleString("en-US", options)); +// → "Thursday, December 20, 2012, GMT" + +// 使用24小时制 +alert(date.toLocaleString("en-US", {hour12: false})); +// → "12/19/2012, 19:00:00" +</pre> + +<h2 id="Performance" name="Performance">性能</h2> + +<p>当格式化大量日期时，最好创建一个 <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/DateTimeFormat" title="/en-US/docs/JavaScript/Reference/Global_Objects/DateTimeFormat"><code>Intl.DateTimeFormat</code></a> 对象，然后使用该对象 <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/DateTimeFormat/format" title="/en-US/docs/JavaScript/Reference/Global_Objects/DateTimeFormat/format"><code>format</code></a> 属性提供的方法。</p> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范版本</th> + <th scope="col">规范状态</th> + <th scope="col">注解</th> + </tr> + <tr> + <td>ECMAScript 1st Edition. Implemented in JavaScript 1.0</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', 'sec-15.9.5.5', 'Date.prototype.toLocaleString')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-date.prototype.tolocalestring', 'Date.prototype.toLocaleString')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + <tr> + <td><a href="http://www.ecma-international.org/ecma-402/1.0/#sec-13.3.1">ECMAScript Internationalization API Specification, 1<sup>st</sup> Edition</a></td> + <td>Standard</td> + <td>Defines <code>locales</code> and <code>options</code> arguments.</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Date.toLocaleString")}}</p> + +<h2 id="See_Also" name="See_Also">相关链接</h2> + +<ul> + <li>{{jsxref("Global_Objects/DateTimeFormat", "DateTimeFormat")}}</li> + <li>{{jsxref("Date.prototype.toLocaleDateString()")}}</li> + <li>{{jsxref("Date.prototype.toLocaleTimeString()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/date/tolocaletimestring/index.html b/files/zh-cn/web/javascript/reference/global_objects/date/tolocaletimestring/index.html new file mode 100644 index 0000000000..2a52a021e7 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/date/tolocaletimestring/index.html @@ -0,0 +1,151 @@ +--- +title: Date.prototype.toLocaleTimeString() +slug: Web/JavaScript/Reference/Global_Objects/Date/toLocaleTimeString +translation_of: Web/JavaScript/Reference/Global_Objects/Date/toLocaleTimeString +--- +<div>{{JSRef("Global_Objects", "Date")}}</div> + +<p>The <code><strong>toLocaleTimeString()</strong></code> <span style="line-height: 1.5;">方法返回该日期对象时间部分的字符串，该字符串格式因不同语言而不同。新增的参数 </span><code style="font-style: normal; line-height: 1.5;">locales</code><span style="line-height: 1.5;"> 和 </span><code style="font-style: normal; line-height: 1.5;">options</code><span style="line-height: 1.5;"> 使程序能够指定使用哪种语言格式化规则，允许定制该方法的表现（behavior）。在旧版本浏览器中， </span><code style="font-style: normal; line-height: 1.5;">locales</code><span style="line-height: 1.5;"> 和 </span><code style="font-style: normal; line-height: 1.5;">options</code><span style="line-height: 1.5;"> 参数被忽略，使用的语言环境和返回的字符串格式是各自独立实现的。</span></p> + +<div>{{EmbedInteractiveExample("pages/js/date-tolocaletimestring.html")}}</div> + + + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><var>dateObj</var>.toLocaleTimeString([locales [, options]])</pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<p>查看<a href="#Browser_Compatibility" title="#Browser_Compatibility">浏览器兼容性</a>小节，看下哪些浏览器支持 <code style="font-style: normal;">locales</code> 和 <code style="font-style: normal;">options</code> 参数，还可以参看<a href="#Example:_Checking_for_support_for_locales_and_options_arguments">例子：检测 <code>locales</code> 和 <code>options</code> 参数支持情况</a>。</p> + +<p>{{page('zh-US/docs/JavaScript/Reference/Global_Objects/DateTimeFormat','Parameters')}}</p> + +<p>The default value for each date-time component property is <code>undefined</code>, but if the <code>hour</code>, <code>minute</code>, <code>second</code> properties are all <code>undefined</code>, then <code>hour</code>, <code>minute</code>, and <code>second</code> are assumed to be "numeric".</p> + +<h2 id="Examples" name="Examples">例子</h2> + +<h3 id="Example:_Using_toLocaleTimeString" name="Example:_Using_toLocaleTimeString">例子：使用 <code>toLocaleTimeString</code></h3> + +<p>没有指定语言环境（locale）时，返回一个使用默认语言环境和格式设置（options）的格式化字符串。</p> + +<pre class="brush:js">var date = new Date(Date.UTC(2012, 11, 12, 3, 0, 0)); + +// toLocaleTimeString without arguments depends on the implementation, +// the default locale, and the default time zone +alert(date.toLocaleTimeString()); +// → "7:00:00 PM" if run in en-US locale with time zone America/Los_Angeles</pre> + +<h3 id="Example:_Checking_for_support_for_locales_and_options_arguments" name="Example:_Checking_for_support_for_locales_and_options_arguments">例子：检测 <code>locales</code> 和 <code>options</code> 支持情况</h3> + +<p><code style="font-style: normal;">locales</code> 和 <code style="font-style: normal;">options</code> 参数不是所有的浏览器都支持。为了检测一种实现环境（implementation）是否支持它们，可以使用不合法的语言标签，如果实现环境支持该参数，则会抛出一个 <code style="font-style: normal;">RangeError</code> 异常，反之会忽略参数。</p> + +<pre class="brush: js">function toLocaleTimeStringSupportsLocales() { + try { + new Date().toLocaleTimeString("i"); + } catch (e) { + return e.name === "RangeError"; + } + return false; +} +</pre> + +<h3 id="Example:_Using_locales" name="Example:_Using_locales">例子：使用 <code>locales</code> 参数</h3> + +<p>下例展示了本地化时间格式的一些变化。为了在应用的用户界面得到某种语言的时间格式，必须确保使用 <code style="font-style: normal;">locales</code> 参数指定了该语言（可能还需要设置某些回退语言）。</p> + +<pre class="brush: js">var date = new Date(Date.UTC(2012, 11, 20, 3, 0, 0)); + +// formats below assume the local time zone of the locale; +// America/Los_Angeles for the US + +// US English uses 12-hour time with AM/PM +alert(date.toLocaleTimeString("en-US")); +// → "7:00:00 PM" + +// British English uses 24-hour time without AM/PM +alert(date.toLocaleTimeString("en-GB")); +// → "03:00:00" + +// Korean uses 12-hour time with AM/PM +alert(date.toLocaleTimeString("ko-KR")); +// → "오후 12:00:00" + +// Arabic in most Arabic speaking countries uses real Arabic digits +alert(date.toLocaleTimeString("ar-EG")); +// → "<span dir="rtl">٧:٠٠:٠٠ م</span>" + +// when requesting a language that may not be supported, such as +// Balinese, include a fallback language, in this case Indonesian +alert(date.toLocaleTimeString(["ban", "id"])); +// → "11.00.00" +</pre> + +<h3 id="Example:_Using_options" name="Example:_Using_options">例子：使用 <code>options</code> 参数</h3> + +<p>可以使用 <code style="font-style: normal;">options </code>参数来自定义 <code style="font-style: normal;">toLocaleTimeString</code> 方法返回的字符串。</p> + +<pre class="brush: js">var date = new Date(Date.UTC(2012, 11, 20, 3, 0, 0)); + +// an application may want to use UTC and make that visible +var options = {timeZone: "UTC", timeZoneName: "short"}; +alert(date.toLocaleTimeString("en-US", options)); +// → "3:00:00 AM GMT" + +// sometimes even the US needs 24-hour time +alert(date.toLocaleTimeString("en-US", {hour12: false})); +// → "19:00:00" +</pre> + +<h2 id="Performance" name="Performance">性能</h2> + +<p>当格式化大量日期时，最好创建一个 <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/DateTimeFormat" title="/en-US/docs/JavaScript/Reference/Global_Objects/DateTimeFormat"><code>Intl.DateTimeFormat</code></a> 对象，然后使用该对象 <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/DateTimeFormat/format" title="/en-US/docs/JavaScript/Reference/Global_Objects/DateTimeFormat/format"><code>format</code></a> 属性提供的方法。</p> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范版本</th> + <th scope="col">规范状态</th> + <th scope="col">注解</th> + </tr> + <tr> + <td>ECMAScript 3rd Edition. Implemented in JavaScript 1.0</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.9.5.7', 'Date.prototype.toLocaleTimeString')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-date.prototype.tolocalestring', 'Date.prototype.toLocaleTimeString')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + <tr> + <td><a href="http://www.ecma-international.org/ecma-402/1.0/#sec-13.3.3">ECMAScript Internationalization API Specification, 1<sup>st</sup> Edition</a></td> + <td>Standard</td> + <td>Defines <code>locales</code> and <code>options</code> arguments.</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Date.toLocaleTimeString")}}</p> +</div> + +<h2 id="See_Also" name="See_Also">相关链接</h2> + +<ul> + <li>{{jsxref("Global_Objects/DateTimeFormat", "DateTimeFormat")}}</li> + <li>{{jsxref("Date.prototype.toLocaleDateString()")}}</li> + <li>{{jsxref("Date.prototype.toLocaleString()")}}</li> + <li>{{jsxref("Date.prototype.toTimeString()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/date/tosource/index.html b/files/zh-cn/web/javascript/reference/global_objects/date/tosource/index.html new file mode 100644 index 0000000000..dbcae1c739 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/date/tosource/index.html @@ -0,0 +1,50 @@ +--- +title: Date.prototype.toSource() +slug: Web/JavaScript/Reference/Global_Objects/Date/toSource +translation_of: Web/JavaScript/Reference/Global_Objects/Date/toSource +--- +<div>{{JSRef}} {{non-standard_header}}</div> + +<p><strong><code>toSource() </code></strong>返回表示源代码的字符串。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>dateObj</var>.toSource() +Date.toSource()</pre> + +<h3 id="返回值">返回值</h3> + +<p> 表示{{jsxref("Global_Objects/Date", "Date")}} 源代码的字符串</p> + +<h2 id="描述">描述</h2> + +<p><code>toSource()</code> 返回以下参数:</p> + +<ul> + <li>对于内置的{{jsxref("Date")}} 对象, <code>toSource()</code> 返回以下字符串,表示源代码不可用: + + <pre class="brush: js">function Date() { + [native code] +} +</pre> + </li> + <li>对于{{jsxref("Date")}}的实例, <code>toSource()</code> 返回表示该日期源代码的字符串.</li> +</ul> + +<p>此方法通常由JavaScript内部调用，而不是在代码中显式调用。</p> + +<h2 id="规范">规范</h2> + +<p>暂无标准, 在 JavaScript 1.3中实现.</p> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Date.toSource")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Object.prototype.toSource()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/date/tostring/index.html b/files/zh-cn/web/javascript/reference/global_objects/date/tostring/index.html new file mode 100644 index 0000000000..ce97ceafc5 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/date/tostring/index.html @@ -0,0 +1,90 @@ +--- +title: Date.prototype.toString() +slug: Web/JavaScript/Reference/Global_Objects/Date/toString +translation_of: Web/JavaScript/Reference/Global_Objects/Date/toString +--- +<div>{{JSRef}}</div> + +<p><code><strong>toString()</strong></code> 方法返回一个字符串，表示该{{jsxref("Date")}}对象。</p> + +<div>{{EmbedInteractiveExample("pages/js/date-tostring.html")}}</div> + + + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><var>dateObj</var>.toString()</pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<p>无</p> + +<h2 id="Description" name="Description">描述</h2> + +<p>{{jsxref("Date")}}对象覆盖了 {{jsxref("Object")}} 对象的 <code>toString() </code>方法；它不是继承自 {{jsxref("Object.prototype.toString()")}}。对于 {{jsxref("Date")}} 对象，<code>toString()</code> 方法返回一个表示该对象的字符串。</p> + +<p>该 <code>toString</code> 方法总是返回一个美式英语日期格式的字符串。</p> + +<p>当一个日期对象被用来作为文本值或用来进行字符串连接时，<code>toString</code> 方法会被自动调用。</p> + +<p><code>toString() </code>是通用函数。如果不是{{jsxref("Date")}}实例，则 返回"Invalid Date"。</p> + +<h2 id="Examples" name="Examples">例子</h2> + +<h3 id="Example:_Using_toString" name="Example:_Using_toString">例子： 使用 <code>toString</code> 方法</h3> + +<p>下例把一个{{jsxref("Date")}}对象的 <code>toString</code> 返回值赋给 <code>myVar：</code></p> + +<pre class="brush:js">var x = new Date(); +myVar = x.toString(); // 把类似于下面格式的值赋给 myVar， +// Fri Apr 26 2019 11:46:17 GMT+0800 (中国标准时间) +</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('ES1')}}</td> + <td>{{Spec2('ES1')}}</td> + <td>Initial definition. Implemented in JavaScript 1.0.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.9.5.2', 'Date.prototype.toLocaleTimeString')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-date.prototype.tostring', 'Date.prototype.toString')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-date.prototype.tostring', 'Date.prototype.toString')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Date.toString")}}</p> +</div> + +<h2 id="See_Also" name="See_Also">相关链接</h2> + +<ul> + <li>{{jsxref("Object.prototype.toString()")}}</li> + <li>{{jsxref("Date.prototype.toDateString()")}}</li> + <li>{{jsxref("Date.prototype.toLocaleString()")}}</li> + <li>{{jsxref("Date.prototype.toTimeString()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/date/totimestring/index.html b/files/zh-cn/web/javascript/reference/global_objects/date/totimestring/index.html new file mode 100644 index 0000000000..0a05806085 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/date/totimestring/index.html @@ -0,0 +1,73 @@ +--- +title: Date.prototype.toTimeString() +slug: Web/JavaScript/Reference/Global_Objects/Date/toTimeString +translation_of: Web/JavaScript/Reference/Global_Objects/Date/toTimeString +--- +<div>{{JSRef("Global_Objects", "Date")}}</div> + +<p><code><strong>toTimeString()</strong></code> 方法以人类易读形式返回一个日期对象时间部分的字符串，该字符串以美式英语格式化。</p> + +<div>{{EmbedInteractiveExample("pages/js/date-totimestring.html")}}</div> + + + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><var>dateObj</var>.toTimeString()</pre> + +<h2 id="Description" name="Description">描述</h2> + +<p>{{jsxref("Global_Objects/Date", "Date")}} 对象的实例引用一个具体的时间点。 调用 {{jsxref("Date.toString", "toString")}} 方法以美式英语和人类易读的形式，返回日期对象的格式化字符串。在 <a href="/en-US/docs/SpiderMonkey" title="SpiderMonkey">SpiderMonkey</a> 里，该字符串由日期部分（年月日）和其后的时间部分（时分秒和时区）组成。有时会需要获取时间部分的字符串，这可以由 <code>toTimeString</code> 方法完成。</p> + +<p>The <code style="font-style: normal;">toTimeString</code> method is especially useful because compliant engines implementing <a href="https://developer.mozilla.org/en-US/docs/ECMAScript" title="ECMAScript">ECMA-262</a> may differ in the string obtained from <code style="font-style: normal;">toString</code> for <code style="font-style: normal;">Date</code> objects, as the format is implementation-dependent; simple string slicing approaches may not produce consistent results across multiple engines.</p> + +<h2 id="Example" name="Example">例子</h2> + +<h3 id="Example:_A_basic_usage_of_toTimeString" name="Example:_A_basic_usage_of_toTimeString">例子：<code>toTimeString</code> 方法的简单使用</h3> + +<pre class="brush:js">var d = new Date(1993, 6, 28, 14, 39, 7); + +println(d.toString()); // prints Wed Jul 28 1993 14:39:07 GMT-0600 (PDT) +println(d.toTimeString()); // prints 14:39:07 GMT-0600 (PDT) +</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>ECMAScript 3rd Edition</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.9.5.4', 'Date.prototype.toTimeString')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-date.prototype.totimestring', 'Date.prototype.toTimeString')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Date.toTimeString")}}</p> + +<h2 id="See_Also" name="See_Also">相关链接</h2> + +<ul> + <li>{{jsxref("Date.prototype.toLocaleTimeString()")}}</li> + <li>{{jsxref("Date.prototype.toDateString()")}}</li> + <li>{{jsxref("Date.prototype.toString()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/date/toutcstring/index.html b/files/zh-cn/web/javascript/reference/global_objects/date/toutcstring/index.html new file mode 100644 index 0000000000..4889075b1c --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/date/toutcstring/index.html @@ -0,0 +1,76 @@ +--- +title: Date.prototype.toUTCString() +slug: Web/JavaScript/Reference/Global_Objects/Date/toUTCString +translation_of: Web/JavaScript/Reference/Global_Objects/Date/toUTCString +--- +<div>{{JSRef("Global_Objects", "Date")}}</div> + +<p><code><strong>toUTCString()</strong></code> 方法把一个日期转换为一个字符串，使用UTC时区。</p> + +<div>{{EmbedInteractiveExample("pages/js/date-toutcstring.html")}}</div> + + + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><var>dateObj</var>.toUTCString()</pre> + +<h3 id="Parameters" name="Parameters">返回值</h3> + +<p>返回使用UTC时区表示给定日期的字符串</p> + +<p> </p> + +<h2 id="Description" name="Description">描述</h2> + +<p><code>toUTCString</code> 的返回值是一个使用UTC时区的易读格式字符串。返回值的格式可能随平台而变化。通常返回值是一个 RFC-1123 格式的时间戳，这是一个 RFC-822 时间戳的小幅更新版。</p> + +<h2 id="Examples" name="Examples">例子</h2> + +<h3 id="Example:_Using_toUTCString" name="Example:_Using_toUTCString">例子：使用<code>toUTCString</code></h3> + +<pre>var today = new Date(); +var UTCstring = today.toUTCString(); +// Mon, 03 Jul 2006 21:44:38 GMT +</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>ECMAScript 1st Edition. Implemented in JavaScript 1.3</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.9.5.42', 'Date.prototype.toUTCString')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-date.prototype.toutcstring', 'Date.prototype.toUTCString')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Date.toUTCString")}}</p> + +<h2 id="See_Also" name="See_Also">相关链接</h2> + +<ul> + <li>{{jsxref("Date.prototype.toLocaleString()")}}</li> + <li>{{jsxref("Date.prototype.toDateString()")}}</li> + <li>{{jsxref("Date.prototype.toISOString()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/date/utc/index.html b/files/zh-cn/web/javascript/reference/global_objects/date/utc/index.html new file mode 100644 index 0000000000..0be526200f --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/date/utc/index.html @@ -0,0 +1,104 @@ +--- +title: Date.UTC() +slug: Web/JavaScript/Reference/Global_Objects/Date/UTC +tags: + - Date + - JavaScript + - Method +translation_of: Web/JavaScript/Reference/Global_Objects/Date/UTC +--- +<div>{{JSRef("Global_Objects", "Date")}}</div> + +<p><code><strong>Date.UTC()</strong></code> 方法接受的参数同日期构造函数接受最多参数时一样，返回从1970-1-1 00:00:00 UTC到指定日期的的毫秒数。</p> + +<div>{{EmbedInteractiveExample("pages/js/date-utc.html")}}</div> + + + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code>Date.UTC(<em>year</em>,<em>month</em>[,<em>date</em>[,<em>hrs</em>[,<em>min</em>[,<em>sec</em>{{mediawiki.external(',<em>ms</em>')}}]]]]) </code></pre> + +<h2 id="Parameters" name="Parameters">参数</h2> + +<dl> + <dt><code>year</code></dt> + <dd>1900 年后的某一年份。</dd> + <dt><code>month</code></dt> + <dd>0 到 11 之间的一个整数，表示月份。</dd> + <dt><code>date</code></dt> + <dd>1 到 31 之间的一个整数，表示某月当中的第几天。</dd> + <dt><code>hrs</code></dt> + <dd>0 到 23 之间的一个整数，表示小时。</dd> + <dt><code>min</code></dt> + <dd>0 到 59 之间的一个整数，表示分钟。</dd> + <dt><code>sec</code></dt> + <dd>0 到 59 之间的一个整数，表示秒。</dd> + <dt><code>ms</code></dt> + <dd>0 到 999 之间的一个整数，表示毫秒。</dd> +</dl> + +<h2 id="Description" name="Description">描述</h2> + +<p><code>UTC</code> 方法接受以逗号隔开的日期参数，返回1970-1-1 00:00:00 UTC到指定的日期之间的毫秒数。</p> + +<p>你应该指定一个完整格式的年份，如 1998。如果年份被指定为 0 到 99 之间，则该方法会将年份转换为 20 世纪的一个年份（即 1900 + year），例如，指定为 95， 则年份为 1995。</p> + +<p><code>UTC</code> 方法与 <code>Date</code> 有两点不同：</p> + +<ul> + <li><code>Date.UTC</code> 方法使用协调世界时代替本地时间。</li> + <li><code>Date.UTC</code> 方法返回一个时间数值，而不是一个日期对象。</li> +</ul> + +<p>如果有一个指定的参数超出其合理范围，则 UTC 方法会通过更新其他参数直到该参数在合理范围内。例如，为月份指定 15，则年份将会加 1，然后月份将会使用 3。</p> + +<p>由于 <code>UTC</code> 是 <code>Date</code>（日期对象）的一个静态方法，所以应该在 <code>Date </code>上直接调用，就像 <code>Date.UTC()</code>，而不要把它作为创建的日期对象的方法。</p> + +<h2 id="Examples" name="Examples">例子</h2> + +<h3 id="Example:_Using_Date.UTC" name="Example:_Using_Date.UTC">例子：使用 <code>Date.UTC</code></h3> + +<p>下面的语句使用 UTC 时间代替本地时间创建了一个日期对象。</p> + +<pre class="brush:js">var utcDate = new Date(Date.UTC(96, 11, 1, 0, 0, 0)); +</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>ECMAScript 1st Edition. Implemented in JavaScript 1.0</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.9.4.3', 'Date.UTC')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-date.utc', 'Date.UTC')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Date.UTC")}}</p> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("Date.parse()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/date/valueof/index.html b/files/zh-cn/web/javascript/reference/global_objects/date/valueof/index.html new file mode 100644 index 0000000000..9871342a43 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/date/valueof/index.html @@ -0,0 +1,86 @@ +--- +title: Date.prototype.valueOf() +slug: Web/JavaScript/Reference/Global_Objects/Date/valueOf +tags: + - Date + - JavaScript + - 原型 + - 参考 + - 方法 + - 日期 +translation_of: Web/JavaScript/Reference/Global_Objects/Date/valueOf +--- +<div>{{JSRef}}</div> + +<p><code><strong>valueOf()</strong></code> 方法返回一个 {{jsxref("Date")}} 对象的原始值。</p> + +<div>{{EmbedInteractiveExample("pages/js/date-valueof.html")}}</div> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code><var>dateObj</var>.valueOf()</code></pre> + +<h3 id="Parameters" name="Parameters">返回值</h3> + +<p>从1970年1月1日0时0分0秒（UTC，即协调世界时）到该日期的毫秒数。</p> + +<h2 id="Description" name="Description">描述</h2> + +<p><code>valueOf</code> 方法返回以数值格式表示的一个 <code>Date</code> 对象的原始值，从1970年1月1日0时0分0秒（UTC，即协调世界时）到该日期对象所代表时间的毫秒数。</p> + +<p>该方法的功能和 {{jsxref("Date.prototype.getTime()")}} 方法一样。</p> + +<p>该方法通常在 JavaScript 内部被调用，而不是在代码中显式调用。</p> + +<h2 id="Examples" name="Examples">例子</h2> + +<h3 id="Example:_Using_valueOf" name="Example:_Using_valueOf">使用 <code>valueOf()</code></h3> + +<pre class="brush:js">var x = new Date(56, 6, 17); +var myVar = x.valueOf(); // assigns -424713600000 to myVar +</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>{{SpecName('ES1')}}</td> + <td>{{Spec2('ES1')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.9.5.8', 'Date.prototype.valueOf')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-date.prototype.valueof', 'Date.prototype.valueOf')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-date.prototype.valueof', 'Date.prototype.valueOf')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Date.valueOf")}}</p> + +<h2 id="See_Also" name="See_Also">相关链接</h2> + +<ul> + <li>{{jsxref("Object.prototype.valueOf()")}}</li> + <li>{{jsxref("Date.prototype.getTime()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/decodeuri/index.html b/files/zh-cn/web/javascript/reference/global_objects/decodeuri/index.html new file mode 100644 index 0000000000..dfaaf7e104 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/decodeuri/index.html @@ -0,0 +1,121 @@ +--- +title: decodeURI() +slug: Web/JavaScript/Reference/Global_Objects/decodeURI +tags: + - JavaScript + - URI + - decodeURI() + - 统一资源标识符 +translation_of: Web/JavaScript/Reference/Global_Objects/decodeURI +--- +<div>{{jsSidebar("Objects")}}</div> + +<div></div> + +<p><code><strong>decodeURI()</strong></code> 函数能解码由{{jsxref("encodeURI")}} 创建或其它流程得到的统一资源标识符（URI）。</p> + +<p>{{EmbedInteractiveExample("pages/js/globalprops-decodeuri.html")}}</p> + +<div class="hidden"> +<p>The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> and send us a pull request.</p> +</div> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code>decodeURI(<em>encodedURI</em>)</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>encodedURI</code></dt> + <dd>一个完整的编码过的 URI</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>返回一个给定编码统一资源标识符(URI)的未编码版本的新字符串。</p> + +<h3 id="异常">异常</h3> + +<p>当<code><em>encodedURI</em></code> 包含无效字符序列时，引发{{jsxref("URIError")}}（“格式错误的URI序列”）异常。</p> + +<h2 id="描述">描述</h2> + +<p>将已编码 URI 中所有能识别的转义序列转换成原字符，但不能解码那些不会被 {{jsxref("encodeURI")}} 编码的内容（例如 "<code>#</code>"）。</p> + +<h2 id="示例">示例</h2> + +<h3 id="解码一个西里尔字母（Cyrillic）URL">解码一个西里尔字母（Cyrillic）URL</h3> + +<pre class="brush: js">decodeURI("https://developer.mozilla.org/ru/docs/JavaScript_%D1%88%D0%B5%D0%BB%D0%BB%D1%8B"); +// "https://developer.mozilla.org/ru/docs/JavaScript_шеллы" +</pre> + +<h3 id="捕捉异常">捕捉异常</h3> + +<pre>try { + var a = decodeURI('%E0%A4%A'); +} catch(e) { + console.error(e); +} + +// URIError: malformed URI sequence</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>{{SpecName('ES3')}}</td> + <td>{{Spec2('ES3')}}</td> + <td>初始定义</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.1.3.1', 'decodeURI')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-decodeuri-encodeduri', 'decodeURI')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-decodeuri-encodeduri', 'decodeURI')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div class="hidden"> +<p>The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> +</div> + +<p>{{Compat("javascript.builtins.decodeURI")}}</p> + +<h2 id="相关链接"><br> + <span style="">相关链接</span></h2> + +<div id="compat-mobile"></div> + +<ul> + <li>{{jsxref("decodeURIComponent")}}</li> + <li>{{jsxref("encodeURI")}}</li> + <li>{{jsxref("encodeURIComponent")}}</li> +</ul> + +<p> + <audio style="display: none;"></audio> +</p> + +<p> + <audio style="display: none;"></audio> +</p> diff --git a/files/zh-cn/web/javascript/reference/global_objects/decodeuricomponent/index.html b/files/zh-cn/web/javascript/reference/global_objects/decodeuricomponent/index.html new file mode 100644 index 0000000000..07070206e4 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/decodeuricomponent/index.html @@ -0,0 +1,150 @@ +--- +title: decodeURIComponent() +slug: Web/JavaScript/Reference/Global_Objects/decodeURIComponent +tags: + - JavaScript + - URI + - 统一资源标识符 + - 解码 +translation_of: Web/JavaScript/Reference/Global_Objects/decodeURIComponent +--- +<div>{{jsSidebar("Objects")}}</div> + +<p><code><strong>decodeURIComponent()</strong></code> 方法用于解码由 {{jsxref("encodeURIComponent")}} 方法或者其它类似方法编码的部分统一资源标识符（URI）。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code>decodeURIComponent(<em>encodedURI</em>)</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>encodedURI</code></dt> + <dd>编码后的部分 URI</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p><span class="tlid-translation translation" lang="zh-CN"><span title="">一个解码后的统一资源标识符（URI）字符串，处理前的URI经过了给定格式的编码。</span></span></p> + +<h3 id="异常">异常</h3> + +<p>当该方法使用不当时，将会抛出一个{{jsxref("URIError")}}（<span class="tlid-translation translation" lang="zh-CN"><span title="">“</span></span><span class="tlid-translation translation" lang="zh-CN"><span title="">格式错误的URI序列</span></span><span class="tlid-translation translation" lang="zh-CN"><span title="">”</span></span>）异常。</p> + +<h2 id="描述">描述</h2> + +<p>将已编码 URI 中所有能识别的转义序列转换成原字符。</p> + +<h2 id="示例">示例</h2> + +<h3 id="解码一个西里尔字母的URL">解码一个西里尔字母的URL</h3> + +<pre class="brush: js">decodeURIComponent("JavaScript_%D1%88%D0%B5%D0%BB%D0%BB%D1%8B"); +// "JavaScript_шеллы" +</pre> + +<h3 id="捕捉异常">捕捉异常</h3> + +<pre class="brush: js">try { + var a = decodeURIComponent('%E0%A4%A'); +} catch(e) { + console.error(e); +} + +// URIError: malformed URI sequence</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>{{SpecName('ES3')}}</td> + <td>{{Spec2('ES3')}}</td> + <td>初始定义</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.1.3.2', 'decodeURIComponent')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-decodeuricomponent-encodeduricomponent', 'decodeURIComponent')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-decodeuricomponent-encodeduricomponent', 'decodeURIComponent')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{ CompatibilityTable() }}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>特性</th> + <th>Chrome</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>基础功能</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>特性</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>基础功能</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("decodeURI")}}</li> + <li>{{jsxref("encodeURI")}}</li> + <li>{{jsxref("encodeURIComponent")}}</li> +</ul> + +<p> + <audio style="display: none;"> </audio> +</p> diff --git a/files/zh-cn/web/javascript/reference/global_objects/encodeuri/index.html b/files/zh-cn/web/javascript/reference/global_objects/encodeuri/index.html new file mode 100644 index 0000000000..8f3db7a445 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/encodeuri/index.html @@ -0,0 +1,170 @@ +--- +title: encodeURI() +slug: Web/JavaScript/Reference/Global_Objects/encodeURI +tags: + - JavaScript + - URI + - decodeURI + - encodeURI + - 统一资源定位符 +translation_of: Web/JavaScript/Reference/Global_Objects/encodeURI +--- +<div>{{jsSidebar("Objects")}}</div> + +<p><code><strong>encodeURI()</strong></code> 函数通过将特定字符的每个实例替换为一个、两个、三或四转义序列来对统一资源标识符 (URI) 进行编码 (该字符的 UTF-8 编码仅为四转义序列)由两个 "代理" 字符组成)。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code>encodeURI(<em>URI</em>)</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>URI</code></dt> + <dd>一个完整的URI.</dd> + <dt> + <h3 id="返回值">返回值</h3> + + <p> 一个新字符串, 表示提供的字符串编码为统一资源标识符 (URI)。</p> + </dt> +</dl> + +<h2 id="描述">描述</h2> + +<p>假定一个URI是完整的URI，那么无需对那些保留的并且在URI中有特殊意思的字符进行编码。</p> + +<pre><code>http://username:password@www.example.com:80/path/to/file.php?foo=316&bar=this+has+spaces#anchor</code></pre> + +<p><code>encodeURI</code> 会替换所有的字符，但不包括以下字符，即使它们具有适当的UTF-8转义序列：</p> + +<table class="standard-table"> + <tbody> + <tr> + <td class="header">类型</td> + <td class="header">包含</td> + </tr> + <tr> + <td>保留字符</td> + <td><code>;</code> <code>,</code> <code>/</code> <code>?</code> <code>:</code> <code>@</code> <code>&</code> <code>=</code> <code>+</code> <code>$</code></td> + </tr> + <tr> + <td>非转义的字符</td> + <td>字母 数字 <code>-</code> <code>_</code> <code>.</code> <code>!</code> <code>~</code> <code>*</code> <code>'</code> <code>(</code> <code>)</code></td> + </tr> + <tr> + <td>数字符号</td> + <td><code>#</code></td> + </tr> + </tbody> +</table> + +<p>请注意，<code>encodeURI</code> 自身<em>无法</em>产生能适用于HTTP GET 或 POST 请求的URI，例如对于 XMLHTTPRequests, 因为 "&", "+", 和 "=" 不会被编码，然而在 GET 和 POST 请求中它们是特殊字符。然而{{jsxref("encodeURIComponent")}}这个方法会对这些字符编码。</p> + +<p>另外，如果试图编码一个非高-低位完整的代理字符，将会抛出一个 {{jsxref("URIError")}} 错误，例如：</p> + +<pre class="brush: js">// 编码高-低位完整字符 ok +console.log(encodeURI('\uD800\uDFFF')); + +// 编码单独的高位字符抛出 "Uncaught URIError: URI malformed" +console.log(encodeURI('\uD800')); + +// 编码单独的低位字符抛出 "Uncaught URIError: URI malformed" +console.log(encodeURI('\uDFFF'));</pre> + +<p>并且需要注意，如果URL需要遵循较新的<a href="http://tools.ietf.org/html/rfc3986">RFC3986</a>标准，那么方括号是被保留的(给IPv6)，因此对于那些没有被编码的URL部分(例如主机)，可以使用下面的代码：</p> + +<pre class="brush: js">function fixedEncodeURI (str) { + return encodeURI(str).replace(/%5B/g, '[').replace(/%5D/g, ']'); +}</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>{{SpecName('ES3')}}</td> + <td>{{Spec2('ES3')}}</td> + <td>初始定义</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.1.3.3', 'encodeURI')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-encodeuri-uri', 'encodeURI')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-encodeuri-uri', 'encodeURI')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{CompatibilityTable}}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>特性</th> + <th>Chrome</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>基础功能</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>特性</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>基础功能</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("decodeURI")}}</li> + <li>{{jsxref("encodeURIComponent")}}</li> + <li>{{jsxref("decodeURIComponent")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/encodeuricomponent/index.html b/files/zh-cn/web/javascript/reference/global_objects/encodeuricomponent/index.html new file mode 100644 index 0000000000..d80cd457c9 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/encodeuricomponent/index.html @@ -0,0 +1,144 @@ +--- +title: encodeURIComponent() +slug: Web/JavaScript/Reference/Global_Objects/encodeURIComponent +tags: + - JavaScript + - URI + - 统一资源标识符 +translation_of: Web/JavaScript/Reference/Global_Objects/encodeURIComponent +--- +<div>{{jsSidebar("Objects")}}</div> + +<p><code><strong>encodeURIComponent()</strong></code>函数通过将一个，两个，三个或四个表示字符的UTF-8编码的转义序列替换某些字符的每个实例来编码 <a href="https://wiki.developer.mozilla.org/en-US/docs/Glossary/URI">URI</a> （对于由两个“代理”字符组成的字符而言，将仅是四个转义序列） 。</p> + +<p>{{EmbedInteractiveExample("pages/js/globalprops-encodeuricomponent.html","shorter")}}</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox notranslate">encodeURIComponent(str);</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>str</code></dt> + <dd>String. URI 的组成部分。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>原字串作为URI组成部分被被编码后的新字符串。</p> + +<h2 id="描述">描述</h2> + +<p><code>encodeURIComponent</code> 转义除了如下所示外的所有字符：</p> + +<pre class="notranslate">不转义的字符： + A-Z a-z 0-9 <code>-</code> <code>_</code> <code>.</code> <code>!</code> <code>~</code> <code>*</code> <code>'</code> <code>(</code> <code>)</code></pre> + +<p><code>encodeURIComponent()</code> 和 <strong><code>encodeURI</code></strong> 有以下几个不同点：</p> + +<pre class="notranslate">var set1 = ";,/?:@&=+$"; // 保留字符 +var set2 = "-_.!~*'()"; // 不转义字符 +var set3 = "#"; // 数字标志 +var set4 = "ABC abc 123"; // 字母数字字符和空格 + +console.log(encodeURI(set1)); // ;,/?:@&=+$ +console.log(encodeURI(set2)); // -_.!~*'() +console.log(encodeURI(set3)); // # +console.log(encodeURI(set4)); // ABC%20abc%20123 (the space gets encoded as %20) + +console.log(encodeURIComponent(set1)); // %3B%2C%2F%3F%3A%40%26%3D%2B%24 +console.log(encodeURIComponent(set2)); // -_.!~*'() +console.log(encodeURIComponent(set3)); // %23 +console.log(encodeURIComponent(set4)); // ABC%20abc%20123 (the space gets encoded as %20)</pre> + +<p>注意，如果试图编码一个非高-低位完整的代理字符，将会抛出一个 {{jsxref("URIError")}} 错误，例如：</p> + +<pre class="brush: js notranslate">// 高低位完整 +alert(encodeURIComponent('\uD800\uDFFF')); + +// 只有高位，将抛出"URIError: malformed URI sequence" +alert(encodeURIComponent('\uD800')); + +// 只有低位，将抛出"URIError: malformed URI sequence" +alert(encodeURIComponent('\uDFFF')); </pre> + +<p>为了避免服务器收到不可预知的请求，对任何用户输入的作为URI部分的内容你都需要用encodeURIComponent进行转义。比如，一个用户可能会输入"<code>Thyme &time=again</code>"作为<code>comment</code>变量的一部分。如果不使用encodeURIComponent对此内容进行转义，服务器得到的将是<code>comment=Thyme%20&time=again</code>。请注意，"&"符号和"="符号产生了一个新的键值对，所以服务器得到两个键值对（一个键值对是<code>comment=Thyme</code>，另一个则是<code>time=again</code>），而不是一个键值对。</p> + +<p>对于 <a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/association-of-controls-and-forms.html#application/x-www-form-urlencoded-encoding-algorithm"><code>application/x-www-form-urlencoded</code></a> (POST) 这种数据方式，空格需要被替换成 '+'，所以通常使用 <code>encodeURIComponent</code> 的时候还会把 "%20" 替换为 "+"。</p> + +<p>为了更严格的遵循 <a class="external" href="http://tools.ietf.org/html/rfc3986">RFC 3986</a>（它保留 !, ', (, ), 和 *），即使这些字符并没有正式划定 URI 的用途，下面这种方式是比较安全的：</p> + +<pre class="brush: js notranslate">function fixedEncodeURIComponent (str) { + return encodeURIComponent(str).replace(/[!'()*]/g, function(c) { + return '%' + c.charCodeAt(0).toString(16); + }); +}</pre> + +<h2 id="示例">示例</h2> + +<p>下面这个例子提供了 UTF-8 下 <code>Content-Disposition</code> 和 <code>Link</code> 的服务器响应头信息的参数（例如 UTF-8 文件名)：</p> + +<pre class="brush: js notranslate">var fileName = 'my file(2).txt'; +var header = "Content-Disposition: attachment; filename*=UTF-8''" + + encodeRFC5987ValueChars(fileName); + +console.log(header); +// 输出 "Content-Disposition: attachment; filename*=UTF-8''my%20file%282%29.txt" + + +function encodeRFC5987ValueChars (str) { + return encodeURIComponent(str). + // 注意，仅管 RFC3986 保留 "!"，但 RFC5987 并没有 + // 所以我们并不需要过滤它 + replace(/['()]/g, escape). // i.e., %27 %28 %29 + replace(/\*/g, '%2A'). + // 下面的并不是 RFC5987 中 URI 编码必须的 + // 所以对于 |`^ 这3个字符我们可以稍稍提高一点可读性 + replace(/%(?:7C|60|5E)/g, unescape); +} +</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>{{SpecName('ES3')}}</td> + <td>{{Spec2('ES3')}}</td> + <td>初始定义</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.1.3.4', 'encodeURIComponent')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-encodeuricomponent-uricomponent', 'encodeURIComponent')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-encodeuricomponent-uricomponent', 'encodeURIComponent')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{Compat("javascript.builtins.encodeURIComponent")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("decodeURI")}}</li> + <li>{{jsxref("encodeURI")}}</li> + <li>{{jsxref("decodeURIComponent")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/error/columnnumber/index.html b/files/zh-cn/web/javascript/reference/global_objects/error/columnnumber/index.html new file mode 100644 index 0000000000..cff8e92402 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/error/columnnumber/index.html @@ -0,0 +1,81 @@ +--- +title: Error.prototype.columnNumber +slug: Web/JavaScript/Reference/Global_Objects/Error/columnNumber +translation_of: Web/JavaScript/Reference/Global_Objects/Error/columnNumber +--- +<div>{{JSRef}} {{non-standard_header}}</div> + +<p><code><strong>columnNumber</strong></code>属性包含引发此错误的文件行中的列号。</p> + +<h2 id="例子">例子</h2> + +<h3 id="使用_columnNumber">使用 <code>columnNumber</code></h3> + +<pre class="brush: js">var e = new Error('Could not parse input'); +throw e; +console.log(e.columnNumber) // 0 +</pre> + +<h2 id="规范">规范</h2> + +<p>不属于任何规范的一部分. 非标准.</p> + +<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>基本支持</td> + <td>{{CompatNo}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</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>基本支持</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Error.prototype.stack")}} {{non-standard_inline}}</li> + <li>{{jsxref("Error.prototype.lineNumber")}} {{non-standard_inline}}</li> + <li>{{jsxref("Error.prototype.fileName")}} {{non-standard_inline}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/error/filename/index.html b/files/zh-cn/web/javascript/reference/global_objects/error/filename/index.html new file mode 100644 index 0000000000..430cb738c2 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/error/filename/index.html @@ -0,0 +1,85 @@ +--- +title: Error.prototype.fileName +slug: Web/JavaScript/Reference/Global_Objects/Error/fileName +translation_of: Web/JavaScript/Reference/Global_Objects/Error/fileName +--- +<div>{{JSRef}} {{non-standard_header}}</div> + +<p><code><strong>fileName</strong></code> 属性包含引发此错误的文件的路径.</p> + +<h2 id="描述">描述</h2> + +<p>此非标准属性包含引发此错误的文件的路径. 如果从调试器上下文调用，例如Firefox Developer Tools，将会返回“debugger eval code”.</p> + +<h2 id="例子">例子</h2> + +<h3 id="使用_fileName">使用 <code>fileName</code></h3> + +<pre class="brush: js">var e = new Error('Could not parse input'); +throw e; +// e.fileName could look like "file:///C:/example.html" +</pre> + +<h2 id="规范">规范</h2> + +<p>不属于任何规范的一部分. 非标准.</p> + +<h2 id="Browser_compatibility">Browser compatibility</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>基本支持</td> + <td>{{CompatNo}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</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>基本支持</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Error.prototype.stack")}} {{non-standard_inline}}</li> + <li>{{jsxref("Error.prototype.columnNumber")}} {{non-standard_inline}}</li> + <li>{{jsxref("Error.prototype.lineNumber")}} {{non-standard_inline}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/error/index.html b/files/zh-cn/web/javascript/reference/global_objects/error/index.html new file mode 100644 index 0000000000..27bd521d4e --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/error/index.html @@ -0,0 +1,257 @@ +--- +title: Error +slug: Web/JavaScript/Reference/Global_Objects/Error +tags: + - Error + - Whoops! + - 参考 +translation_of: Web/JavaScript/Reference/Global_Objects/Error +--- +<p>{{JSRef}}</p> + +<p><span style="line-height: inherit;">通过<strong>Error</strong>的构造器可以创建一个错误对象。当运行时错误产生时，Error的实例对象会被抛出。Error对象</span>也<span style="line-height: inherit;">可用于用户自定义的异常的基础对象。下面列出了各种内建的标准错误类型。</span></p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="brush: js">new Error([<em>message</em>[, <em>fileName</em>[,<em>lineNumber</em>]]])</pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>message</code></dt> + <dd>可选。人类可阅读的错误描述信息。</dd> +</dl> + +<dl> + <dt><code>fileName </code>{{non-standard_inline}}</dt> + <dd>可选。被创建的<span style="font-family: monospace; line-height: inherit;">Error对象的fileName属性值。</span><span style="line-height: inherit;">默认是调用Error构造器代码所在的文件 的名字。</span></dd> +</dl> + +<dl> + <dt><code>lineNumber </code>{{non-standard_inline}}</dt> + <dd>可选。被创建的<span style="font-family: monospace; line-height: inherit;">Error对象的lineNumber属性值。默认是</span><span style="line-height: inherit;">调用Error构造器代码所在的文件的行号</span><span style="font-family: monospace; line-height: inherit;">。</span></dd> +</dl> + +<h2 id="Description" name="Description">描述</h2> + +<p>当代码运行时的发生错误，会创建新的<code>Error</code> 对象，并将其抛出。</p> + +<p><span style="line-height: inherit;">该页面描述了Error对象自身的使用,以及其构造函数的使用</span><span style="line-height: inherit;">. 关于Error实例的内部属性和方法,请看</span> {{jsxref("Error.prototype")}}。</p> + +<h3 id="作为函数使用">作为函数使用</h3> + +<p>当像函数一样使用 <code>Error</code> 时 -- 如果没有 {{jsxref("Operators/new", "new")}}，它将返回一个 <code>Error</code> 对象。所以， 仅仅调用 <code>Error</code> 产生的结果与通过<code>new</code> 关键字构造 <code>Error</code> 对象生成的结果相同。 </p> + +<pre><code>// this: +const x = Error('I was created using a function call!'); +// has the same functionality as this: +const y = new Error('I was constructed via the "new" keyword!');</code></pre> + +<h3 id="Error_types" name="Error_types">Error 类型</h3> + +<p>除了通用的<span style="font-family: courier new,andale mono,monospace; line-height: inherit;">Error构造函数外，</span>JavaScript<span style="font-family: courier new,andale mono,monospace; line-height: inherit;">还有6个其他类型的错误构造函数。更多客户端异常,详见</span><span style="line-height: inherit;"> </span><a href="/en/JavaScript/Guide/Statements#Exception_Handling_Statements" style="line-height: inherit;" title="en/JavaScript/Guide/Statements#Exception Handling Statements">Exception Handling Statements</a>。</p> + +<dl> + <dt><strong style="font-weight: bold;">{{jsxref("EvalError")}}</strong></dt> + <dd>创建一个error实例，表示错误的原因：与 {{jsxref("Global_Objects/eval", "eval()")}} 有关。</dd> + <dt><strong style="font-weight: bold;">{{jsxref("InternalError")}} {{non-standard_inline}}</strong></dt> + <dd>创建一个代表Javascript引擎内部错误的异常抛出的实例。 如: "递归太多".</dd> +</dl> + +<dl> + <dt><strong style="font-weight: bold;">{{jsxref("RangeError", "RangeError")}}</strong></dt> + <dd>创建一个error实例，表示错误的原因：<span style="line-height: inherit;">数值变量或参数超出其有效范围</span><span style="line-height: inherit;">。</span></dd> +</dl> + +<dl> + <dt><strong style="font-weight: bold;">{{jsxref("ReferenceError")}}</strong></dt> + <dd>创建一个error实例，表示错误的原因：无效引用。</dd> +</dl> + +<dl> + <dt><strong style="font-weight: bold;">{{jsxref("SyntaxError")}}</strong></dt> + <dd>创建一个error实例，表示错误的原因：{{jsxref("Global_Objects/eval", "eval()")}}在解析代码的过程中发生的语法错误<span style="line-height: inherit;">。</span></dd> +</dl> + +<dl> + <dt><strong style="font-weight: bold;">{{jsxref("TypeError")}}</strong></dt> + <dd>创建一个error实例，表示错误的原因：变量或参数不属于有效类型。</dd> +</dl> + +<dl> + <dt><strong style="font-weight: bold;">{{jsxref("URIError")}}</strong></dt> + <dd>创建一个error实例，表示错误的原因：给 {{jsxref("Global_Objects/encodeURI", "encodeURI()")}}<span style="line-height: inherit;">或 </span> {{jsxref("Global_Objects/decodeURI", "decodeURl()")}}<span style="line-height: inherit;">传递的参数无效。</span></dd> +</dl> + +<h2 id="Properties" name="Properties">属性</h2> + +<dl> + <dt>{{jsxref("Error.prototype")}}</dt> + <dd>允许添加属性到<code>Error</code>实例。</dd> +</dl> + +<h2 id="Methods" name="Methods">方法</h2> + +<p>全局<code>Error</code>对象自身不包含任何方法,但从原型链中继承了一些方法.</p> + +<h2 id="Error_instances" name="Error_instances"><code>Error</code> 实例</h2> + +<div> +<p>{{page('en-US/docs/JavaScript/Reference/Global_Objects/Error/prototype', 'Description')}}</p> + +<h3 id="属性">属性</h3> + +<p>{{page('en-US/docs/JavaScript/Reference/Global_Objects/Error/prototype', 'Properties')}}</p> + +<h3 id="方法">方法</h3> + +<p>{{page('en-US/docs/JavaScript/Reference/Global_Objects/Error/prototype', 'Methods')}}</p> +</div> + +<h2 id="Examples" name="Examples">例子</h2> + +<h3 id="Example_Throwing_a_generic_error" name="Example:_Throwing_a_generic_error">抛出一个基本错误</h3> + +<p>通常你会使用{{jsxref("Statements/throw", "throw")}}关键字来抛出你创建的Error对象。可以使用 {{jsxref("Statements/try...catch", "try...catch")}} 结构来处理异常:</p> + +<pre class="brush: js">try { + throw new Error("Whoops!"); +} catch (e) { + alert(e.name + ": " + e.message); +} +</pre> + +<h3 id="Example_Handling_a_specific_error" name="Example:_Handling_a_specific_error">处理一个特定错误</h3> + +<p>你可以通过判断异常的类型来特定处理某一类的异常,即判断 {{jsxref("Object.prototype.constructor", "constructor")}} 属性，当使用现代Javascript引擎时,可使用{{jsxref("Operators/instanceof", "instanceof")}} 关键字：</p> + +<pre class="brush: js">try { + foo.bar(); +} catch (e) { + if (e instanceof EvalError) { + alert(e.name + ": " + e.message); + } else if (e instanceof RangeError) { + alert(e.name + ": " + e.message); + } + // ... etc +} +</pre> + +<h3 id="自定义异常类型">自定义异常类型</h3> + +<p>你可能希望自定义基于Error的异常类型，使得你能够 throw new MyError() 并可以使用 <code>instanceof MyError</code> 来检查某个异常的类型. 这种需求的通用解决方法如下.</p> + +<div class="warning" style="font-size: 14px;"> +<p>注意，在FireFox中抛出自定义类型的异常会显示不正确的行号和文件名。</p> +</div> + +<p>参考 <a href="http://stackoverflow.com/questions/1382107/whats-a-good-way-to-extend-error-in-javascript">"What's a good way to extend Error in JavaScript?" discussion on Stackoverflow</a>.</p> + +<pre class="brush: js">// Create a new object, that prototypally inherits from the Error constructor. +function MyError(message) { + this.name = 'MyError'; + this.message = message || 'Default Message'; + this.stack = (new Error()).stack; +} +MyError.prototype = Object.create(Error.prototype); +MyError.prototype.constructor = MyError; + +try { + throw new MyError(); +} catch (e) { + console.log(e.name); // 'MyError' + console.log(e.message); // 'Default Message' +} + +try { + throw new MyError('custom message'); +} catch (e) { + console.log(e.name); // 'MyError' + console.log(e.message); // 'custom message' +}</pre> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 0px; background: 0px 0px;"></div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 19px; background: 0px 0px;"></div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 38px; background: 0px 0px;"></div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 57px; background: 0px 0px;"></div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 76px; background: 0px 0px;"></div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 95px; background: 0px 0px;"></div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 114px; background: 0px 0px;"></div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 133px; background: 0px 0px;"></div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 152px; background: 0px 0px;"></div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 171px; background: 0px 0px;"></div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 190px; background: 0px 0px;"></div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 209px; background: 0px 0px;"></div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 228px; background: 0px 0px;"></div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 247px; background: 0px 0px;"></div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 266px; background: 0px 0px;"></div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 285px; background: 0px 0px;"></div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 304px; background: 0px 0px;"></div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 323px; background: 0px 0px;"></div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 342px; background: 0px 0px;"></div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 361px; background: 0px 0px;"></div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 380px; background: 0px 0px;"></div> + +<h2 id="规范" style="margin-bottom: 20px; line-height: 30px; font-size: 2.14285714285714rem;">规范</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>ECMAScript 1st Edition.</td> + <td>Standard</td> + <td>Initial definition. Implemented in JavaScript 1.1.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.11', 'Error')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-error-objects', 'Error')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-error-objects', 'Error')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性" style="margin-bottom: 20px; line-height: 30px; font-size: 2.14285714285714rem;">浏览器兼容性</h2> + +<div>{{Compat("javascript.builtins.Error")}}</div> + +<h2 id="See_also" name="See_also" style="margin-bottom: 20px; line-height: 30px; font-size: 2.14285714285714rem;">相关链接</h2> + +<ul> + <li>{{jsxref("Error.prototype")}}</li> + <li>{{jsxref("Statements/throw", "throw")}}</li> + <li>{{jsxref("Statements/try...catch", "try...catch")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/error/linenumber/index.html b/files/zh-cn/web/javascript/reference/global_objects/error/linenumber/index.html new file mode 100644 index 0000000000..a7b1ecd375 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/error/linenumber/index.html @@ -0,0 +1,54 @@ +--- +title: Error.prototype.lineNumber +slug: Web/JavaScript/Reference/Global_Objects/Error/lineNumber +tags: + - JavaScript + - 属性 + - 错误 +translation_of: Web/JavaScript/Reference/Global_Objects/Error/lineNumber +--- +<div>{{JSRef}} {{non-standard_header}}</div> + +<p><code><strong>lineNumber</strong></code> 属性的值为抛出错误的代码在其源文件中所在的行号。</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用_lineNumber">使用 <code>lineNumber</code></h3> + +<pre class="brush: js">var e = new Error('Could not parse input'); +throw e; +console.log(e.lineNumber) // 2 +</pre> + +<h3 id="监听_error_事件的示例">监听 <code>error</code> 事件的示例</h3> + +<pre class="brush: js">window.addEventListener('error', function(e) { + console.log(e.lineNumber); // 5 +}); +var e = new Error('Could not parse input'); +throw e; +</pre> + +<p>这不是一个标准化的属性，缺乏广泛的支持。参见下面的浏览器兼容性表格。</p> + +<h2 id="规范">规范</h2> + +<p>非标准化属性。不属于任何规范。</p> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> +<div> + + +<p>{{Compat("javascript.builtins.Error.lineNumber")}}</p> +</div> +</div> + +<h2 id="相关内容">相关内容</h2> + +<ul> + <li>{{jsxref("Error.prototype.stack")}} {{non-standard_inline}}</li> + <li>{{jsxref("Error.prototype.columnNumber")}} {{non-standard_inline}}</li> + <li>{{jsxref("Error.prototype.fileName")}} {{non-standard_inline}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/error/message/index.html b/files/zh-cn/web/javascript/reference/global_objects/error/message/index.html new file mode 100644 index 0000000000..92ba4e16c1 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/error/message/index.html @@ -0,0 +1,110 @@ +--- +title: Error.prototype.message +slug: Web/JavaScript/Reference/Global_Objects/Error/message +translation_of: Web/JavaScript/Reference/Global_Objects/Error/message +--- +<div>{{JSRef("Global_Objects", "Error", "EvalError,InternalError,RangeError,ReferenceError,SyntaxError,TypeError,URIError")}}</div> + +<h2 id="Summary" name="Summary">概述</h2> + +<p><code><strong>message</strong></code> 属性是有关错误信息，人类易读的（human-readable）描述。</p> + +<h2 id="Description" name="Description">描述</h2> + +<p>如果该属性已经被设置，则该属性包含了错误的一个简短描述。<a href="/en-US/docs/Mozilla/Projects/SpiderMonkey">SpiderMonkey</a> 大量应用 <code>message</code> 属性在异常方面。 <code>message</code> 属性结合 {{jsxref("Error.prototype.name", "name")}} 属性一起被 {{jsxref("Error.prototype.toString()")}} 方法用来创建错误的字符串形式。</p> + +<p>默认情况下，<code>message</code> 属性是一个空字符串，但是可以通过指定一段信息作为 {{jsxref("Error", "Error constructor")}} 的第一个参数创建一个实例来改变该属性值。</p> + +<h2 id="Examples" name="Examples">示例</h2> + +<h3 id="Example:_Throwing_a_custom_error" name="Example:_Throwing_a_custom_error">例子：抛出一个自定义错误</h3> + +<pre class="brush: js">var e = new Error("Could not parse input"); // e.message is "Could not parse input" +throw e; +</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>ECMAScript 1st Edition.</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.11.4.3', 'Error.prototype.message')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-error.prototype.message', 'Error.prototype.message')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{ CompatibilityTable() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("Error.prototype.name")}}</li> + <li>{{jsxref("Error.prototype.toString()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/error/name/index.html b/files/zh-cn/web/javascript/reference/global_objects/error/name/index.html new file mode 100644 index 0000000000..85eba29c8a --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/error/name/index.html @@ -0,0 +1,110 @@ +--- +title: Error.prototype.name +slug: Web/JavaScript/Reference/Global_Objects/Error/name +translation_of: Web/JavaScript/Reference/Global_Objects/Error/name +--- +<p>{{JSRef("Global_Objects", "Error", "EvalError,InternalError,RangeError,ReferenceError,SyntaxError,TypeError,URIError")}}</p> + +<h2 id="Summary" name="Summary">概述</h2> + +<p><code style="font-style: normal; line-height: 19.0909080505371px;"><strong>name</strong></code><span style="line-height: 19.0909080505371px;"> </span>属性表示error类型的名称.初始值为"Error".</p> + +<h2 id="Description" name="Description">描述</h2> + +<p>默认情况下,<span style="line-height: 19.0909080505371px;">{{jsxref("Error")}}</span>对象的<code>name</code>属性值为"Error".<code>name属性和</code><span style="line-height: 19.0909080505371px;">{{jsxref("Error.prototype.message", "message")}}</span>属性一起,通过调用<span style="line-height: 19.0909080505371px;">{{jsxref("Error.prototype.toString()")}}</span>方法,会作为最后异常信息的字符串表示.</p> + +<h2 id="Examples" name="Examples">示例</h2> + +<h3 id="Example:_Throwing_a_custom_error" name="Example:_Throwing_a_custom_error">例子: 抛出一个自定义错误</h3> + +<pre class="brush:js">var e = new Error("Malformed input"); // e.name默认是"Error" + +e.name = "ParseError"; // 修改之后,e.toString()会成为下面这样的字符串 +throw e; // "ParseError: Malformed input" +</pre> + +<h2 id="规范" style="margin-bottom: 20px; line-height: 30px; font-size: 2.14285714285714rem;">规范</h2> + +<table class="standard-table" style="line-height: 19.0909080505371px;"> + <tbody> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + <tr> + <td>ECMAScript 1st Edition.</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.11.4.2', 'Error.prototype.name')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-error.prototype.name', 'Error.prototype.name')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性" style="margin-bottom: 20px; line-height: 30px; font-size: 2.14285714285714rem;">浏览器兼容性</h2> + +<div style="line-height: 19.0909080505371px;">{{CompatibilityTable}}</div> + +<div id="compat-desktop" style="line-height: 19.0909080505371px;"> +<table class="compat-table" style="border-color: transparent;"> + <tbody> + <tr> + <th style="line-height: 16px;">Feature</th> + <th style="line-height: 16px;">Chrome</th> + <th style="line-height: 16px;">Firefox (Gecko)</th> + <th style="line-height: 16px;">Internet Explorer</th> + <th style="line-height: 16px;">Opera</th> + <th style="line-height: 16px;">Safari</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile" style="line-height: 19.0909080505371px;"> +<table class="compat-table" style="border-color: transparent;"> + <tbody> + <tr> + <th style="line-height: 16px;">Feature</th> + <th style="line-height: 16px;">Android</th> + <th style="line-height: 16px;">Chrome for Android</th> + <th style="line-height: 16px;">Firefox Mobile (Gecko)</th> + <th style="line-height: 16px;">IE Mobile</th> + <th style="line-height: 16px;">Opera Mobile</th> + <th style="line-height: 16px;">Safari Mobile</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="See_also" name="See_also" style="margin-bottom: 20px; line-height: 30px; font-size: 2.14285714285714rem;">相关链接</h2> + +<ul style="line-height: 19.0909080505371px;"> + <li>{{jsxref("Error.prototype.message")}}</li> + <li>{{jsxref("Error.prototype.toString()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/error/prototype/index.html b/files/zh-cn/web/javascript/reference/global_objects/error/prototype/index.html new file mode 100644 index 0000000000..aea7d132d2 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/error/prototype/index.html @@ -0,0 +1,161 @@ +--- +title: Error.prototype +slug: Web/JavaScript/Reference/Global_Objects/Error/prototype +tags: + - Error + - JavaScript + - Property + - 参考 + - 属性 +translation_of: Web/JavaScript/Reference/Global_Objects/Error +--- +<div> +<p>{{JSRef}}</p> + +<p><code><strong>Error.prototype</strong></code> 属性代表 {{jsxref("Error")}} 的构造器。</p> + +<p>{{js_property_attributes(0, 0, 0)}}</p> +</div> + +<h2 id="Description" name="Description">描述</h2> + +<p>所有 {{jsxref("Global_Objects/Error", "Error")}} 与 {{jsxref("Global_Objects/Error", "非标准Error", "#Error_types", 1)}} 的实例都继承自 <code>Error.prototype。同所有构造器函数一样，你可以在构造器的 </code>prototype 上添加属性或者方法，使其在所有该构造器的实例上生效。</p> + +<h2 id="Properties" name="Properties">属性</h2> + +<h3 id="Standard_properties" name="Standard_properties">标准属性</h3> + +<dl> + <dt><code>Error.prototype.constructor</code></dt> + <dd>实例原型的构造函数。</dd> + <dt>{{jsxref("Error.prototype.message")}}</dt> + <dd>错误信息。</dd> + <dt>{{jsxref("Error.prototype.name")}}</dt> + <dd>错误名。</dd> +</dl> + +<h3 id="Vendor-specific_extensions" name="Vendor-specific_extensions">厂商特定扩展属性</h3> + +<div>{{non-standard_header}}</div> + +<h4 id="Microsoft" name="Microsoft">Microsoft</h4> + +<dl> + <dt>{{jsxref("Error.prototype.description")}}</dt> + <dd>错误描述，与 {{jsxref("Error.prototype.message", "message")}} 相似。</dd> + <dt>{{jsxref("Error.prototype.number")}}</dt> + <dd>错误码。</dd> +</dl> + +<h4 id="Mozilla" name="Mozilla">Mozilla</h4> + +<dl> + <dt>{{jsxref("Error.prototype.fileName")}}</dt> + <dd>产生该错误的文件名。</dd> + <dt>{{jsxref("Error.prototype.lineNumber")}}</dt> + <dd>产生该错误的行号。</dd> + <dt>{{jsxref("Error.prototype.columnNumber")}}</dt> + <dd>产生该错误的列号。</dd> + <dt>{{jsxref("Error.prototype.stack")}}</dt> + <dd>错误堆栈。</dd> +</dl> + +<h2 id="Methods" name="Methods">方法</h2> + +<dl> + <dt>{{jsxref("Error.prototype.toSource()")}} {{non-standard_inline}}</dt> + <dd>返回一个包含特定 {{jsxref("Error")}} 对象的源代码字符串，你可以用该值新建一个新的对象，重写自 {{jsxref("Object.prototype.toSource()")}} 方法。</dd> + <dt>{{jsxref("Error.prototype.toString()")}}</dt> + <dd>返回一个表示该对象的字符串，重写自 {{jsxref("Object.prototype.toString()")}} 方法。</dd> +</dl> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范版本</th> + <th scope="col">状态</th> + <th scope="col">注解</th> + </tr> + <tr> + <td>{{SpecName('ES1')}}</td> + <td>{{Spec2('ES1')}}</td> + <td>Initial definition. Implemented in JavaScript 1.1.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.11.3.1', 'Error')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-error.prototype', 'Error')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-error.prototype', 'Error')}}</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>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</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>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="See_also" name="See_also">参见</h2> + +<ul> + <li>{{jsxref("Error")}}</li> + <li>{{jsxref("Object.prototype")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/error/stack/index.html b/files/zh-cn/web/javascript/reference/global_objects/error/stack/index.html new file mode 100644 index 0000000000..b828e71662 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/error/stack/index.html @@ -0,0 +1,126 @@ +--- +title: Error.prototype.stack +slug: Web/JavaScript/Reference/Global_Objects/Error/Stack +tags: + - JavaScript + - 原型 + - 参考 + - 属性 + - 错误 +translation_of: Web/JavaScript/Reference/Global_Objects/Error/Stack +--- +<div>{{JSRef}} {{non-standard_header}}</div> + +<p>{{jsxref("Error")}}对象作为一个非标准的栈属性提供了一种函数追踪方式。无论这个函数被被调用，处于什么模式，来自于哪一行或者哪个文件，有着什么样的参数。这个栈产生于最近一次调用最早的那次调用，返回原始的全局作用域调用</p> + +<h2 id="描述">描述</h2> + +<p>每个步骤都会被分为单独的一行以这个函数的名字作为开始（如果不是一个来自于全局作用域的调用）,然后通过一个@符号标记一个文件的位置（尤其是当一个函数构造错误并且作为错误被抛出，并且如果能定位到这个文件的位置，那么会使用冒号显示行号。（提示）{{jsxref("Error")}}对象在错误跑出时同样能处理并渲染出文件名，行号和列号属性（但是仅仅限于错误。而不是追踪他的路径）</p> + +<p>注意这是Firefox定义的格式，并没有标准的定义。但是Safari 6+ 和 Opera 12-定义了一种非常相似的格式。其他使用JavaScript V8引擎的浏览器（例如Chrome, Opera 15+,安卓浏览器）和IE 10+，定义了一种不同的格式（可参见 <a class="external" href="http://msdn.microsoft.com/en-us/library/windows/apps/hh699850.aspx">error.stack</a> 文档）</p> + +<p>堆栈中的参数值： Firefox 14版本之前是 ({{bug("744842")}})函数名会随着参数值会在添加@符号之前被立即转换成用圆括号包裹的string类型。然而对象或者数组等其他类型似乎会被转换成<code>"[object Object]"</code>并且这种格式不能回退到之前实际上的对象，而纯值会被渲染（或许这种在Firefox14中仍有这种可能，使用<code>arguments.callee.caller.arguments</code>更加简单。因为函数名可以使用<code>arguments.callee.caller.name</code>渲染）。<code>"undefined"</code>被显示为<code>"(void 0)"</code>不过要注意的是如果是字符串类型的参数会直接以类似<code>"@"</code>, <code>"("</code>, <code>")"</code>格式通过编译（或者是包含在文件名中）。你不能简单的依赖这些将它分成多个组件，但是，对于Firefox14及以后的版本来说，这些都不是问题</p> + +<p>不同的浏览器会在不同时期设置这个值。例如，Firefox在创建{{jsxref("Error")}}对象时设置它，然而PhantomJS是在当且仅当它抛出 {{jsxref("Error")}}时， 并且<a href="http://msdn.microsoft.com/en-us/library/windows/apps/hh699850.aspx">MSDN docs</a> 似乎也实现了PhantomJS的方式。</p> + +<h2 id="示例">示例</h2> + +<p>下面这段html代码展示了<code>stack</code> 属性的使用方法</p> + +<pre class="brush: html"><!DOCTYPE HTML> +<meta charset="UTF-8"> +<title>Stack Trace Example</title> +<body> +<script> +function trace() { + try { + throw new Error('myError'); + } + catch(e) { + alert(e.stack); + } +} +function b() { + trace(); +} +function a() { + b(3, 4, '\n\n', undefined, {}); +} +a('first call, firstarg'); +</script> + +</pre> + +<p>假设上面这段代码被保存在Windows系统下的 <code>C:\example.html</code>在处理过程中抛出如下所示的错误信息</p> + +<p>Firefox 30及以上版本的浏览器会包含以列号为开始 ({{bug("762556")}}):</p> + +<pre><samp>trace@file:///C:/example.html:9:17 +b@file:///C:/example.html:16:13 +a@file:///C:/example.html:19:13 +@file:///C:/example.html:21:9</samp></pre> + +<p>Firefox 14 to Firefox 29:</p> + +<pre><samp>trace@file:///C:/example.html:9 +b@file:///C:/example.html:16 +a@file:///C:/example.html:19 +@file:///C:/example.html:21</samp></pre> + +<p>Firefox 13及更早版本的浏览器会抛出如下信息：</p> + +<pre><samp>Error("myError")@:0 +trace()@file:///C:/example.html:9 +b(3,4,"\n\n",(void 0),[object Object])@file:///C:/example.html:16 +a("first call, firstarg")@file:///C:/example.html:19 +@file:///C:/example.html:21</samp></pre> + +<h3 id="Stack_of_eval'ed_code">Stack of eval'ed code</h3> + +<p>Firefox30以{{geckoRelease("30")}}格式开头，<code>Function()</code> 和 <code>eval()</code> 调用产生的错误代码堆栈，现在在调用内部通过行号和列号以更加详细的格式向我们展示出来。函数调用显示为<code>"> Function"</code> 而 eval调用则是 <code>"> eval"</code>这样。下面来看这个{{bug("332176")}}.</p> + +<pre class="brush: js">try { + new Function('throw new Error()')(); +} catch (e) { + console.log(e.stack); +} + +// anonymous@file:///C:/example.html line 7 > Function:1:1 +// @file:///C:/example.html:7:6 + + +try { + eval("eval('FAIL')"); +} catch (x) { + console.log(x.stack); +} + +// @file:///C:/example.html line 7 > eval line 1 > eval:1:1 +// @file:///C:/example.html line 7 > eval:1:1 +// @file:///C:/example.html:7:6 +</pre> + +<p>你也可以使用<code>//# sourceURL</code> 命名eval源的指令。 也可以查看在 <a href="/en-US/docs/Tools/Debugger">Debugger</a>文档中的<a href="/en-US/docs/Tools/Debugger/How_to/Debug_eval_sources" style="">Debug eval 源</a>和<a href="http://fitzgeraldnick.com/weblog/59/">blog post博客 。</a></p> + +<h2 id="规范">规范</h2> + +<p>不属于任何规范，没有标准规范。</p> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> +<div> +<div class="hidden">此页面上的兼容性表由数据结构化生成。 如果您想为此做出贡献，请查看<a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> 并向我们发起拉取请求。</div> + +<p>{{Compat("javascript.builtins.Error.stack")}}</p> +</div> +</div> + +<h2 id="另请参阅">另请参阅</h2> + +<ul> + <li><a href="/en-US/docs/Components.stack">Components.stack</a></li> + <li>外部项目: <a class="link-https" href="https://github.com/csnover/TraceKit/">TraceKit</a> and <a class="link-https" href="https://github.com/eriwen/javascript-stacktrace">javascript-stacktrace</a></li> + <li>MSDN: <a class="external" href="http://msdn.microsoft.com/en-us/library/windows/apps/hh699850.aspx" title="http://msdn.microsoft.com/en-us/library/windows/apps/hh699850.aspx">error.stack</a> docs</li> + <li><a href="https://github.com/v8/v8/wiki/Stack%20Trace%20API">Overview of the V8 JavaScript stack trace API</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/error/tosource/index.html b/files/zh-cn/web/javascript/reference/global_objects/error/tosource/index.html new file mode 100644 index 0000000000..89273b1f32 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/error/tosource/index.html @@ -0,0 +1,53 @@ +--- +title: Error.prototype.toSource() +slug: Web/JavaScript/Reference/Global_Objects/Error/toSource +translation_of: Web/JavaScript/Reference/Global_Objects/Error/toSource +--- +<div>{{JSRef}} {{non-standard_header}}</div> + +<p><code><strong>toSource()</strong></code> 方法返回可以计算出到相同错误的代码。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>e</var>.toSource()</pre> + +<h3 id="返回值">返回值</h3> + +<p>一个包含错误源代码的字符串</p> + +<h2 id="描述">描述</h2> + +<p>调用一个{{jsxref("Error")}}实例的<code>toSource</code>方法（包括 <em><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Error#Error_types">NativeErrors</a></em>）将返回包含错误源代码的字符串。 这个字符串可以被评估创建一个(大约)相等的对象。当然,包含源字符串遵循的结构{{ jsxref("Error")}} 构造函数。例如:</p> + +<pre class="brush: js">(new<em>name</em>(<em>message</em> ,<em>fileName</em>,<em>lineNumber</em>)) +</pre> + +<p>这些属性对应于错误实例的相应属性。</p> + +<div class="note"> +<p><strong>提示:</strong> 需要注意到，在创建该字符串时，<code>toSource</code>方法所使用的属性是可变的，并且可能无法准确地反映用于创建错误实例的函数或实际发生错误的文件名或行号。</p> +</div> + +<h2 id="规范">规范</h2> + +<p>不属于任何规范. 应用于 in JavaScript 1.3.</p> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> +<div> +<div class="hidden">这个页面上的兼容性表是由结构化数据生成的。如果您想对数据作出贡献，请查看https://github.com/mdn/browser-compat-data并发送一个pull请求。</div> + +<p>{{Compat("javascript.builtins.Error.toSource")}}</p> +</div> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Error.prototype.fileName")}}</li> + <li>{{jsxref("Error.prototype.lineNumber")}}</li> + <li>{{jsxref("Error.prototype.message")}}</li> + <li>{{jsxref("Error.prototype.name")}}</li> + <li>{{jsxref("Object.prototype.toSource()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/error/tostring/index.html b/files/zh-cn/web/javascript/reference/global_objects/error/tostring/index.html new file mode 100644 index 0000000000..a32f0919d3 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/error/tostring/index.html @@ -0,0 +1,129 @@ +--- +title: Error.prototype.toString() +slug: Web/JavaScript/Reference/Global_Objects/Error/toString +translation_of: Web/JavaScript/Reference/Global_Objects/Error/toString +--- +<div> + {{JSRef("Global_Objects", "Error", "EvalError,InternalError,RangeError,ReferenceError,SyntaxError,TypeError,URIError")}}</div> +<h2 id="Summary" name="Summary">概述</h2> +<p><code><strong>toString()</strong></code> 方法返回一个指定的错误对象（Error object）的字符串表示。</p> +<h2 id="Syntax" name="Syntax">语法</h2> +<pre class="syntaxbox"><code><em>e</em>.toString();</code></pre> +<h2 id="Description" name="Description">描述</h2> +<p>{{jsxref("Error")}} 对象覆盖了 {{jsxref("Object.prototype.toString()")}} 方法。该方法实现如下：（假定 <code>Object</code> 和 <code>String</code> 没有被更改）：</p> +<pre class="brush:js">Error.prototype.toString = function() +{ + "use strict"; + + var obj = Object(this); + if (obj !== this) + throw new TypeError(); + + var name = this.name; + name = (name === undefined) ? "Error" : String(name); + + var msg = this.message; + msg = (msg === undefined) ? "" : String(msg); + + if (name === "") + return msg; + if (msg === "") + return name; + + return name + ": " + msg; +}; +</pre> +<h2 id="Example" name="Example">示例</h2> +<pre class="brush:js">var e = new Error("fatal error"); +print(e.toString()); // "Error: fatal error" + +e.name = undefined; +print(e.toString()); // "Error: fatal error" + +e.name = ""; +print(e.toString()); // "fatal error" + +e.message = undefined; +print(e.toString()); // "Error" + +e.name = "hello"; +print(e.toString()); // "hello" +</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>ECMAScript 1st Edition.</td> + <td>Standard</td> + <td>Initial definition.<br> + Implemented in JavaScript 1.1</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.11.4.4', 'Error.prototype.toString')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-error.prototype.tostring', 'Error.prototype.toString')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> +<h2 id="浏览器兼容性">浏览器兼容性</h2> +<p>{{ CompatibilityTable() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> + </table> +</div> +<h2 id="See_also" name="See_also">相关链接</h2> +<ul> + <li>{{jsxref("Error.prototype.toSource()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/escape/index.html b/files/zh-cn/web/javascript/reference/global_objects/escape/index.html new file mode 100644 index 0000000000..295bf14331 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/escape/index.html @@ -0,0 +1,126 @@ +--- +title: escape() +slug: Web/JavaScript/Reference/Global_Objects/escape +translation_of: Web/JavaScript/Reference/Global_Objects/escape +--- +<div> +<div> +<div>{{jsSidebar("Objects")}} {{deprecated_header}}</div> +</div> +</div> + +<h2 id="Summary" name="Summary">概览</h2> + +<p>废弃的 <code><strong>escape()</strong></code> 方法生成新的由十六进制转义序列替换的字符串. 使用 {{jsxref("Global_Objects/encodeURI", "encodeURI")}} 或 {{jsxref("Global_Objects/encodeURIComponent", "encodeURIComponent")}} 代替.</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code>escape(str)</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>str</code></dt> + <dd>待编码的字符串.</dd> +</dl> + +<h2 id="Description" name="Description">描述</h2> + +<p><code>escape</code> 函数是全局对象的属性. 特色字符如: @*_+-./ 被排除在外.</p> + +<p>字符的16进制格式值,当该值小于等于0xFF时,用一个2位转移序列: %xx 表示. 大于的话则使用4位序列:%<strong>u</strong>xxxx 表示.</p> + +<h2 id="示例">示例</h2> + +<pre class="brush: js">escape("abc123"); // "abc123" +escape("äöü"); // "%E4%F6%FC" +escape("ć"); // "%u0107" + +// special characters +escape("@*_+-./"); // "@*_+-./"</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>ECMAScript 1st Edition.</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-B.2.1', 'escape')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td>Defined in the (informative) Compatibility Annex B</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-escape-string', 'escape')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Defined in the (normative) Annex B for Additional ECMAScript Features for Web Browsers</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{ CompatibilityTable() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="See_Also" name="See_Also">其他链接</h2> + +<ul> + <li>{{jsxref("Global_Objects/encodeURI", "encodeURI")}}</li> + <li>{{jsxref("Global_Objects/encodeURIComponent", "encodeURIComponent")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/eval/index.html b/files/zh-cn/web/javascript/reference/global_objects/eval/index.html new file mode 100644 index 0000000000..4189e29d72 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/eval/index.html @@ -0,0 +1,319 @@ +--- +title: eval() +slug: Web/JavaScript/Reference/Global_Objects/eval +tags: + - JavaScript + - eval + - 参考 +translation_of: Web/JavaScript/Reference/Global_Objects/eval +--- +<div>{{jsSidebar("Objects")}}</div> + +<p><code><strong>eval()</strong></code><strong> </strong>函数会将传入的字符串当做 JavaScript 代码进行执行。</p> + +<div>{{EmbedInteractiveExample("pages/js/globalprops-eval.html")}}</div> + +<p class="hidden">此交互式示例的源存储在GitHub存储库中。 如果您想参与交互式示例项目，请克隆https://github.com/mdn/interactive-examples并向我们发送拉取请求。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code>eval(<em>string</em>)</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>string</code></dt> + <dd>一个表示 JavaScript 表达式、语句或一系列语句的字符串。表达式可以包含变量与已存在对象的属性。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>返回字符串中代码的返回值。如果返回值为空，则返回 {{jsxref("undefined")}}。</p> + +<h2 id="描述">描述</h2> + +<p><code>eval()</code> 是全局对象的一个函数属性。</p> + +<p><code>eval()</code> 的参数是一个字符串。如果字符串表示的是表达式，<code>eval()</code> 会对表达式进行求值。如果参数表示一个或多个 JavaScript 语句，那么<code>eval()</code> 就会执行这些语句。不需要用 <code>eval()</code> 来执行一个算术表达式：因为 JavaScript 可以自动为算术表达式求值。</p> + +<p>如果你以字符串的形式构造了算术表达式，那么可以在后面用 <code>eval()</code>对它求值。例如，假设你有一个变量 <code>x</code>，您可以通过将表达式的字符串值（例如 <code>3 * x + 2</code>）赋值给一个变量，然后在你的代码后面的其他地方调用 <code>eval()</code>，来推迟涉及 <code>x</code> 的表达式的求值。</p> + +<p>如果 <code>eval()</code> 的参数不是字符串， <code>eval()</code> 会将参数原封不动地返回。在下面的例子中，<code>String</code> 构造器被指定，而 <code>eval()</code> 返回了 <code>String</code> 对象而不是执行字符串。</p> + +<pre class="brush: js">eval(new String("2 + 2")); // 返回了包含"2 + 2"的字符串对象 +eval("2 + 2"); // returns 4 +</pre> + +<p>你可以使用一些通用的方法来绕过这个限制，例如使用 <code>toString()</code>。</p> + +<pre class="brush: js">var expression = new String("2 + 2"); +eval(expression.toString()); +</pre> + +<p>如果你间接的使用 <code>eval()</code>，比如通过一个引用来调用它，而不是直接的调用 <code>eval</code>。 从 <a href="http://www.ecma-international.org/ecma-262/5.1/#sec-10.4.2">ECMAScript 5</a> 起，它工作在全局作用域下，而不是局部作用域中。这就意味着，例如，下面的代码的作用声明创建一个全局函数，并且 <code>eval</code> 中的这些代码在执行期间不能在被调用的作用域中访问局部变量。</p> + +<pre class="brush: js">function test() { + var x = 2, y = 4; + console.log(eval('x + y')); // 直接调用，使用本地作用域，结果是 6 + var geval = eval; // 等价于在全局作用域调用 + console.log(geval('x + y')); // 间接调用，使用全局作用域，throws ReferenceError 因为`x`未定义 +<code> (0, eval)('x + y'); // 另一个间接调用的例子 +</code>}</pre> + +<h2 id="Don.27t_use_eval.21" name="Don.27t_use_eval.21">永远不要使用 <code>eval</code>！</h2> + +<p><code>eval()</code> 是一个危险的函数， 它使用与调用者相同的权限执行代码。如果你用 <code>eval()</code> 运行的字符串代码被恶意方（不怀好意的人）修改，您最终可能会在您的网页/扩展程序的权限下，在用户计算机上运行恶意代码。更重要的是，第三方代码可以看到某一个 <code>eval()</code> 被调用时的作用域，这也有可能导致一些不同方式的攻击。相似的 {{jsxref("Global_Objects/Function", "Function")}} 就不容易被攻击。</p> + +<p><code>eval()</code> 通常比其他替代方法更慢，因为它必须调用 JS 解释器，而许多其他结构则可被现代 JS 引擎进行优化。</p> + +<p>此外，现代JavaScript解释器将javascript转换为机器代码。 这意味着任何变量命名的概念都会被删除。 因此，任意一个eval的使用都会强制浏览器进行冗长的变量名称查找，以确定变量在机器代码中的位置并设置其值。 另外，新内容将会通过 <code>eval()</code> 引进给变量， 比如更改该变量的类型，因此会强制浏览器重新执行所有已经生成的机器代码以进行补偿。 但是，（谢天谢地）存在一个非常好的eval替代方法：只需使用 <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function">window.Function</a>。 这有个例子方便你了解如何将<code>eval()</code>的使用转变为<code>Function()</code>。</p> + +<p>使用eval的糟糕代码:</p> + +<pre class="brush:js example-bad">function looseJsonParse(obj){ + return eval("(" + obj + ")"); +} +console.log(looseJsonParse( + "{a:(4-1), b:function(){}, c:new Date()}" +)) +</pre> + +<p> 不用eval的更好的代码:</p> + +<pre class="brush:js example-good">function looseJsonParse(obj){ + return Function('"use strict";return (' + obj + ')')(); +} +console.log(looseJsonParse( + "{a:(4-1), b:function(){}, c:new Date()}" +)) + +</pre> + +<p>比较上面的两个代码片段，两个代码片段似乎是以相同的方式工作，但再想一想：eval的这个代码的速度要慢得多。 注意<code>c: new Date()</code>在执行体中。 在没有eval的函数中，对象在全局范围内被用来进行计算，因此浏览器可以放心的假设<code>Date</code>是来自<code>window.Date</code>的而不是一个名为<code>Date</code>的局部变量。 然而，在使用<code>eval()</code>的代码中，浏览器不能假设这一点，因为如果您的代码是下面这个：</p> + +<pre class="brush:js example-bad">function Date(n){ + return ["Monday","Tuesday","Wednesday","Thursday","Friday","Saturday","Sunday"][n%7 || 0]; +} +function looseJsonParse(obj){ + return eval("(" + obj + ")"); +} +console.log(looseJsonParse( + "{a:(4-1), b:function(){}, c:new Date()}" +)) +</pre> + +<p>因此，在<code>eval()</code>版本的代码中，浏览器被迫进行高代价的查找调用以检查是否存在名为Date()的任何局部变量。 与<code>Function()</code>相比，这是非常低效的。</p> + +<p>在类似的情况下，如果您确实希望能够从<code>Function()</code>内部的代码调用<code>Date</code>函数，该怎么办？ 你应该躲避并退回到<code>eval()</code>吗？ 绝对不是，永远不要这么做。 而是尝试下面的方法。</p> + +<pre class="brush:js example-good">function Date(n){ + return ["Monday","Tuesday","Wednesday","Thursday","Friday","Saturday","Sunday"][n%7 || 0]; +} +function runCodeWithDateFunction(obj){ + return Function('"use strict";return (' + obj + ')')()( + Date + ); +} +console.log(runCodeWithDateFunction( + "function(Date){ return Date(5) }" +)) +</pre> + +<p>由于三重嵌套函数，上面的代码似乎效率低下，但让我们分析一下上述有效方法的好处：</p> + +<p>1.它使得传递给<code>runCodeWithDateFunction</code>的字符串中的代码更少。</p> + +<p>2.函数调用开销很小，使得代码尺寸小得多，值得获益</p> + +<p>3. <code>Function()</code>更容易让你的代码利用特性修饰<code>"use strict"</code>;</p> + +<p>4.代码不使用eval（），使其比其他方式快几个数量级。</p> + +<p>最后，我们来看看简化版。 使用如上所示的<code>Function()</code>，您可以更有效地缩小传递给<code>runCodeWithDateFunction</code>的代码字符串，因为函数参数名称也可以缩小，如下面的缩小代码所示。</p> + +<pre class="brush:js">console.log(Function('"use strict";return(function(a){return a(5)})')()(function(a){ +return"Monday Tuesday Wednesday Thursday Friday Saturday Sunday".split(" ")[a%7||0]}));</pre> + +<p>对于常见用例，<code>eval()</code>或<code>Function()</code>还有更安全(而且更快!)的替代方案。</p> + +<h3 id="访问成员属性">访问成员属性</h3> + +<p>你不应该去使用 <code>eval()</code> 来将属性名字转化为属性。考虑下面的这个例子，被访问对象的属性在它被执行之前都会未知的。这里可以用 eval 处理：</p> + +<pre class="brush: js">var obj = { a: 20, b: 30 }; +var propName = getPropName(); // 返回 "a" 或 "b" + +eval( 'var result = obj.' + propsName )</pre> + +<p>但是，这里并不是必须得使用 <code>eval()</code> 。事实上，这里并不建议这样使用。可以使用 <a href="/zh-CN/docs/Web/JavaScript/Reference/Operators/Property_Accessors">属性访问器</a> 进行代替，它更快、更安全：</p> + +<pre class="brush: js">var obj = { a: 20, b: 30 } +var propName = getPropName(); // 返回 "a" 或 "b" +var result = obj[ propName ]; // obj[ "a" ] 与 obj.a 等价</pre> + +<p>你还可以使用这个方法去访问子代的属性。如下：</p> + +<pre class="brush: js">var obj = {a: {b: {c: 0}}}; +var propPath = getPropPath(); // 例如返回 "a.b.c" + +eval( 'var result = obj.' + propPath ) +</pre> + +<p>这里，可以通过分割属性路径、循环遍历不同的属性，来避免 <code>eval()</code>：</p> + +<pre class="brush:js">function getDescendantProp(obj, desc) { + var arr = desc.split('.'); + while (arr.length) { + obj = obj[arr.shift()]; + } + return obj; +} + +var obj = {a: {b: {c: 0}}}; +var propPath = getPropPath(); // 例如返回 "a.b.c" +var result = getDescendantProp(obj, propPath);</pre> + +<p>同样的方法也可实现设置子代的属性值：</p> + +<pre class="brush:js">function setDescendantProp(obj, desc, value) { + var arr = desc.split('.'); + while (arr.length > 1) { + obj = obj[arr.shift()]; + } + return obj[arr[0]] = value; +} + +var obj = {a: {b: {c: 0}}}; +var propPath = getPropPath(); // 例如，返回 "a.b.c" +var result = setDescendantProp(obj, propPath, 1); // a.b.c 值为 1</pre> + +<h3 id="使用函数而非代码段">使用函数而非代码段</h3> + +<p>JavaScript 拥有 <a href="/zh-CN/docs/Glossary/First-class_Function">first-class functions</a>，这意味着你可以将函数直接作为参数传递给其他接口，将他们保存在变量中或者对象的属性中，等等。很多DOM的API都用这种思路进行设计，你也可以（或者应该）这样子设计你的代码：</p> + +<pre class="brush: js">// 代替 setTimeout(" ... ", 1000) 写法: +setTimeout(function() { ... }, 1000); + +// 代替 elt.setAttribute("onclick", "...") 写法: +elt.addEventListener('click', function() { ... } , false);</pre> + +<p><a href="/zh-CN/docs/Web/JavaScript/Closures">闭包</a> 也有助于创建参数化函数而不用连接字符串。</p> + +<h3 id="解析_JSON（将字符串转化为_JavaScript_对象）">解析 JSON（将字符串转化为 JavaScript 对象）</h3> + +<p>如果你在调用 <code>eval()</code> 传入的字符串参数中包含数据（如：一个数组“[1,2,3]”）而不是代码，你应该考虑将其转换为 <a href="/zh-CN/docs/Glossary/JSON">JSON</a> 对象，这允许你用JavaScript语法的子集来表示数据。<a href="/zh-CN/docs/Downloading_JSON_and_JavaScript_in_extensions">在扩展中下载JSON和JavaScript</a></p> + +<p>提示：因为 JSON 语法子集相对于 JavaScript 语法子集比较有局限性，很多在 JavaScript 中可用的特性在 JSON 中就不起作用了。比如，后缀逗号在 JSON 中不支持，并且对象中的属性名在 JSON 中必须用引号括起来。请务必使用 JSON 序列化方法来生成稍后将被解析为 JSON 的字符串。</p> + +<h3 id="尽量传递数据而非代码">尽量传递数据而非代码</h3> + +<p>例如，设计为抓取网页内容的扩展，可能会在XPath中定义抓取规则，而不是在 JavaScript 代码中。</p> + +<h3 id="以有限权限运行代码">以有限权限运行代码</h3> + +<p>如果你必须执行这段代码, 应考虑以更低的权限运行。此建议主要适用于扩展和 XUL 应用程序，可以使用 <a href="/zh-CN/docs/Components.utils.evalInSandbox">Components.utils.evalInSandbox</a> 做到降低权限。</p> + +<h2 id="例子">例子</h2> + +<h3 id="使用_eval">使用 <code>eval</code></h3> + +<p>在下面的代码中，两种包含了 <code>eval()</code> 的声明都返回了 42。第一种是对字符串 "<code>x + y + 1</code>" 求值；第二种是对字符串 "<code>42</code>" 求值。</p> + +<pre class="brush:js">var x = 2; +var y = 39; +var z = "42"; +eval("x + y + 1"); // returns 42 +eval(z); // returns 42 +</pre> + +<h3 id="使用_eval_执行一串_JavaScript_语句">使用 <code>eval</code> 执行一串 JavaScript 语句</h3> + +<p>下面的例子使用 <code>eval()</code> 来执行 <code>str</code> 字符串。这个字符串包含了如果 <code>x</code> 等于5，就打开一个Alert 对话框并对 <code>z</code> 赋值 42，否则就对 <code>z</code> 赋值 0 的 JavaScript 语句。 当第二个声明被执行，<code>eval()</code> 将会令字符串被执行，并最终返回赋值给 <code>z</code> 的 42。</p> + +<pre class="brush:js">var x = 5; +var str = "if (x == 5) {console.log('z is 42'); z = 42;} else z = 0;"; + +console.log('z is ', eval(str));</pre> + +<p>如果您定义了多个值，则会返回最后一个值。</p> + +<pre class="brush:js">var x = 5; +var str = "if (x == 5) {console.log('z is 42'); z = 42; x = 420; } else z = 0;"; + +console.log('x is ', eval(str)); // z is 42 x is 420 +</pre> + +<h3 id="返回值_2">返回值</h3> + +<p><code>eval</code> 返回最后一个表达式的值。</p> + +<pre class="brush:js">var str = 'if ( a ) { 1 + 1; } else { 1 + 2; }'; +var a = true; +var b = eval(str); // returns 2 + +console.log('b is : ' + b); + +a = false; +b = eval(str); // returns 3 + +console.log('b is : ' + b);</pre> + +<h3 id="eval_中函数作为字符串被定义需要“（”和“）”作为前缀和后缀"><code>eval</code> 中函数作为字符串被定义需要“（”和“）”作为前缀和后缀</h3> + +<pre class="brush:js">var fctStr1 = 'function a() {}' +var fctStr2 = '(function a() {})' +var fct1 = eval(fctStr1) // 返回undefined +var fct2 = eval(fctStr2) // 返回一个函数 +</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('ES1')}}</td> + <td>{{Spec2('ES1')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.1.2.1', 'eval')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-eval-x', 'eval')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-eval-x', 'eval')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div class="hidden">此页面上的兼容性表是根据结构化数据生成的。 如果您想为数据做出贡献，请查看<a href="/zh-CN/docs/">https://github.com/mdn/browser-compat-data</a> 并向我们发送拉取请求。</div> + +<p>{{Compat("javascript.builtins.eval")}}</p> + +<h2 id="Firefox_相关">Firefox 相关</h2> + +<ul> + <li>从历史上看，<code>eval()</code> 有一个可选的第二个参数，指定上下文执行对象。 这个参数是非标准的，并且明确地从 Firefox 4 中删除。请参阅 {{bug(531675)}} 。</li> +</ul> + +<h2 id="参见">参见</h2> + +<ul> + <li>{{jsxref("Global_Objects/uneval", "uneval()")}}</li> + <li><a href="/zh-CN/docs/Web/JavaScript/Reference/Operators/Property_Accessors">Property accessors</a></li> + <li><a href="/zh-CN/Add-ons/WebExtensions/Content_scripts#Using_eval()_in_content_scripts">WebExtensions: Using eval in content scripts</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/evalerror/index.html b/files/zh-cn/web/javascript/reference/global_objects/evalerror/index.html new file mode 100644 index 0000000000..85eebfa1ce --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/evalerror/index.html @@ -0,0 +1,116 @@ +--- +title: EvalError +slug: Web/JavaScript/Reference/Global_Objects/EvalError +translation_of: Web/JavaScript/Reference/Global_Objects/EvalError +--- +<div>{{JSRef}}</div> + +<p>本对象代表了一个关于 <a href="/en/Core_JavaScript_1.5_Reference/Global_Functions/eval" title="en/Core_JavaScript_1.5_Reference/Global_Functions/eval">eval</a> 函数的错误.此异常不再会被JavaScript抛出，但是EvalError对象仍然保持兼容性.</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code>new EvalError([<var>message</var>[, <var>fileName</var>[, <var>lineNumber</var>]]])</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt>message</dt> + <dd>可选参数.人类可阅读的关于错误的描述.</dd> +</dl> + +<dl> + <dt>fileName(非标准)</dt> + <dd>可选参数.代码中导致异常的文件的文件名.</dd> +</dl> + +<dl> + <dt>lineNumber(非标准)</dt> + <dd>可选参数.代码中导致异常的代码的行号.</dd> +</dl> + +<h2 id="Properties" name="Properties">属性</h2> + +<dl> + <dt><a href="/en/Core_JavaScript_1.5_Reference/Global_Objects/EvalError/prototype" title="en/Core_JavaScript_1.5_Reference/Global_Objects/EvalError/prototype">prototype</a></dt> + <dd>允许向EvalError对象中添加自定义属性.</dd> +</dl> + +<h2 id="Methods" name="Methods">方法</h2> + +<p>全局的EvalError对象本身不包含任何方法, 然而它通过原型链继承了一些方法.</p> + +<h2 id="EvalError_实例"><code>EvalError</code> 实例</h2> + +<h3 id="属性">属性</h3> + +<p>{{page('/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/EvalError/prototype', 'Properties')}}</p> + +<h3 id="方法">方法</h3> + +<p>{{page('/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/EvalError/prototype', 'Methods')}}</p> + +<h2 id="例子">例子</h2> + +<p><code>EvalError</code> 不在当前ECMAScript规范中使用，因此不会被运行时抛出. 但是对象本身仍然与规范的早期版本向后兼容.</p> + +<h3 id="创建_EvalError">创建 <code>EvalError</code></h3> + +<pre><code>try { + throw new EvalError('Hello', 'someFile.js', 10); +} catch (e) { + console.log(e instanceof EvalError); // true + console.log(e.message); // "Hello" + console.log(e.name); // "EvalError" + console.log(e.fileName); // "someFile.js" + console.log(e.lineNumber); // 10 + console.log(e.columnNumber); // 0 + console.log(e.stack); // "@Scratchpad/2:2:9\n" +}</code></pre> + +<h2 id="规范">规范</h2> + +<table> + <tbody> + <tr> + <th scope="col">规范</th> + <th scope="col">状态</th> + <th scope="col">注释</th> + </tr> + <tr> + <td>{{SpecName('ES3')}}</td> + <td>{{Spec2('ES3')}}</td> + <td>初始定义.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.11.6.1', 'EvalError')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td>本规范中未使用. 为了保持向后兼容.</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-native-error-types-used-in-this-standard-evalerror', 'EvalError')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>本规范中未使用. 为了保持向后兼容.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-native-error-types-used-in-this-standard-evalerror', 'EvalError')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div class="hidden"> +<p>该页面中的兼容性表格由结构化的数据生成。如果有意向贡献数据，请查看 <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> 并发起 pull request。</p> +</div> + +<p>{{Compat("javascript.builtins.EvalError")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li><a href="/en/Core_JavaScript_1.5_Reference/Global_Objects/Error" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Error">Error</a></li> + <li><a href="/en/Core_JavaScript_1.5_Reference/Global_Functions/eval" title="en/Core_JavaScript_1.5_Reference/Global_Functions/eval">eval</a></li> + <li><a href="/en/Core_JavaScript_1.5_Reference/Global_Objects/EvalError/prototype" title="en/Core_JavaScript_1.5_Reference/Global_Objects/EvalError/prototype">EvalError.prototype</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/evalerror/prototype/index.html b/files/zh-cn/web/javascript/reference/global_objects/evalerror/prototype/index.html new file mode 100644 index 0000000000..1ea7e10e86 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/evalerror/prototype/index.html @@ -0,0 +1,84 @@ +--- +title: EvalError.prototype +slug: Web/JavaScript/Reference/Global_Objects/EvalError/prototype +translation_of: Web/JavaScript/Reference/Global_Objects/EvalError +--- +<div>{{JSRef}}</div> + +<p><code><strong>EvalError.prototype</strong></code> 属性是 {{jsxref("EvalError")}} 原型构造函数.</p> + +<div>{{js_property_attributes(0, 0, 0)}}</div> + +<h2 id="Description">Description</h2> + +<p>{{jsxref("EvalError")}} 全部实例都继承自<code>EvalError.prototype</code>. 你可以通过prototype去添加方法和属性.</p> + +<h2 id="Properties">Properties</h2> + +<dl> + <dt><code>EvalError.prototype.constructor</code></dt> + <dd>指定创建实例原型的函数.</dd> + <dt>{{jsxref("Error.prototype.message", "EvalError.prototype.message")}}</dt> + <dd>错误信息. 从 ECMA-262 开始 {{jsxref("EvalError")}} 提供 <code>message</code> （继承自{{jsxref("Error.prototype.message")}}）属性, 详见 <a href="/en-US/docs/Mozilla/Projects/SpiderMonkey">SpiderMonkey</a>.</dd> + <dt>{{jsxref("Error.prototype.name", "EvalError.prototype.name")}}</dt> + <dd>错误名称.继承自 {{jsxref("Error")}}.</dd> + <dt>{{jsxref("Error.prototype.fileName", "EvalError.prototype.fileName")}}</dt> + <dd>引发错误的文件路径. 继承自 {{jsxref("Error")}}.</dd> + <dt>{{jsxref("Error.prototype.lineNumber", "EvalError.prototype.lineNumber")}}</dt> + <dd>引发错误所在行.继承自 {{jsxref("Error")}}.</dd> + <dt>{{jsxref("Error.prototype.columnNumber", "EvalError.prototype.columnNumber")}}</dt> + <dd>引发错误所在的列. 继承自{{jsxref("Error")}}.</dd> + <dt>{{jsxref("Error.prototype.stack", "EvalError.prototype.stack")}}</dt> + <dd>堆栈.继承自 {{jsxref("Error")}}.</dd> +</dl> + +<h2 id="Methods">Methods</h2> + +<p>虽然 {{jsxref("EvalError")}} 自己的属性方法较少, 但是通过原型链继承了很多有用的方法.</p> + +<h2 id="Specifications">Specifications</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('ES3')}}</td> + <td>{{Spec2('ES3')}}</td> + <td>初代.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.11.7.6', 'NativeError.prototype')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td>定义为<code><em>NativeError</em>.prototype</code>.</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-nativeerror.prototype', 'NativeError.prototype')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>定义为<code><em>NativeError</em>.prototype</code>.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-nativeerror.prototype', 'NativeError.prototype')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td>定义为<code><em>NativeError</em>.prototype</code>.</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility">Browser compatibility</h2> + +<div> + + +<p>{{Compat("javascript.builtins.EvalError")}}</p> +</div> + +<h2 id="See_also">See also</h2> + +<ul> + <li>{{jsxref("Error.prototype")}}</li> + <li>{{jsxref("Function.prototype")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/finalizationregistry/index.html b/files/zh-cn/web/javascript/reference/global_objects/finalizationregistry/index.html new file mode 100644 index 0000000000..10e720eb80 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/finalizationregistry/index.html @@ -0,0 +1,153 @@ +--- +title: FinalizationRegistry +slug: Web/JavaScript/Reference/Global_Objects/FinalizationRegistry +tags: + - FinalizationRegistry + - GC + - 垃圾回收 +translation_of: Web/JavaScript/Reference/Global_Objects/FinalizationRegistry +--- +<div>{{JSRef}}</div> + +<p><strong><code>FinalizationRegistry</code> 对象可以让你在对象被垃圾回收时请求一个回调。</strong></p> + +<h2 id="描述">描述</h2> + +<p><code>FinalizationRegistry</code> 提供了这样的一种方法：当一个在注册表中注册的对象被回收时，请求在某个时间点上调用一个清理回调。（清理回调有时被称为 finalizer ）。</p> + +<div class="note"> +<p><strong>注意：</strong> 清理回调不应被用于必要的程序逻辑。详情请看<a href="#Notes_on_cleanup_callbacks">清理回调的注意事项</a>。</p> +</div> + +<p>你在回调中创建了如下的 registry：</p> + +<pre class="brush: js notranslate">const registry = new FinalizationRegistry(heldValue => { + // .... +}); +</pre> + +<p>然后，你可以通过调用`register`方法，注册任何你想要清理回调的对象，传入该对象和*所含的值*。</p> + +<pre class="brush: js notranslate">registry.register(theObject, "some value"); +</pre> + +<p>The registry does not keep a strong reference to the object, as that would defeat the purpose (if the registry held it strongly, the object would never be reclaimed).</p> + +<p>If <code>theObject</code> is reclaimed, your cleanup callback may be called at some point with the <em>held value</em> you provided for it (<code>"some value"</code> in the above). The held value can be any value you like: a primitive or an object, even <code>undefined</code>. If the held value is an object, the registry keeps a <em>strong</em> reference to it (so it can pass it to your cleanup callback later).</p> + +<p>If you might want to unregister an object later, you pass a third value, which is the <em>unregistration token</em> you'll use later when calling the registry's <code>unregister</code> function to unregister the object. The registry only keeps a weak reference to the unregister token.</p> + +<p>It's common to use the object itself as the unregister token, which is just fine:</p> + +<pre class="brush: js notranslate">registry.register(theObject, "some value", theObject); +// ...some time later, if you don't care about `theObject` anymore... +registry.unregister(theObject); +</pre> + +<p>It doesn't have to be the same object, though; it can be a different one:</p> + +<pre class="brush: js notranslate">registry.register(theObject, "some value", tokenObject); +// ...some time later, if you don't care about `theObject` anymore... +registry.unregister(tokenObject); +</pre> + +<h2 id="Constructor">Constructor</h2> + +<dl> + <dt>{{jsxref("FinalizationRegistry/FinalizationRegistry", "FinalizationRegistry()")}}</dt> + <dd>Creates a new <code>FinalizationRegistry</code> object.</dd> +</dl> + +<h2 id="Instance_methods">Instance methods</h2> + +<dl> + <dt>{{jsxref("FinalizationRegistry.register", "FinalizationRegistry.prototype.register()")}}</dt> + <dd>Registers an object with the registry in order to get a cleanup callback when/if the object is garbage-collected.</dd> + <dt>{{jsxref("FinalizationRegistry.unregister", "FinalizationRegistry.prototype.unregister()")}}</dt> + <dd>Unregisters an object from the registry.</dd> +</dl> + +<h2 id="Avoid_where_possible">Avoid where possible</h2> + +<p>Correct use of <code>FinalizationRegistry</code> takes careful thought, and it's best avoided if possible. It's also important to avoid relying on any specific behaviors not guaranteed by the specification. When, how, and whether garbage collection occurs is down to the implementation of any given JavaScript engine. Any behavior you observe in one engine may be different in another engine, in another version of the same engine, or even in a slightly different situation with the same version of the same engine. Garbage collection is a hard problem that JavaScript engine implementers are constantly refining and improving their solutions to.</p> + +<p>Here are some specific points that the authors of the WeakRef proposal that FinalizationRegistry is part of included in its <a href="https://github.com/tc39/proposal-FinalizationRegistrys/blob/master/README.md">explainer document</a>:</p> + +<blockquote> +<p><a href="https://en.wikipedia.org/wiki/Garbage_collection_(computer_science)">Garbage collectors</a> are complicated. If an application or library depends on GC cleaning up a FinalizationRegistry or calling a finalizer [cleanup callback] in a timely, predictable manner, it's likely to be disappointed: the cleanup may happen much later than expected, or not at all. Sources of variability include:</p> + +<ul> + <li>One object might be garbage-collected much sooner than another object, even if they become unreachable at the same time, e.g., due to generational collection.</li> + <li>Garbage collection work can be split up over time using incremental and concurrent techniques.</li> + <li>Various runtime heuristics can be used to balance memory usage, responsiveness.</li> + <li>The JavaScript engine may hold references to things which look like they are unreachable (e.g., in closures, or inline caches).</li> + <li>Different JavaScript engines may do these things differently, or the same engine may change its algorithms across versions.</li> + <li>Complex factors may lead to objects being held alive for unexpected amounts of time, such as use with certain APIs.</li> +</ul> +</blockquote> + +<h2 id="Notes_on_cleanup_callbacks">Notes on cleanup callbacks</h2> + +<p>Some notes on cleanup callbacks:</p> + +<ul> + <li>Developers shouldn't rely on cleanup callbacks for essential program logic. Cleanup callbacks may be useful for reducing memory usage across the course of a program, but are unlikely to be useful otherwise.</li> + <li>A conforming JavaScript implementation, even one that does garbage collection, is not required to call cleanup callbacks. When and whether it does so is entirely down to the implementation of the JavaScript engine. When a registered object is reclaimed, any cleanup callbacks for it may be called then, or some time later, or not at all.</li> + <li>It's likely that major implementations will call cleanup callbacks at some point during execution, but those calls may be substantially after the related object was reclaimed.</li> + <li>There are also situations where even implementations that normally call cleanup callbacks are unlikely to call them: + <ul> + <li>When the JavaScript program shuts down entirely (for instance, closing a tab in a browser).</li> + <li>When the <code>FinalizationRegistry</code> instance itself is no longer reachable by JavaScript code.</li> + </ul> + </li> +</ul> + +<h2 id="Examples">Examples</h2> + +<h3 id="Creating_a_new_registry">Creating a new registry</h3> + +<p>You create the registry passing in the callback:</p> + +<pre class="brush: js notranslate">const registry = new FinalizationRegistry(heldValue => { + // .... +}); +</pre> + +<h3 id="Registering_objects_for_cleanup">Registering objects for cleanup</h3> + +<p>Then you register any objects you want a cleanup callback for by calling the `register` method, passing in the object and a *held value* for it:</p> + +<pre class="brush: js notranslate">registry.register(theObject, "some value");</pre> + +<h2 id="Specifications">Specifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Specification</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('WeakRefs', '#sec-finalization-registry-objects', 'FinalizationRegistry')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility">Browser compatibility</h2> + + + +<p>{{Compat("javascript.builtins.FinalizationRegistry")}}</p> + +<h2 id="See_also">See also</h2> + +<ul> + <li>{{jsxref("WeakRef")}}</li> + <li>{{jsxref("WeakSet")}}</li> + <li>{{jsxref("WeakMap")}}</li> +</ul> + +<div id="gtx-trans" style="position: absolute; left: 224px; top: 147px;"> +<div class="gtx-trans-icon"></div> +</div> diff --git a/files/zh-cn/web/javascript/reference/global_objects/float32array/index.html b/files/zh-cn/web/javascript/reference/global_objects/float32array/index.html new file mode 100644 index 0000000000..393c5e4c2d --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/float32array/index.html @@ -0,0 +1,261 @@ +--- +title: Float32Array +slug: Web/JavaScript/Reference/Global_Objects/Float32Array +tags: + - JavaScript + - TypeArray + - TypeArrays + - 构造函数 +translation_of: Web/JavaScript/Reference/Global_Objects/Float32Array +--- +<div>{{JSRef}}</div> + +<p><strong><code>Float32Array</code></strong> 类型数组代表的是平台字节顺序为32位的浮点数型数组(对应于 C 浮点数据类型) 。 如果需要控制字节顺序， 使用 {{jsxref("DataView")}} 替代。其内容初始化为<code>0</code>。一旦建立起来，你可以使用这个对象的方法对其元素进行操作，或者使用标准数组索引语法 (使用方括号)。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">new Float32Array(length); +new Float32Array(typedArray); +new Float32Array(object); +new Float32Array(buffer [, byteOffset [, length]]);</pre> + +<p>更多的语法信息和参数，参见 <em><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray#Syntax">TypedArray</a>。</em></p> + +<h2 id="属性">属性</h2> + +<dl> + <dt>{{jsxref("TypedArray.BYTES_PER_ELEMENT", "Float32Array.BYTES_PER_ELEMENT")}}</dt> + <dd>返回元素字节数。 <code>在</code> <code>Float32Array的情况下返回4。</code></dd> + <dt>Float32Array.length</dt> + <dd>长度属性的值为 3。关于其实际长度(元素数量)参见{{jsxref("TypedArray.prototype.length", "Float32Array.prototype.length")}}。</dd> + <dt>{{jsxref("TypedArray.name", "Float32Array.name")}}</dt> + <dd>返回构造函数名字的字符串值。在 <code>Float32Array</code> 类型的情况下为："Float32Array"。</dd> + <dt>{{jsxref("TypedArray.prototype", "Float32Array.prototype")}}</dt> + <dd> <em>TypedArray</em>对象的原型。</dd> +</dl> + +<h2 id="方法">方法</h2> + +<dl> + <dt>{{jsxref("TypedArray.from", "Float32Array.from()")}}</dt> + <dd>从一个类数组对象或可遍历对象创建一个新的Float32Array。参见 {{jsxref("Array.from()")}}。</dd> + <dt>{{jsxref("TypedArray.of", "Float32Array.of()")}}</dt> + <dd>用可变数量的参数创建一个新的Float32Array。 参见 {{jsxref("Array.of()")}}。</dd> +</dl> + +<h2 id="Boolean_instances" name="Boolean_instances"><code>Float32Array</code> 属性</h2> + +<p>所有的<code>Float32Array对象都</code>继承自 {{jsxref("TypedArray.prototype", "%TypedArray%.prototype")}}。</p> + +<h3 id="特性">特性</h3> + +<dl> + <dt><code>Float32Array.prototype.constructor</code></dt> + <dd>返回创建这个实例原型的函数。 这是<code>Float32Array</code> 默认的构造函数。</dd> + <dt>{{jsxref("TypedArray.prototype.buffer", "Float32Array.prototype.buffer")}} {{readonlyInline}}</dt> + <dd>返回这个<code>Float32Array引用的</code>{{jsxref("ArrayBuffer")}}。构造时已固定，所以是<strong>只读</strong>的。</dd> + <dt>{{jsxref("TypedArray.prototype.byteLength", "Float32Array.prototype.byteLength")}} {{readonlyInline}}</dt> + <dd>返回从<code>Float32Array的</code>{{jsxref("ArrayBuffer")}}开头开始<code>的</code>长度 (以字节为单位) 。构造时已固定，所以是<strong>只读</strong>的。</dd> + <dt>{{jsxref("TypedArray.prototype.byteOffset", "Float32Array.prototype.byteOffset")}} {{readonlyInline}}</dt> + <dd>返回从<code>Float32Array的</code>{{jsxref("ArrayBuffer")}}开头开始<code>的偏移量</code> (以字节为单位) 。构造时已固定，所以是<strong>只读</strong>的。</dd> + <dt>{{jsxref("TypedArray.prototype.length", "Float32Array.prototype.length")}} {{readonlyInline}}</dt> + <dd>返回<code>Float32Array中的元素个数</code>。构造时已固定，所以是<strong>只读</strong>的。</dd> +</dl> + +<h3 id="方法_2">方法</h3> + +<dl> + <dt>{{jsxref("TypedArray.copyWithin", "Float32Array.prototype.copyWithin()")}}</dt> + <dd>从数组复制元素。参见{{jsxref("Array.prototype.copyWithin()")}}。</dd> + <dt>{{jsxref("TypedArray.entries", "Float32Array.prototype.entries()")}}</dt> + <dd><code>返回一个包含数组中每个元素键值对的数组遍历器对象</code>。参见{{jsxref("Array.prototype.entries()")}}。</dd> + <dt>{{jsxref("TypedArray.every", "Float32Array.prototype.every()")}}</dt> + <dd>检测是否所有元素都能通过给定函数的测试。参见{{jsxref("Array.prototype.every()")}}。</dd> + <dt>{{jsxref("TypedArray.fill", "Float32Array.prototype.fill()")}}</dt> + <dd>用一个静态值填充给定的起始位置。 参见{{jsxref("Array.prototype.fill()")}}。</dd> + <dt>{{jsxref("TypedArray.filter", "Float32Array.prototype.filter()")}}</dt> + <dd>创建一个新数组，数据为原数组中所有能让给入函数返回true的元素。参见{{jsxref("Array.prototype.filter()")}}。</dd> + <dt>{{jsxref("TypedArray.find", "Float32Array.prototype.find()")}}</dt> + <dd>返回满足测试函数的值，如果没有找到，返回undefined。 参见{{jsxref("Array.prototype.find()")}}。</dd> + <dt>{{jsxref("TypedArray.findIndex", "Float32Array.prototype.findIndex()")}}</dt> + <dd>返回满足测试函数的值的位置，如果没有找到，返回-1。参见{{jsxref("Array.prototype.findIndex()")}}。</dd> + <dt>{{jsxref("TypedArray.forEach", "Float32Array.prototype.forEach()")}}</dt> + <dd>以每个元素为参数各调用一次函数。参见{{jsxref("Array.prototype.forEach()")}}。</dd> + <dt>{{jsxref("TypedArray.includes", "Float32Array.prototype.includes()")}} {{experimental_inline}}</dt> + <dd>判断是否包含某个元素，<code>返回true</code> 或 <code>false</code>。参见{{jsxref("Array.prototype.includes()")}}。</dd> + <dt>{{jsxref("TypedArray.indexOf", "Float32Array.prototype.indexOf()")}}</dt> + <dd>返回数组中等于给定值的元素的第一个（最小）位置， 没有找到则返回-1。参见{{jsxref("Array.prototype.indexOf()")}}。</dd> + <dt>{{jsxref("TypedArray.join", "Float32Array.prototype.join()")}}</dt> + <dd>合并所有数组元素到一个字符串中。 参见{{jsxref("Array.prototype.join()")}}。</dd> + <dt>{{jsxref("TypedArray.keys", "Float32Array.prototype.keys()")}}</dt> + <dd><code>返回一个包含数组中所有索引的数组遍历器</code>。 参见{{jsxref("Array.prototype.keys()")}}。</dd> + <dt>{{jsxref("TypedArray.lastIndexOf", "Float32Array.prototype.lastIndexOf()")}}</dt> + <dd>返回数组中等于给定值的元素的最后（最大）位置， 没有找到则返回-1。参见{{jsxref("Array.prototype.lastIndexOf()")}}。</dd> + <dt>{{jsxref("TypedArray.map", "Float32Array.prototype.map()")}}</dt> + <dd>创建一个新的数组，数据由原数组每个元素依次传入给定函数后返回的值组成。参见{{jsxref("Array.prototype.map()")}}。</dd> + <dt>{{jsxref("TypedArray.move", "Float32Array.prototype.move()")}} {{non-standard_inline}} {{unimplemented_inline}}</dt> + <dd>{{jsxref("TypedArray.copyWithin", "Float32Array.prototype.copyWithin()")}}以前的一个非标准版本。</dd> + <dt>{{jsxref("TypedArray.reduce", "Float32Array.prototype.reduce()")}}</dt> + <dd>传入一个函数作为累加器，从左到右遍历，最终得到一个值。 参见{{jsxref("Array.prototype.reduce()")}}。</dd> + <dt>{{jsxref("TypedArray.reduceRight", "Float32Array.prototype.reduceRight()")}}</dt> + <dd>传入一个函数作为累加器，从右到左遍历，最终得到一个值。参见{{jsxref("Array.prototype.reduceRight()")}}。</dd> + <dt>{{jsxref("TypedArray.reverse", "Float32Array.prototype.reverse()")}}</dt> + <dd>反转数组元素的顺序 — 第一个变为最后一个， 最后一个变为第一个。参见{{jsxref("Array.prototype.reverse()")}}。</dd> + <dt>{{jsxref("TypedArray.set", "Float32Array.prototype.set()")}}</dt> + <dd>从给定的数组存入多个数值。</dd> + <dt>{{jsxref("TypedArray.slice", "Float32Array.prototype.slice()")}}</dt> + <dd>提取数组的一部分并且返回一个新数组。参见{{jsxref("Array.prototype.slice()")}}。</dd> + <dt>{{jsxref("TypedArray.some", "Float32Array.prototype.some()")}}</dt> + <dd>如果数组中至少有一个元素满足测试函数的要求则返回true。参见{{jsxref("Array.prototype.some()")}}。</dd> + <dt>{{jsxref("TypedArray.sort", "Float32Array.prototype.sort()")}}</dt> + <dd>对数组元素进行排序并返回数组。参见{{jsxref("Array.prototype.sort()")}}。</dd> + <dt>{{jsxref("TypedArray.subarray", "Float32Array.prototype.subarray()")}}</dt> + <dd>从给定的起始位置返回一个新的<code>Float32Array</code> 。</dd> + <dt>{{jsxref("TypedArray.values", "Float32Array.prototype.values()")}}</dt> + <dd>返回一个包含所有数组元素的数组遍历器对象。 参见{{jsxref("Array.prototype.values()")}}。</dd> + <dt>{{jsxref("TypedArray.toLocaleString", "Float32Array.prototype.toLocaleString()")}}</dt> + <dd>返回一个代表数组和其元素的本地化格式字符串。参见{{jsxref("Array.prototype.toLocaleString()")}}。</dd> + <dt>{{jsxref("TypedArray.toString", "Float32Array.prototype.toString()")}}</dt> + <dd>返回一个代表数组和它的元素的字符串。参见{{jsxref("Array.prototype.toString()")}}。</dd> + <dt>{{jsxref("TypedArray.@@iterator", "Float32Array.prototype[@@iterator]()")}}</dt> + <dd>返回一个新的包含数组元素的数组迭代器对象。</dd> +</dl> + +<h2 id="例子">例子</h2> + +<pre class="brush: js">// From a length +var float32 = new Float32Array(2); +float32[0] = 42; +console.log(float32[0]); // 42 +console.log(float32.length); // 2 +console.log(float32.BYTES_PER_ELEMENT); // 4 + +// From an array +var arr = new Float32Array([21,31]); +console.log(arr[1]); // 31 + +// From another TypedArray +var x = new Float32Array([21, 31]); +var y = new Float32Array(x); +console.log(y[0]); // 21 + +// From an ArrayBuffer +var buffer = new ArrayBuffer(16); +var z = new Float32Array(buffer, 0, 4); +</pre> + +<h2 id="sect1"> </h2> + +<h2 id="规范">规范</h2> + +<table> + <tbody> + <tr> + <th scope="col">规范</th> + <th scope="col">状态</th> + <th scope="col">注释</th> + </tr> + <tr> + <td>{{SpecName('Typed Array')}}</td> + <td>{{Spec2('Typed Array')}}</td> + <td>被ECMAScript 6取代</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#table-49', 'TypedArray constructors')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>在ECMA中初始定义，另外规定需要使用new。</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#table-49', 'TypedArray constructors')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容">浏览器兼容</h2> + +<p>{{CompatibilityTable}}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>特性</th> + <th>Chrome</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>基础支持</td> + <td>7.0</td> + <td>{{CompatGeckoDesktop(2)}}</td> + <td>10</td> + <td>11.6</td> + <td>5.1</td> + </tr> + <tr> + <td>需要<code>new</code></td> + <td>{{CompatUnknown}}</td> + <td>{{CompatGeckoDesktop(44)}}</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>特性</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>基础支持</td> + <td>4.0</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoMobile(2)}}</td> + <td>10</td> + <td>11.6</td> + <td>4.2</td> + </tr> + <tr> + <td>需要<code>new</code></td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatGeckoMobile(44)}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="一致性提示">一致性提示</h2> + +<p>从ECMAScript 2015 (ES6)开始， <code>Float32Array</code>构造函数需要用一个{{jsxref("Operators/new", "new")}}操作符来构造。现在直接把<code>Float32Array构造函数当函数调用而不使用new，会抛出一个</code>{{jsxref("TypeError")}}。</p> + +<pre class="brush: js example-bad">var dv = Float32Array([1, 2, 3]); +// TypeError: calling a builtin Float32Array constructor +// 不允许不使用new</pre> + +<pre class="brush: js example-good">var dv = new Float32Array([1, 2, 3]);</pre> + +<h2 id="参见">参见</h2> + +<ul> + <li><a href="/en-US/docs/Web/JavaScript/Typed_arrays" title="en/JavaScript typed arrays">JavaScript typed arrays</a></li> + <li>{{jsxref("ArrayBuffer")}}</li> + <li>{{jsxref("DataView")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/float64array/index.html b/files/zh-cn/web/javascript/reference/global_objects/float64array/index.html new file mode 100644 index 0000000000..8c08d222d8 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/float64array/index.html @@ -0,0 +1,259 @@ +--- +title: Float64Array +slug: Web/JavaScript/Reference/Global_Objects/Float64Array +tags: + - JavaScript + - TypeArray + - TypeArrays + - 构造函数 +translation_of: Web/JavaScript/Reference/Global_Objects/Float64Array +--- +<div>{{JSRef}}</div> + +<p><strong><code>Float64Array</code></strong> 类型数组代表的是平台字节顺序为64位的浮点数型数组(对应于 C 浮点数据类型) 。 如果需要控制字节顺序， 使用 {{jsxref("DataView")}} 替代。其内容初始化为<code>0</code>。一旦建立起来，你可以使用这个对象的方法对其元素进行操作，或者使用标准数组索引语法 (使用方括号)。</p> + +<h2 id="语法">?语法 </h2> + +<pre class="syntaxbox">new Float64Array(length); +new Float64Array(typedArray); +new Float64Array(object); +new Float64Array(buffer [, byteOffset [, length]]);</pre> + +<p>更多的语法信息和参数，参见 <em><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray#Syntax">TypedArray</a></em>.</p> + +<h2 id="属性">属性</h2> + +<dl> + <dt>{{jsxref("TypedArray.BYTES_PER_ELEMENT", "Float64Array.BYTES_PER_ELEMENT")}}</dt> + <dd>返回元素字节数。 <code>在</code> <code>Float64Array的情况下返回8。</code></dd> + <dt>Float64Array.length</dt> + <dd>长度属性的值为 3。关于其实际长度(元素数量)参见 {{jsxref("TypedArray.prototype.length", "Float64Array.prototype.length")}}。</dd> + <dt>{{jsxref("TypedArray.name", "Float64Array.name")}}</dt> + <dd>返回构造函数名字的字符串值。在 <code>Float64Array</code> 类型的情况下为："Float64Array"。</dd> + <dt>{{jsxref("TypedArray.prototype", "Float64Array.prototype")}}</dt> + <dd><em>TypedArray</em>对象的原型。</dd> +</dl> + +<h2 id="方法">方法</h2> + +<dl> + <dt>{{jsxref("TypedArray.from", "Float64Array.from()")}}</dt> + <dd>从一个类数组对象或可遍历对象创建一个新的Float64Array。参见 {{jsxref("Array.from()")}}。</dd> + <dt>{{jsxref("TypedArray.of", "Float64Array.of()")}}</dt> + <dd>用可变数量的参数创建一个新的Float64Array。 参见 {{jsxref("Array.of()")}}。</dd> +</dl> + +<h2 id="Float64Array_属性"><code>Float64Array</code> 属性</h2> + +<p>所有的<code>Float64Array对象都</code>继承自 {{jsxref("TypedArray.prototype", "%TypedArray%.prototype")}}。</p> + +<h3 id="特性">特性</h3> + +<dl> + <dt><code>Float64Array.prototype.constructor</code></dt> + <dd>返回创建这个实例原型的函数。 这是<code>Float64Array</code> 默认的构造函数。</dd> + <dt>{{jsxref("TypedArray.prototype.buffer", "Float64Array.prototype.buffer")}} {{readonlyInline}}</dt> + <dd>返回这个<code>Float64Array引用的</code> {{jsxref("ArrayBuffer")}}。构造时已固定，所以是<strong>只读</strong>的。</dd> + <dt>{{jsxref("TypedArray.prototype.byteLength", "Float64Array.prototype.byteLength")}} {{readonlyInline}}</dt> + <dd>返回从<code>Float64Array的</code>{{jsxref("ArrayBuffer")}}开头开始<code>的</code>长度 (以字节为单位) 。构造时已固定，所以是<strong>只读</strong>的。</dd> + <dt>{{jsxref("TypedArray.prototype.byteOffset", "Float64Array.prototype.byteOffset")}} {{readonlyInline}}</dt> + <dd>返回从<code>Float64Array的</code>{{jsxref("ArrayBuffer")}}开头开始<code>的偏移量</code> (以字节为单位) 。构造时已固定，所以是<strong>只读</strong>的。</dd> + <dt>{{jsxref("TypedArray.prototype.length", "Float64Array.prototype.length")}} {{readonlyInline}}</dt> + <dd>返回<code>Float64Array中的元素个数</code>。构造时已固定，所以是<strong>只读</strong>的。</dd> +</dl> + +<h3 id="方法_2">方法</h3> + +<dl> + <dt>{{jsxref("TypedArray.copyWithin", "Float64Array.prototype.copyWithin()")}}</dt> + <dd>从数组复制元素。参见{{jsxref("Array.prototype.copyWithin()")}}。</dd> + <dt>{{jsxref("TypedArray.entries", "Float64Array.prototype.entries()")}}</dt> + <dd><code>返回一个包含数组中每个元素键值对的数组遍历器对象</code>。参见{{jsxref("Array.prototype.entries()")}}。</dd> + <dt>{{jsxref("TypedArray.every", "Float64Array.prototype.every()")}}</dt> + <dd>检测是否所有元素都能通过给定函数的测试。参见{{jsxref("Array.prototype.every()")}}。</dd> + <dt>{{jsxref("TypedArray.fill", "Float64Array.prototype.fill()")}}</dt> + <dd>用一个静态值填充给定的起始位置。 参见{{jsxref("Array.prototype.fill()")}}。</dd> + <dt>{{jsxref("TypedArray.filter", "Float64Array.prototype.filter()")}}</dt> + <dd>创建一个新数组，数据为原数组中所有能让给入函数返回true的元素。参见{{jsxref("Array.prototype.filter()")}}。</dd> + <dt>{{jsxref("TypedArray.find", "Float64Array.prototype.find()")}}</dt> + <dd>返回满足测试函数的值，如果没有找到，返回undefined。 参见{{jsxref("Array.prototype.find()")}}。</dd> + <dt>{{jsxref("TypedArray.findIndex", "Float64Array.prototype.findIndex()")}}</dt> + <dd>返回满足测试函数的值的位置，如果没有找到，返回-1。参见{{jsxref("Array.prototype.findIndex()")}}。</dd> + <dt>{{jsxref("TypedArray.forEach", "Float64Array.prototype.forEach()")}}</dt> + <dd>以每个元素为参数各调用一次函数。参见{{jsxref("Array.prototype.forEach()")}}。</dd> + <dt>{{jsxref("TypedArray.includes", "Float64Array.prototype.includes()")}} {{experimental_inline}}</dt> + <dd>判断是否包含某个元素，<code>返回true</code> 或 <code>false</code>。参见{{jsxref("Array.prototype.includes()")}}。</dd> + <dt>{{jsxref("TypedArray.indexOf", "Float64Array.prototype.indexOf()")}}</dt> + <dd>返回数组中等于给定值的元素的第一个（最小）位置， 没有找到则返回-1。参见{{jsxref("Array.prototype.indexOf()")}}。</dd> + <dt>{{jsxref("TypedArray.join", "Float64Array.prototype.join()")}}</dt> + <dd>合并所有数组元素到一个字符串中。 参见{{jsxref("Array.prototype.join()")}}。</dd> + <dt>{{jsxref("TypedArray.keys", "Float64Array.prototype.keys()")}}</dt> + <dd><code>返回一个包含数组中所有索引的数组遍历器</code>。 参见{{jsxref("Array.prototype.keys()")}}。</dd> + <dt>{{jsxref("TypedArray.lastIndexOf", "Float64Array.prototype.lastIndexOf()")}}</dt> + <dd>返回数组中等于给定值的元素的最后（最大）位置， 没有找到则返回-1。参见{{jsxref("Array.prototype.lastIndexOf()")}}。</dd> + <dt>{{jsxref("TypedArray.map", "Float64Array.prototype.map()")}}</dt> + <dd>创建一个新的数组，数据由原数组每个元素依次传入给定函数后返回的值组成。参见{{jsxref("Array.prototype.map()")}}。</dd> + <dt>{{jsxref("TypedArray.move", "Float64Array.prototype.move()")}} {{non-standard_inline}} {{unimplemented_inline}}</dt> + <dd>{{jsxref("TypedArray.copyWithin", "Float64Array.prototype.copyWithin()")}}以前的一个非标准版本。</dd> + <dt>{{jsxref("TypedArray.reduce", "Float64Array.prototype.reduce()")}}</dt> + <dd>传入一个函数作为累加器，从左到右遍历，最终得到一个值。 参见{{jsxref("Array.prototype.reduce()")}}。</dd> + <dt>{{jsxref("TypedArray.reduceRight", "Float64Array.prototype.reduceRight()")}}</dt> + <dd>传入一个函数作为累加器，从右到左遍历，最终得到一个值。参见{{jsxref("Array.prototype.reduceRight()")}}。</dd> + <dt>{{jsxref("TypedArray.reverse", "Float64Array.prototype.reverse()")}}</dt> + <dd>反转数组元素的顺序 — 第一个变为最后一个， 最后一个变为第一个。参见{{jsxref("Array.prototype.reverse()")}}。</dd> + <dt>{{jsxref("TypedArray.set", "Float64Array.prototype.set()")}}</dt> + <dd>从给定的数组存入多个数值。</dd> + <dt>{{jsxref("TypedArray.slice", "Float64Array.prototype.slice()")}}</dt> + <dd>提取数组的一部分并且返回一个新数组。参见{{jsxref("Array.prototype.slice()")}}。</dd> + <dt>{{jsxref("TypedArray.some", "Float64Array.prototype.some()")}}</dt> + <dd>如果数组中至少有一个元素满足测试函数的要求则返回true。参见{{jsxref("Array.prototype.some()")}}。</dd> + <dt>{{jsxref("TypedArray.sort", "Float64Array.prototype.sort()")}}</dt> + <dd>对数组元素进行排序并返回数组。参见{{jsxref("Array.prototype.sort()")}}。</dd> + <dt>{{jsxref("TypedArray.subarray", "Float64Array.prototype.subarray()")}}</dt> + <dd>从给定的起始位置返回一个新的<code>Float64Array</code> 。</dd> + <dt>{{jsxref("TypedArray.values", "Float64Array.prototype.values()")}}</dt> + <dd>返回一个包含所有数组元素的数组遍历器对象。 参见{{jsxref("Array.prototype.values()")}}。</dd> + <dt>{{jsxref("TypedArray.toLocaleString", "Float64Array.prototype.toLocaleString()")}}</dt> + <dd>返回一个代表数组和其元素的本地化格式字符串。参见{{jsxref("Array.prototype.toLocaleString()")}}。</dd> + <dt>{{jsxref("TypedArray.toString", "Float64Array.prototype.toString()")}}</dt> + <dd>返回一个代表数组和它的元素的字符串。参见{{jsxref("Array.prototype.toString()")}}。</dd> + <dt>{{jsxref("TypedArray.@@iterator", "Float64Array.prototype[@@iterator]()")}}</dt> + <dd>返回一个新的包含数组元素的数组迭代器对象。</dd> +</dl> + +<h2 id="例子">例子</h2> + +<pre class="brush: js">// From a length +var float64 = new Float64Array(2); +float64[0] = 42; +console.log(float64[0]); // 42 +console.log(float64.length); // 2 +console.log(float64.BYTES_PER_ELEMENT); // 8 + +// From an array +var arr = new Float64Array([21,31]); +console.log(arr[1]); // 31 + +// From another TypedArray +var x = new Float64Array([21, 31]); +var y = new Float64Array(x); +console.log(y[0]); // 21 + +// From an ArrayBuffer +var buffer = new ArrayBuffer(32); +var z = new Float64Array(buffer, 0, 4); +</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>{{SpecName('Typed Array')}}</td> + <td>{{Spec2('Typed Array')}}</td> + <td>被ECMAScript 6取代。</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#table-49', 'TypedArray constructors')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>在ECMA中初始定义，另外规定需要使用new。</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#table-49', 'TypedArray constructors')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容">浏览器兼容</h2> + +<p>{{CompatibilityTable}}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>特性</th> + <th>Chrome</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>基础支持</td> + <td>7.0</td> + <td>{{CompatGeckoDesktop(2)}}</td> + <td>10</td> + <td>11.6</td> + <td>5.1</td> + </tr> + <tr> + <td><code>需要用new</code></td> + <td>{{CompatUnknown}}</td> + <td>{{CompatGeckoDesktop(44)}}</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>特性</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>基础支持</td> + <td>4.0</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{ CompatGeckoMobile(2) }}</td> + <td>10</td> + <td>11.6</td> + <td>4.2</td> + </tr> + <tr> + <td><code>需要用new</code></td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{ CompatGeckoMobile(44) }}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="一致性提示">一致性提示</h2> + +<p>从ECMAScript 2015 (ES6)开始， <code>Float32Array</code>构造函数需要用一个{{jsxref("Operators/new", "new")}}操作符来构造。现在直接把<code>Float32Array构造函数当函数调用而不使用new，会抛出一个</code>{{jsxref("TypeError")}}。</p> + +<pre class="brush: js example-bad">var dv = Float64Array([1, 2, 3]); +// TypeError: calling a builtin Float64Array constructor +// 不允许不使用new</pre> + +<pre class="brush: js example-good">var dv = new Float64Array([1, 2, 3]);</pre> + +<h2 id="参见">参见</h2> + +<ul> + <li><a href="/en-US/docs/Web/JavaScript/Typed_arrays" title="en/JavaScript typed arrays">JavaScript typed arrays</a></li> + <li>{{jsxref("ArrayBuffer")}}</li> + <li>{{jsxref("DataView")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/function/apply/index.html b/files/zh-cn/web/javascript/reference/global_objects/function/apply/index.html new file mode 100644 index 0000000000..de53da11e7 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/function/apply/index.html @@ -0,0 +1,219 @@ +--- +title: Function.prototype.apply() +slug: Web/JavaScript/Reference/Global_Objects/Function/apply +tags: + - Function + - JavaScript + - Method +translation_of: Web/JavaScript/Reference/Global_Objects/Function/apply +--- +<div>{{JSRef}}</div> + +<p><strong><code>apply()</code></strong> 方法调用一个具有给定<code>this</code>值的函数，以及以一个数组（或<a href="/zh-CN/docs/Web/JavaScript/Guide/Indexed_collections#Working_with_array-like_objects">类数组对象</a>）的形式提供的参数。</p> + +<div class="note"><strong>注意：</strong><span style="line-height: 1.5;">call()方法的作用和 apply() 方法类似，区别就是<code>call()</code>方法接受的是<strong>参数列表</strong>，而<code>apply()</code>方法接受的是<strong>一个参数数组</strong>。</span></div> + +<div>{{EmbedInteractiveExample("pages/js/function-apply.html")}}</div> + + + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox notranslate"><code><em>func</em>.apply(<em>thisArg</em><em>, [</em><em>argsArray</em>])</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>thisArg</code></dt> + <dd>必选的。在 <em><code>func</code></em> 函数运行时使用的 <code>this</code> 值。请注意，<code>this</code>可能不是该方法看到的实际值：如果这个函数处于{{jsxref("Strict_mode", "非严格模式", "", 1)}}下，则指定为 <code>null</code> 或 <code>undefined</code> 时会自动替换为指向全局对象，原始值会被包装。</dd> + <dt><code>argsArray</code></dt> + <dd>可选的。一个数组或者类数组对象，其中的数组元素将作为单独的参数传给 <code>func</code> 函数。如果该参数的值为 {{jsxref("null")}} 或 {{jsxref("undefined")}}，则表示不需要传入任何参数。从ECMAScript 5 开始可以使用类数组对象。 {{anch("Browser_compatibility", "浏览器兼容性")}} 请参阅本文底部内容。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>调用有指定<code><strong>this</strong></code>值和参数的函数的结果。</p> + +<h2 id="Description" name="Description">描述</h2> + +<p><span style="line-height: 1.5;">在调用一个存在的函数时，你可以为其指定一个 <code>this</code> 对象。 <code>this</code></span> <span style="line-height: 1.5;">指当前对象，也就是正在调用这个函数的对象。 使用 <code>apply</code>， 你可以只写一次这个方法然后在另一个对象中继承它，而不用在新对象中重复写该方法。</span></p> + +<p><code>apply</code> 与 {{jsxref("Function.call", "call()")}} 非常相似，不同之处在于提供参数的方式。<code style="font-size: 14px;">apply</code> 使用参数数组而不是一组参数列表。<code>apply</code> 可以使用数组字面量（array literal）<span style="line-height: 1.5;">，如 </span><code>fun.apply(this, ['eat', 'bananas'])</code><span style="line-height: 1.5;">，或数组对象，</span><span style="line-height: 1.5;"> 如 </span><code>fun.apply(this, new Array('eat', 'bananas'))</code><span style="line-height: 1.5;">。</span></p> + +<p>你也可以使用 {{jsxref("Functions/arguments", "arguments")}}对象作为 <code>argsArray</code> 参数。 <code>arguments</code> 是一个函数的局部变量。 它可以被用作被调用对象的所有未指定的参数。 这样，你在使用apply函数的时候就不需要知道被调用对象的所有参数。 你可以使用arguments来把所有的参数传递给被调用对象。 被调用对象接下来就负责处理这些参数。</p> + +<p>从 ECMAScript 第5版开始，可以使用任何种类的类数组对象，就是说只要有一个 <code>length</code> 属性和<code>(0..length-1)</code>范围的整数属性。例如现在可以使用 {{domxref("NodeList")}} 或一个自己定义的类似 <code>{'length': 2, '0': 'eat', '1': 'bananas'}</code> 形式的对象。</p> + +<div class="note"> +<p>需要注意：Chrome 14 以及 Internet Explorer 9 仍然不接受类数组对象。如果传入类数组对象，它们会抛出异常。</p> +</div> + +<h2 id="Examples" name="Examples">示例</h2> + +<h3 id="用_apply_将数组各项添加到另一个数组">用 <code>apply</code> 将数组各项添加到另一个数组</h3> + +<p>我们可以使用<code>push</code>将元素追加到数组中。由于push接受可变数量的参数，所以也可以一次追加多个元素。</p> + +<p>但是，如果<code>push</code>的参数是数组，它会将该数组作为单个元素添加，而不是将这个数组内的每个元素添加进去，因此我们最终会得到一个数组内的数组。如果不想这样呢？<code>concat</code>符合我们的需求，但它并不是将元素添加到现有数组，而是创建并返回一个新数组。 然而我们需要将元素追加到现有数组......那么怎么做好？难道要写一个循环吗？别当然不是！</p> + +<p><code>apply</code>正派上用场！</p> + +<pre class="brush: js notranslate">var array = ['a', 'b']; +var elements = [0, 1, 2]; +array.push.apply(array, elements); +console.info(array); // ["a", "b", 0, 1, 2] +</pre> + +<h3 id="apply_and_built-in_functions" name="apply_and_built-in_functions">使用<code>apply</code>和内置函数</h3> + +<p>对于一些需要写循环以便历数组各项的需求，我们可以用<code>apply</code>完成以避免循环。</p> + +<p>下面是示例，我们将用<code>Math.max</code>/<code>Math.min</code>求得数组中的最大/小值。</p> + +<pre class="brush: js notranslate">/* 找出数组中最大/小的数字 */ +var numbers = [5, 6, 2, 3, 7]; + +/* 使用Math.min/Math.max以及apply 函数时的代码 */ +var max = Math.max.apply(null, numbers); /* 基本等同于 Math.max(numbers[0], ...) 或 Math.max(5, 6, ..) */ +var min = Math.min.apply(null, numbers); + +/* 对比：简单循环算法 */ +max = -Infinity, min = +Infinity; + +for (var i = 0; i < numbers.length; i++) { + if (numbers[i] > max) + max = numbers[i]; + if (numbers[i] < min) + min = numbers[i]; +}</pre> + +<p>注意：如果按上面方式调用<code>apply</code>，有超出JavaScript引擎参数长度上限的风险。一个方法传入过多参数（比如一万个）时的后果在不同JavaScript 引擎中表现不同。（JavaScriptCore引擎中有被硬编码的<a class="link-https" href="https://bugs.webkit.org/show_bug.cgi?id=80797"> 参数个数上限：65536</a>）。这是因为此限制（实际上也是任何用到超大栈空间的行为的自然表现）是不明确的。一些引擎会抛出异常，更糟糕的是其他引擎会直接限制传入到方法的参数个数，导致参数丢失。比如：假设某个引擎的方法参数上限为4（实际上限当然要高得多）, 这种情况下，上面的代码执行后, 真正被传递到 <code>apply</code>的参数为 <code>5, 6, 2, 3</code> ，而不是完整的数组。</p> + +<p>如果你的参数数组可能非常大，那么推荐使用下面这种混合策略：将数组切块后循环传入目标方法：</p> + +<pre class="brush: js notranslate">function minOfArray(arr) { + var min = Infinity; + var QUANTUM = 32768; + + for (var i = 0, len = arr.length; i < len; i += QUANTUM) { + var submin = Math.min.apply(null, arr.slice(i, Math.min(i + QUANTUM, len))); + min = Math.min(submin, min); + } + + return min; +} + +var min = minOfArray([5, 6, 2, 3, 7]); +</pre> + +<h3 id="Using_apply_to_chain_constructors" name="Using_apply_to_chain_constructors">使用apply来链接构造器</h3> + +<p>你可以使用apply来链接一个对象<a href="/zh-CN/docs/JavaScript/Reference/Operators/new" title="JavaScript/Reference/Operators/new">构造器</a>，类似于Java。在接下来的例子中我们会创建一个全局<a href="/zh-CN/docs/JavaScript/Reference/Global_Objects/Function" title="JavaScript/Reference/Global_Objects/Function"><code>Function</code></a> <span style="color: #000000; display: inline !important; float: none; font-family: 'microsoft yahei'; font-size: 18px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 28.8px; text-align: left; text-indent: 0px; text-transform: none; white-space: normal;">对象的</span><span style="color: #000000; font-family: 'microsoft yahei'; font-size: 18px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 28.8px; text-align: left; text-indent: 0px; text-transform: none; white-space: normal;">construct</span><span style="color: #000000; font-family: 'microsoft yahei'; font-size: 18px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 1.6; text-align: left; text-indent: 0px; text-transform: none; white-space: normal;">方法</span> ，来使你能够在构造器中使用一个类数组对象而非参数列表。</p> + +<pre class="brush: js notranslate">Function.prototype.construct = function (aArgs) { + var oNew = Object.create(this.prototype); + this.apply(oNew, aArgs); + return oNew; +}; +</pre> + +<div class="note"> +<p><strong>注意:</strong> 上面使用的<code>Object.create()</code>方法相对来说比较新。另一种可选的方法，请考虑如下替代方法：</p> + +<p>Using {{jsxref("Object/__proto__", "Object.__proto__")}}:</p> + +<pre class="brush: js notranslate">Function.prototype.construct = function (aArgs) { + var oNew = {}; + oNew.__proto__ = this.prototype; + this.apply(oNew, aArgs); + return oNew; +};</pre> + +<p>使用闭包：</p> + +<pre class="brush: js notranslate" style="font-style: normal;">Function.prototype.construct = function(aArgs) { + var fConstructor = this, fNewConstr = function() { + fConstructor.apply(this, aArgs); + }; + fNewConstr.prototype = fConstructor.prototype; + return new fNewConstr(); +};</pre> + +<p class="brush: js" style="font-style: normal;">使用 Function 构造器：</p> + +<pre class="brush: js notranslate">Function.prototype.construct = function (aArgs) { + var fNewConstr = new Function(""); + fNewConstr.prototype = this.prototype; + var oNew = new fNewConstr(); + this.apply(oNew, aArgs); + return oNew; +};</pre> +</div> + +<p>使用示例：</p> + +<pre class="brush: js notranslate">function MyConstructor (arguments) { + for (var nProp = 0; nProp < arguments.length; nProp++) { + this["property" + nProp] = arguments[nProp]; + } +} + +var myArray = [4, "Hello world!", false]; +var myInstance = new MyConstructor(myArray); //Fix MyConstructor.construct is not a function + +console.log(myInstance.property1); // logs "Hello world!" +console.log(myInstance instanceof MyConstructor); // logs "true" +console.log(myInstance.constructor); // logs "MyConstructor" +</pre> + +<div class="note"><strong>注意：</strong> 这个非native的<code>Function.construct</code>方法无法和一些native构造器（例如<a href="/zh-CN/docs/JavaScript/Reference/Global_Objects/Date" title="JavaScript/Reference/Global_Objects/Date"><code>Date</code></a>）一起使用。 在这种情况下你必须使用<a href="/zh-CN/docs/JavaScript/Reference/Global_Objects/Function/bind#Bound_functions_used_as_constructors" title="JavaScript/Reference/Global_Objects/Function/bind#Bound_functions_used_as_constructors"><code>Function.bind</code></a>方法（例如，想象有如下一个数组要用在Date构造器中： <code>[2012, 11, 4]</code>；这时你需要这样写： <code>new (Function.prototype.bind.apply(Date, [null].concat([2012, 11, 4])))()</code> – -无论如何这不是最好的实现方式并且也许不该用在任何生产环境中).</div> + +<h2 id="规范" style="margin-bottom: 20px; line-height: 30px;">规范</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('ES3')}}</td> + <td>{{Spec2('ES3')}}</td> + <td>Initial definition. Implemented in JavaScript 1.3.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.3.4.3', 'Function.prototype.apply')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-function.prototype.apply', 'Function.prototype.apply')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-function.prototype.apply', 'Function.prototype.apply')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性" style="margin-bottom: 20px; line-height: 30px;">浏览器兼容性</h2> + +<div class="hidden"> +<p>The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> +</div> + +<p>{{Compat("javascript.builtins.Function.apply")}}</p> + +<h2 id="See_also" name="See_also" style="margin-bottom: 20px; line-height: 30px;">相关链接</h2> + +<ul> + <li>{{jsxref("Functions_and_function_scope/arguments", "arguments ")}} object</li> + <li>{{jsxref("Function.prototype.bind()")}}</li> + <li>{{jsxref("Function.prototype.call()")}}</li> + <li>{{jsxref("Functions", "Functions and function scope", "", 1)}}</li> + <li>{{jsxref("Reflect.apply()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/function/arguments/index.html b/files/zh-cn/web/javascript/reference/global_objects/function/arguments/index.html new file mode 100644 index 0000000000..a0c93f29f3 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/function/arguments/index.html @@ -0,0 +1,125 @@ +--- +title: Function.arguments +slug: Web/JavaScript/Reference/Global_Objects/Function/arguments +translation_of: Web/JavaScript/Reference/Global_Objects/Function/arguments +--- +<div>{{JSRef}} {{deprecated_header}}</div> + +<p><code><strong><em>function</em>.arguments</strong></code> 属性代表传入函数的实参，它是一个类数组对象。</p> + +<h2 id="描述">描述</h2> + +<p><code><em>function</em>.arguments</code> 已经被废弃了, 现在推荐的做法是使用函数内部可用的 {{jsxref("Functions/arguments", "arguments")}} 对象来访问函数的实参。</p> + +<p>在函数递归调用的时候（在某一刻同一个函数运行了多次，也就是有多套实参），那么 <code>arguments</code> 属性的值是最近一次该函数调用时传入的实参，下面的示例有演示。</p> + +<p>如果函数不在执行期间，那么该函数的 <code>arguments</code> 属性的值是 <code>null</code>。</p> + +<h2 id="示例">示例</h2> + +<pre class="brush: js">function f(n) { g(n - 1); } + +function g(n) { + console.log('before: ' + g.arguments[0]); + if (n > 0) { f(n); } + console.log('after: ' + g.arguments[0]); +} + +f(2); + +console.log('函数退出后的 arguments 属性值：' + g.arguments); + +// 输出： + +// before: 1 +// before: 0 +// after: 0 +// after: 1 +// 函数退出后的 arguments 属性值：null +</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>{{SpecName('ES1')}}</td> + <td>{{Spec2('ES1')}}</td> + <td>arguments 属性首次实现于 JavaScript 1.0，首次添加进规范是在 ES1，在 ES3 中被删除。</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-10.6', 'arguments object')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td>{{jsxref("Functions/arguments", "arguments")}}</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-arguments-object', 'arguments object')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>{{jsxref("Functions/arguments", "arguments")}}</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>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</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>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Functions/arguments", "arguments")}}</li> + <li>{{jsxref("Functions", "函数和函数的作用域", "", 1)}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/function/arity/index.html b/files/zh-cn/web/javascript/reference/global_objects/function/arity/index.html new file mode 100644 index 0000000000..d8e8668ca2 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/function/arity/index.html @@ -0,0 +1,16 @@ +--- +title: Function.arity +slug: Web/JavaScript/Reference/Global_Objects/Function/arity +translation_of: Archive/Web/JavaScript/Function.arity +--- +<div> +<div>{{JSRef("Global_Objects", "Function")}} {{obsolete_header}}</div> +</div> + +<h2 id="Summary" name="Summary">概述</h2> + +<p>返回一个函数的形参数量.</p> + +<h2 id="Description" name="Description">描述</h2> + +<p class="note"><code>arity</code>是一个古老的已经没有浏览器支持的属性,你应该使用<code><a href="/zh-CN/docs/JavaScript/Reference/Global_Objects/Function/length" title="JavaScript/Reference/Global_Objects/Function/length">Function.prototype.length</a></code>属性来代替.</p> diff --git a/files/zh-cn/web/javascript/reference/global_objects/function/bind/index.html b/files/zh-cn/web/javascript/reference/global_objects/function/bind/index.html new file mode 100644 index 0000000000..fbabcdfc13 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/function/bind/index.html @@ -0,0 +1,324 @@ +--- +title: Function.prototype.bind() +slug: Web/JavaScript/Reference/Global_Objects/Function/bind +tags: + - ECMAScript 2015 + - ECMAScript 5 + - Function + - JavaScript + - Method + - polyfill +translation_of: Web/JavaScript/Reference/Global_Objects/Function/bind +--- +<div>{{JSRef}}</div> + +<p><code><strong>bind()</strong></code> 方法创建一个新的函数，在 <code>bind()</code> 被调用时，这个新函数的 <code>this</code> 被指定为 <code>bind()</code> 的第一个参数，而其余参数将作为新函数的参数，供调用时使用。</p> + +<div>{{EmbedInteractiveExample("pages/js/function-bind.html", "taller")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox notranslate"><code><var>function</var></code>.bind(<var>thisArg</var>[, <var>arg1</var>[, <var>arg2</var>[, ...]]])</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>thisArg</code></dt> + <dd>调用绑定函数时作为 <code>this</code> 参数传递给目标函数的值。 如果使用{{jsxref("Operators/new", "new")}}运算符构造绑定函数，则忽略该值。当使用 <code>bind</code> 在 <code>setTimeout</code> 中创建一个函数（作为回调提供）时，作为 <code>thisArg</code> 传递的任何原始值都将转换为 <code>object</code>。如果 <code>bind</code> 函数的参数列表为空，或者<code>thisArg</code>是<code>null</code>或<code>undefined</code>，执行作用域的 <code>this</code> 将被视为新函数的 <code>thisArg</code>。</dd> + <dt><code>arg1, arg2, ...</code></dt> + <dd>当目标函数被调用时，被预置入绑定函数的参数列表中的参数。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>返回一个原函数的拷贝，并拥有指定的 <strong><code>this</code></strong> 值和初始参数。</p> + +<h2 id="描述">描述</h2> + +<div><strong>bind()</strong> 函数会创建一个新的<strong>绑定函数</strong>（<strong>bound function</strong>，BF）。绑定函数是一个 exotic function object（怪异函数对象，ECMAScript 2015 中的术语），它包装了原函数对象。调用<strong>绑定函数</strong>通常会导致执行<strong>包装函数</strong>。<br> +<strong>绑定函数</strong>具有以下内部属性：</div> + +<div></div> + +<div> +<ul> + <li><strong>[[BoundTargetFunction]]</strong> - 包装的函数对象</li> + <li><strong>[[BoundThis]]</strong> - 在调用包装函数时始终作为 <strong>this</strong> 值传递的值。</li> + <li><strong>[[BoundArguments]]</strong> - 列表，在对包装函数做任何调用都会优先用列表元素填充参数列表。</li> + <li><strong>[[Call]]</strong> - 执行与此对象关联的代码。通过函数调用表达式调用。内部方法的参数是一个<strong>this</strong>值和一个包含通过调用表达式传递给函数的参数的列表。</li> +</ul> + +<p>当调用绑定函数时，它调用 <strong>[[BoundTargetFunction]]</strong> 上的内部方法 <strong>[[Call]]</strong>，就像这样 <strong>Call(<em>boundThis</em>, <em>args</em>)</strong>。其中，<strong>boundThis</strong> 是 <strong>[[BoundThis]]</strong>，<strong>args</strong> 是 <strong>[[BoundArguments]]</strong> 加上通过函数调用传入的参数列表。</p> +</div> + +<div> +<p>绑定函数也可以使用 {{jsxref("Operators/new", "new")}} 运算符构造，它会表现为目标函数已经被构建完毕了似的。提供的 <code>this</code> 值会被忽略，但前置参数仍会提供给模拟函数。</p> +</div> + +<h2 id="示例">示例</h2> + +<h3 id="创建绑定函数">创建绑定函数</h3> + +<p><code>bind()</code> 最简单的用法是创建一个函数，不论怎么调用，这个函数都有同样的 <strong><code>this</code></strong> 值。JavaScript新手经常犯的一个错误是将一个方法从对象中拿出来，然后再调用，期望方法中的 <code>this</code> 是原来的对象（比如在回调中传入这个方法）。如果不做特殊处理的话，一般会丢失原来的对象。基于这个函数，用原始的对象创建一个绑定函数，巧妙地解决了这个问题：</p> + +<pre class="brush: js notranslate">this.x = 9; // 在浏览器中，this 指向全局的 "window" 对象 +var module = { + x: 81, + getX: function() { return this.x; } +}; + +module.getX(); // 81 + +var retrieveX = module.getX; +retrieveX(); +// 返回 9 - 因为函数是在全局作用域中调用的 + +// 创建一个新函数，把 'this' 绑定到 module 对象 +// 新手可能会将全局变量 x 与 module 的属性 x 混淆 +var boundGetX = retrieveX.bind(module); +boundGetX(); // 81 +</pre> + +<h3 id="偏函数">偏函数</h3> + +<p><code>bind()</code> 的另一个最简单的用法是使一个函数拥有预设的初始参数。只要将这些参数（如果有的话）作为 <code>bind()</code> 的参数写在 <code>this</code> 后面。当绑定函数被调用时，这些参数会被插入到目标函数的参数列表的开始位置，传递给绑定函数的参数会跟在它们后面。</p> + +<pre class="brush: js notranslate">function list() { + return Array.prototype.slice.call(arguments); +} + +function addArguments(arg1, arg2) { + return arg1 + arg2 +} + +var list1 = list(1, 2, 3); // [1, 2, 3] + +var result1 = addArguments(1, 2); // 3 + +// 创建一个函数，它拥有预设参数列表。 +var leadingThirtysevenList = list.bind(null, 37); + +// 创建一个函数，它拥有预设的第一个参数 +var addThirtySeven = addArguments.bind(null, 37); + +var list2 = leadingThirtysevenList(); +// [37] + +var list3 = leadingThirtysevenList(1, 2, 3); +// [37, 1, 2, 3] + +var result2 = addThirtySeven(5); +// 37 + 5 = 42 + +var result3 = addThirtySeven(5, 10); +// 37 + 5 = 42 ，第二个参数被忽略 +</pre> + +<h3 id="配合_setTimeout">配合 <code>setTimeout</code></h3> + +<p>在默认情况下，使用 {{ domxref("window.setTimeout()") }} 时，<code>this</code> 关键字会指向 {{ domxref("window") }} （或 <code>global</code>）对象。当类的方法中需要 <code>this</code> 指向类的实例时，你可能需要显式地把 <code>this</code> 绑定到回调函数，就不会丢失该实例的引用。</p> + +<pre class="brush: js notranslate"><code>function LateBloomer() { + this.petalCount = Math.ceil(Math.random() * 12) + 1; +} + +// 在 1 秒钟后声明 bloom +LateBloomer.prototype.bloom = function() { + window.setTimeout(this.declare.bind(this), 1000); +}; + +LateBloomer.prototype.declare = function() { + console.log('I am a beautiful flower with ' + + this.petalCount + ' petals!'); +}; + +var flower = new LateBloomer(); +flower.bloom(); // 一秒钟后, 调用 'declare' 方法</code></pre> + +<h3 id="作为构造函数使用的绑定函数">作为构造函数使用的绑定函数</h3> + +<div class="warning"> +<p><strong>警告</strong> :这部分演示了 JavaScript 的能力并且记录了 <code>bind()</code> 的超前用法。以下展示的方法并不是最佳的解决方案，且可能不应该用在任何生产环境中。</p> +</div> + +<p>绑定函数自动适应于使用 {{jsxref("Operators/new", "new")}} 操作符去构造一个由目标函数创建的新实例。当一个绑定函数是用来构建一个值的，原来提供的 <code>this</code> 就会被忽略。不过提供的参数列表仍然会插入到构造函数调用时的参数列表之前。</p> + +<pre class="brush: js notranslate">function Point(x, y) { + this.x = x; + this.y = y; +} + +Point.prototype.toString = function() { + return this.x + ',' + this.y; +}; + +var p = new Point(1, 2); +p.toString(); // '1,2' + +var emptyObj = {}; +var YAxisPoint = Point.bind(emptyObj, 0/*x*/); + +// 本页下方的 polyfill 不支持运行这行代码， +// 但使用原生的 bind 方法运行是没问题的： + +var YAxisPoint = Point.bind(null, 0/*x*/); + +/*（译注：polyfill 的 bind 方法中，如果把 bind 的第一个参数加上， +即对新绑定的 this 执行 Object(this)，包装为对象， +因为 Object(null) 是 {}，所以也可以支持）*/ + +var axisPoint = new YAxisPoint(5); +axisPoint.toString(); // '0,5' + +axisPoint instanceof Point; // true +axisPoint instanceof YAxisPoint; // true +new YAxisPoint(17, 42) instanceof Point; // true</pre> + +<p>请注意，你不需要做特别的处理就可以用 {{jsxref("Operators/new", "new")}} 操作符创建一个绑定函数。也就是说，你不需要做特别处理就可以创建一个可以被直接调用的绑定函数，即使你更希望绑定函数是用 {{jsxref("Operators/new", "new")}} 操作符来调用。</p> + +<pre class="brush: js notranslate">// ...接着上面的代码继续的话， +// 这个例子可以直接在你的 JavaScript 控制台运行 + +// 仍然能作为一个普通函数来调用 +// （即使通常来说这个不是被期望发生的） +YAxisPoint(13); + +emptyObj.x + ',' + emptyObj.y; // '0,13' +</pre> + +<p>如果你希望一个绑定函数要么只能用 {{jsxref("Operators/new", "new")}} 操作符，要么只能直接调用，那你必须在目标函数上显式规定这个限制。</p> + +<h3 id="快捷调用">快捷调用</h3> + +<p>在你想要为一个需要特定的 <strong><code>this</code></strong> 值的函数创建一个捷径（shortcut）的时候，<code>bind()</code> 也很好用。</p> + +<p>你可以用 {{jsxref("Array.prototype.slice")}} 来将一个类似于数组的对象（array-like object）转换成一个真正的数组，就拿它来举例子吧。你可以简单地这样写：</p> + +<pre class="brush: js notranslate">var slice = Array.prototype.slice; + +// ... + +slice.apply(arguments);</pre> + +<p>用 <code>bind()</code>可以使这个过程变得简单。在下面这段代码里面，<code>slice</code> 是 {{jsxref("Function.prototype")}} 的 {{jsxref("Function.prototype.apply()", "apply()")}} 方法的绑定函数，并且将 {{jsxref("Array.prototype")}} 的 {{jsxref("Array.prototype.slice()", "slice()")}} 方法作为 <strong><code>this</code></strong> 的值。这意味着我们压根儿用不着上面那个 <code>apply()</code>调用了。</p> + +<pre class="brush: js notranslate">// 与前一段代码的 "slice" 效果相同 +var unboundSlice = Array.prototype.slice; +var slice = Function.prototype.apply.bind(unboundSlice); + +// ... + +slice(arguments);</pre> + +<h2 id="Polyfill">Polyfill</h2> + +<p>有两种实现<code>bind</code>的方法，下面第一种不支持使用<code>new</code>调用新创建的构造函数，而第二种支持。</p> + +<pre class="brush: js line-numbers language-js notranslate"><code class="language-js"><span class="comment token">// Does not work with `new (funcA.bind(thisArg, args))`</span> +<span class="keyword token">if</span> <span class="punctuation token">(</span><span class="operator token">!</span><span class="class-name token">Function</span><span class="punctuation token">.</span>prototype<span class="punctuation token">.</span>bind<span class="punctuation token">)</span> <span class="punctuation token">(</span><span class="keyword token">function</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">{</span> + <span class="keyword token">var</span> slice <span class="operator token">=</span> <span class="class-name token">Array</span><span class="punctuation token">.</span>prototype<span class="punctuation token">.</span>slice<span class="punctuation token">;</span> + <span class="class-name token">Function</span><span class="punctuation token">.</span>prototype<span class="punctuation token">.</span><span class="function function-variable token">bind</span> <span class="operator token">=</span> <span class="keyword token">function</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span> + <span class="keyword token">var</span> thatFunc <span class="operator token">=</span> <span class="keyword token">this</span><span class="punctuation token">,</span> thatArg <span class="operator token">=</span> arguments<span class="punctuation token">[</span><span class="number token">0</span><span class="punctuation token">]</span><span class="punctuation token">;</span> + <span class="keyword token">var</span> args <span class="operator token">=</span> <span class="function token">slice</span><span class="punctuation token">.</span><span class="function token">call</span><span class="punctuation token">(</span>arguments<span class="punctuation token">,</span> <span class="number token">1</span><span class="punctuation token">)</span><span class="punctuation token">;</span> + <span class="keyword token">if</span> <span class="punctuation token">(</span><span class="keyword token">typeof</span> thatFunc <span class="operator token">!==</span> <span class="string token">'function'</span><span class="punctuation token">)</span> <span class="punctuation token">{</span> + <span class="comment token">// closest thing possible to the ECMAScript 5</span> + <span class="comment token">// internal IsCallable function</span> + <span class="keyword token">throw</span> <span class="keyword token">new</span> <span class="class-name token">TypeError</span><span class="punctuation token">(</span><span class="string token">'Function.prototype.bind - '</span> <span class="operator token">+</span> + <span class="string token">'what is trying to be bound is not callable'</span><span class="punctuation token">)</span><span class="punctuation token">;</span> + <span class="punctuation token">}</span> + <span class="keyword token">return</span> <span class="keyword token">function</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">{</span> + <span class="keyword token">var</span> funcArgs <span class="operator token">=</span> args<span class="punctuation token">.</span><span class="function token">concat</span><span class="punctuation token">(</span><span class="function token">slice</span><span class="punctuation token">.</span><span class="function token">call</span><span class="punctuation token">(</span>arguments<span class="punctuation token">)</span><span class="punctuation token">)</span> + <span class="keyword token">return</span> <span class="function token">thatFunc</span><span class="punctuation token">.</span><span class="function token">apply</span><span class="punctuation token">(</span>thatArg<span class="punctuation token">,</span> funcArgs<span class="punctuation token">)</span><span class="punctuation token">;</span> + <span class="punctuation token">}</span><span class="punctuation token">;</span> + <span class="punctuation token">}</span><span class="punctuation token">;</span> +<span class="punctuation token">}</span><span class="punctuation token">)</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre> + +<p>你可以将这段代码插入到你的脚本开头，从而使你的 <code>bind()</code> 在没有内置实现支持的环境中也可以部分地使用<code>bind</code>。</p> + +<pre class="brush: js notranslate">// Yes, it does work with `new (funcA.bind(thisArg, args))` +if (!Function.prototype.bind) (function(){ + var ArrayPrototypeSlice = Array.prototype.slice; + Function.prototype.bind = function(otherThis) { + if (typeof this !== 'function') { + // closest thing possible to the ECMAScript 5 + // internal IsCallable function + throw new TypeError('Function.prototype.bind - what is trying to be bound is not callable'); + } + + var baseArgs= ArrayPrototypeSlice.call(arguments, 1), + baseArgsLength = baseArgs.length, + fToBind = this, + fNOP = function() {}, + fBound = function() { + baseArgs.length = baseArgsLength; // reset to default base arguments + baseArgs.push.apply(baseArgs, arguments); + return fToBind.apply( + fNOP.prototype.isPrototypeOf(this) ? this : otherThis, baseArgs + ); + }; + + if (this.prototype) { + // Function.prototype doesn't have a prototype property + fNOP.prototype = this.prototype; + } + fBound.prototype = new fNOP(); + + return fBound; + }; +})();</pre> + +<p>上述算法和实际的实现算法还有许多其他的不同 （尽管可能还有其他不同之处，但已经没有必要再多列举）：</p> + +<ul> + <li>这部分实现依赖于 {{jsxref("Array.prototype.slice()")}}， {{jsxref("Array.prototype.concat()")}}， {{jsxref("Function.prototype.apply()")}} 这些原生方法。</li> + <li>这部分实现创建的函数并没有 {{jsxref("Function.caller", "caller")}} 以及会在 get，set 或者 deletion 上抛出 {{jsxref("Global_Objects/TypeError", "TypeError")}}错误的 arguments 属性这两个不可改变的“毒药” 。（假如环境支持{{jsxref("Object.defineProperty()")}}， 或者实现支持{{jsxref("Object.defineGetter", "__defineGetter__")}} 和 {{jsxref("Object.defineSetter", "__defineSetter__")}} 扩展）</li> + <li>这部分实现创建的函数有 <code>prototype</code> 属性。（正确的绑定函数没有）</li> + <li>这部分实现创建的绑定函数所有的 length 属性并不是同ECMA-262标准一致的：它创建的函数的 length 是0，而在实际的实现中根据目标函数的 length 和预先指定的参数个数可能会返回非零的 length。</li> +</ul> + +<p>如果你选择使用这部分实现，<strong>你不能依赖于那些与 ECMA-262, 5th edition 规定的行为偏离的例子。</strong>在 <code>bind()</code> 函数被广泛支持之前，某些情况下（或者为了兼容某些特定需求对其做一些特定修改后）可以选择用这个实现作为过渡。</p> + +<p>请访问 <a href="https://github.com/Raynos/function-bind">https://github.com/Raynos/function-bind</a> 以查找更完整的解决方案！</p> + +<h2 id="规范" style="margin-bottom: 20px; line-height: 30px; font-size: 2.14285714285714rem;">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范</th> + <th scope="col">状态</th> + <th scope="col">备注</th> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.3.4.5', 'Function.prototype.bind')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td>初始定义。在 JavaScript 1.8.5 中实现。</td> + </tr> + <tr> + <td>{{SpecName('ES2015', '#sec-function.prototype.bind', 'Function.prototype.bind')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-function.prototype.bind', 'Function.prototype.bind')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.Function.bind")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Function.prototype.apply()")}}</li> + <li>{{jsxref("Function.prototype.call()")}}</li> + <li>{{jsxref("Functions", "函数")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/function/call/index.html b/files/zh-cn/web/javascript/reference/global_objects/function/call/index.html new file mode 100644 index 0000000000..5b9fc87b48 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/function/call/index.html @@ -0,0 +1,174 @@ +--- +title: Function.prototype.call() +slug: Web/JavaScript/Reference/Global_Objects/Function/call +tags: + - JavaScript + - 函数 + - 方法 +translation_of: Web/JavaScript/Reference/Global_Objects/Function/call +--- +<div>{{JSRef}}</div> + +<p><code><strong>call()</strong></code> 方法使用一个指定的 <code>this</code> 值和单独给出的一个或多个参数来调用一个函数。</p> + +<div class="note"><strong>注意：</strong>该方法的语法和作用与 {{jsxref("Function.apply", "apply()")}} 方法类似，只有一个区别，就是 <code>call()</code> 方法接受的是<strong>一个参数列表</strong>，而 <code>apply()</code> 方法接受的是<strong>一个包含多个参数的数组</strong>。</div> + +<div>{{EmbedInteractiveExample("pages/js/function-call.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><em>function</em>.call(<em>thisArg</em>, <em>arg1</em>, <em>arg2</em>, ...)</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>thisArg</code></dt> + <dd>可选的。在 <em><code>function</code></em> 函数运行时使用的 <code>this</code> 值。请注意，<code>this</code>可能不是该方法看到的实际值：如果这个函数处于<a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Strict_mode" title="如果你想改变你的代码，让其工作在具有限制性JavaScript环境中，请参阅转换成严格模式。">非严格模式</a>下，则指定为 <code>null</code> 或 <code>undefined</code> 时会自动替换为指向全局对象，原始值会被包装。</dd> + <dt><code>arg1, arg2, ...</code></dt> + <dd>指定的参数列表。</dd> +</dl> + +<h2 id="返回值">返回值</h2> + +<p>使用调用者提供的 <code>this</code> 值和参数调用该函数的返回值。若该方法没有返回值，则返回 <code>undefined</code>。</p> + +<h2 id="描述">描述</h2> + +<p><code>call()</code> 允许为不同的对象分配和调用属于一个对象的函数/方法。</p> + +<p><code>call()</code> 提供新的 <strong>this </strong>值给当前调用的函数/方法。你可以使用 <code>call</code> 来实现继承：写一个方法，然后让另外一个新的对象来继承它（而不是在新对象中再写一次这个方法）。</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用_call_方法调用父构造函数">使用 <code>call</code> 方法调用父构造函数</h3> + +<p>在一个子构造函数中，你可以通过调用父构造函数的 <code>call</code> 方法来实现继承，类似于 <code>Java</code> 中的写法。下例中，使用 <code>Food</code> 和 <code>Toy </code>构造函数创建的对象实例都会拥有在 <code>Product</code> 构造函数中添加的 <code>name</code> 属性和 <code>price</code> 属性,但 <code>category</code> 属性是在各自的构造函数中定义的。</p> + +<pre class="brush: js">function Product(name, price) { + this.name = name; + this.price = price; +} + +function Food(name, price) { + Product.call(this, name, price); + this.category = 'food'; +} + +function Toy(name, price) { + Product.call(this, name, price); + this.category = 'toy'; +} + +var cheese = new Food('feta', 5); +var fun = new Toy('robot', 40); +</pre> + +<h3 id="使用_call_方法调用匿名函数">使用 <code>call</code> 方法调用匿名函数</h3> + +<p>在下例中的 <code>for</code> 循环体内，我们创建了一个匿名函数，然后通过调用该函数的 <code>call</code> 方法，将每个数组元素作为指定的 <code>this</code> 值执行了那个匿名函数。这个匿名函数的主要目的是给每个数组元素对象添加一个 <code>print</code> 方法，这个 <code>print</code> 方法可以打印出各元素在数组中的正确索引号。当然，这里不是必须得让数组元素作为 <code>this</code> 值传入那个匿名函数（普通参数就可以），目的是为了演示 <code>call</code> 的用法。</p> + +<pre class="brush: js">var animals = [ + { species: 'Lion', name: 'King' }, + { species: 'Whale', name: 'Fail' } +]; + +for (var i = 0; i < animals.length; i++) { + (function(i) { + this.print = function() { + console.log('#' + i + ' ' + this.species + + ': ' + this.name); + } + this.print(); + }).call(animals[i], i); +} +</pre> + +<h3 id="使用_call_方法调用函数并且指定上下文的_this">使用 <code>call</code> 方法调用函数并且指定上下文的 '<code>this</code>'</h3> + +<p>在下面的例子中，当调用 <code>greet</code> 方法的时候，该方法的<code>this</code>值会绑定到 <code>obj</code> 对象。</p> + +<pre class="brush: js">function greet() { + var reply = [this.animal, 'typically sleep between', this.sleepDuration].join(' '); + console.log(reply); +} + +var obj = { + animal: 'cats', sleepDuration: '12 and 16 hours' +}; + +greet.call(obj); // cats typically sleep between 12 and 16 hours +</pre> + +<h3 id="使用_call_方法调用函数并且不指定第一个参数（argument）" style="margin-bottom: 20px; line-height: 30px;">使用 <code><strong>call</strong></code> 方法调用函数并且不指定第一个参数（<code>argument</code>）</h3> + +<p>在下面的例子中，我们调用了 <code>display</code> 方法，但并没有传递它的第一个参数。如果没有传递第一个参数，<code>this</code> 的值将会被绑定为全局对象。</p> + +<pre class="brush: js">var sData = 'Wisen'; + +function display() { + console.log('sData value is %s ', this.sData); +} + +display.call(); // sData value is Wisen</pre> + +<div class="note"> +<p><strong>注意：</strong>在严格模式下，<code>this</code> 的值将会是 <code>undefined</code>。见下文。</p> +</div> + +<pre class="brush: js">'use strict'; + +var sData = 'Wisen'; + +function display() { + console.log('sData value is %s ', this.sData); +} + +display.call(); // Cannot read the property of 'sData' of undefined</pre> + +<h2 id="规范" style="margin-bottom: 20px; line-height: 30px;">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范版本</th> + <th scope="col">状态</th> + <th scope="col">说明</th> + </tr> + <tr> + <td>{{SpecName('ES1')}}</td> + <td>{{Spec2('ES1')}}</td> + <td>初始定义。在 JavaScript 1.3 中实现。</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.3.4.4', 'Function.prototype.call')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-function.prototype.call', 'Function.prototype.call')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-function.prototype.call', 'Function.prototype.call')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.Function.call")}}</p> + +<h2 id="See_also" name="See_also" style="margin-bottom: 20px; line-height: 30px;">相关链接</h2> + +<ul> + <li>{{jsxref("Function.prototype.bind()")}}</li> + <li>{{jsxref("Function.prototype.apply()")}}</li> + <li><a href="/zh-CN/docs/Web/JavaScript/Introduction_to_Object-Oriented_JavaScript">JavaScript 面向对象入门</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/function/caller/index.html b/files/zh-cn/web/javascript/reference/global_objects/function/caller/index.html new file mode 100644 index 0000000000..a850d41582 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/function/caller/index.html @@ -0,0 +1,69 @@ +--- +title: Function.caller +slug: Web/JavaScript/Reference/Global_Objects/Function/caller +translation_of: Web/JavaScript/Reference/Global_Objects/Function/caller +--- +<div>{{JSRef("Global_Objects", "Function")}} {{non-standard_header}}</div> + +<h2 id="Summary" name="Summary">概述</h2> + +<p>返回调用指定函数的函数.</p> + +<p>该属性不是ECMA-262第3版标准的一部分.不过, <a href="/zh-cn/SpiderMonkey" title="zh-cn/SpiderMonkey">SpiderMonkey</a> (Mozilla的JavaScript引擎) (查看{{ Bug("65683") }}), V8 (Chrome的JavaScript引擎) 和 JScript(IE的ECMAScript实现)都已经支持了它.</p> + +<h2 id="Description" name="Description">描述</h2> + +<p>如果一个函数<code>f</code>是在全局作用域内被调用的,则<code>f.caller为</code><code>null</code>,相反,如果一个函数是在另外一个函数作用域内被调用的,则<code>f.caller指向调用它的那个函数.</code></p> + +<p>该属性的常用形式<code>arguments.callee.caller</code>替代了被废弃的 <a href="/zh-cn/JavaScript/Reference/Functions_and_function_scope/arguments/caller" title="zh-cn/JavaScript/Reference/Functions_and_function_scope/arguments/caller">arguments.caller</a>.</p> + +<h3 id="Notes" name="Notes">备注</h3> + +<p>注意,在使用递归调用时, 你不能使用此属性来重现出调用栈.请考虑以下代码:</p> + +<pre class="brush: js">function f(n) { g(n-1) } +function g(n) { if(n>0) f(n); else stop() } +f(2) +</pre> + +<p>当<code>stop()函数被调用时,调用栈是这样的</code>:</p> + +<pre class="brush: js">f(2) -> g(1) -> f(1) -> g(0) -> stop() +</pre> + +<p>由于下面的表达式为 true(只保留函数最后一次被调用时的caller):</p> + +<pre class="brush: js">stop.caller === g && f.caller === g && g.caller === f +</pre> + +<p>所以如果你尝试在<code>stop()</code>函数中获取调用栈的话:</p> + +<pre class="brush: js">var f = stop; +var stack = "调用栈:"; +while (f) { + stack += "\n" + f.name; + f = f.caller; +} +</pre> + +<p>则上面的代码会进入一个死循环.</p> + +<p>有一个特殊属性 <code>__caller__</code>, 可以返回调用当前函数的函数的活动对象(可以用来重现出整个调用栈), 但由于安全原因的考虑,该属性已被删除.</p> + +<h2 id="Examples" name="Examples">例子</h2> + +<h3 id="Example:_Checking_the_value_of_a_function.27s_caller_property" name="Example:_Checking_the_value_of_a_function.27s_caller_property">例子: 检测一个函数的<code>caller</code>属性的值</h3> + +<p>下例用来得出一个函数是被谁调用的<code>.</code></p> + +<pre class="brush: js">function myFunc() { + if (myFunc.caller == null) { + return ("<span><span class="string">该函数在全局作用域内被调用</span></span>!"); + } else + return ("调用我的是函数是" + myFunc.caller); +} +</pre> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>Function.caller目前被所有主流浏览器支持: Firefox, Safari, Chrome, Opera 和 IE. <a class="external" href="http://dl.dropbox.com/u/534786/callertest.html" title="http://dl.dropbox.com/u/534786/callertest.html"><span style="text-decoration: underline;">查看检测结果</span></a>.</p> diff --git a/files/zh-cn/web/javascript/reference/global_objects/function/displayname/index.html b/files/zh-cn/web/javascript/reference/global_objects/function/displayname/index.html new file mode 100644 index 0000000000..abf8452f93 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/function/displayname/index.html @@ -0,0 +1,121 @@ +--- +title: Function.displayName +slug: Web/JavaScript/Reference/Global_Objects/Function/displayName +translation_of: Web/JavaScript/Reference/Global_Objects/Function/displayName +--- +<div>{{JSRef}} {{non-standard_header}}</div> + +<p><strong><code>function.displayName</code></strong> 属性获取函数的显示名称</p> + +<h2 id="Description_描述">Description 描述</h2> + +<p>当一个函数的 <code>displayName</code> 属性被定义，这个函数的 <code>displayName</code> 属性将返回显示名称。</p> + +<pre class="brush: js">function doSomething() {} + +console.log(doSomething.displayName); // "undefined" + +var popup = function(content) { console.log(content); }; + +popup.displayName = 'Show Popup'; + +console.log(popup.displayName); // "Show Popup" +</pre> + +<p>可以在函数表达式重定义函数的显示名称{{jsxref("Functions", "function expression", "", 1)}}:</p> + +<pre class="brush: js">var object = { + someMethod: function() {} +}; + +object.someMethod.displayName = 'someMethod'; + +console.log(object.someMethod.displayName); // logs "someMethod" + +try { someMethod } catch(e) { console.log(e); } +// ReferenceError: someMethod is not defined +</pre> + +<p>可以动态修改函数的显示名称：</p> + +<pre class="brush: js">var object = { + // anonymous + someMethod: function(value) { + arguments.callee.displayName = 'someMethod (' + value + ')'; + } +}; + +console.log(object.someMethod.displayName); // "undefined" + +object.someMethod('123') +console.log(object.someMethod.displayName); // "someMethod (123)" +</pre> + +<h2 id="Examples_例子">Examples 例子</h2> + +<p>这个显示名称通常在控制台和配置文件中，用它来提醒对它背后的真实函数名 {{jsxref("Function.name", "func.name")}}的引用。例如：</p> + +<p>通过如下的举例，显示的名称应该显示像"function My Function()"</p> + +<pre class="brush: js">var a = function() {}; +a.displayName = 'My Function'; + +a; // "function My Function()"</pre> + +<h2 id="Specifications_规范">Specifications 规范</h2> + +<p>不属于任何规范</p> + +<h2 id="Browser_compatibility_浏览器兼容性">Browser compatibility 浏览器兼容性</h2> + +<p>如果你愿意贡献数据，请访问<a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>并同时给我们发送推送请求。</p> + +<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(13)}}</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>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + </tr> + </tbody> +</table> +</div> diff --git a/files/zh-cn/web/javascript/reference/global_objects/function/index.html b/files/zh-cn/web/javascript/reference/global_objects/function/index.html new file mode 100644 index 0000000000..217ac78e3d --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/function/index.html @@ -0,0 +1,156 @@ +--- +title: Function +slug: Web/JavaScript/Reference/Global_Objects/Function +tags: + - Constructor + - Function + - JavaScript + - 函数 + - 构造器 +translation_of: Web/JavaScript/Reference/Global_Objects/Function +--- +<div>{{JSRef}}</div> + +<div>每个 JavaScript 函数实际上都是一个 <code>Function</code> 对象。运行 <code>(function(){}).constructor === Function // true</code> 便可以得到这个结论。</div> + +<h2 id="构造函数">构造函数</h2> + +<p><strong><code>Function</code> 构造函数</strong>创建一个新的 <code>Function</code> <strong>对象</strong>。直接调用此构造函数可用动态创建函数，但会遇到和 {{jsxref("eval")}} 类似的的安全问题和(相对较小的)性能问题。然而，与 <code>eval</code> 不同的是，<code>Function</code> 创建的函数只能在全局作用域中运行。</p> + +<div>{{EmbedInteractiveExample("pages/js/function-constructor.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code>new Function ([<var>arg1</var>[, <var>arg2</var>[, ...<var>argN</var>]],] <var>functionBody</var>)</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>arg1, arg2, ... arg<em>N</em></code></dt> + <dd>被函数使用的参数的名称必须是合法命名的。参数名称是一个有效的JavaScript标识符的字符串，或者一个用逗号分隔的有效字符串的列表;例如“<code>×</code>”，“<code>theValue</code>”，或“<code>a,b</code>”。</dd> + <dt><code>functionBody</code></dt> + <dd>一个含有包括函数定义的 JavaScript 语句的<strong>字符串</strong>。</dd> +</dl> + +<h2 id="描述">描述</h2> + +<p>使用 <code>Function</code> 构造器生成的 <code>Function</code> 对象是在函数创建时解析的。这比你使用<a href="/zh-CN/docs/Web/JavaScript/Reference/Operators/function">函数声明</a>或者<a href="/zh-CN/docs/Web/JavaScript/Reference/Operators/function">函数表达式</a>并在你的代码中调用更为低效，因为使用后者创建的函数是跟其他代码一起解析的。</p> + +<p>所有被传递到构造函数中的参数，都将被视为将被创建的函数的参数，并且是相同的标示符名称和传递顺序。<a href="/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/eval"><span style="display: none;"> </span></a></p> + +<p>以调用函数的方式调用 <code>Function</code> 的构造函数（而不是使用 <code>new</code> 关键字) 跟以构造函数来调用是一样的。</p> + +<h2 id="属性和方法">属性和方法</h2> + +<p>全局的 <code>Function</code> 对象没有自己的属性和方法，但是，因为它本身也是一个函数，所以它也会通过原型链从自己的原型链 {{jsxref("Function.prototype")}} 上继承一些属性和方法。</p> + +<h2 id="原型对象">原型对象</h2> + +<h3 id="属性">属性</h3> + +<div>{{page('/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Function/prototype', '属性')}}</div> + +<h3 id="方法">方法</h3> + +<div>{{page('/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Function/prototype', '方法')}}</div> + +<h2 id="实例">实例</h2> + +<p><code>Function</code> 实例从 {{jsxref("Function.prototype")}} 继承了一些属性和方法。 同其他构造函数一样， 你可以改变构造函数的原型从而使得所有的 <code>Function</code> 实例的属性和方法发生改变。</p> + +<h2 id="示例">示例</h2> + +<h3 id="传入参数调用_Function_构造函数">传入参数调用 Function 构造函数</h3> + +<p>下面的代码会创建一个需要两个参数的 <code>Function</code> 对象。</p> + +<pre class="brush: js">// 可以直接在 JavaScript 控制台中运行 + +// 创建了一个能返回两个参数和的函数 +const adder = new Function("a", "b", "return a + b"); + +// 调用函数 +adder(2, 6); +// > 8 +</pre> + +<p>参数 "<code>a</code>" 和 "<code>b</code>" 是参数的名字，在函数体中被使用，"<code>return a + b</code>"。</p> + +<h3 id="Function_构造器与函数声明之间的不同">Function 构造器与函数声明之间的不同</h3> + +<p>由 <code>Function</code> 构造器创建的函数不会创建当前环境的闭包，它们总是被创建于全局环境，因此在运行时它们只能访问全局变量和自己的局部变量，不能访问它们被 <code>Function</code> 构造器创建时所在的作用域的变量。这一点与使用 {{jsxref("eval")}} 执行创建函数的代码不同。</p> + +<pre class="brush: js">var x = 10; + +function createFunction1() { + var x = 20; + return new Function('return x;'); // 这里的 x 指向最上面全局作用域内的 x +} + +function createFunction2() { + var x = 20; + function f() { + return x; // 这里的 x 指向上方本地作用域内的 x + } + return f; +} + +var f1 = createFunction1(); +console.log(f1()); // 10 +var f2 = createFunction2(); +console.log(f2()); // 20 +</pre> + +<p>虽然这段代码可以在浏览器中正常运行，但在 Node.js 中 <code>f1()</code> 会产生一个“找不到变量 <code>x</code> ”的 <code>ReferenceError</code>。这是因为在 Node 中顶级作用域不是全局作用域，而 <code>x</code> 其实是在当前模块的作用域之中。</p> + +<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('ES1')}}</td> + <td>{{Spec2('ES1')}}</td> + <td>Initial definition. Implemented in JavaScript 1.0.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.3', 'Function')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-function-objects', 'Function')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-function-objects', 'Function')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.Function")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Functions", "函数与函数作用域")}}</li> + <li>{{jsxref("Statements/function", "函数声明")}}</li> + <li>{{jsxref("Operators/function", "函数表达式")}}</li> + <li>{{jsxref("Statements/function*", "function* 声明")}}</li> + <li>{{jsxref("Operators/function*", "function* 表达式")}}</li> + <li>{{jsxref("AsyncFunction")}}</li> + <li>{{jsxref("GeneratorFunction")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/function/isgenerator/index.html b/files/zh-cn/web/javascript/reference/global_objects/function/isgenerator/index.html new file mode 100644 index 0000000000..f377f0a210 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/function/isgenerator/index.html @@ -0,0 +1,40 @@ +--- +title: Function.prototype.isGenerator() +slug: Web/JavaScript/Reference/Global_Objects/Function/isGenerator +translation_of: Archive/Web/JavaScript/Function.isGenerator +--- +<div>{{JSRef("Global_Objects", "Function")}} {{non-standard_header}}</div> + +<h2 id="概述">概述</h2> + +<p>判断一个函数是否是一个<a href="/zh-cn/JavaScript/Guide/Iterators_and_Generators#Generators.3a_a_better_way_to_build_Iterators" title="zh-cn/Core JavaScript 1.5 Guide/Iterators and Generators#Generators.3a a better way to build Iterators">生成器</a>.</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><var>fun</var>.isGenerator()</code></pre> + +<h2 id="描述">描述</h2> + +<p>该方法用来判断一个函数是否是一个<a href="/zh-cn/JavaScript/Guide/Iterators_and_Generators#Generators.3a_a_better_way_to_build_Iterators" title="zh-cn/Core JavaScript 1.5 Guide/Iterators and Generators#Generators.3a a better way to build Iterators">生成器</a>.</p> + +<h2 id="例子">例子</h2> + +<pre class="brush: js">function f() {} +function* g() { + yield 42; +} +console.log("f.isGenerator() = " + f.isGenerator()); +console.log("g.isGenerator() = " + g.isGenerator()); +</pre> + +<p>上面代码的输出结果为</p> + +<pre>f.isGenerator() = false +g.isGenerator() = true +</pre> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li><a href="/zh-cn/JavaScript/Guide/Iterators_and_Generators" title="zh-cn/Core JavaScript 1.5 Guide/Iterators and Generators">迭代器和生成器</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/function/length/index.html b/files/zh-cn/web/javascript/reference/global_objects/function/length/index.html new file mode 100644 index 0000000000..9804d07a75 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/function/length/index.html @@ -0,0 +1,89 @@ +--- +title: Function.length +slug: Web/JavaScript/Reference/Global_Objects/Function/length +tags: + - Function + - JavaScript + - Property +translation_of: Web/JavaScript/Reference/Global_Objects/Function/length +--- +<div>{{JSRef}}</div> + +<p><code><strong>length</strong></code> 属性指明函数的形参个数。</p> + +<p>{{EmbedInteractiveExample("pages/js/function-length.html")}}</p> + +<div>{{js_property_attributes(0,0,1)}}</div> + +<h2 id="Description" name="Description">描述</h2> + +<p><code>length</code> 是函数对象的一个属性值，指该函数有多少个必须要传入的参数，即形参的个数。</p> + +<p>形参的数量不包括剩余参数个数，仅包括第一个具有默认值之前的参数个数。</p> + +<p>与之对比的是， {{jsxref("Functions_and_function_scope/arguments/length", "arguments.length")}} 是函数被调用时实际传参的个数。</p> + +<h3 id="Function_构造器的属性"><code>Function</code> 构造器的属性</h3> + +<p>{{jsxref("Function")}} 构造器本身也是个<a href="/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Function">Function</a>。他的 <code>length</code> 属性值为 1 。该属性 Writable: <code>false</code>, Enumerable: <code>false</code>, Configurable: <code>true</code>.</p> + +<h3 id="Function.prototype_对象的属性"><code>Function</code>.prototype 对象的属性</h3> + +<p> {{jsxref("Function.prototype")}} 对象的 length 属性值为 0 。</p> + +<h2 id="Examples" name="Examples">示例</h2> + +<pre class="brush: js">console.log(Function.length); /* 1 */ + +console.log((function() {}).length); /* 0 */ +console.log((function(a) {}).length); /* 1 */ +console.log((function(a, b) {}).length); /* 2 etc. */ + +console.log((function(...args) {}).length); +// 0, rest parameter is not counted + +console.log((function(a, b = 1, c) {}).length); +// 1, only parameters before the first one with +// a default value is counted</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('ES1')}}</td> + <td>{{Spec2('ES1')}}</td> + <td>Initial definition. Implemented in JavaScript 1.1.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.3.5.1', 'Function.length')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-function-instances-length', 'Function.length')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>The <code>configurable</code> attribute of this property is now <code>true</code>.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-function-instances-length', 'Function.length')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容">浏览器兼容</h2> + +<div>{{Compat("javascript.builtins.Function.length")}}</div> + +<h2 id="参见">参见</h2> + +<ul> + <li>{{jsxref("Function")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/function/name/index.html b/files/zh-cn/web/javascript/reference/global_objects/function/name/index.html new file mode 100644 index 0000000000..3c701acdca --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/function/name/index.html @@ -0,0 +1,219 @@ +--- +title: Function.name +slug: Web/JavaScript/Reference/Global_Objects/Function/name +tags: + - ECMAScript 2015 + - Function + - JavaScript + - Property +translation_of: Web/JavaScript/Reference/Global_Objects/Function/name +--- +<div>{{JSRef("Global_Objects", "Function")}}</div> + +<div><code><strong><em>function</em>.name</strong></code> 属性返回函数实例的名称。</div> + +<p>{{js_property_attributes(0,0,1)}}</p> + +<div class="note"> +<p>请注意，在非标准的ES2015之前的实现中，<code>configurable</code>属性也是<code>false</code> 。</p> +</div> + +<h2 id="示例">示例</h2> + +<h3 id="函数声明的名称">函数声明的名称</h3> + +<p> <code>name</code> 属性返回一个函数声明的名称。</p> + +<pre class="brush:js">function doSomething() { } +doSomething.name; // "doSomething" +</pre> + +<h3 id="构造函数的名称">构造函数的名称</h3> + +<p>使用<code>new Function(...)</code>语法创建的函数或只是 <code>Function(...) create</code> {{jsxref("Function")}}对象及其名称为“anonymous”。</p> + +<pre class="brush: js">(new Function).name; // "anonymous"</pre> + +<h3 id="推断函数名称">推断函数名称</h3> + +<p>变量和方法可以从句法位置推断匿名函数的名称（ECMAScript 2015中新增）。</p> + +<pre class="brush: js">var f = function() {}; +var object = { + someMethod: function() {} +}; + +console.log(f.name); // "f" +console.log(object.someMethod.name); // "someMethod"</pre> + +<p style="color: rgb(77, 78, 83);">你可以在 {{jsxref("Operators/Function", "函数表达式", "", 1)}}中定义函数的名称:</p> + +<pre class="brush:js">var object = { + someMethod: function object_someMethod() {} +}; + +console.log(object.someMethod.name); // "object_someMethod" + +try { object_someMethod } catch(e) { alert(e); } +// ReferenceError: object_someMethod is not defined +</pre> + +<p>你不能更改函数的名称，此属性是只读的：</p> + +<div class="hidden"> +<p>Example below contradicts with what is said at the beginning of this section and doesn't work as described.</p> +</div> + +<pre class="brush: js">var object = { + // anonymous + someMethod: function() {} +}; + +object.someMethod.name = 'otherMethod'; +console.log(object.someMethod.name); // someMethod</pre> + +<p>要更改它，可以使用{{jsxref("Object.defineProperty()")}}。</p> + +<h3 id="简写方法的名称">简写方法的名称</h3> + +<pre class="brush: js">var o = { + foo(){} +}; +o.foo.name; // "foo";</pre> + +<h3 id="绑定函数的名称">绑定函数的名称</h3> + +<p>{{jsxref("Function.bind()")}} 所创建的函数将会在函数的名称前加上"bound " 。</p> + +<pre class="brush: js">function foo() {}; +foo.bind({}).name; // "bound foo"</pre> + +<h3 id="getters_和_setters_的函数名">getters 和 setters 的函数名</h3> + +<p>当通过 <code><a href="/zh-CN/docs/Web/JavaScript/Reference/Functions/get">get</a></code> 和 <code><a href="/zh-CN/docs/Web/JavaScript/Reference/Functions/set">set</a></code> 访问器来存取属性时, "get" 或 "set" 会出现在函数名称前。</p> + +<pre class="brush: js">var o = { + get foo(){}, + set foo(x){} +}; + +var descriptor = Object.getOwnPropertyDescriptor(o, "foo"); +descriptor.get.name; // "get foo" +descriptor.set.name; // "set foo";</pre> + +<h3 id="类中的函数名称">类中的函数名称</h3> + +<p>你可以使用<code>obj.constructor.name</code>来检查对象的“类”（但请务必阅读以下警告）：</p> + +<pre class="brush: js">function Foo() {} // ES2015 Syntax: class Foo {} + +var fooInstance = new Foo(); +console.log(fooInstance.constructor.name); // logs "Foo"</pre> + +<div class="warning"> +<p><strong>警告：</strong>脚本解释器只有在函数没有名为name的属性时才会设置内置的<code>Function.name</code>属性（参见 <a href="https://www.ecma-international.org/ecma-262/6.0/#sec-setfunctionname">9.2.11 of the ECMAScript2015 Language Specification</a>）。但是，ES2015规定由关键字<em>static</em>修饰的静态方法也会被认为是类的属性（ECMAScript2015, <a href="https://www.ecma-international.org/ecma-262/6.0/#sec-runtime-semantics-classdefinitionevaluation">14.5.14.21.b</a> + <a href="https://www.ecma-international.org/ecma-262/6.0/#sec-object-initializer-runtime-semantics-propertydefinitionevaluation">12.2.6.9</a>）。</p> +</div> + +<p>因此，我们无法获取具有静态方法属性<code>name()</code>的几乎任何类的类名称：</p> + +<pre class="brush: js">class Foo { + constructor() {} + static name() {} +} +</pre> + +<p>使用<code>static name()</code>方法<code>Foo.name</code>不再保存实际的类名称，而是引用<code>name()</code>函数对象。 ES2015语法中的上述类定义将在Chrome或Firefox中运行，类似于ES5语法中的以下代码段：</p> + +<pre class="brush: js">function Foo() {} +Object.defineProperty(Foo, 'name', { writable: true }); +Foo.name = function() {}; +</pre> + +<p>通过<code>fooInstance.constructor.name</code>获取<code>fooInstance</code>类不会给我们所有的类名，而是静态类方法的引用。 例如：</p> + +<pre class="brush: js">var fooInstance = new Foo(); +console.log(fooInstance.constructor.name); // logs function name()</pre> + +<p>你也可以从ES5语法示例中看到，在Chrome或Firefox的中静态定义的<code>Foo.name</code>变得可写。内置定义在没有自定义静态定义时是只读的：</p> + +<pre class="brush: js">Foo.name = 'Hello'; +console.log(Foo.name); +//如果Foo具有静态name()属性，则输出“Hello”，否则为“Foo” +</pre> + +<p>因此，你不能依赖内置的<code>Function.name</code>属性来保持一个类的名称。</p> + +<h3 id="Symbol作为函数名称">Symbol作为函数名称</h3> + +<p>如果{{jsxref("Symbol")}} 被用于函数名称，并且这个symbol具有相应的描述符，那么方法的名字就是方括号中的描述符。</p> + +<pre class="brush: js">var sym1 = Symbol("foo"); +var sym2 = Symbol(); +var o = { + [sym1]: function(){}, + [sym2]: function(){} +}; + +o[sym1].name; // "[foo]" +o[sym2].name; // "" +</pre> + +<h2 id="JavaScript_压缩和_minifiers">JavaScript 压缩和 minifiers</h2> + +<div class="warning"> +<p><strong>警告：</strong>当使用<code>Function.name</code>和那些JavaScript压缩器（minifiers）或混淆器进行源码转换时要小心。这些工具通常用作JavaScript构建管道的一部分，以在程序部署到生产之前减少程序的大小。但这种转换通常会在构建时更改函数的名称。</p> +</div> + +<p>例如下面的代码:</p> + +<pre class="brush: js">function Foo() {}; +var foo = new Foo(); + +if (foo.constructor.name === 'Foo') { + console.log("'foo' is an instance of 'Foo'"); +} else { + console.log('Oops!'); +}</pre> + +<p>可能被压缩为:</p> + +<pre class="brush: js">function a() {}; +var b = new a(); +if (b.constructor.name === 'Foo') { + console.log("'foo' is an instance of 'Foo'"); +} else { + console.log('Oops!'); +} +</pre> + +<p>在未压缩版本中，程序运行到真实分支并打印<code>'foo' is an instance of 'Foo'</code>。 而在压缩版本中，它的行为不同，并且进入else分支。如果您依赖于<code>Function.name</code>，就像上面的示例一样，确保您的构建管道不会更改函数名称，也不要假定函数具有特定的名称。</p> + +<article> +<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-name', 'name')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-name', 'name')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div class="hidden">The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</div> + +<p>{{Compat("javascript.builtins.Function.name")}}</p> +</article> diff --git a/files/zh-cn/web/javascript/reference/global_objects/function/prototype/index.html b/files/zh-cn/web/javascript/reference/global_objects/function/prototype/index.html new file mode 100644 index 0000000000..afae311604 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/function/prototype/index.html @@ -0,0 +1,138 @@ +--- +title: Function.prototype +slug: Web/JavaScript/Reference/Global_Objects/Function/prototype +tags: + - JavaScript + - 函数 + - 原型 + - 原型属性 +translation_of: Web/JavaScript/Reference/Global_Objects/Function +--- +<div>{{JSRef}}</div> + +<p><code><strong>Function.prototype</strong></code> 属性存储了 {{jsxref("Function")}} 的原型对象。</p> + +<h2 id="Description" name="Description">描述</h2> + +<p>{{jsxref("Function")}}<code>对象继承自 Function.prototype 属性</code><code>。因此，Function.prototype</code> 不能被修改。</p> + +<h2 id="属性">属性</h2> + +<dl> + <dt>{{jsxref("Function.arguments")}} {{deprecated_inline()}}</dt> + <dd>以数组形式获取传入函数的所有参数。此属性已被{{jsxref("Functions_and_function_scope/arguments", "arguments")}}替代。</dd> + <dt><s class="obsoleteElement">{{jsxref("Function.arity")}} {{obsolete_inline() }}</s></dt> + <dd><s class="obsoleteElement">用于指定的函数的参数的个数，但已被删除。使用{{jsxref("Function.length","length")}}属性代替。</s></dd> + <dt>{{jsxref("Function.caller")}} {{ Non-standard_inline() }}</dt> + <dd>获取调用函数的具体对象。</dd> + <dt>{{jsxref("Function.length")}}</dt> + <dd>获取函数的接收参数个数。</dd> + <dt>{{jsxref("Function.name")}} {{ Non-standard_inline() }}</dt> + <dd>获取函数的名称。</dd> + <dt>{{jsxref("Function.displayName")}} {{ Non-standard_inline() }}</dt> + <dd>获取函数的display name。</dd> + <dt><code>Function.prototype.constructor</code></dt> + <dd>声明函数的原型构造方法，详细请参考 {{jsxref("Object.constructor")}} 。</dd> +</dl> + +<h2 id="方法">方法</h2> + +<dl> + <dt>{{jsxref("Function.prototype.apply()")}}</dt> + <dd>在一个对象的上下文中应用另一个对象的方法；参数能够以数组形式传入。</dd> + <dt>{{jsxref("Function.prototype.bind()")}}</dt> + <dd><span style="font-family: courier new,andale mono,monospace; line-height: 1.5;">bind()</span>方法会创建一个新函数,称为绑定函数.当调用这个绑定函数时,绑定函数会以创建它时传入 <span style="font-family: courier new,andale mono,monospace;">bind()</span>方法的第一个参数作为 <span style="font-family: courier new,andale mono,monospace;">this</span>,传入 <span style="font-family: courier new,andale mono,monospace;">bind()</span>方法的第二个以及以后的参数加上绑定函数运行时本身的参数按照顺序作为原函数的参数来调用原函数.</dd> + <dt>{{jsxref("Function.prototype.call()")}}</dt> + <dd>在一个对象的上下文中应用另一个对象的方法；参数能够以列表形式传入。</dd> + <dt>{{jsxref("Function.prototype.isGenerator()")}} {{ Non-standard_inline() }}</dt> + <dd><code>若函数对象为</code><a href="/zh-CN/docs/Web/JavaScript/Guide/Iterators_and_Generators">generator</a>，返回true，反之返回 <code>false</code>。</dd> + <dt>{{jsxref("Function.prototype.toSource()")}} {{ Non-standard_inline() }}</dt> + <dd>获取函数的实现源码的字符串。 覆盖了 {{jsxref("Object.prototype.toSource")}} 方法。</dd> + <dt>{{jsxref("Function.prototype.toString()")}}</dt> + <dd>获取函数的实现源码的字符串。覆盖了 {{jsxref("Object.prototype.toString")}} 方法。</dd> +</dl> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范</th> + <th scope="col">状态</th> + <th scope="col">说明</th> + </tr> + <tr> + <td>{{SpecName('ES1')}}</td> + <td>{{Spec2('ES1')}}</td> + <td>Initial definition.Implemented in JavaScript 1.1</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.3.5.2', 'Function.prototype')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-function-instances-prototype', 'Function.prototype')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{ CompatibilityTable() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="参考">参考</h2> + +<ul> + <li>{{jsxref("Function")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/function/tosource/index.html b/files/zh-cn/web/javascript/reference/global_objects/function/tosource/index.html new file mode 100644 index 0000000000..5c4de38138 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/function/tosource/index.html @@ -0,0 +1,49 @@ +--- +title: Function.prototype.toSource() +slug: Web/JavaScript/Reference/Global_Objects/Function/toSource +translation_of: Web/JavaScript/Reference/Global_Objects/Function/toSource +--- +<div> +<div>{{JSRef("Global_Objects", "Function")}} {{non-standard_header}}</div> +</div> + +<h2 id="Summary" name="Summary">概述</h2> + +<p>返回函数的源代码的字符串表示.</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code><var>function</var>.toSource(); +Function.toSource(); +</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<p>无</p> + +<h2 id="Description" name="Description">描述</h2> + +<p><code>toSource方法返回下面的值</code>:</p> + +<p></p> + +<ul> + <li>对于内置的<code>Function</code>对象,<code>toSource</code>返回下面的字符串:</li> +</ul> + +<pre class="brush: js"><code>function Function() { + [native code] +}</code></pre> + +<ul> + <li>对于自定义函数来说, <code>toSource返回能定义该函数</code>的Javascript源码.</li> +</ul> + +<p>该方法通常在引擎内部调用.你可以在调试的时候用该方法开查看一个函数的源代码.</p> + +<h2 id="See_Also" name="See_Also">相关链接</h2> + +<ul> + <li><a href="/zh-CN/docs/JavaScript/Reference/Global_Objects/Function/toString" title="JavaScript/Reference/Global_Objects/Function/toString">toString</a></li> + <li><a href="/zh-CN/docs/JavaScript/Reference/Global_Objects/Object/valueOf" title="JavaScript/Reference/Global_Objects/Object/valueOf">Object.prototype.valueOf</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/function/tostring/index.html b/files/zh-cn/web/javascript/reference/global_objects/function/tostring/index.html new file mode 100644 index 0000000000..01bf4d2ce7 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/function/tostring/index.html @@ -0,0 +1,230 @@ +--- +title: Function.prototype.toString() +slug: Web/JavaScript/Reference/Global_Objects/Function/toString +tags: + - Function + - JavaScript + - Method +translation_of: Web/JavaScript/Reference/Global_Objects/Function/toString +--- +<div>{{JSRef}}</div> + +<p><strong><code>toString()</code> </strong>方法返回一个表示当前函数源代码的字符串。</p> + +<div>{{EmbedInteractiveExample("pages/js/function-tostring.html")}}</div> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code><var>function</var>.toString()</code></pre> + +<h3 id="返回值">返回值</h3> + +<p>表示函数源代码的一个字符串</p> + +<h2 id="Description" name="Description">描述</h2> + +<p>{{jsxref("Function")}}对象覆盖了从{{jsxref("Object")}}继承来的{{jsxref("Object.prototype.toString", "toString")}} 方法。对于用户定义的 {{jsxref("Function")}} 对象，<code>toString</code>方法返回一个字符串，其中包含用于定义函数的源文本段。</p> + +<p>在{{jsxref("Function")}}需要转换为字符串时，通常会自动调用函数的 <code>toString </code>方法。</p> + +<p>若 <code>this</code> 不是 <code>Function </code>对象，则 <code>toString()</code> 方法将抛出 {{jsxref("TypeError")}} ("Function.prototype.toString called on incompatible object") 异常，比如 {{jsxref("Proxy")}} 对象就会抛出异常。</p> + +<pre class="brush: js example-bad">Function.prototype.toString.call('foo'); // TypeError +</pre> + +<p>如果是在内置函数或由 <code>Function.prototype.bind </code>返回的函数上调用 <code>toString()</code>，则<code>toString()</code> 返回原生代码字符串，如下</p> + +<pre class="brush: js">"function () {\n [native code]\n}" +</pre> + +<p>若是在由 <code>Function</code> 构造器生成的函数上调用 <code>toString()</code> ，则 <code>toString()</code> 返回创建后的函数源码，包括形参和函数体，函数名为 "anonymous"。</p> + +<h2 id="示例">示例</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Function</th> + <th scope="col">Function.prototype.toString result</th> + </tr> + </thead> + <tbody> + <tr> + <td> + <pre> +function f(){}</pre> + </td> + <td> + <pre> +"function f(){}"</pre> + </td> + </tr> + <tr> + <td> + <pre> +class A { a(){} }</pre> + </td> + <td> + <pre> +"class A { a(){} }"</pre> + </td> + </tr> + <tr> + <td> + <pre> +function* g(){}</pre> + </td> + <td> + <pre> +"function* g(){}"</pre> + </td> + </tr> + <tr> + <td> + <pre> +a => a</pre> + </td> + <td> + <pre> +"a => a"</pre> + </td> + </tr> + <tr> + <td> + <pre> +({ a(){} }.a)</pre> + </td> + <td> + <pre> +"a(){}"</pre> + </td> + </tr> + <tr> + <td> + <pre> +({ *a(){} }.a)</pre> + </td> + <td> + <pre> +"*a(){}"</pre> + </td> + </tr> + <tr> + <td> + <pre> +({ [0](){} }[0])</pre> + </td> + <td> + <pre> +"[0](){}"</pre> + </td> + </tr> + <tr> + <td> + <pre> +Object.getOwnPropertyDescriptor({ + get a(){} +}, "a").get</pre> + </td> + <td> + <pre> +"get a(){}"</pre> + </td> + </tr> + <tr> + <td> + <pre> +Object.getOwnPropertyDescriptor({ + set a(x){} +}, "a").set</pre> + </td> + <td> + <pre> +"set a(x){}"</pre> + </td> + </tr> + <tr> + <td> + <pre> +Function.prototype.toString</pre> + </td> + <td> + <pre> +"function toString() { [native code] }"</pre> + </td> + </tr> + <tr> + <td> + <pre> +(function f(){}.bind(0))</pre> + </td> + <td> + <pre> +"function () { [native code] }"</pre> + </td> + </tr> + <tr> + <td> + <pre> +Function("a", "b")</pre> + </td> + <td> + <pre> +"function anonymous(a\n) {\nb\n}"</pre> + </td> + </tr> + </tbody> +</table> + +<h2 id="规范" style="margin-bottom: 20px; line-height: 30px;">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范版本</th> + <th scope="col">规范状态</th> + <th scope="col">注解</th> + </tr> + <tr> + <td>{{SpecName('ES1')}}</td> + <td>{{Spec2('ES1')}}</td> + <td>初始定义。在 JavaScript 1.1 中实现。</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-function.prototype.tostring', 'Function.prototype.toString')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>对字符串表示增加了更多的特定需求。</td> + </tr> + <tr> + <td><a href="http://tc39.github.io/Function-prototype-toString-revision/">Function.prototype.toString revision</a></td> + <td>Draft</td> + <td>对内置函数与行尾表示进行标准化。</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-function.prototype.tostring', 'Function.prototype.toString')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> + + +<p>{{Compat("javascript.builtins.Function.toString")}}</p> +</div> + +<h2 id="附注（针对Firefox）">附注（针对Firefox）</h2> + +<ul> + <li>从Firefox 17开始，<code>Function.prototype.toString()</code> 通过保存函数源码的方式来实现，而之前是通过反编译器反编译函数字节码的方式来实现。反编译器已经被移除，因此我们不再需要 <code>indentation</code> 参数。查看 {{bug("761723")}} 获得更多信息。</li> + <li>从Firefox 38开始，<code>Function.prototype.toString()</code> 会对 {{jsxref("Proxy")}} 对象抛出异常 ({{bug(1100936)}})。</li> +</ul> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("Object.prototype.toString()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/generator/index.html b/files/zh-cn/web/javascript/reference/global_objects/generator/index.html new file mode 100644 index 0000000000..612024ca88 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/generator/index.html @@ -0,0 +1,142 @@ +--- +title: Generator +slug: Web/JavaScript/Reference/Global_Objects/Generator +tags: + - ECMAScript 2015 + - Generator + - JavaScript + - Legacy Generator + - Legacy Iterator + - 参考 + - 生成器 +translation_of: Web/JavaScript/Reference/Global_Objects/Generator +--- +<div>{{JSRef}} </div> + +<p><strong>生成器</strong>对象是由一个 {{jsxref("Statements/function*", "generator function", "", 1)}} 返回的,并且它符合<a href="/zh-CN/docs/Web/JavaScript/Reference/Iteration_protocols#iterable">可迭代协议</a>和<a href="/zh-CN/docs/Web/JavaScript/Reference/Iteration_protocols#iterator">迭代器协议</a>。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">function* gen() { + yield 1; + yield 2; + yield 3; +} + +let g = gen(); +// "Generator { }"</pre> + +<h2 id="方法">方法</h2> + +<dl> + <dt>{{jsxref("Generator.prototype.next()")}}</dt> + <dd>返回一个由 {{jsxref("Operators/yield", "yield")}}表达式生成的值。</dd> + <dt>{{jsxref("Generator.prototype.return()")}}</dt> + <dd>返回给定的值并结束生成器。</dd> + <dt>{{jsxref("Generator.prototype.throw()")}}</dt> + <dd>向生成器抛出一个错误。</dd> +</dl> + +<h2 id="示例">示例</h2> + +<h3 id="一个无限迭代器">一个无限迭代器</h3> + +<pre class="brush: js">function* idMaker(){ + let index = 0; + while(true) + yield index++; +} + +let gen = idMaker(); // "Generator { }" + +console.log(gen.next().value); +// 0 +console.log(gen.next().value); +// 1 +console.log(gen.next().value); +// 2 +// ...</pre> + +<h2 id="传统的生成器对象">传统的生成器对象</h2> + +<p>Firefox (SpiderMonkey) 在 <a href="/en-US/docs/Web/JavaScript/New_in_JavaScript/1.7">JavaScript 1.7</a> 中也实现了一个较早版本的生成器，其中函数声明中的星号（*）不是必需的 (只需在函数体中使用<code style="font-style: normal;">yield</code> 关键字)。但是，旧式生成器已弃用。不要使用它们;他们将被删除 ({{bug(1083482)}})。</p> + +<h3 id="传统的生成器方法">传统的生成器方法</h3> + +<dl> + <dt><code>Generator.prototype.next() </code>{{non-standard_inline}}</dt> + <dd>返回 {{jsxref("Operators/yield", "yield")}} 表达式产生的值. 与ES2015 生成器对象的<span style="font-family: courier,andale mono,monospace;">next()方法对应</span>.</dd> + <dt><code>Generator.prototype.close()</code> {{non-standard_inline}}</dt> + <dd>关闭生成器，因此执行该函数后调用<code>next()函数时将会抛出</code> {{jsxref("StopIteration")}} 错误. 与ES2015 生成器对象的<span style="font-family: courier,andale mono,monospace;">return()方法对应</span>..</dd> + <dt><code>Generator.prototype.send()</code> {{non-standard_inline}}</dt> + <dd>用于将值发送到生成器。 该值由 {{jsxref("Operators/yield", "yield")}} 表达式返回, 并且返回下一个 {{jsxref("Operators/yield", "yield")}} 表达式产生的值. <code>send(x)</code> 对应于ES2015生成器对象中的 <code>next(x)</code></dd> + <dt><strong><code>Generator.</code></strong><code>prototype.</code><strong><code>throw()</code> </strong> {{non-standard_inline}}</dt> + <dd>向生成器抛出错误. 与ES2015 生成器对象的<span style="font-family: courier,andale mono,monospace;">throw()方法对应</span>.</dd> +</dl> + +<h3 id="旧生成器对象示例">旧生成器对象示例</h3> + +<pre class="brush: js">function fibonacci() { + var a = yield 1; + yield a * 2; +} + +var it = fibonacci(); +console.log(it); // "Generator { }" +console.log(it.next()); // 1 +console.log(it.send(10)); // 20 +console.log(it.close()); // undefined +console.log(it.next()); // throws StopIteration (as the generator is now closed) +</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-generator-objects', 'Generator objects')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-generator-objects', 'Generator objects')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.Generator")}}</p> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<h3 id="Legacy_generators">Legacy generators</h3> + +<ul> + <li>{{jsxref("Statements/Legacy_generator_function", "The legacy generator function", "", 1)}}</li> + <li>{{jsxref("Operators/Legacy_generator_function", "The legacy generator function expression", "", 1)}}</li> + <li>{{jsxref("StopIteration")}}</li> + <li><a href="/en-US/docs/Web/JavaScript/Reference/Deprecated_and_obsolete_features/The_legacy_Iterator_protocol">The legacy Iterator protocol</a></li> +</ul> + +<h3 id="ES2015_generators">ES2015 generators</h3> + +<ul> + <li>{{jsxref("Functions", "Functions", "", 1)}}</li> + <li>{{jsxref("Statements/function", "function")}}</li> + <li>{{jsxref("Operators/function", "function expression")}}</li> + <li>{{jsxref("Function")}}</li> + <li>{{jsxref("Statements/function*", "function*")}}</li> + <li>{{jsxref("Operators/function*", "function* expression")}}</li> + <li>{{jsxref("GeneratorFunction")}}</li> + <li><a href="/en-US/docs/Web/JavaScript/Guide/The_Iterator_protocol">The Iterator protocol</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/generator/next/index.html b/files/zh-cn/web/javascript/reference/global_objects/generator/next/index.html new file mode 100644 index 0000000000..96ad60c35c --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/generator/next/index.html @@ -0,0 +1,165 @@ +--- +title: Generator.prototype.next() +slug: Web/JavaScript/Reference/Global_Objects/Generator/next +tags: + - ECMAScript 2015 + - Generator + - JavaScript + - 原型 + - 参考 + - 方法 + - 生成器 +translation_of: Web/JavaScript/Reference/Global_Objects/Generator/next +--- +<div>{{JSRef}}</div> + +<p><code><strong>next</strong></code><strong><code>()</code></strong> 方法返回一个包含属性 <code>done</code> 和 <code>value</code> 的对象。该方法也可以通过接受一个参数用以向生成器传值。</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code><var>gen</var>.next(value)</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>value</code></dt> + <dd>向生成器传递的值.</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>返回的<code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object">对象</a></code>包含两个属性:</p> + +<ul> + <li><code>done</code> (布尔类型) + + <ul> + <li>如果迭代器超过迭代序列的末尾，则值为 <code>true</code>。 在这种情况下，<code>value</code>可选地指定迭代器的返回值。</li> + <li>如果迭代器能够生成序列中的下一个值，则值为<code>false</code>。 这相当于没有完全指定<code>done</code>属性。</li> + </ul> + </li> + <li><code>value</code> - 迭代器返回的任意的Javascript值。当 <code>done</code> 的值为 <code>true </code>时可以忽略该值。</li> +</ul> + +<h2 id="示例">示例</h2> + +<h3 id="Example_Using_test" name="Example:_Using_test">使用 <code>next()方法</code></h3> + +<p>下面的例子展示了一个简单的生成器, 以及调用 <code>next</code> 后方法的返回值:</p> + +<pre class="brush: js">function* gen() { + yield 1; + yield 2; + yield 3; +} + +var g = gen(); // "Generator { }" +g.next(); // "Object { value: 1, done: false }" +g.next(); // "Object { value: 2, done: false }" +g.next(); // "Object { value: 3, done: false }" +g.next(); // "Object { value: undefined, done: true }" +</pre> + +<h3 id="向生成器传值">向生成器传值</h3> + +<p>在此示例中，使用值调用<code>next</code>。 请注意，第一次调用没有记录任何内容，因为生成器最初没有产生任何结果。</p> + +<pre><code>function* gen() { + while(true) { + var value = yield null; + console.log(value); + } +} + +var g = gen(); +g.next(1); +// "{ value: null, done: false }" +g.next(2); +// 2 +// "{ value: null, done: false }"</code> +</pre> + +<h2 id="Specifications" name="Specifications">规范</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('ES6', '#sec-generator.prototype.next', 'Generator.prototype.next')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>初始定义</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-generator.prototype.next', 'Generator.prototype.next')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td>草案</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">浏览器兼容性</h2> + +<div>{{CompatibilityTable}}</div> + +<div> +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Chrome</th> + <th>Edge</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{CompatVersionUnknown}}</td> + <td>13</td> + <td>{{CompatGeckoDesktop(26)}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatSafari(10)}}</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>5.1</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoMobile(26)}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>10</td> + </tr> + </tbody> +</table> +</div> +</div> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li><code><a href="/en-US/docs/Web/JavaScript/Reference/Statements/function*">function*</a></code></li> + <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Iterators_and_Generators">Iterators and generators</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/generator/return/index.html b/files/zh-cn/web/javascript/reference/global_objects/generator/return/index.html new file mode 100644 index 0000000000..9c5ed4bb99 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/generator/return/index.html @@ -0,0 +1,99 @@ +--- +title: Generator.prototype.return() +slug: Web/JavaScript/Reference/Global_Objects/Generator/return +tags: + - ECMAScript6 + - JavaScript + - 原型 + - 参考 + - 方法 + - 生成器 +translation_of: Web/JavaScript/Reference/Global_Objects/Generator/return +--- +<div>{{JSRef}}</div> + +<p><code><strong>return</strong></code><strong><code>()</code></strong> 方法返回给定的值并结束生成器。</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code><var>gen</var>.return(value)</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>value</code></dt> + <dd>需要返回的值</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>返回该函数参数中给定的值.</p> + +<h2 id="示例">示例</h2> + +<h3 id="Example_Using_test" name="Example:_Using_test">使用 <code>return()</code></h3> + +<p>以下例子展示了一个简单的生成器和 <code>return</code> 方法的使用.</p> + +<pre class="brush: js">function* gen() { + yield 1; + yield 2; + yield 3; +} + +var g = gen(); + +g.next(); // { value: 1, done: false } +g.return("foo"); // { value: "foo", done: true } +g.next(); // { value: undefined, done: true } +</pre> + +<p>如果对已经处于“完成”状态的生成器调用<code>return(value)</code>，则生成器将保持在“完成”状态。如果没有提供参数，则返回对象的<code>value</code>属性与示例最后的<code>.next()</code>方法相同。如果提供了参数，则参数将被设置为返回对象的<code>value</code>属性的值。</p> + +<pre class="brush: js">function* gen() { + yield 1; + yield 2; + yield 3; +} + +var g = gen(); +g.next(); // { value: 1, done: false } +g.next(); // { value: 2, done: false } +g.next(); // { value: 3, done: false } +g.next(); // { value: undefined, done: true } +g.return(); // { value: undefined, done: true } +g.return(1); // { value: 1, done: true }</pre> + +<h2 id="Specifications" name="Specifications">规范</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('ES6', '#sec-generator.prototype.return', 'Generator.prototype.return')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-generator.prototype.return', 'Generator.prototype.return')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.Generator.return")}}</p> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li><code><a href="/en-US/docs/Web/JavaScript/Reference/Statements/function*">function*</a></code></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/generator/throw/index.html b/files/zh-cn/web/javascript/reference/global_objects/generator/throw/index.html new file mode 100644 index 0000000000..13138d5484 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/generator/throw/index.html @@ -0,0 +1,142 @@ +--- +title: Generator.prototype.throw() +slug: Web/JavaScript/Reference/Global_Objects/Generator/throw +tags: + - ECMAScript6 + - JavaScript + - 参考 + - 属性 + - 方法 + - 生成器 +translation_of: Web/JavaScript/Reference/Global_Objects/Generator/throw +--- +<div>{{JSRef}}</div> + +<p><code><strong>throw</strong></code><strong><code>()</code></strong> 方法用来向生成器抛出异常，并恢复生成器的执行，返回带有 <code>done</code> 及 <code>value</code> 两个属性的对象。</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code><var>gen</var>.throw(exception)</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>exception</code></dt> + <dd>用于抛出的异常。 使用 {{jsxref("Error")}} 的实例对调试非常有帮助.</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>带有两个属性的{{jsxref("Object", "对象")}}：</p> + +<ul> + <li><code>done</code> (boolean) + + <ul> + <li>如果迭代器已经返回了迭代序列的末尾，则值为 <code>true</code>。在这种情况下，<code>可以</code>指定迭代器 <code>value </code>的返回值。 </li> + <li>如果迭代能够继续生产在序列中的下一个值，则值为 <code>false</code>。 这相当与不指定 done 属性的值。</li> + </ul> + </li> + <li><code>value</code> - 迭代器返回的任何 JavaScript 值。当 done 是 true 的时候可以省略。</li> +</ul> + +<h2 id="示例">示例</h2> + +<h3 id="Example:_Using_test" name="Example:_Using_test">使用 <code>throw()</code></h3> + +<p>下面的例子展示了一个简单的生成器并使用 <span style="font-family: courier,andale mono,monospace;">throw方法</span>向该生成器抛出一个异常，该异常通常可以通过 <code><a href="/en-US/docs/Web/JavaScript/Reference/Statements/try...catch">try...catch</a></code> 块进行捕获.</p> + +<pre class="brush: js">function* gen() { + while(true) { + try { + yield 42; + } catch(e) { + console.log("Error caught!"); + } + } +} + +var g = gen(); +g.next(); // { value: 42, done: false } +g.throw(new Error("Something went wrong")); // "Error caught!" +</pre> + +<h2 id="Specifications" name="Specifications">规范</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('ES6', '#sec-generator.prototype.throw', 'Generator.prototype.throw')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-generator.prototype.throw', 'Generator.prototype.throw')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">浏览器兼容性</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(26)}}</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(26)}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li><code><a href="/en-US/docs/Web/JavaScript/Reference/Statements/function*">function*</a></code></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/generatorfunction/index.html b/files/zh-cn/web/javascript/reference/global_objects/generatorfunction/index.html new file mode 100644 index 0000000000..ab93243b97 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/generatorfunction/index.html @@ -0,0 +1,113 @@ +--- +title: GeneratorFunction +slug: Web/JavaScript/Reference/Global_Objects/GeneratorFunction +tags: + - Constructor + - ECMAScript 2015 + - GeneratorFunction + - Iterator + - JavaScript + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/GeneratorFunction +--- +<div>{{JSRef("Global_Objects", "生成器函数")}}</div> + +<p><strong><code>GeneratorFunction</code>构造器</strong>生成新的{{jsxref("Statements/function*", "生成器函数")}} 对象。在JavaScript中，生成器函数实际上都是<code>GeneratorFunction</code>的实例对象。</p> + +<p>注意，<code>GeneratorFunction</code>并不是一个全局对象。它可以通过下面的代码获取。</p> + +<pre class="brush: js">Object.getPrototypeOf(function*(){}).constructor +</pre> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code>new GeneratorFunction ([<var>arg1</var>[, <var>arg2</var>[, ...<var>argN</var>]],] <var>functionBody</var>)</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>arg1, arg2, ... arg<em>N</em></code></dt> + <dd>函数使用的名称作为形式参数名称。每个必须是一个字符串，对应于一个有效的JavaScript标识符或这样的字符串的列表，用逗号分隔；如“<code>x</code>”，“<code>theValue</code>”或“<code>a,b</code>”。</dd> + <dt><code>functionBody</code></dt> + <dd>一个包含多条表示JavaScript函数体语句的字符串。</dd> +</dl> + +<h2 id="Description" name="Description">描述</h2> + +<p>当创建函数时，将使用<code>GeneratorFunction</code>构造函数创建的{{jsxref("Statements/function*", "生成器函数")}}对象进行解析。这比使用{{jsxref("Statements/function*", "function* 表达式")}} 声明生成器函数效率更低，并且在代码中调用它，因为这些函数与其余的代码一起被解析。</p> + +<p>传递给函数的所有参数按照它们被传递的顺序被视为要创建的函数中参数的标识符的名称。</p> + +<div class="note"> +<p><strong>提示：</strong>使用<code>GeneratorFunction</code>构造函数创建的{{jsxref("Statements/function*", "生成器函数")}}不会为其创建上下文创建闭包；它们始终在全局范围内创建。当运行它们时，它们只能访问自己的本地变量和全局变量，而不是从<code>GeneratorFunction</code>构造函数调用的范围的变量。这与使用{{jsxref("Global_Objects/eval", "eval")}}与生成函数表达式的代码不同。</p> +</div> + +<p>将<code>GeneratorFunction</code>构造函数调用为函数（不使用<code>new</code>运算符）与将其作为构造函数调用的效果相同。</p> + +<h2 id="Properties" name="Properties">属性</h2> + +<dl> + <dt><code><strong>GeneratorFunction.length</strong></code></dt> + <dd><code>GeneratorFunction</code>构造函数的 length 属性值为 1。</dd> + <dt>{{jsxref("GeneratorFunction.prototype")}}</dt> + <dd>允许向所有生成器函数对象添加属性。</dd> +</dl> + +<h2 id="GeneratorFunction_原型对象"><code>GeneratorFunction</code> 原型对象</h2> + +<h3 id="属性">属性</h3> + +<div>{{page('/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/GeneratorFunction/prototype', 'Properties')}}</div> + +<h2 id="GeneratorFunction_instances" name="GeneratorFunction_instances"><code>GeneratorFunction</code> 实例</h2> + +<p><code>GeneratorFunction</code>实例从{{jsxref("GeneratorFunction.prototype")}}继承方法和属性。与所有构造函数一样，你可以更改构造函数的原型对象以对所有<code>GeneratorFunction</code>实例进行更改。</p> + +<h2 id="Examples" name="Examples">示例</h2> + +<h3 id="从GeneratorFunction构造函数创建一个生成器函数">从<code>GeneratorFunction</code>构造函数创建一个生成器函数</h3> + +<pre class="brush: js">var GeneratorFunction = Object.getPrototypeOf(function*(){}).constructor +var g = new GeneratorFunction("a", "yield a * 2"); +var iterator = g(10); +console.log(iterator.next().value); // 20 +</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-generatorfunction-objects', 'GeneratorFunction')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-generatorfunction-objects', 'GeneratorFunction')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容">浏览器兼容</h2> + +<div class="hidden">The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</div> + +<p>{{Compat("javascript.builtins.GeneratorFunction")}}</p> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("Statements/function*", "function* function")}}</li> + <li>{{jsxref("Operators/function*", "function* expression")}}</li> + <li>{{jsxref("Global_Objects/Function", "Function")}}</li> + <li>{{jsxref("Statements/function", "function statement")}}</li> + <li>{{jsxref("Operators/function", "function expression")}}</li> + <li>{{jsxref("Functions_and_function_scope", "Functions and function scope", "", 1)}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/generatorfunction/prototype/index.html b/files/zh-cn/web/javascript/reference/global_objects/generatorfunction/prototype/index.html new file mode 100644 index 0000000000..c723725c05 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/generatorfunction/prototype/index.html @@ -0,0 +1,64 @@ +--- +title: GeneratorFunction.prototype +slug: Web/JavaScript/Reference/Global_Objects/GeneratorFunction/prototype +tags: + - ECMAScript 2015 + - GeneratorFunction + - Iterator + - JavaScript + - Property + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/GeneratorFunction +--- +<div>{{JSRef}}</div> + +<p><code><strong>GeneratorFunction.prototype</strong></code>属性是{{jsxref("GeneratorFunction")}}的原型对象。</p> + +<h2 id="Description" name="Description">描述</h2> + +<p>{{jsxref("GeneratorFunction")}} 的实例对象都继承于 <code>GeneratorFunction.prototype</code>. <code>GeneratorFunction.prototype</code> 不能被修改。</p> + +<h2 id="Properties" name="Properties">属性</h2> + +<dl> + <dt><code><strong>GeneratorFunction.constructor</strong></code></dt> + <dd>初始值是 {{jsxref("GeneratorFunction")}}.</dd> + <dt><code><strong>GeneratorFunction.prototype.prototype</strong></code></dt> + <dd>值是 <code>%GeneratorPrototype%</code>.</dd> +</dl> + +<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-generatorfunction.prototype', 'GeneratorFunction.prototype')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-generatorfunction.prototype', 'GeneratorFunction.prototype')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容">浏览器兼容</h2> + +<div class="hidden">The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</div> + +<p>{{Compat("javascript.builtins.GeneratorFunction.prototype")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("GeneratorFunction")}}</li> + <li>{{jsxref("Function")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/globalthis/index.html b/files/zh-cn/web/javascript/reference/global_objects/globalthis/index.html new file mode 100644 index 0000000000..8e0e0feeb2 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/globalthis/index.html @@ -0,0 +1,92 @@ +--- +title: globalThis +slug: Web/JavaScript/Reference/Global_Objects/globalThis +tags: + - JavaScript + - Reference + - global + - globalThis + - this + - 全局 + - 参考 + - 属性 +translation_of: Web/JavaScript/Reference/Global_Objects/globalThis +--- +<div>{{jsSidebar("Objects")}}</div> + +<p><span class="seoSummary">全局属性 <code>globalThis</code> 包含全局的 <code>this</code> 值，类似于全局对象（global object）。</span></p> + +<div>{{EmbedInteractiveExample("pages/js/globalprops-globalthis.html","shorter")}}</div> + + + +<p>{{JS_Property_Attributes(1, 0, 1)}}</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox notranslate">globalThis</pre> + +<h2 id="描述">描述</h2> + +<p>在以前，从不同的 JavaScript 环境中获取全局对象需要不同的语句。在 Web 中，可以通过 <code>window</code>、<code>self</code> 或者 <code>frames</code> 取到全局对象，但是在 <a href="/zh-CN/docs/Web/API/Worker">Web Workers</a> 中，只有 <code>self</code> 可以。在 Node.js 中，它们都无法获取，必须使用 <code>global</code>。</p> + +<p>在松散模式下，可以在函数中返回 <code>this</code> 来获取全局对象，但是在严格模式和模块环境下，<code>this</code> 会返回 <code>undefined</code>。 You can also use <code>Function('return this')()</code>, but environments that disable {{jsxref("eval", "eval()")}}, like <a href="https://wiki.developer.mozilla.org/en-US/docs/Glossary/CSP">CSP</a> in browsers, prevent use of {{jsxref("Function")}} in this way.</p> + +<p><code>globalThis</code> 提供了一个标准的方式来获取不同环境下的全局 <code>this</code> 对象（也就是全局对象自身）。不像 <code>window</code> 或者 <code>self</code> 这些属性，它确保可以在有无窗口的各种环境下正常工作。所以，你可以安心的使用 <code>globalThis</code>，不必担心它的运行环境。为便于记忆，你只需要记住，全局作用域中的 <code>this</code> 就是 <code>globalThis</code>。</p> + +<h3 id="HTML_与_WindowProxy">HTML 与 WindowProxy</h3> + +<p>在很多引擎中， <code>globalThis</code> 被认为是真实的全局对象的引用，但是在浏览器中，由于 iframe 以及跨窗口安全性的考虑，它实际引用的是真实全局对象（不可以被直接访问）的 {{jsxref("Proxy")}} 代理。在通常的应用中，很少会涉及到代理与对象本身的区别，但是也需要加以注意。</p> + +<h3 id="命名">命名</h3> + +<p>并没有采用一些更常见的命名方式类似 <code>self</code> 和 <code>global</code> 是因为考虑到前向兼容，为了避免影响到现存代码的正常工作。 更多相关信息可以查看 <a href="https://github.com/tc39/proposal-global/blob/master/NAMING.md">language proposal's "naming" document</a> 。</p> + +<h2 id="示例">示例</h2> + +<p>在 <code>globalThis</code> 之前，获取某个全局对象的唯一方式就是 <code>Function('return this')()</code>，但是这在某些情况下会违反 <a href="/zh-CN/docs/Web/HTTP/CSP">CSP</a> 规则，所以，<a href="https://github.com/paulmillr/es6-shim">es6-shim</a> 使用了类似如下的方式：</p> + +<pre class="brush: js notranslate">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') { + // 此环境中没有 setTimeout 方法！ +} +</pre> + +<p>但是有了 <code>globalThis</code> 之后，只需要：</p> + +<pre class="brush: js notranslate">if (typeof globalThis.setTimeout !== 'function') { + // 此环境中没有 setTimeout 方法！ +}</pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范</th> + </tr> + <tr> + <td>{{SpecName("ESDraft", "#sec-globalthis", "<code>globalThis</code>")}}</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.globalThis")}}</p> + +<h3 id="实现进度">实现进度</h3> + +<p>下表提供了此特性的每日实施状态，因为该功能尚未达到跨浏览器的稳定性。 通过在每个浏览器的JavaScript引擎的daily版本或最新版本中运行 <a href="https://github.com/tc39/test262">Test262</a>（JavaScript 的标准测试套件）中的相关功能测试得到了如下数据。</p> + +<div>{{EmbedTest262ReportResultsTable("globalThis")}}</div> diff --git a/files/zh-cn/web/javascript/reference/global_objects/index.html b/files/zh-cn/web/javascript/reference/global_objects/index.html new file mode 100644 index 0000000000..293b4935b6 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/index.html @@ -0,0 +1,208 @@ +--- +title: JavaScript 标准内置对象 +slug: Web/JavaScript/Reference/Global_Objects +tags: + - JavaScript + - Reference + - 参考 + - 总览 +translation_of: Web/JavaScript/Reference/Global_Objects +--- +<div>{{JSSidebar("Objects")}}</div> + +<p>本章介绍和说明了 JavaScript 中所有的标准内置对象、以及它们的方法和属性。</p> + +<p>这里的术语"全局对象"（或标准内置对象）不应与<strong>global对象</strong>混淆。这里的"全局对象"指的是<strong>处在全局作用域里的多个对象</strong>。</p> + +<p><strong>global对象</strong>可以在全局作用域里通过使用{{JSxRef("Operators/this", "this")}}访问到（但只有在 ECMAScript 5 的非严格模式下才可以，在严格模式下得到的是 {{JSxRef("undefined")}}）。其实全局作用域<strong>包含</strong>全局对象中的属性，包括它可能继承来的属性。</p> + +<p>全局作用域中的其他对象则可<a href="/zh-CN/docs/Web/JavaScript/Guide/Working_with_Objects#Creating_new_objects">由用户的脚本创建</a>，或由宿主程序提供。浏览器环境中所提供的宿主对象的说明可以在这里找到：<a href="/zh-CN/docs/Web/API">API 参考</a>。</p> + +<p>要了解关于 <a href="/zh-CN/docs/Web/API/Document_Object_Model">DOM</a> 和核心 <a href="/zh-CN/docs/Web/JavaScript">JavaScript</a> 之间区别的更多信息，可参阅 <a href="/zh-CN/docs/Web/JavaScript/JavaScript_technologies_overview">JavaScript 技术概述</a>。</p> + +<h2 id="标准内置对象分类">标准内置对象分类</h2> + +<h3 id="值属性">值属性</h3> + +<p>这些全局属性返回一个简单值，这些值没有自己的属性和方法。</p> + +<ul> + <li>{{JSxRef("Infinity")}}</li> + <li>{{JSxRef("NaN")}}</li> + <li>{{JSxRef("undefined")}}</li> + <li>{{JSxRef("globalThis")}}</li> +</ul> + +<h3 id="函数属性">函数属性</h3> + +<p>全局函数可以直接调用，不需要在调用时指定所属对象，执行结束后会将结果直接返回给调用者。</p> + +<div class="twocolumns"> +<ul> + <li>{{JSxRef("Global_Objects/eval", "eval()")}}</li> + <li>{{JSxRef("Global_Objects/uneval", "uneval()")}}</li> + <li>{{JSxRef("Global_Objects/isFinite", "isFinite()")}}</li> + <li>{{JSxRef("Global_Objects/isNaN", "isNaN()")}}</li> + <li>{{JSxRef("Global_Objects/parseFloat", "parseFloat()")}}</li> + <li>{{JSxRef("Global_Objects/parseInt", "parseInt()")}}</li> + <li>{{JSxRef("Global_Objects/decodeURI", "decodeURI()")}}</li> + <li>{{JSxRef("Global_Objects/decodeURIComponent", "decodeURIComponent()")}}</li> + <li>{{JSxRef("Global_Objects/encodeURI", "encodeURI()")}}</li> + <li>{{JSxRef("Global_Objects/encodeURIComponent", "encodeURIComponent()")}}</li> + <li><strong>已废弃</strong> + <ul> + <li>{{JSxRef("Global_Objects/escape", "escape()")}}</li> + <li>{{JSxRef("Global_Objects/unescape", "unescape()")}}</li> + </ul> + </li> +</ul> +</div> + +<h3 id="基本对象">基本对象</h3> + +<p>顾名思义，基本对象是定义或使用其他对象的基础。基本对象包括一般对象、函数对象和错误对象。</p> + +<ul> + <li>{{JSxRef("Object")}}</li> + <li>{{JSxRef("Function")}}</li> + <li>{{JSxRef("Boolean")}}</li> + <li>{{JSxRef("Symbol")}}</li> +</ul> + +<h4 id="错误对象">错误对象</h4> + +<p>错误对象是一种特殊的基本对象。它们拥有基本的 {{JSxRef("Error")}} 类型，同时也有多种具体的错误类型。</p> + +<div class="twocolumns"> +<ul> + <li>{{JSxRef("Error")}}</li> + <li>{{JSxRef("AggregateError")}}</li> + <li>{{JSxRef("EvalError")}}</li> + <li>{{JSxRef("InternalError")}}</li> + <li>{{JSxRef("RangeError")}}</li> + <li>{{JSxRef("ReferenceError")}}</li> + <li>{{JSxRef("SyntaxError")}}</li> + <li>{{JSxRef("TypeError")}}</li> + <li>{{JSxRef("URIError")}}</li> +</ul> +</div> + +<h3 id="数字和日期对象">数字和日期对象</h3> + +<p>用来表示数字、日期和执行数学计算的对象。</p> + +<ul> + <li>{{JSxRef("Number")}}</li> + <li>{{JSxRef("BigInt")}}</li> + <li>{{JSxRef("Math")}}</li> + <li>{{JSxRef("Date")}}</li> +</ul> + +<h3 id="字符串">字符串</h3> + +<p>用来表示和操作字符串的对象。</p> + +<ul> + <li>{{JSxRef("String")}}</li> + <li>{{JSxRef("RegExp")}}</li> +</ul> + +<h3 id="可索引的集合对象">可索引的集合对象</h3> + +<p>这些对象表示按照索引值来排序的数据集合，包括数组和类型数组，以及类数组结构的对象。</p> + +<div class="twocolumns"> +<ul> + <li>{{JSxRef("Array")}}</li> + <li>{{JSxRef("Int8Array")}}</li> + <li>{{JSxRef("Uint8Array")}}</li> + <li>{{JSxRef("Uint8ClampedArray")}}</li> + <li>{{JSxRef("Int16Array")}}</li> + <li>{{JSxRef("Uint16Array")}}</li> + <li>{{JSxRef("Int32Array")}}</li> + <li>{{JSxRef("Uint32Array")}}</li> + <li>{{JSxRef("Float32Array")}}</li> + <li>{{JSxRef("Float64Array")}}</li> + <li>{{JSxRef("BigInt64Array")}}</li> + <li>{{JSxRef("BigUint64Array")}}</li> +</ul> +</div> + +<h3 id="使用键的集合对象">使用键的集合对象</h3> + +<p>这些集合对象在存储数据时会使用到键，包括可迭代的{{JSxRef("Map")}} 和 {{JSxRef("Set")}}，支持按照插入顺序来迭代元素。</p> + +<ul> + <li>{{JSxRef("Map")}}</li> + <li>{{JSxRef("Set")}}</li> + <li>{{JSxRef("WeakMap")}}</li> + <li>{{JSxRef("WeakSet")}}</li> +</ul> + +<h3 id="结构化数据">结构化数据</h3> + +<p>这些对象用来表示和操作结构化的缓冲区数据，或使用 JSON （JavaScript Object Notation）编码的数据。</p> + +<ul> + <li>{{JSxRef("ArrayBuffer")}}</li> + <li>{{JSxRef("SharedArrayBuffer")}}</li> + <li>{{JSxRef("Atomics")}}</li> + <li>{{JSxRef("DataView")}}</li> + <li>{{JSxRef("JSON")}}</li> +</ul> + +<h3 id="控制抽象对象">控制抽象对象</h3> + +<p>控件抽象可以帮助构造代码，尤其是异步代码（例如，不使用深度嵌套的回调）。</p> + +<ul> + <li>{{JSxRef("Promise")}}</li> + <li>{{JSxRef("Generator")}}</li> + <li>{{JSxRef("GeneratorFunction")}}</li> + <li>{{JSxRef("AsyncFunction")}}</li> +</ul> + +<h3 id="反射">反射</h3> + +<ul> + <li>{{JSxRef("Reflect")}}</li> + <li>{{JSxRef("Proxy")}}</li> +</ul> + +<h3 id="国际化">国际化</h3> + +<p><span class="tlid-translation translation" lang="zh-CN"><span title="">ECMAScript核心的附加功能，用于</span></span>支持多语言处理<span class="tlid-translation translation" lang="zh-CN"><span title="">。</span></span></p> + +<div class="twocolumns"> +<ul> + <li>{{JSxRef("Intl")}}</li> + <li>{{JSxRef("Global_Objects/Collator", "Intl.Collator")}}</li> + <li>{{JSxRef("Global_Objects/DateTimeFormat", "Intl.DateTimeFormat")}}</li> + <li>{{JSxRef("Global_Objects/ListFormat", "Intl.ListFormat")}}</li> + <li>{{JSxRef("Global_Objects/NumberFormat", "Intl.NumberFormat")}}</li> + <li>{{JSxRef("Global_Objects/PluralRules", "Intl.PluralRules")}}</li> + <li>{{JSxRef("Global_Objects/RelativeTimeFormat", "Intl.RelativeTimeFormat")}}</li> + <li>{{JSxRef("Global_Objects/Locale", "Intl.Locale")}}</li> +</ul> +</div> + +<h3 id="WebAssembly">WebAssembly</h3> + +<div class="twocolumns"> +<ul> + <li>{{JSxRef("WebAssembly")}}</li> + <li>{{JSxRef("WebAssembly.Module")}}</li> + <li>{{JSxRef("WebAssembly.Instance")}}</li> + <li>{{JSxRef("WebAssembly.Memory")}}</li> + <li>{{JSxRef("WebAssembly.Table")}}</li> + <li>{{JSxRef("WebAssembly.CompileError")}}</li> + <li>{{JSxRef("WebAssembly.LinkError")}}</li> + <li>{{JSxRef("WebAssembly.RuntimeError")}}</li> +</ul> +</div> + +<h3 id="其他">其他</h3> + +<ul> + <li>{{JSxRef("Functions/arguments", "arguments")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/infinity/index.html b/files/zh-cn/web/javascript/reference/global_objects/infinity/index.html new file mode 100644 index 0000000000..7d8e6cb3c4 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/infinity/index.html @@ -0,0 +1,57 @@ +--- +title: Infinity +slug: Web/JavaScript/Reference/Global_Objects/Infinity +tags: + - JavaScript +translation_of: Web/JavaScript/Reference/Global_Objects/Infinity +--- +<div>{{jsSidebar("Objects")}}</div> + +<p>全局属性 <code><strong>Infinity</strong></code> 是一个数值，表示无穷大。</p> + +<p>{{js_property_attributes(0,0,0)}}</p> + +<p>{{EmbedInteractiveExample("pages/js/globalprops-infinity.html")}}</p> + +<h2 id="Description" name="Description">描述</h2> + +<p><code>Infinity</code> 是<em>全局对象</em>（<em>global object</em>）的一个属性，即它是一个全局变量。</p> + +<p><code>Infinity</code> 的初始值是 {{jsxref("Number.POSITIVE_INFINITY")}}。<code>Infinity</code>（正无穷大）大于任何值。</p> + +<p>该值的意义与数学无穷大略有不同。 有关详细信息，请参见{{jsxref("Number.POSITIVE_INFINITY")}}。</p> + +<p>在 ECMAScript 5 的规范中， <code>Infinity</code> 是只读的（实现于 JavaScript 1.8.5 / Firefox 4）。</p> + +<h2 id="示例">示例</h2> + +<pre class="brush: js line-numbers language-js notranslate"><code class="language-js">console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span><span class="number token">Infinity</span> <span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">/* Infinity */</span> +console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span><span class="number token">Infinity</span> <span class="operator token">+</span> <span class="number token">1</span> <span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">/* Infinity */</span> +console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>Math<span class="punctuation token">.</span><span class="function token">pow</span><span class="punctuation token">(</span><span class="number token">10</span><span class="punctuation token">,</span> <span class="number token">1000</span><span class="punctuation token">)</span><span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">/* Infinity */</span> +console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>Math<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span><span class="number token">0</span><span class="punctuation token">)</span> <span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">/* -Infinity */</span> +console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span><span class="number token">1</span> <span class="operator token">/</span> <span class="number token">Infinity</span> <span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">/* 0 */</span></code></pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范</th> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-value-properties-of-the-global-object-infinity', 'Infinity')}}</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{Compat("javascript.builtins.Infinity")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Number.NEGATIVE_INFINITY")}}</li> + <li>{{jsxref("Number.POSITIVE_INFINITY")}}</li> + <li>{{jsxref("Number.isFinite")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/int16array/index.html b/files/zh-cn/web/javascript/reference/global_objects/int16array/index.html new file mode 100644 index 0000000000..0626eed988 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/int16array/index.html @@ -0,0 +1,254 @@ +--- +title: Int16Array +slug: Web/JavaScript/Reference/Global_Objects/Int16Array +translation_of: Web/JavaScript/Reference/Global_Objects/Int16Array +--- +<div>{{JSRef}}</div> + +<p>The <strong><code>Int16Array</code></strong> typed array represents an array of twos-complement 16-bit signed integers in the platform byte order. If control over byte order is needed, use {{jsxref("DataView")}} instead. The contents are initialized to <code>0</code>. Once established, you can reference elements in the array using the object's methods, or using standard array index syntax (that is, using bracket notation).</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">new Int16Array(length); +new Int16Array(typedArray); +new Int16Array(object); +new Int16Array(buffer [, byteOffset [, length]]);</pre> + +<p>For more information about the constructor syntax and the parameters, see <em><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray#Syntax">TypedArray</a></em>.</p> + +<h2 id="属性">属性</h2> + +<dl> + <dt>{{jsxref("TypedArray.BYTES_PER_ELEMENT", "Int16Array.BYTES_PER_ELEMENT")}}</dt> + <dd>Returns a number value of the element size. <code>2</code> in the case of an <code>Int16Array</code>.</dd> + <dt>Int16Array.length</dt> + <dd>Static length property whose value is 3. For the actual length (number of elements), see {{jsxref("TypedArray.prototype.length", "Int16Array.prototype.length")}}.</dd> + <dt>{{jsxref("TypedArray.name", "Int16Array.name")}}</dt> + <dd>Returns the string value of the constructor name. In the case of the <code>Int16Array</code> type: "Int16Array".</dd> + <dt>{{jsxref("TypedArray.prototype", "Int16Array.prototype")}}</dt> + <dd>Prototype for the <em>TypedArray</em> objects.</dd> +</dl> + +<h2 id="方法">方法</h2> + +<dl> + <dt>{{jsxref("TypedArray.from", "Int16Array.from()")}}</dt> + <dd>Creates a new <code>Int16Array</code> from an array-like or iterable object. See also {{jsxref("Array.from()")}}.</dd> + <dt>{{jsxref("TypedArray.of", "Int16Array.of()")}}</dt> + <dd>Creates a new <code>Int16Array</code> with a variable number of arguments. See also {{jsxref("Array.of()")}}.</dd> +</dl> + +<h2 id="Int16Array_prototype"><code>Int16Array</code> prototype</h2> + +<p>All <code>Int16Array</code> objects inherit from {{jsxref("TypedArray.prototype", "%TypedArray%.prototype")}}.</p> + +<h3 id="Properties">Properties</h3> + +<dl> + <dt><code>Int16Array.prototype.constructor</code></dt> + <dd>Returns the function that created an instance's prototype. This is the <code>Int16Array</code> constructor by default.</dd> + <dt>{{jsxref("TypedArray.prototype.buffer", "Int16Array.prototype.buffer")}} {{readonlyInline}}</dt> + <dd>Returns the {{jsxref("ArrayBuffer")}} referenced by the <code>Int16Array</code> Fixed at construction time and thus <strong>read only</strong>.</dd> + <dt>{{jsxref("TypedArray.prototype.byteLength", "Int16Array.prototype.byteLength")}} {{readonlyInline}}</dt> + <dd>Returns the length (in bytes) of the <code>Int16Array</code> from the start of its {{jsxref("ArrayBuffer")}}. Fixed at construction time and thus <strong>read only.</strong></dd> + <dt>{{jsxref("TypedArray.prototype.byteOffset", "Int16Array.prototype.byteOffset")}} {{readonlyInline}}</dt> + <dd>Returns the offset (in bytes) of the <code>Int16Array</code> from the start of its {{jsxref("ArrayBuffer")}}. Fixed at construction time and thus <strong>read only.</strong></dd> + <dt>{{jsxref("TypedArray.prototype.length", "Int16Array.prototype.length")}} {{readonlyInline}}</dt> + <dd>Returns the number of elements hold in the <code>Int16Array</code>. Fixed at construction time and thus <strong>read only.</strong></dd> +</dl> + +<h3 id="Methods">Methods</h3> + +<dl> + <dt>{{jsxref("TypedArray.copyWithin", "Int16Array.prototype.copyWithin()")}}</dt> + <dd>Copies a sequence of array elements within the array. See also {{jsxref("Array.prototype.copyWithin()")}}.</dd> + <dt>{{jsxref("TypedArray.entries", "Int16Array.prototype.entries()")}}</dt> + <dd>Returns a new <code>Array Iterator</code> object that contains the key/value pairs for each index in the array. See also {{jsxref("Array.prototype.entries()")}}.</dd> + <dt>{{jsxref("TypedArray.every", "Int16Array.prototype.every()")}}</dt> + <dd>Tests whether all elements in the array pass the test provided by a function. See also {{jsxref("Array.prototype.every()")}}.</dd> + <dt>{{jsxref("TypedArray.fill", "Int16Array.prototype.fill()")}}</dt> + <dd>Fills all the elements of an array from a start index to an end index with a static value. See also {{jsxref("Array.prototype.fill()")}}.</dd> + <dt>{{jsxref("TypedArray.filter", "Int16Array.prototype.filter()")}}</dt> + <dd>Creates a new array with all of the elements of this array for which the provided filtering function returns true. See also {{jsxref("Array.prototype.filter()")}}.</dd> + <dt>{{jsxref("TypedArray.find", "Int16Array.prototype.find()")}}</dt> + <dd>Returns the found value in the array, if an element in the array satisfies the provided testing function or <code>undefined</code> if not found. See also {{jsxref("Array.prototype.find()")}}.</dd> + <dt>{{jsxref("TypedArray.findIndex", "Int16Array.prototype.findIndex()")}}</dt> + <dd>Returns the found index in the array, if an element in the array satisfies the provided testing function or -1 if not found. See also {{jsxref("Array.prototype.findIndex()")}}.</dd> + <dt>{{jsxref("TypedArray.forEach", "Int16Array.prototype.forEach()")}}</dt> + <dd>Calls a function for each element in the array. See also {{jsxref("Array.prototype.forEach()")}}.</dd> + <dt>{{jsxref("TypedArray.includes", "Int16Array.prototype.includes()")}} {{experimental_inline}}</dt> + <dd>Determines whether a typed array includes a certain element, returning <code>true</code> or <code>false</code> as appropriate. See also {{jsxref("Array.prototype.includes()")}}.</dd> + <dt>{{jsxref("TypedArray.indexOf", "Int16Array.prototype.indexOf()")}}</dt> + <dd>Returns the first (least) index of an element within the array equal to the specified value, or -1 if none is found. See also {{jsxref("Array.prototype.indexOf()")}}.</dd> + <dt>{{jsxref("TypedArray.join", "Int16Array.prototype.join()")}}</dt> + <dd>Joins all elements of an array into a string. See also {{jsxref("Array.prototype.join()")}}.</dd> + <dt>{{jsxref("TypedArray.keys", "Int16Array.prototype.keys()")}}</dt> + <dd>Returns a new <code>Array Iterator</code> that contains the keys for each index in the array. See also {{jsxref("Array.prototype.keys()")}}.</dd> + <dt>{{jsxref("TypedArray.lastIndexOf", "Int16Array.prototype.lastIndexOf()")}}</dt> + <dd>Returns the last (greatest) index of an element within the array equal to the specified value, or -1 if none is found. See also {{jsxref("Array.prototype.lastIndexOf()")}}.</dd> + <dt>{{jsxref("TypedArray.map", "Int16Array.prototype.map()")}}</dt> + <dd>Creates a new array with the results of calling a provided function on every element in this array. See also {{jsxref("Array.prototype.map()")}}.</dd> + <dt>{{jsxref("TypedArray.move", "Int16Array.prototype.move()")}} {{non-standard_inline}} {{unimplemented_inline}}</dt> + <dd>Former non-standard version of {{jsxref("TypedArray.copyWithin", "Int16Array.prototype.copyWithin()")}}.</dd> + <dt>{{jsxref("TypedArray.reduce", "Int16Array.prototype.reduce()")}}</dt> + <dd>Apply a function against an accumulator and each value of the array (from left-to-right) as to reduce it to a single value. See also {{jsxref("Array.prototype.reduce()")}}.</dd> + <dt>{{jsxref("TypedArray.reduceRight", "Int16Array.prototype.reduceRight()")}}</dt> + <dd>Apply a function against an accumulator and each value of the array (from right-to-left) as to reduce it to a single value. See also {{jsxref("Array.prototype.reduceRight()")}}.</dd> + <dt>{{jsxref("TypedArray.reverse", "Int16Array.prototype.reverse()")}}</dt> + <dd>Reverses the order of the elements of an array — the first becomes the last, and the last becomes the first. See also {{jsxref("Array.prototype.reverse()")}}.</dd> + <dt>{{jsxref("TypedArray.set", "Int16Array.prototype.set()")}}</dt> + <dd>Stores multiple values in the typed array, reading input values from a specified array.</dd> + <dt>{{jsxref("TypedArray.slice", "Int16Array.prototype.slice()")}}</dt> + <dd>Extracts a section of an array and returns a new array. See also {{jsxref("Array.prototype.slice()")}}.</dd> + <dt>{{jsxref("TypedArray.some", "Int16Array.prototype.some()")}}</dt> + <dd>Returns true if at least one element in this array satisfies the provided testing function. See also {{jsxref("Array.prototype.some()")}}.</dd> + <dt>{{jsxref("TypedArray.sort", "Int16Array.prototype.sort()")}}</dt> + <dd>Sorts the elements of an array in place and returns the array. See also {{jsxref("Array.prototype.sort()")}}.</dd> + <dt>{{jsxref("TypedArray.subarray", "Int16Array.prototype.subarray()")}}</dt> + <dd>Returns a new <code>Int16Array</code> from the given start and end element index.</dd> + <dt>{{jsxref("TypedArray.values", "Int16Array.prototype.values()")}}</dt> + <dd>Returns a new <code>Array Iterator</code> object that contains the values for each index in the array. See also {{jsxref("Array.prototype.values()")}}.</dd> + <dt>{{jsxref("TypedArray.toLocaleString", "Int16Array.prototype.toLocaleString()")}}</dt> + <dd>Returns a localized string representing the array and its elements. See also {{jsxref("Array.prototype.toLocaleString()")}}.</dd> + <dt>{{jsxref("TypedArray.toString", "Int16Array.prototype.toString()")}}</dt> + <dd>Returns a string representing the array and its elements. See also {{jsxref("Array.prototype.toString()")}}.</dd> + <dt>{{jsxref("TypedArray.@@iterator", "Int16Array.prototype[@@iterator]()")}}</dt> + <dd>Returns a new <code>Array Iterator</code> object that contains the values for each index in the array.</dd> +</dl> + +<h2 id="Examples">Examples</h2> + +<pre class="brush: js">// From a length +var int16 = new Int16Array(2); +int16[0] = 42; +console.log(int16[0]); // 42 +console.log(int16.length); // 2 +console.log(int16.BYTES_PER_ELEMENT); // 2 + +// From an array +var arr = new Int16Array([21,31]); +console.log(arr[1]); // 31 + +// From another TypedArray +var x = new Int16Array([21, 31]); +var y = new Int16Array(x); +console.log(y[0]); // 21 + +// From an ArrayBuffer +var buffer = new ArrayBuffer(8); +var z = new Int16Array(buffer, 0, 4); +</pre> + +<h2 id="Specifications">Specifications</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('Typed Array')}}</td> + <td>{{Spec2('Typed Array')}}</td> + <td>Superseded by ECMAScript 2015.</td> + </tr> + <tr> + <td>{{SpecName('ES2015', '#table-49', 'TypedArray constructors')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>Initial definition in an ECMA standard. Specified that <code>new</code> is required.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#table-49', 'TypedArray constructors')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility">Browser compatibility</h2> + +<p>{{CompatibilityTable}}</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>7.0</td> + <td>{{ CompatGeckoDesktop(2) }}</td> + <td>10</td> + <td>11.6</td> + <td>5.1</td> + </tr> + <tr> + <td><code>new</code> is required</td> + <td>{{CompatUnknown}}</td> + <td>{{ CompatGeckoDesktop(44) }}</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>4.0</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{ CompatGeckoMobile(2) }}</td> + <td>10</td> + <td>11.6</td> + <td>4.2</td> + </tr> + <tr> + <td><code>new</code> is required</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{ CompatGeckoMobile(44) }}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="Compatibility_notes">Compatibility notes</h2> + +<p>Starting with ECMAScript 2015, <code>Int16Array</code> constructors require to be constructed with a {{jsxref("Operators/new", "new")}} operator. Calling a <code>Int16Array</code> constructor as a function without <code>new</code>, will throw a {{jsxref("TypeError")}} from now on.</p> + +<pre class="brush: js example-bad">var dv = Int16Array([1, 2, 3]); +// TypeError: calling a builtin Int16Array constructor +// without new is forbidden</pre> + +<pre class="brush: js example-good">var dv = new Int16Array([1, 2, 3]);</pre> + +<h2 id="See_also">See also</h2> + +<ul> + <li><a href="/en-US/docs/Web/JavaScript/Typed_arrays" title="en/JavaScript typed arrays">JavaScript typed arrays</a></li> + <li>{{jsxref("ArrayBuffer")}}</li> + <li>{{jsxref("DataView")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/int32array/index.html b/files/zh-cn/web/javascript/reference/global_objects/int32array/index.html new file mode 100644 index 0000000000..1e7ca21cc4 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/int32array/index.html @@ -0,0 +1,259 @@ +--- +title: Int32Array +slug: Web/JavaScript/Reference/Global_Objects/Int32Array +translation_of: Web/JavaScript/Reference/Global_Objects/Int32Array +--- +<div>{{JSRef}}</div> + +<p>该 <strong><code>Int32Array</code></strong> 类型表示在平台顺序字节中一个双补码32位有符号的整型数组。如果需要控制字节顺序，请改用{{jsxref("DataView")}} 。此内容的初始化为<code>0</code>。一旦创建，你可以使用对象的方法或者标准数组索引的语法(即使用括号表示法)。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">new Int32Array(length); +new Int32Array(typedArray); +new Int32Array(object); +new Int32Array(buffer [, byteOffset [, length]]);</pre> + +<p>更多关于构造函数语法和参数的详细信息，请参阅<em><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray#Syntax">TypedArray</a>。</em></p> + +<h2 id="属性">属性</h2> + +<dl> + <dt>{{jsxref("TypedArray.BYTES_PER_ELEMENT", "Int32Array.BYTES_PER_ELEMENT")}}</dt> + <dd>Returns a number value of the element size. <code>4</code> in the case of an <code>Int32Array</code>. </dd> + <dt>Int32Array.length</dt> + <dd>Static length property whose value is 3. For the actual length (number of elements), see {{jsxref("TypedArray.prototype.length", "Int32Array.prototype.length")}}.</dd> + <dt>{{jsxref("TypedArray.name", "Int32Array.name")}}</dt> + <dd>Returns the string value of the constructor name. In the case of the <code>Int32Array</code> type: "Int32Array".</dd> + <dt>{{jsxref("TypedArray.prototype", "Int32Array.prototype")}}</dt> + <dd>Prototype for the <em>TypedArray</em> objects.</dd> +</dl> + +<h2 id="方法">方法</h2> + +<dl> + <dt>{{jsxref("TypedArray.from", "Int32Array.from()")}}</dt> + <dd>从类似数组或者可迭代对象中创建一个新的<code>Int32Array</code>。另见{{jsxref("Array.from()")}}.</dd> + <dt>{{jsxref("TypedArray.of", "Int32Array.of()")}}</dt> + <dd>创建一个新的具有可变数量参数的<code>Int32Array</code>。另见{{jsxref("Array.of()")}}。</dd> +</dl> + +<h2 id="Int32Array_属性"><code>Int32Array</code> 属性</h2> + +<p>所有的<code>Int32Array</code>对象都继承自{jsxref("TypedArray.prototype", "%TypedArray%.prototype")}}。</p> + +<h3 id="属性_2">属性</h3> + +<dl> + <dt><code>Int32Array.prototype.constructor</code></dt> + <dd>返回创建实例原型的函数。默认情况下,它是<code>Int32Array</code>的构造函数。</dd> + <dt>{{jsxref("TypedArray.prototype.buffer", "Int32Array.prototype.buffer")}} {{readonlyInline}}</dt> + <dd>返回在构造时被固定的<code>Int32Array</code>引用的{{jsxref("ArrayBuffer")}}，因此只读。</dd> + <dt>{{jsxref("TypedArray.prototype.byteLength", "Int32Array.prototype.byteLength")}} {{readonlyInline}}</dt> + <dd>返回从其{{jsxref("ArrayBuffer")}}开始的<code>Int32Array</code>长度的(以字节为单位)。在构造时被固定，因此只读。</dd> + <dt>{{jsxref("TypedArray.prototype.byteOffset", "Int32Array.prototype.byteOffset")}} {{readonlyInline}}</dt> + <dd>返回从其{{jsxref("ArrayBuffer")}}开始的偏移量(以字节为单位)。在构造时被固定,因此只读。</dd> +</dl> + +<dl> + <dt>{{jsxref("TypedArray.prototype.length", "Int32Array.prototype.length")}} {{readonlyInline}}</dt> + <dd> 返回<code>Int32ArrayInt32Array</code>包含的元素个数。在构造时被固定,因此只读。</dd> +</dl> + +<h3 id="方法_2">方法</h3> + +<dl> + <dt>{{jsxref("TypedArray.copyWithin", "Int32Array.prototype.copyWithin()")}}</dt> + <dd>Copies a sequence of array elements within the array. See also {{jsxref("Array.prototype.copyWithin()")}}.</dd> + <dt>{{jsxref("TypedArray.entries", "Int32Array.prototype.entries()")}}</dt> + <dd>Returns a new <code>Array Iterator</code> object that contains the key/value pairs for each index in the array. See also {{jsxref("Array.prototype.entries()")}}.</dd> + <dt>{{jsxref("TypedArray.every", "Int32Array.prototype.every()")}}</dt> + <dd>Tests whether all elements in the array pass the test provided by a function. See also {{jsxref("Array.prototype.every()")}}.</dd> + <dt>{{jsxref("TypedArray.fill", "Int32Array.prototype.fill()")}}</dt> + <dd>Fills all the elements of an array from a start index to an end index with a static value. See also {{jsxref("Array.prototype.fill()")}}.</dd> + <dt>{{jsxref("TypedArray.filter", "Int32Array.prototype.filter()")}}</dt> + <dd>Creates a new array with all of the elements of this array for which the provided filtering function returns true. See also {{jsxref("Array.prototype.filter()")}}.</dd> + <dt>{{jsxref("TypedArray.find", "Int32Array.prototype.find()")}}</dt> + <dd>Returns the found value in the array, if an element in the array satisfies the provided testing function or <code>undefined</code> if not found. See also {{jsxref("Array.prototype.find()")}}.</dd> + <dt>{{jsxref("TypedArray.findIndex", "Int32Array.prototype.findIndex()")}}</dt> + <dd>Returns the found index in the array, if an element in the array satisfies the provided testing function or -1 if not found. See also {{jsxref("Array.prototype.findIndex()")}}.</dd> + <dt>{{jsxref("TypedArray.forEach", "Int32Array.prototype.forEach()")}}</dt> + <dd>Calls a function for each element in the array. See also {{jsxref("Array.prototype.forEach()")}}.</dd> + <dt>{{jsxref("TypedArray.includes", "Int32Array.prototype.includes()")}} {{experimental_inline}}</dt> + <dd>Determines whether a typed array includes a certain element, returning <code>true</code> or <code>false</code> as appropriate. See also {{jsxref("Array.prototype.includes()")}}.</dd> + <dt>{{jsxref("TypedArray.indexOf", "Int32Array.prototype.indexOf()")}}</dt> + <dd>Returns the first (least) index of an element within the array equal to the specified value, or -1 if none is found. See also {{jsxref("Array.prototype.indexOf()")}}.</dd> + <dt>{{jsxref("TypedArray.join", "Int32Array.prototype.join()")}}</dt> + <dd>Joins all elements of an array into a string. See also {{jsxref("Array.prototype.join()")}}.</dd> + <dt>{{jsxref("TypedArray.keys", "Int32Array.prototype.keys()")}}</dt> + <dd>Returns a new <code>Array Iterator</code> that contains the keys for each index in the array. See also {{jsxref("Array.prototype.keys()")}}.</dd> + <dt>{{jsxref("TypedArray.lastIndexOf", "Int32Array.prototype.lastIndexOf()")}}</dt> + <dd>Returns the last (greatest) index of an element within the array equal to the specified value, or -1 if none is found. See also {{jsxref("Array.prototype.lastIndexOf()")}}.</dd> + <dt>{{jsxref("TypedArray.map", "Int32Array.prototype.map()")}}</dt> + <dd>Creates a new array with the results of calling a provided function on every element in this array. See also {{jsxref("Array.prototype.map()")}}.</dd> + <dt>{{jsxref("TypedArray.move", "Int32Array.prototype.move()")}} {{non-standard_inline}} {{unimplemented_inline}}</dt> + <dd>Former non-standard version of {{jsxref("TypedArray.copyWithin", "Int32Array.prototype.copyWithin()")}}.</dd> + <dt>{{jsxref("TypedArray.reduce", "Int32Array.prototype.reduce()")}}</dt> + <dd>Apply a function against an accumulator and each value of the array (from left-to-right) as to reduce it to a single value. See also {{jsxref("Array.prototype.reduce()")}}.</dd> + <dt>{{jsxref("TypedArray.reduceRight", "Int32Array.prototype.reduceRight()")}}</dt> + <dd>Apply a function against an accumulator and each value of the array (from right-to-left) as to reduce it to a single value. See also {{jsxref("Array.prototype.reduceRight()")}}.</dd> + <dt>{{jsxref("TypedArray.reverse", "Int32Array.prototype.reverse()")}}</dt> + <dd>Reverses the order of the elements of an array — the first becomes the last, and the last becomes the first. See also {{jsxref("Array.prototype.reverse()")}}.</dd> + <dt>{{jsxref("TypedArray.set", "Int32Array.prototype.set()")}}</dt> + <dd>在类型化数组中存储多个值，从指定数组中读取输入值。</dd> + <dt>{{jsxref("TypedArray.slice", "Int32Array.prototype.slice()")}}</dt> + <dd>提取数组中的一部分，并返回一个新的数组.更多请见{{jsxref("Array.prototype.slice()")}}。</dd> + <dt>{{jsxref("TypedArray.some", "Int32Array.prototype.some()")}}</dt> + <dd>如果数组中至少有一个元素满足所提供的测试函数，则返回true。更多请见{{jsxref("Array.prototype.some()")}}。</dd> + <dt>{{jsxref("TypedArray.sort", "Int32Array.prototype.sort()")}}</dt> + <dd>Sorts the elements of an array in place and returns the array. See also {{jsxref("Array.prototype.sort()")}}.</dd> + <dt>{{jsxref("TypedArray.subarray", "Int32Array.prototype.subarray()")}}</dt> + <dd>Returns a new <code>Int32Array</code> from the given start and end element index.</dd> + <dt>{{jsxref("TypedArray.values", "Int32Array.prototype.values()")}}</dt> + <dd>Returns a new <code>Array Iterator</code> object that contains the values for each index in the array. See also {{jsxref("Array.prototype.values()")}}.</dd> + <dt>{{jsxref("TypedArray.toLocaleString", "Int32Array.prototype.toLocaleString()")}}</dt> + <dd>Returns a localized string representing the array and its elements. See also {{jsxref("Array.prototype.toLocaleString()")}}.</dd> + <dt>{{jsxref("TypedArray.toString", "Int32Array.prototype.toString()")}}</dt> + <dd>Returns a string representing the array and its elements. See also {{jsxref("Array.prototype.toString()")}}.</dd> + <dt>{{jsxref("TypedArray.@@iterator", "Int32Array.prototype[@@iterator]()")}}</dt> + <dd>Returns a new <code>Array Iterator</code> object that contains the values for each index in the array.</dd> +</dl> + +<h2 id="例子">例子</h2> + +<p>不同的方式创建一个 <code>Int32Array</code></p> + +<pre class="brush: js">// 从一个数字 +var int32 = new Int32Array(2); +int32[0] = 42; +console.log(int32[0]); // 42 +console.log(int32.length); // 2 +console.log(int32.BYTES_PER_ELEMENT); // 4 + +// 从一个数组 +var arr = new Int32Array([21,31]); +console.log(arr[1]); // 31 + +// 从一个其他TypedArray +var x = new Int32Array([21, 31]); +var y = new Int32Array(x); +console.log(y[0]); // 21 + +// 从一个ArrayBuffer +var buffer = new ArrayBuffer(16); +var z = new Int32Array(buffer, 0, 4); +</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('Typed Array')}}</td> + <td>{{Spec2('Typed Array')}}</td> + <td>已被ECMAScript 6取代.</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#table-49', 'TypedArray constructors')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>ECMA标准中的初始定义，指定需要新建。</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#table-49', 'TypedArray constructors')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{CompatibilityTable}}</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>基本支持</td> + <td>7.0</td> + <td>{{ CompatGeckoDesktop(2) }}</td> + <td>10</td> + <td>11.6</td> + <td>5.1</td> + </tr> + <tr> + <td><font face="consolas, Liberation Mono, courier, monospace"><span style="background-color: rgba(220, 220, 220, 0.5);">新</span></font> 的特性</td> + <td>{{CompatUnknown}}</td> + <td>{{ CompatGeckoDesktop(44) }}</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>基本支持</td> + <td>4.0</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{ CompatGeckoMobile(2) }}</td> + <td>10</td> + <td>11.6</td> + <td>4.2</td> + </tr> + <tr> + <td><code>新</code>的特性</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{ CompatGeckoMobile(44) }}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="兼容性说明">兼容性说明</h2> + +<p>Starting with ECMAScript 2015 (ES6), <code>In32Array</code> constructors require to be constructed with a {{jsxref("Operators/new", "new")}} operator. Calling a <code>Int32Array</code> constructor as a function without <code>new</code>, will throw a {{jsxref("TypeError")}} from now on.</p> + +<pre class="brush: js example-bad">var dv = Int32Array([1, 2, 3]); +// TypeError: calling a builtin Int32Array constructor +// without new is forbidden</pre> + +<pre class="brush: js example-good">var dv = new Int32Array([1, 2, 3]);</pre> + +<h2 id="参见">参见</h2> + +<ul> + <li><a href="/en-US/docs/Web/JavaScript/Typed_arrays" title="en/JavaScript typed arrays">JavaScript typed arrays</a></li> + <li>{{jsxref("ArrayBuffer")}}</li> + <li>{{jsxref("DataView")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/int8array/index.html b/files/zh-cn/web/javascript/reference/global_objects/int8array/index.html new file mode 100644 index 0000000000..a2916916a9 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/int8array/index.html @@ -0,0 +1,258 @@ +--- +title: Int8Array +slug: Web/JavaScript/Reference/Global_Objects/Int8Array +tags: + - Int8Array + - 构造器 + - 特定类型数组 +translation_of: Web/JavaScript/Reference/Global_Objects/Int8Array +--- +<div>{{JSRef}}</div> + +<p><strong><code>Int8Array</code></strong> 类型数组表示二进制补码8位有符号整数的数组。内容初始化为0。 一旦建立，你可以使用对象的方法引用数组中的元素，或使用标准数组索引语法( 即，使用括号注释)。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">new Int8Array(length); +new Int8Array(typedArray); +new Int8Array(object); +new Int8Array(buffer [, byteOffset [, length]]);</pre> + +<p>有关构造函数语法和参数的更多信息，请访问 <em><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray#Syntax">TypedArray</a></em>.</p> + +<h2 id="属性">属性</h2> + +<dl> + <dt>{{jsxref("TypedArray.BYTES_PER_ELEMENT", "Int8Array.BYTES_PER_ELEMENT")}}</dt> + <dd>返回数组中每个元素的大小. 在<code>Int8Array中这个值为1</code>.</dd> + <dt>Int8Array.length</dt> + <dd>此属性为固定值属性，值为3.查看 {{jsxref("TypedArray.prototype.length", "Int8Array.prototype.length")}}获得获取数组内元素个数方法。</dd> + <dt>{{jsxref("TypedArray.name", "Int8Array.name")}}</dt> + <dd>返回构造器方法名称.在Int8Array类型中此值为 "Int8Array"。</dd> + <dt>{{jsxref("TypedArray.prototype", "Int8Array.prototype")}}</dt> + <dd><em>TypedArray</em> 对象的构造原型。</dd> +</dl> + +<h2 id="方法">方法</h2> + +<dl> + <dt>{{jsxref("TypedArray.from", "Int8Array.from()")}}</dt> + <dd>从类数组对象或迭代器生成int8Array数组对象. 参照{{jsxref("Array.from()")}}.</dd> + <dt>{{jsxref("TypedArray.of", "Int8Array.of()")}}</dt> + <dd>以多个参数构造Int8Array对象， 参照 {{jsxref("Array.of()")}}.</dd> +</dl> + +<h2 id="Int8Array_原型方法"><code>Int8Array</code> 原型方法</h2> + +<p>所有<strong> Int8Array</strong>对象都继承自 {{jsxref("TypedArray.prototype", "%TypedArray%.prototype")}}.</p> + +<h3 id="属性_2">属性</h3> + +<dl> + <dt><code>Int8Array.prototype.constructor</code></dt> + <dd>这个方法会返回对象的构造原型. 默认为<code>Int8Array构造函数</code>.</dd> + <dt>{{jsxref("TypedArray.prototype.buffer", "Int8Array.prototype.buffer")}} {{readonlyInline}}</dt> + <dd>Returns the {{jsxref("ArrayBuffer")}} referenced by the <code>Int8Array</code> Fixed at construction time and thus <strong>read only</strong>.</dd> + <dt>{{jsxref("TypedArray.prototype.byteLength", "Int8Array.prototype.byteLength")}} {{readonlyInline}}</dt> + <dd>Returns the length (in bytes) of the <code>Int8Array</code> from the start of its {{jsxref("ArrayBuffer")}}. Fixed at construction time and thus <strong>read only.</strong></dd> + <dt>{{jsxref("TypedArray.prototype.byteOffset", "Int8Array.prototype.byteOffset")}} {{readonlyInline}}</dt> + <dd>Returns the offset (in bytes) of the <code>Int8Array</code> from the start of its {{jsxref("ArrayBuffer")}}. Fixed at construction time and thus <strong>read only.</strong></dd> + <dt>{{jsxref("TypedArray.prototype.length", "Int8Array.prototype.length")}} {{readonlyInline}}</dt> + <dd>Returns the number of elements hold in the <code>Int8Array</code>. Fixed at construction time and thus <strong>read only.</strong></dd> +</dl> + +<h3 id="方法_2">方法</h3> + +<dl> + <dt>{{jsxref("TypedArray.copyWithin", "Int8Array.prototype.copyWithin()")}}</dt> + <dd>Copies a sequence of array elements within the array. See also {{jsxref("Array.prototype.copyWithin()")}}.</dd> + <dt>{{jsxref("TypedArray.entries", "Int8Array.prototype.entries()")}}</dt> + <dd>Returns a new <code>Array Iterator</code> object that contains the key/value pairs for each index in the array. See also {{jsxref("Array.prototype.entries()")}}.</dd> + <dt>{{jsxref("TypedArray.every", "Int8Array.prototype.every()")}}</dt> + <dd>Tests whether all elements in the array pass the test provided by a function. See also {{jsxref("Array.prototype.every()")}}.</dd> + <dt>{{jsxref("TypedArray.fill", "Int8Array.prototype.fill()")}}</dt> + <dd>Fills all the elements of an array from a start index to an end index with a static value. See also {{jsxref("Array.prototype.fill()")}}.</dd> + <dt>{{jsxref("TypedArray.filter", "Int8Array.prototype.filter()")}}</dt> + <dd>Creates a new array with all of the elements of this array for which the provided filtering function returns true. See also {{jsxref("Array.prototype.filter()")}}.</dd> + <dt>{{jsxref("TypedArray.find", "Int8Array.prototype.find()")}}</dt> + <dd>Returns the found value in the array, if an element in the array satisfies the provided testing function or <code>undefined</code> if not found. See also {{jsxref("Array.prototype.find()")}}.</dd> + <dt>{{jsxref("TypedArray.findIndex", "Int8Array.prototype.findIndex()")}}</dt> + <dd>Returns the found index in the array, if an element in the array satisfies the provided testing function or -1 if not found. See also {{jsxref("Array.prototype.findIndex()")}}.</dd> + <dt>{{jsxref("TypedArray.forEach", "Int8Array.prototype.forEach()")}}</dt> + <dd>Calls a function for each element in the array. See also {{jsxref("Array.prototype.forEach()")}}.</dd> + <dt>{{jsxref("TypedArray.includes", "Int8Array.prototype.includes()")}} {{experimental_inline}}</dt> + <dd>Determines whether a typed array includes a certain element, returning <code>true</code> or <code>false</code> as appropriate. See also {{jsxref("Array.prototype.includes()")}}.</dd> + <dt>{{jsxref("TypedArray.indexOf", "Int8Array.prototype.indexOf()")}}</dt> + <dd>Returns the first (least) index of an element within the array equal to the specified value, or -1 if none is found. See also {{jsxref("Array.prototype.indexOf()")}}.</dd> + <dt>{{jsxref("TypedArray.join", "Int8Array.prototype.join()")}}</dt> + <dd>Joins all elements of an array into a string. See also {{jsxref("Array.prototype.join()")}}.</dd> + <dt>{{jsxref("TypedArray.keys", "Int8Array.prototype.keys()")}}</dt> + <dd>Returns a new <code>Array Iterator</code> that contains the keys for each index in the array. See also {{jsxref("Array.prototype.keys()")}}.</dd> + <dt>{{jsxref("TypedArray.lastIndexOf", "Int8Array.prototype.lastIndexOf()")}}</dt> + <dd>Returns the last (greatest) index of an element within the array equal to the specified value, or -1 if none is found. See also {{jsxref("Array.prototype.lastIndexOf()")}}.</dd> + <dt>{{jsxref("TypedArray.map", "Int8Array.prototype.map()")}}</dt> + <dd>返回一个由回调函数的返回值组成的新数组。. See also {{jsxref("Array.prototype.map()")}}.</dd> + <dt>{{jsxref("TypedArray.move", "Int8Array.prototype.move()")}} {{non-standard_inline}} {{unimplemented_inline}}</dt> + <dd>{{jsxref("TypedArray.copyWithin", "Int8Array.prototype.copyWithin()")}} 早期的不标准定义。</dd> + <dt>{{jsxref("TypedArray.reduce", "Int8Array.prototype.reduce()")}}</dt> + <dd>从左到右为每个数组元素执行一次回调函数，并把上次回调函数的返回值放在一个暂存器中传给下次回调函数，并返回最后一次回调函数的返回值。参照 {{jsxref("Array.prototype.reduce()")}}.</dd> + <dt>{{jsxref("TypedArray.reduceRight", "Int8Array.prototype.reduceRight()")}}</dt> + <dd>从右到左为每个数组元素执行一次回调函数，并把上次回调函数的返回值放在一个暂存器中传给下次回调函数，并返回最后一次回调函数的返回值。参照 {{jsxref("Array.prototype.reduceRight()")}}.</dd> + <dt>{{jsxref("TypedArray.reverse", "Int8Array.prototype.reverse()")}}</dt> + <dd>颠倒数组中元素的排列顺序，即原先的第一个变为最后一个，原先的最后一个变为第一个。参照{{jsxref("Array.prototype.reverse()")}}.</dd> + <dt>{{jsxref("TypedArray.set", "Int8Array.prototype.set()")}}</dt> + <dd>Stores multiple values in the typed array, reading input values from a specified array.</dd> + <dt>{{jsxref("TypedArray.slice", "Int8Array.prototype.slice()")}}</dt> + <dd>抽取当前数组中的一段元素组合成一个新数组。参照{{jsxref("Array.prototype.slice()")}}.</dd> + <dt>{{jsxref("TypedArray.some", "Int8Array.prototype.some()")}}</dt> + <dd>如果数组中至少有一个元素满足测试函数，则返回 true，否则返回 false。参照 {{jsxref("Array.prototype.some()")}}.</dd> + <dt>{{jsxref("TypedArray.sort", "Int8Array.prototype.sort()")}}</dt> + <dd>对数组元素进行排序，并返回当前数组. 参照{{jsxref("Array.prototype.sort()")}}.</dd> + <dt>{{jsxref("TypedArray.subarray", "Int8Array.prototype.subarray()")}}</dt> + <dd>返回一个以给定的初始结束位置裁剪的Int8Array数组.</dd> + <dt>{{jsxref("TypedArray.values", "Int8Array.prototype.values()")}}</dt> + <dd>返回一个数组迭代器对象，该迭代器会包含所有数组元素的值。. 参照 {{jsxref("Array.prototype.values()")}}.</dd> + <dt>{{jsxref("TypedArray.toLocaleString", "Int8Array.prototype.toLocaleString()")}}</dt> + <dd>返回一个由所有数组元素组合而成的本地化后的字符串. See also {{jsxref("Array.prototype.toLocaleString()")}}.</dd> + <dt>{{jsxref("TypedArray.toString", "Int8Array.prototype.toString()")}}</dt> + <dd>返回一个由所有数组元素组合而成的字符串.参照 {{jsxref("Array.prototype.toString()")}}.</dd> + <dt>{{jsxref("TypedArray.@@iterator", "Int8Array.prototype[@@iterator]()")}}</dt> + <dd>此方法返回一个带有数组内所有元素的迭代器对象，同Int8Array.prototype.values 。</dd> +</dl> + +<h2 id="示例">示例</h2> + +<pre class="brush: js">// 以长度参数构造对象 +var int8 = new Int8Array(2); +int8[0] = 42; +console.log(int8[0]); // 42 +console.log(int8.length); // 2 +console.log(int8.BYTES_PER_ELEMENT); // 1 + +// 以数组构造对象 +var arr = new Int8Array([21,31]); +console.log(arr[1]); // 31 + +// 从另一数组构造对象 +var x = new Int8Array([21, 31]); +var y = new Int8Array(x); +console.log(y[0]); // 21 + +// 从ArrayBuffer构造对象 +var buffer = new ArrayBuffer(8); +var z = new Int8Array(buffer, 1, 4); +</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>{{SpecName('Typed Array')}}</td> + <td>{{Spec2('Typed Array')}}</td> + <td>已被 ECMAScript 6取代。</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#table-49', 'TypedArray constructors')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>ECMA 标准中构造对象时 new 关键字为必需。</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#table-49', 'TypedArray constructors')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{CompatibilityTable}}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>功能</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>7.0</td> + <td>{{ CompatGeckoDesktop("2") }}</td> + <td>10</td> + <td>11.6</td> + <td>5.1</td> + </tr> + <tr> + <td><code>new</code> is required</td> + <td>{{CompatUnknown}}</td> + <td>{{ CompatGeckoDesktop("44") }}</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>4.0</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{ CompatGeckoMobile("2") }}</td> + <td>10</td> + <td>11.6</td> + <td>4.2</td> + </tr> + <tr> + <td><code>new</code> is required</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{ CompatGeckoMobile("44") }}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="兼容性说明">兼容性说明</h2> + +<p>自 ECMAScript 2015 (ES6)施行, <code>Int8Array</code> 需要使用{{jsxref("Operators/new", "new")}} 构造. 从当前版本开始，不加new而便调用<code>Int8Array</code> 构造器方法, 将报出 {{jsxref("TypeError")}} 错误.</p> + +<pre class="brush: js example-bad">var dv = Int8Array([1, 2, 3]); +// TypeError: calling a builtin Int8Array constructor +// without new is forbidden</pre> + +<pre class="brush: js example-good">var dv = new Int8Array([1, 2, 3]);</pre> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li><a href="/en-US/docs/Web/JavaScript/Typed_arrays" title="en/JavaScript typed arrays">JavaScript typed arrays</a></li> + <li>{{jsxref("ArrayBuffer")}}</li> + <li>{{jsxref("DataView")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/internalerror/index.html b/files/zh-cn/web/javascript/reference/global_objects/internalerror/index.html new file mode 100644 index 0000000000..e0f98013f9 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/internalerror/index.html @@ -0,0 +1,123 @@ +--- +title: InternalError +slug: Web/JavaScript/Reference/Global_Objects/InternalError +tags: + - InternalError + - 内部错误 +translation_of: Web/JavaScript/Reference/Global_Objects/InternalError +--- +<div>{{JSRef}} {{non-standard_header}}</div> + +<p><strong><code>InternalError</code> 对象</strong>表示出现在JavaScript引擎内部的错误。 例如： <strong>"InternalError</strong>: too much recursion"（内部错误：递归过深）。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code>new InternalError([<var>message</var>[, <var>fileName</var>[, <var>lineNumber</var>]]])</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>message</code></dt> + <dd>可选。 人类可读的错误描述信息。</dd> + <dt><code>fileName</code> {{non-standard_inline}}</dt> + <dd>可选。触发该错误的代码所在文件的文件名。</dd> + <dt><code>lineNumber</code> {{non-standard_inline}}</dt> + <dd>可选。触发该错误的代码所在的代码行号。</dd> +</dl> + +<h2 id="描述">描述</h2> + +<p>当JavaScript引擎出现内部错误时将会抛出<code>InternalError。</code></p> + +<p>示例场景通常为某些成分过大，例如：</p> + +<ul> + <li>"too many switch cases"（过多<code>case</code>子句）；</li> + <li>"too many parentheses in regular expression"（正则表达式中括号过多）；</li> + <li>"array initializer too large"（数组初始化器过大）；</li> + <li>"too much recursion"（递归过深）。</li> +</ul> + +<h2 id="属性">属性</h2> + +<dl> + <dt>{{jsxref("InternalError.prototype")}}</dt> + <dd>允许向<code>InternalError</code>对象添加属性。</dd> +</dl> + +<h2 id="方法">方法</h2> + +<p>全局 <code>InternalError</code> 对象自身不包含任何方法,但从原型链中继承了一些方法.</p> + +<h2 id="InternalError_实例"><code>InternalError</code> 实例</h2> + +<h3 id="属性_2">属性</h3> + +<div>{{page('/en-US/docs/Web/JavaScript/Reference/Global_Objects/InternalError/prototype', '属性')}}</div> + +<h3 id="方法_2">方法</h3> + +<div>{{page('/en-US/docs/Web/JavaScript/Reference/Global_Objects/InternalError/prototype', '方法')}}</div> + +<h2 id="规范">规范</h2> + +<p>尚未成为任何规范的一部分。</p> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<h2 id="CompatibilityTable"><span style="font-size: 14px; font-weight: normal; line-height: 1.5;">{{CompatibilityTable}}</span></h2> + +<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>基本支持</td> + <td>{{CompatNo}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</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>基本支持</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Error","错误")}}</li> + <li>{{jsxref("InternalError.prototype")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/intl/collator/index.html b/files/zh-cn/web/javascript/reference/global_objects/intl/collator/index.html new file mode 100644 index 0000000000..640bb0b9e4 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/intl/collator/index.html @@ -0,0 +1,177 @@ +--- +title: Intl.Collator +slug: Web/JavaScript/Reference/Global_Objects/Intl/Collator +translation_of: Web/JavaScript/Reference/Global_Objects/Intl/Collator +--- +<div>{{JSRef}}</div> + +<p><strong><code>Intl.Collator<font face="Open Sans, Arial, sans-serif"> </font></code></strong><code>是用于语言敏感字符串比较的 collators构造函数。</code></p> + +<div>{{EmbedInteractiveExample("pages/js/intl-collator.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code>new Intl.Collator([<var>locales</var>[, <var>options</var>]]) +Intl.Collator.call(<var>this</var>[, <var>locales</var>[, <var>options</var>]])</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>locales</code></dt> + <dd> + <p>可选. 缩写语言代码 (BCP 47 language tag, 例如: cmn-Hans-CN) 的字符串或者这些字符串组成的数组. 关于参数 locales 的一般形式和解释请参见{{jsxref("Global_Objects/Intl", "Intl page", "#Locale_identification_and_negotiation", 1)}}. 下面的这些 Unicode 扩展键也是被允许的:</p> + + <dl> + <dt><code>co</code></dt> + <dd>某些区域设置的变体归类。 可能的值包括：“big5han”，“dict”，“direct”，“ducet”，“gb2312”，“phonebk”，“phonetic”，“pinyin”，“reformed”，“searchjl”，“stroke” “，”unihan“。值“<code>standard</code>” 和 “<code>search</code>” 被忽略; 它们被 options 属性用法替换（详见下文）。</dd> + <dt><code>kn</code></dt> + <dd>是否应使用数字对照，使得 “1”<“2”<“10”。 可能的值为 “true” 和 “false”。 此选项可以通过 options 属性或通过 Unicode 扩展 key 设置; 如果两者都提供，options 属性优先。</dd> + <dt><code>kf</code></dt> + <dd><code>首先排序大写或者小写。可能的值为 “upper”，“lower” 或 “false”（使用区域设置的默认值）。 </code> 此选项可以通过 options 属性或通过 Unicode 扩展 key 设置; 如果两者都提供，options 属性优先。</dd> + </dl> + </dd> + <dt><code>options</code></dt> + <dd> + <p>可选. 包含一些或所有的下面属性的对象:</p> + + <dl> + <dt><code>localeMatcher</code></dt> + <dd>使用的 local 的匹配算法. 可能的值有 "lookup" 和 "best fit"; 默认值是 <code>"best fit"</code>. 有关此选项的信息, 请参见{{jsxref("Global_Objects/Intl", "Intl page", "#Locale_negotiation", 1)}}.</dd> + <dt><code>usage</code></dt> + <dd>比较是用于排序还是用于搜索匹配的字符串。 可能的值为 “sort” 和 “search”; 默认为 “sort”。</dd> + <dt><code>sensitivity</code></dt> + <dd> + <p>字符串中的哪些差异应导致结果值为非零(non-zero)。 可能的值有：</p> + + <ul> + <li><code>"base"</code>: 只有字母不同的字母比较不相等。例子: <code>a ≠ b</code>, <code>a = á</code>, <code>a = A。</code></li> + <li><code>"accent"</code>: 只有不同的基本字母或重音符号和其他变音符号的字符串比较为不相等。 例如: <code>a ≠ b</code>, <code>a ≠ á</code>, <code>a = A。</code></li> + <li><code>"case"</code>: 只有不同的基本字母或大小写的字符串比较不相等。 Examples: <code>a ≠ b</code>, <code>a = á</code>, <code>a ≠ A。</code></li> + <li><code>"variant"</code>: 字符串的字母，口音和其他变音符号、或不同大小写比较不相等。 也可以考虑其他差异。例如： <code>a ≠ b</code>, <code>a ≠ á</code>, <code>a ≠ A</code>.</li> + </ul> + + <p><code>"variant" 的默认值使用<font face="Open Sans, Arial, sans-serif"> </font></code><code>"sort"</code>; 它的 locale 依赖于使用 <code>"search"</code>.</p> + </dd> + <dt><code>ignorePunctuation</code></dt> + <dd>是否应忽略标点。 可能的值为 true 和 false; 默认值为 false。</dd> + <dt><code>numeric</code></dt> + <dd>是否应使用数字对照，使得 “1”<“2”<“10”。 可能的值为 “true” 和 “false”。默认值为 “false” 。 此选项可以通过 options 属性或通过 Unicode 扩展 key 设置; 如果两者都提供，options 属性优先。实现不需要支持此属性。</dd> + <dt><code>caseFirst</code></dt> + <dd><code>首先排序大写或者小写。可能的值为 “upper”，“lower” 或 “false”（使用区域设置的默认值）。 </code> 此选项可以通过 options 属性或通过 Unicode 扩展 key 设置; 如果两者都提供，options 属性优先。实现不需要支持此属性。</dd> + </dl> + </dd> +</dl> + +<h2 id="描述">描述</h2> + +<p><code>Intl.Collator</code> 类有一下属性和方法</p> + +<h3 id="属性">属性</h3> + +<dl> + <dt>{{jsxref("Collator.prototype", "Intl.Collator.prototype")}}</dt> + <dd>允许向所有对象添加属性。</dd> +</dl> + +<h3 id="方法">方法</h3> + +<dl> + <dt>{{jsxref("Collator.supportedLocalesOf", "Intl.Collator.supportedLocalesOf()")}}</dt> + <dd>返回包含所支持的所提供语言环境的数组的数组，而不必回退到运行时的默认语言环境。</dd> +</dl> + +<h2 id="Collator_实例"><code>Collator 实例</code></h2> + +<h3 id="属性_2">属性</h3> + +<p><code>Collator 实例从其原型继承以下属性：</code></p> + +<div>{{page('en-US/docs/Web/JavaScript/Reference/Global_Objects/Collator/prototype', 'Properties')}}</div> + +<h3 id="方法_2">方法</h3> + +<h3 id="Collator_实例从其原型继承以下方法：">Collator 实例从其原型继承以下方法：</h3> + +<div>{{page('en-US/docs/Web/JavaScript/Reference/Global_Objects/Collator/prototype', 'Methods')}}</div> + +<h2 id="例子">例子</h2> + +<h3 id="基本用法">基本用法</h3> + +<p>以下示例演示在另一个之前，之后或同级别发生的字符串的不同潜在结果：</p> + +<pre class="brush: js">console.log(new Intl.Collator().compare('a', 'c')); // → a negative value +console.log(new Intl.Collator().compare('c', 'a')); // → a positive value +console.log(new Intl.Collator().compare('a', 'a')); // → 0 +</pre> + +<p>请注意，上述代码中显示的结果可能会因浏览器和浏览器版本而异。 这是因为值是实现特定的。 也就是说，规范仅需要前后值为负和正。</p> + +<h3 id="使用_locales">使用 <code>locales</code></h3> + +<p>{{jsxref("Collator.prototype.compare()")}} 提供的结果在不同语言之间有所不同。为了获得用于您的应用程序的用户界面的语言格式，请确保设定了语言（可能还有一些回退语言）参数：</p> + +<pre class="brush: js">// 德语中, ä 使用 a 的排序 +console.log(new Intl.Collator('de').compare('ä', 'z')); +// → 一个负值 + +// 瑞典语中, ä 在 z 的后面 +console.log(new Intl.Collator('sv').compare('ä', 'z')); +// → 一个正值 +</pre> + +<h3 id="使用_options">使用 <code>options</code></h3> + +<p>{{jsxref("Collator.prototype.compare()")}} 提供的结果可以使用 options 参数自定义：</p> + +<pre class="brush: js">// 德语中, ä 使用 a 作为基本字母 +console.log(new Intl.Collator('de', { sensitivity: 'base' }).compare('ä', 'a')); +// → 0 + +// 瑞典语中, ä 和 a 是单独的基本字母 +console.log(new Intl.Collator('sv', { sensitivity: 'base' }).compare('ä', 'a')); +// → 一个正值 +</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('ES Int 1.0', '#sec-10.1', 'Intl.Collator')}}</td> + <td>{{Spec2('ES Int 1.0')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES Int 2.0', '#sec-10.1', 'Intl.Collator')}}</td> + <td>{{Spec2('ES Int 2.0')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES Int Draft', '#collator-objects', 'Intl.Collator')}}</td> + <td>{{Spec2('ES Int Draft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> +<div> + + +<p>{{Compat("javascript.builtins.Intl.Collator")}}</p> +</div> +</div> + +<h2 id="参见">参见</h2> + +<div>{{page('/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl', 'See_also')}}</div> diff --git a/files/zh-cn/web/javascript/reference/global_objects/intl/datetimeformat/index.html b/files/zh-cn/web/javascript/reference/global_objects/intl/datetimeformat/index.html new file mode 100644 index 0000000000..ef43816d44 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/intl/datetimeformat/index.html @@ -0,0 +1,286 @@ +--- +title: Intl.DateTimeFormat +slug: Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat +translation_of: Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat +--- +<div>{{JSRef}}</div> + +<div><strong><code>Intl.DateTimeFormat</code></strong>是根据语言来格式化日期和时间的对象的构造器。</div> + +<div>{{EmbedInteractiveExample("pages/js/intl-datetimeformat.html")}}</div> + +<p class="hidden">交互示例的源代码存储在 GitHub 资源库。如果你愿意分布交互示例，请复制<a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a>，并向我们发送一个pull请求。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code>new Intl.DateTimeFormat([<var>locales</var>[, <var>options</var>]]) +Intl.DateTimeFormat.call(<var>this</var>[, <var>locales</var>[, <var>options</var>]])</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>locales</code></dt> + <dd> + <p>可选.缩写语言代码(BCP 47 language tag,例如:cmn-Hans-CN)的字符串或者这些字符串组成的数组. 关于参数locales的一般形式和解释请参见{{jsxref("Global_Objects/Intl", "Intl page", "#Locale_identification_and_negotiation", 1)}}. 下面的这些Unicode扩展键也是被允许的:</p> + + <p>译者注:下面这两种扩展的使用方式是language[-scripts][-region]-u-nu-* 和 language[-scripts][-region]-u-ca-* ,例如:zh-u-nu-hanidec(表示中文十进制数字) 和 zh-u-ca-chinese(表示中国日历,比如壬辰年冬月8日) ,也可以 nu 和 ca 组合使用 比如 使用 zh-u-ca-chinese-nu-hanidec 格式化Date.now()的返回值类似于"丙申年冬月九日"</p> + + <p><code>nu</code></p> + + <dl> + <dd>编号系统. 可能的值包括: <code>"arab"</code>, <code>"arabext"</code>, <code>"bali"</code>, <code>"beng"</code>, <code>"deva"</code>, <code>"fullwide"</code>, <code>"gujr"</code>, <code>"guru"</code>, <code>"hanidec"</code>, <code>"khmr"</code>, <code>"knda"</code>, <code>"laoo"</code>, <code>"latn"</code>, <code>"limb"</code>, <code>"mlym"</code>, <code>"mong"</code>, <code>"mymr"</code>, <code>"orya"</code>, <code>"tamldec"</code>, <code>"telu"</code>, <code>"thai"</code>, <code>"tibt"</code>.</dd> + <dt><code>ca</code></dt> + <dd>日历. 可能的值包括: <code>"buddhist"</code>, <code>"chinese"</code>, <code>"coptic"</code>, <code>"ethioaa"</code>, <code>"ethiopic"</code>, <code>"gregory"</code>, <code>"hebrew"</code>, <code>"indian"</code>, <code>"islamic"</code>, <code>"islamicc"</code>, <code>"iso8601"</code>, <code>"japanese"</code>, <code>"persian"</code>, <code>"roc"</code>.</dd> + </dl> + </dd> + <dt><code>options</code></dt> + <dd> + <p>可选. 包含一些或所有的下面属性的类:</p> + + <dl> + <dt><code>localeMatcher</code></dt> + <dd>使用的local的匹配算法. 可能的值有"lookup"和"best fit"; 默认值是 <code>"best fit"</code>. 有关此选项的信息, 请参见{{jsxref("Global_Objects/Intl", "Intl page", "#Locale_negotiation", 1)}}.</dd> + <dt><code>timeZone</code></dt> + <dd>使用的时区. 这唯一的值实现必须被标准世界时间(UTC)所识别。默认值是运行时的默认时区. <a href="https://www.iana.org/time-zones">IANA time zone database</a>中的时区名称可能会被识别, 例如<code>"Asia/Shanghai"</code>, <code>"Asia/Kolkata"</code>, <code>"America/New_York"</code>.</dd> + <dt><code>hour12</code></dt> + <dd>是否使用12小时时间制(而不是24小时的时间). 可能的值是<code>true</code> 或 <code>false</code>; 默认值是根据locale来自动决定的(译者注:中国地区的默认值为true).</dd> + <dt><code>formatMatcher</code></dt> + <dd><code>format的匹配算法.可能的值有"basic"和"best fit";默认值是"best fit".有关此属性使用的信息，参见以下段落。</code></dd> + <dd> + <p>日期时间插件被格式化输出时可以使用的属性集合描述。实现需要支持是以下子集中的其中一个(译者注:当weekday,year等这些属性一个也不使用的时候,在cmn-Hans-CN中相当于使用集合year, month, day, hour, minute, second并且它们的值都是numeric)：</p> + </dd> + </dl> + + <ul> + <li><code>weekday</code>, <code>year</code>, <code>month</code>, <code>day</code>, <code>hour</code>, <code>minute</code>, <code>second</code></li> + <li><code>weekday</code>, <code>year</code>, <code>month</code>, <code>day</code></li> + <li><code>year</code>, <code>month</code>, <code>day</code></li> + <li><code>year</code>, <code>month</code></li> + <li><code>month</code>, <code>day</code></li> + <li><code>hour</code>, <code>minute</code>, <code>second</code></li> + <li><code>hour</code>, <code>minute</code></li> + </ul> + + <p>实现可能支持其他的子集，并通过对所有可用的子集对比找到最匹配的子集。通过 formatMatcher属性可以设置两种算法用于对比和选择子集: <a href="http://www.ecma-international.org/ecma-402/1.0/#BasicFormatMatcher">完全匹配<code>"basic"算法</code> </a> 和 一种依赖于“best fit”算法的实现.</p> + + <dl> + <dt><code>weekday</code></dt> + <dd>工作日的展现方式.可能的值有 <code>"narrow"</code>, <code>"short"</code>, <code>"long"</code>.</dd> + <dt><code>era</code></dt> + <dd>纪元的展现方式. 可能的值有 <code>"narrow"</code>, <code>"short"</code>, <code>"long"</code>.</dd> + <dt><code>year</code></dt> + <dd>年的展现方式. 可能的值有 <code>"numeric"</code>, <code>"2-digit"</code>.</dd> + <dt><code>month</code></dt> + <dd>月的展现方式. 可能的值有 <code>"numeric"</code>, <code>"2-digit"</code>, <code>"narrow"</code>, <code>"short"</code>, <code>"long"</code>.</dd> + <dt><code>day</code></dt> + <dd>日的展现方式.可能的值有 <code>"numeric"</code>, <code>"2-digit"</code>.</dd> + <dt><code>hour</code></dt> + <dd>时的展现方式.可能的值有 <code>"numeric"</code>, <code>"2-digit"</code>.</dd> + <dt><code>minute</code></dt> + <dd>分钟的展现方式.可能的值有 <code>"numeric"</code>, <code>"2-digit"</code>.</dd> + <dt><code>second</code></dt> + <dd>秒的展现方式. 可能的值有<code>"numeric"</code>, <code>"2-digit"</code>.</dd> + <dt><code>timeZoneName</code></dt> + <dd>时区名称的展现方式.可能的值有 <code>"short"</code>, <code>"long"</code>.</dd> + </dl> + + <p class="noinclude">每个日期时间组件属性的默认值都是{{jsxref("undefined")}},但是若所有的组件属性都是{{jsxref("undefined")}},那么<code>year</code>, <code>month</code>, and <code>day</code> 的值就都被认为是"<code>numeric</code>".</p> + </dd> +</dl> + +<h2 id="描述">描述</h2> + +<h3 id="属性">属性</h3> + +<dl> + <dt>{{jsxref("DateTimeFormat.prototype", "Intl.DateTimeFormat.prototype")}}</dt> + <dd>允许将属性添加到所有对象上。</dd> +</dl> + +<h3 id="方法">方法</h3> + +<dl> + <dt>{{jsxref("DateTimeFormat.supportedLocalesOf", "Intl.DateTimeFormat.supportedLocalesOf()")}}</dt> + <dd>Returns an array containing those of the provided locales that are supported without having to fall back to the runtime's default locale.</dd> +</dl> + +<h2 id="DateTimeFormat_实例"><code>DateTimeFormat</code> 实例</h2> + +<h3 id="属性_2">属性</h3> + +<p><code>DateTimeFormat实例集成以下原型的属性</code>:</p> + +<div>{{page('/en-US/docs/Web/JavaScript/Reference/Global_Objects/DateTimeFormat/prototype', 'Properties')}}</div> + +<h3 id="方法_2">方法</h3> + +<p><code>DateTimeFormat实例集成以下原型的方法</code>:</p> + +<div>{{page('/en-US/docs/Web/JavaScript/Reference/Global_Objects/DateTimeFormat/prototype', 'Methods')}}</div> + +<h2 id="实例">实例</h2> + +<h3 id="使用_DateTimeFormat">使用 <code>DateTimeFormat</code></h3> + +<p>不指定locale时,DateTimeFormat使用默认的locale 和 默认的 options</p> + +<pre class="brush: js">var date = new Date(Date.UTC(2012, 11, 20, 3, 0, 0)); + +//参数未填时使用默认的locale和默认的时区 +console.log(new Intl.DateTimeFormat().format(date)); +//如果是在洛杉矶那么值为 → "12/19/2012" +</pre> + +<h3 id="使用locales">使用<code>locales</code></h3> + +<p>这个例子显示了本地化日期和时间格式的一些变化。为了获得用于您的应用程序的用户界面的语言格式，请确保使用locales参数确保指定语言（可能还有一些回退语言）：</p> + +<pre class="brush: js">var date = new Date(Date.UTC(2012, 11, 20, 3, 0, 0)); + +// 下面是假定的所在时区 +// 洛杉矶(America/Los_Angeles for the US) + +// 美式英语(US English) 使用 month-day-year 格式 +console.log(new Intl.DateTimeFormat('en-US').format(date)); +// → "12/19/2012" + +// 英式英语(British English) 使用 day-month-year 格式 +console.log(new Intl.DateTimeFormat('en-GB').format(date)); +// → "20/12/2012" + +// 韩国使用 year-month-day 格式 +console.log(new Intl.DateTimeFormat('ko-KR').format(date)); +// → "2012. 12. 20." + +//大部分阿拉伯国家使用阿拉伯字母(real Arabic digits) +console.log(new Intl.DateTimeFormat('ar-EG').format(date)); +// → "<span dir="rtl">٢٠/١٢/٢٠١٢</span>" + +//在日本，应用可能想要使用日本日历, +//2012 是平成24年（平成是是日本天皇明仁的年号,由1989年1月8日起开始计算直至现在） +console.log(new Intl.DateTimeFormat('ja-JP-u-ca-japanese').format(date)); +// → "平成24/12/20" + +//当请求一个语言可能不支持，如巴厘(ban)，若有备用的语言印尼语(id)， +//那么将使用印尼语(id) +console.log(new Intl.DateTimeFormat(['ban', 'id']).format(date)); +// → "20/12/2012" +</pre> + +<h3 id="使用options">使用<code>options</code></h3> + +<p>可以使用 <code>options </code>参数来自定义 <font face="Consolas, Liberation Mono, Courier, monospace">日期时间格式化</font>方法返回的字符串。</p> + +<pre class="brush: js">var date = new Date(Date.UTC(2012, 11, 20, 3, 0, 0)); + +//请求参数(options)中包含参数星期(weekday)，并且该参数的值为长类型(long) +var options = { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' }; +console.log(new Intl.DateTimeFormat('de-DE', options).format(date)); +// → "Donnerstag, 20. Dezember 2012" + +// 一个应用使用 世界标准时间(UTC),并且UTC使用短名字(short)展示 +options.timeZone = 'UTC'; +options.timeZoneName = 'short';//若不写这一行那么仍然显示的是世界标准时间；但是GMT三个字母不会显示 +console.log(new Intl.DateTimeFormat('en-US', options).format(date)); +// → "Thursday, December 20, 2012, GMT" + +// 有时你想变得更精确 +options = { + hour: 'numeric', minute: 'numeric', second: 'numeric', + timeZoneName: 'short' +}; +console.log(new Intl.DateTimeFormat('en-AU', options).format(date)); +// → "2:00:00 pm AEDT" + +// 使用24小时制 +options = { + year: 'numeric', month: 'numeric', day: 'numeric', + hour: 'numeric', minute: 'numeric', second: 'numeric', + hour12: false +}; +console.log(date.toLocaleString('en-US', options)); +// → "12/19/2012, 19:00:00" +</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>{{SpecName('ES Int 1.0', '#sec-12.1', 'Intl.DateTimeFormat')}}</td> + <td>{{Spec2('ES Int 1.0')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES Int 2.0', '#sec-12.1', 'Intl.DateTimeFormat')}}</td> + <td>{{Spec2('ES Int 2.0')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES Int Draft', '#datetimeformat-objects', 'Intl.DateTimeFormat')}}</td> + <td>{{Spec2('ES Int Draft')}}</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 (WebKit)</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{CompatChrome("24")}}</td> + <td>{{CompatGeckoDesktop("29")}}</td> + <td>{{CompatIE("11")}}</td> + <td>{{CompatOpera("15")}}</td> + <td>{{CompatSafari("10")}}</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 Phone</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{CompatNo}}</td> + <td>{{CompatChrome("26")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatSafari("10")}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="相关链接">相关链接</h2> + +<div>{{page('/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl', 'See_also')}}</div> diff --git a/files/zh-cn/web/javascript/reference/global_objects/intl/datetimeformat/prototype/index.html b/files/zh-cn/web/javascript/reference/global_objects/intl/datetimeformat/prototype/index.html new file mode 100644 index 0000000000..d8cb843c33 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/intl/datetimeformat/prototype/index.html @@ -0,0 +1,119 @@ +--- +title: Intl.DateTimeFormat.prototype +slug: Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat/prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat +--- +<div>{{JSRef}}</div> + +<p><strong><code>Intl.DateTimeFormat.prototype</code></strong>表示 {{jsxref("DateTimeFormat", "Intl.DateTimeFormat")}}构造函数的原型对象。</p> + +<p>{{js_property_attributes(0, 0, 0)}} </p> + +<h2 id="描述">描述</h2> + +<p>参见 {{jsxref("DateTimeFormat")}}来看<code>Intl.DateTimeFormat实例的一个描述。</code></p> + +<p>{{jsxref("DateTimeFormat", "Intl.DateTimeFormat")}} 实例继承自<code>Intl.DateTimeFormat.prototype</code>. 对原型对象的修改都继承自{{jsxref("DateTimeFormat", "Intl.DateTimeFormat")}}实例。</p> + +<h2 id="属性">属性</h2> + +<dl> + <dt><code>Intl.DateTimeFormat.prototype.constructor</code></dt> + <dd>请参考 {{jsxref("DateTimeFormat", "Intl.DateTimeFormat")}}.</dd> + <dt>{{jsxref("DateTimeFormat.format", "Intl.DateTimeFormat.prototype.format")}}</dt> + <dd>Getter; 返回一个{{jsxref("DateTimeFormat", "DateTimeFormat")}}对象的根据locale和格式化参数格式化日期的函数。</dd> +</dl> + +<h2 id="方法">方法</h2> + +<dl> + <dt>{{jsxref("DateTimeFormat.formatToParts", "Intl.DateTimeFormat.prototype.formatToParts()")}}</dt> + <dd>Returns an {{jsxref("Array")}} of objects representing the date string in parts that can be used for custom locale-aware formatting.</dd> + <dt>{{jsxref("DateTimeFormat.resolvedOptions", "Intl.DateTimeFormat.prototype.resolvedOptions()")}}</dt> + <dd>返回一个新的属性对象，反射出在对象初始化过程中计算出的locale和options的各个值。</dd> +</dl> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范版本</th> + <th scope="col">规范状态</th> + <th scope="col">注解</th> + </tr> + <tr> + <td>{{SpecName('ES Int 1.0', '#sec-12.2.1', 'Intl.DateTimeFormat.prototype')}}</td> + <td>{{Spec2('ES Int 1.0')}}</td> + <td>初始定义</td> + </tr> + <tr> + <td>{{SpecName('ES Int 2.0', '#sec-12.2.1', 'Intl.DateTimeFormat.prototype')}}</td> + <td>{{Spec2('ES Int 2.0')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES Int Draft', '#sec-Intl.DateTimeFormat.prototype', 'Intl.DateTimeFormat.prototype')}}</td> + <td>{{Spec2('ES Int Draft')}}</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 (WebKit)</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{CompatChrome("24")}}</td> + <td>{{CompatGeckoDesktop("29")}}</td> + <td>{{CompatIE("11")}}</td> + <td>{{CompatOpera("15")}}</td> + <td>{{CompatNo}}</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 Phone</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{CompatNo}}</td> + <td>{{CompatChrome("26")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="参见">参见</h2> + +<ul> + <li>{{jsxref("DateTimeFormat", "Intl.DateTimeFormat")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/intl/displaynames/index.html b/files/zh-cn/web/javascript/reference/global_objects/intl/displaynames/index.html new file mode 100644 index 0000000000..06b7cf130b --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/intl/displaynames/index.html @@ -0,0 +1,28 @@ +--- +title: Intl.DisplayNames +slug: Web/JavaScript/Reference/Global_Objects/Intl/DisplayNames +translation_of: Web/JavaScript/Reference/Global_Objects/Intl/DisplayNames +--- +<p>{{JSRef}} <strong><code>Intl.DisplayNames</code></strong> 是一个对象构造器，它支持语言、区域和脚本显示名称的一致翻译。</p> + +<h2 id="语法">语法</h2> + +<pre><code>new Intl.DisplayNames([<var>locales</var>[, <var>options</var>]]) </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 href="https://tc39.es/proposal-intl-displaynames/#sec-intl-displaynames-constructor">Intl.DisplayNames Constructor</a></td> + <td>Stage 3</td> + <td></td> + </tr> + </tbody> +</table> diff --git a/files/zh-cn/web/javascript/reference/global_objects/intl/getcanonicallocales/index.html b/files/zh-cn/web/javascript/reference/global_objects/intl/getcanonicallocales/index.html new file mode 100644 index 0000000000..78ee477634 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/intl/getcanonicallocales/index.html @@ -0,0 +1,72 @@ +--- +title: Intl.getCanonicalLocales() +slug: Web/JavaScript/Reference/Global_Objects/Intl/getCanonicalLocales +tags: + - 区域语言代码 + - 去重 +translation_of: Web/JavaScript/Reference/Global_Objects/Intl/getCanonicalLocales +--- +<div>{{JSRef}}</div> + +<p><strong><code>Intl.getCanonicalLocales()</code></strong> 方法返回一个数组，数组包含规范的区域语言代码，重复的元素将会被去除，每一个元素都会被验证为格式有效的区域语言代码。</p> + +<div>{{EmbedInteractiveExample("pages/js/intl-getcanonicallocales.html")}}</div> + + + +<h2 id="Syntax">Syntax</h2> + +<pre class="syntaxbox">Intl.getCanonicalLocales(locales)</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>locales</code></dt> + <dd>想要规范化的字符串数组。</dd> +</dl> + +<h3 id="Return_value">Return value</h3> + +<p>一个包含规范区域语言代码的数组。</p> + +<h2 id="例子">例子</h2> + +<pre class="brush: js">Intl.getCanonicalLocales('EN-US'); // ["en-US"] +Intl.getCanonicalLocales(['EN-US', 'Fr']); // ["en-US", "fr"] + +Intl.getCanonicalLocales('EN_US'); +// RangeError:'EN_US' is not a structurally valid language tag +</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('ES Int Draft', '#sec-intl.getcanonicallocales', 'Intl.getCanonicalLocales')}}</td> + <td>{{Spec2('ES Int Draft')}}</td> + <td>Initial definition</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容">浏览器兼容</h2> + +<div> + + +<p>{{Compat("javascript.builtins.Intl.getCanonicalLocales")}}</p> +</div> + +<h2 id="参见">参见</h2> + +<ul> + <li>{{jsxref("NumberFormat.supportedLocalesOf", "Intl.NumberFormat.supportedLocalesOf()")}}</li> + <li>{{jsxref("DateTimeFormat.supportedLocalesOf", "Intl.DateTimeFormat.supportedLocalesOf()")}}</li> + <li>{{jsxref("Collator.supportedLocalesOf", "Intl.Collator.supportedLocalesOf()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/intl/index.html b/files/zh-cn/web/javascript/reference/global_objects/intl/index.html new file mode 100644 index 0000000000..165a332206 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/intl/index.html @@ -0,0 +1,132 @@ +--- +title: Intl +slug: Web/JavaScript/Reference/Global_Objects/Intl +tags: + - JavaScript + - 国际化 +translation_of: Web/JavaScript/Reference/Global_Objects/Intl +--- +<div>{{JSRef}}</div> + +<p class="summary"><strong><code>Intl</code></strong> 对象是 ECMAScript 国际化 API 的一个命名空间，它提供了精确的字符串对比、数字格式化，和日期时间格式化。{{jsxref("Collator")}}，{{jsxref("NumberFormat")}} 和 {{jsxref("DateTimeFormat")}} 对象的构造函数是 <code>Intl</code> 对象的属性。本页文档内容包括了这些属性，以及国际化使用的构造器和其他语言的方法等常见的功能。</p> + +<h2 id="属性">属性</h2> + +<dl> + <dt>{{jsxref("Global_Objects/Collator", "Intl.Collator")}}</dt> + <dd>collators的构造函数，用于启用对语言敏感的字符串比较的对象。</dd> + <dt>{{jsxref("Global_Objects/DateTimeFormat", "Intl.DateTimeFormat")}}</dt> + <dd>用于启用语言敏感的日期和时间格式的对象的构造函数。</dd> + <dt>{{jsxref("Global_Objects/ListFormat", "Intl.ListFormat")}}</dt> + <dd>Constructor for objects that enable language-sensitive list formatting.</dd> + <dt>{{jsxref("Global_Objects/NumberFormat", "Intl.NumberFormat")}}</dt> + <dd>用于启用语言敏感数字格式的对象的构造函数。</dd> + <dt>{{jsxref("Global_Objects/PluralRules", "Intl.PluralRules")}}</dt> + <dd>用于启用多种敏感格式和多种语言语言规则的对象的构造函数。</dd> + <dt>{{jsxref("Global_Objects/RelativeTimeFormat", "Intl.RelativeTimeFormat")}}</dt> + <dd>Constructor for objects that enable language-sensitive relative time formatting.</dd> +</dl> + +<h2 id="方法">方法</h2> + +<dl> + <dt>{{jsxref("Intl.getCanonicalLocales()")}}</dt> + <dd>返回规范区域名称（canonical locale name）。</dd> +</dl> + +<h2 id="语言区域识别和判定">语言区域识别和判定</h2> + +<p>国际化的构造函数和其他构造函数的几个语言敏感的方法（可参考下方的{{anch("See_also", "参见")}}）一样，使用同样的模式来识别语言区域和确定使用哪一种语言格式：他们都接收 <code>locales</code> 和 <code>options</code> 参数，使用 <code>options.localeMatcher</code> 属性指定的一个算法来对比应用请求的和支持的语言区域，来确定使用哪一个语言区域。</p> + +<h3 id="locales_参数"><code>locales</code> 参数</h3> + +<p><code>locales</code> 参数必须是一个 <a href="http://tools.ietf.org/html/rfc5646">BCP 47 语言标记</a>的字符串，或者是一个包括多个语言标记的数组。如果 <code>locales</code> 参数未提供或者是 undefined，便会使用运行时默认的 locale。</p> + +<p>一个 BCP 47 语言标记代表了一种语言或者区域（两者没有很大的区别）。在其最常见的格式中，它以这样的顺序囊括了这些内容：语言代码，脚本代码，和国家代码，全部由连字符分隔开。例如：</p> + +<ul> + <li><code>"hi"</code>：印地语 (primary language)。</li> + <li><code>"de-AT"</code>：<code>在奥地利使用的德语 (primary language with country code)。</code></li> + <li><code>"zh-Hans-CN"</code>：在中国使用的简体中文 (primary language with script and country codes)。</li> +</ul> + +<p>在 BCP 47 中表示语言，脚本，国家（区域）和变体（少用）的语言子标记含义可以在<a href="http://www.iana.org/assignments/language-subtag-registry/language-subtag-registry"> IANA 语言子标记注册</a>中找到。</p> + +<p>BCP 47 也支持扩展，其中一个和 JavaScript 国际化方法相关的是："u"（Unicode）扩展。它可以用于请求一个自定义区域特定行为的 {{jsxref("Collator")}}，{{jsxref("NumberFormat")}}，或者 {{jsxref("DateTimeFormat")}} 对象。例如：</p> + +<ul> + <li><code>"de-DE-u-co-phonebk"</code>：使用德语的电话簿排序变体，这会把元音变音扩展成字符对：ä → ae, ö → oe, ü → ue。</li> + <li><code>"th-TH-u-nu-thai"</code>：在数字格式中使用泰语的数值表示（๐, ๑, ๒, ๓, ๔, ๕, ๖, ๗, ๘, ๙）</li> + <li><code>"ja-JP-u-ca-japanese"：在日期和时间格式化中使用日本的日历表示方式，所以 2013 会表示为平成 25。</code></li> + <li><code>"en-GB-u-ca-islamic"</code>: use British English with the Islamic (Hijri) calendar, where the Gregorian date 14 October, 2017 is the Hijri date 24 Muharram, 1439.</li> +</ul> + +<h3 id="语言区域判定">语言区域判定</h3> + +<p><code>locales</code> 参数，在除去所有的 Unicode 扩展之后，会被转化成来自应用的优先请求。运行时拿它和可用的语言区域做对比然后选择出最合适的一个。有两种匹配算法：“查找” 匹配遵循 <a href="http://tools.ietf.org/html/rfc5646">BCP 47</a> 中指定的查找算法；“最佳命中” 匹配器会让运行时至少提供一个语言区域，但合适请求的结果可能会比查找算法的要多。如果应用没有提供一个 locales 参数，或者运行时没有一个匹配请求的语言区域，那么会使用运行时默认的语言区域。匹配器可以使用 <code>options</code> 参数的一个属性来进行选择（见下方）。</p> + +<p>如果选中的语言标记有一个 Unicode 扩展子字符串，这个扩展会用于自定义构造对象或者方法的行为。每一个构造函数或者方法仅支持 Unicode 扩展定义的 key 的一个子集，和依赖于语言标记的支持的值。例如，<code>“co”</code>这个 key（collation）只在 {{jsxref("Collator")}} 中支持，它的值 “phonebk” 只在德语中支持。</p> + +<h3 id="options_参数"><code>options</code> 参数</h3> + +<p><code>options</code> 参数必须是一个对象，其属性值在不同的构造函数和方法中会有所变化。如果 <code>options</code> 参数未提供或者为 undefined，所有的属性值则使用默认的。</p> + +<p>所有语言敏感的构造函数和方法都支持的一个属性是：<code>localeMatcher</code> 属性，它的值必须是字符串 “lookup” 或者 “best fit”，用于选择上边描述的语言区域匹配算法。</p> + +<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('ES Int 1.0', '#sec-8', 'Intl')}}</td> + <td>{{Spec2('ES Int 1.0')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES Int 2.0', '#sec-8', 'Intl')}}</td> + <td>{{Spec2('ES Int 2.0')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES Int Draft', '#intl-object', 'Intl')}}</td> + <td>{{Spec2('ES Int Draft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div class="hidden">The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</div> + +<p>{{Compat("javascript.builtins.Intl")}}</p> + +<h2 id="参见">参见</h2> + +<ul> + <li>介绍：<a href="http://norbertlindenberg.com/2012/12/ecmascript-internationalization-api/index.html">The ECMAScript Internationalization API</a></li> + <li>构造函数 + <ul> + <li>{{jsxref("Collator", "Intl.Collator")}}</li> + <li>{{jsxref("DateTimeFormat", "Intl.DateTimeFormat")}}</li> + <li>{{jsxref("ListFormat", "Intl.ListFormat")}}</li> + <li>{{jsxref("NumberFormat", "Intl.NumberFormat")}}</li> + <li>{{jsxref("PluralRules", "Intl.PluralRules")}}</li> + <li>{{jsxref("RelativeTimeFormat", "Intl.RelativeTimeFormat")}}</li> + </ul> + </li> + <li>方法 + <ul> + <li>{{jsxref("String.prototype.localeCompare()")}}</li> + <li>{{jsxref("Number.prototype.toLocaleString()")}}</li> + <li>{{jsxref("Date.prototype.toLocaleString()")}}</li> + <li>{{jsxref("Date.prototype.toLocaleDateString()")}}</li> + <li>{{jsxref("Date.prototype.toLocaleTimeString()")}}</li> + </ul> + </li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/intl/listformat/index.html b/files/zh-cn/web/javascript/reference/global_objects/intl/listformat/index.html new file mode 100644 index 0000000000..c80d0bca89 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/intl/listformat/index.html @@ -0,0 +1,115 @@ +--- +title: Intl.ListFormat +slug: Web/JavaScript/Reference/Global_Objects/Intl/ListFormat +tags: + - Intl + - JavaScript + - ListFormat + - 列表格式化 +translation_of: Web/JavaScript/Reference/Global_Objects/Intl/ListFormat +--- +<p>{{JSRef}}</p> + +<p><strong><code>Intl.ListFormat</code></strong> 是一个语言相关的列表格式化构造器。</p> + +<div>{{EmbedInteractiveExample("pages/js/intl-listformat.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre><code>new Intl.ListFormat([<var>locales</var>[, <var>options</var>]]) +</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>locales</code></dt> + <dd> + <p>可选的.。符合 BCP 47 语言标注的字符串或字符串数组。<code>locales</code> 参数的一般形式和相关解释，请参阅 {{jsxref("Global_Objects/Intl", "Intl page", "#Locale_identification_and_negotiation", 1)}}.</p> + </dd> + <dt><code>options</code></dt> + <dd>可选的。 拥有下面所列属性中任意几个或全部的对象： + <ul> + <li><code>localeMatcher</code><br> + 指定要使用的本地匹配算法。可选的值有<code>"lookup"</code> 和 <code>"best fit"</code>；默认情况下使用<code>"best fit"</code>。该参数的更多信息，请参考<a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl#Locale_negotiation" rel="nofollow"><code>Intl</code> page</a>.</li> + <li><code>type</code><br> + 消息输出的格式。可选的值有用于替代基于“且”关系列表的<code>"conjunction"</code> (默认值， 例如： <code>A, B, and C</code>)， 或者用于替代基于“或”关系列表的 <code>"disjunction"</code>(例如： <code>A, B, or C</code>)，以及用于替代带计量单位的值列表的<code>"unit"</code> (例如： <code>5 pounds, 12 ounces</code>).</li> + <li><code>style</code><br> + 被格式化消息的长度。可选值有：<code>"long"</code> (默认值，例如： <code>A, B, and C</code>)、<code>"short"</code> 或者 <code>"narrow"</code> (例如： <code>A, B, C</code>)。 当<code>style</code> 的值为<code>narrow时，</code>type 属性的值只能取值<code>unit。</code></li> + </ul> + </dd> +</dl> + +<h2 id="描述">描述</h2> + +<h3 id="属性">属性</h3> + +<dl> + <dt>{{jsxref("ListFormat.prototype", "Intl.ListFormat.prototype")}}</dt> + <dd>允许增加一个属性到列表中的所有对象。</dd> +</dl> + +<h3 id="方法">方法</h3> + +<dl> + <dt>{{jsxref("ListFormat.supportedLocalesOf", "Intl.ListFormat.supportedLocalesOf()")}}</dt> + <dd>返回一个包含指定的被支持区域设置的数组，没有时使用运行环境默认区域设置</dd> +</dl> + +<h2 id="示例">示例</h2> + +<h3 id="使用_format">使用 <code>format</code></h3> + +<p>下面的例子展示了用英语语言怎么去创建一个列表格式化器。</p> + +<pre class="brush: js">const list = ['Motorcycle', 'Bus', 'Car']; + + console.log(new Intl.ListFormat('en-GB', { style: 'long', type: 'conjunction' }).format(list)); +// > Motorcycle, Bus and Car + + console.log(new Intl.ListFormat('en-GB', { style: 'short', type: 'disjunction' }).format(list)); +// > Motorcycle, Bus or Car + + console.log(new Intl.ListFormat('en-GB', { style: 'narrow', type: 'unit' }).format(list)); +// > Motorcycle Bus Car +</pre> + +<h3 id="使用_formatToParts">使用 <code>formatToParts</code></h3> + +<p>下面的例子展示了如何创建一个返回被格式化部分的列表格式化器。</p> + +<pre class="brush: js">const list = ['Motorcycle', 'Bus', 'Car']; +console.log(new Intl.ListFormat('en-GB', { style: 'long', type: 'conjunction' }).formatToParts(list)); + +// > [ { "type": "element", "value": "Motorcycle" }, { "type": "literal", "value": ", " }, { "type": "element", "value": "Bus" }, { "type": "literal", "value": ", and " }, { "type": "element", "value": "Car" } ]; +</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 href="https://github.com/tc39/proposal-intl-list-format/">Intl.ListFormat proposal</a></td> + <td>Stage 3</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器支持">浏览器支持</h2> + +<div> + + +<p>{{Compat("javascript.builtins.Intl.ListFormat")}}</p> +</div> + +<h2 id="参考地址">参考地址</h2> + +<div>{{page('/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl', 'See_also')}}</div> diff --git a/files/zh-cn/web/javascript/reference/global_objects/intl/locale/index.html b/files/zh-cn/web/javascript/reference/global_objects/intl/locale/index.html new file mode 100644 index 0000000000..2714245ace --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/intl/locale/index.html @@ -0,0 +1,105 @@ +--- +title: Intl.Locale +slug: Web/JavaScript/Reference/Global_Objects/Intl/Locale +translation_of: Web/JavaScript/Reference/Global_Objects/Intl/Locale +--- +<div>{{JSRef}}</div> + +<p><strong><code>Intl.Locale</code></strong> 对象是 Intl 对象的标准内置属性，用于表示 Unicode 区域标识。</p> + +<div>{{EmbedInteractiveExample("pages/js/intl-locale.html")}}</div> + +<h2 id="描述">描述</h2> + +<p><code><strong>Intl.Locale</strong></code> 对象是为了更便捷地处理 Unicode 区域设置。Unicode 使用字符串作为区域识别标识。区域标识符由<em>语言标识符</em>和<em>扩展标记</em>组成。语言标识符是区域(locale)的核心，包含了语言、脚本和地域子标记(region subtags)。有关区域设置的其他信息体现在可选的扩展标记中。扩展标记保存有关区域设置方面的信息，例如日历类型、时钟类型和编号系统类型。</p> + +<p>传统上，Intl 接口像 Unicode 一样使用字符串来表示区域设置，这是一个简单而轻量且效果好的解决方案。但是，添加一个Locale 类可以更容易地解析和操作语言、脚本、区域以及扩展标记。</p> + +<h2 id="构造函数">构造函数</h2> + +<dl> + <dt>{{jsxref("Locale/Locale", "Intl.Locale()")}}</dt> + <dd>实例化一个 <code>Locale</code> 对象。</dd> +</dl> + +<h2 id="实例属性">实例属性</h2> + +<dl> + <dt><a href="/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Intl/Locale/baseName"><code>Intl.Locale.prototype.baseName</code></a></dt> + <dd>Returns basic, core information about the <code>Locale</code> in the form of a substring of the complete data string.</dd> + <dt><a href="/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Intl/Locale/calendar"><code>Intl.Locale.prototype.calendar</code></a></dt> + <dd>Returns the part of the <code>Locale</code> that indicates the Locale's calendar era.</dd> + <dt><a href="/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Intl/Locale/caseFirst"><code>Intl.Locale.prototype.caseFirst</code></a></dt> + <dd>Returns whether case is taken into account for the locale's collation rules.</dd> + <dt><a href="/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Intl/Locale/collation"><code>Intl.Locale.prototype.collation</code></a></dt> + <dd>Returns the collation type for the <code>Locale</code>, which is used to order strings according to the locale's rules.</dd> + <dt><a href="/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Intl/Locale/hourCycle"><code>Intl.Locale.prototype.hourCycle</code></a></dt> + <dd>Returns the time keeping format convention used by the locale.</dd> + <dt><a href="/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Intl/Locale/language"><code>Intl.Locale.prototype.language</code></a></dt> + <dd>Returns the language associated with the locale.</dd> + <dt><a href="/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Intl/Locale/numberingSystem"><code>Intl.Locale.prototype.numberingSystem</code></a></dt> + <dd>Returns the numeral system used by the locale.</dd> + <dt><a href="/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Intl/Locale/numeric"><code>Intl.Locale.prototype.numeric</code></a></dt> + <dd>Returns whether the locale has special collation handling for numeric characters.</dd> + <dt><a href="/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Intl/Locale/region"><code>Intl.Locale.prototype.region</code></a></dt> + <dd>Returns the region of the world (usually a country) associated with the locale.</dd> + <dt><a href="/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Intl/Locale/script"><code>Intl.Locale.prototype.script</code></a></dt> + <dd>Returns the script used for writing the particular language used in the locale.</dd> +</dl> + +<h2 id="实例方法">实例方法</h2> + +<dl> + <dt><a href="/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Intl/Locale/maximize"><code>Intl.Locale.prototype.maximize()</code></a></dt> + <dd>Gets the most likely values for the language, script, and region of the locale based on existing values.</dd> + <dt><a href="/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Intl/Locale/minimize"><code>Intl.Locale.prototype.minimize()</code></a></dt> + <dd>Gets the most likely values for the language, script, and region of the locale based on existing values.</dd> + <dt><a href="/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Intl/Locale/toString"><code>Intl.Locale.prototype.toString()</code></a></dt> + <dd>Returns the Locale's full locale identifier string.</dd> +</dl> + +<h2 id="范例">范例</h2> + +<h3 id="基本使用">基本使用</h3> + +<p>很简单，就是需要给{{jsxref("Locale/Locale", "Intl.Locale")}} 构造函数传入一个 locale 标识字符串作为参数：</p> + +<pre class="brush: js notranslate">let us = new Intl.Locale('zh-Hans-CN');</pre> + +<h3 id="使用配置实例化">使用配置实例化</h3> + +<p>构造函数支持传入 object 作为配置，object 中可包含多个配置属性。例如，设置 <code><a href="/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Intl/Locale/hourCycle">hourCycle</a></code> 属性，用于设置您所需要的小时周期类型：</p> + +<pre class="brush: js notranslate">let zh12hour = new Intl.Locale("zh-Hans-CN", {hourCycle: "h12"}); +console.log(zh12hour.hourCycle); // Prints "h12"</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 href="https://tc39.github.io/proposal-intl-locale">Intl.Locale proposal</a></td> + <td>Stage 3</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> +<div class="hidden">本页面兼容性表的数据由结构化数据生成。如果你想提供数据，请转到<a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>并且向我们发推送（pull）请求。</div> + +<p>{{Compat("javascript.builtins.Intl.Locale")}}</p> +</div> + +<h2 id="参阅">参阅</h2> + +<ul> + <li> <a href="https://github.com/zbraniecki/Intl.js/tree/intllocale">The Intl.Locale Polyfill</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/intl/numberformat/format/index.html b/files/zh-cn/web/javascript/reference/global_objects/intl/numberformat/format/index.html new file mode 100644 index 0000000000..4e481052b1 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/intl/numberformat/format/index.html @@ -0,0 +1,92 @@ +--- +title: Intl.NumberFormat.prototype.format +slug: Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat/format +translation_of: Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat/format +--- +<div>{{JSRef}}</div> + +<p> <strong><code>Intl.NumberFormat.prototype.format</code></strong> 属性返回一个根据{{jsxref("NumberFormat")}}对象的语言环境和格式化选项，来格式化一个数字的getter函数。</p> + +<div>{{EmbedInteractiveExample("pages/js/intl-numberformat-prototype-format.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><var>numberFormat</var>.format(<var>number</var>)</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>number</code></dt> + <dd>要格式化的数值。</dd> +</dl> + +<h2 id="描述">描述</h2> + +<p>该函数返回一个根据{{jsxref("NumberFormat")}}对象的语言环境和格式化选项，来<code>format</code> 一个数字的函数。</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用_format">使用 <code>format</code></h3> + +<p>使用 <code>format</code> 格式化一个单一的货币值, 以俄罗斯为例:</p> + +<pre class="brush: js">var options = { style: 'currency', currency: 'RUB' }; +var numberFormat = new Intl.NumberFormat('ru-RU', options); +console.log(numberFormat.format(654321.987)); +// → "654 321,99 руб." +</pre> + +<h3 id="使用_format_和_map">使用 <code>format</code> 和 <code>map</code></h3> + +<p>使用 <code>format</code> 返回的函数来格式化数组中的所有数字。注意，该函数绑定到所获得的{{jsxref("NumberFormat")}}，因此它可以直接传递给{{jsxref("Array.prototype.map")}}。</p> + +<pre class="brush: js">var a = [123456.789, 987654.321, 456789.123]; +var numberFormat = new Intl.NumberFormat('es-ES'); +var formatted = a.map(numberFormat.format); +console.log(formatted.join('; ')); +// → "123.456,789; 987.654,321; 456.789,123" +</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>{{SpecName('ES Int 1.0', '#sec-11.3.2', 'Intl.NumberFormat.prototype.format')}}</td> + <td>{{Spec2('ES Int 1.0')}}</td> + <td>初始定义</td> + </tr> + <tr> + <td>{{SpecName('ES Int 2.0', '#sec-11.3.2', 'Intl.NumberFormat.prototype.format')}}</td> + <td>{{Spec2('ES Int 2.0')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES Int Draft', '#sec-Intl.NumberFormat.prototype.format', 'Intl.NumberFormat.prototype.format')}}</td> + <td>{{Spec2('ES Int Draft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> +<div class="hidden">The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>and send us a pull request.</div> + +<p>{{Compat("javascript.builtins.Intl.NumberFormat.format")}}</p> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("NumberFormat", "Intl.NumberFormat")}}</li> + <li>{{jsxref("Number.prototype.toLocaleString()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/intl/numberformat/index.html b/files/zh-cn/web/javascript/reference/global_objects/intl/numberformat/index.html new file mode 100644 index 0000000000..51520c2b83 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/intl/numberformat/index.html @@ -0,0 +1,247 @@ +--- +title: Intl.NumberFormat +slug: Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat +tags: + - Intl + - 国际化 +translation_of: Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat +--- +<div>{{JSRef}}</div> + +<p><strong><code>Intl.NumberFormat是对语言敏感的格式化数字类的构造器类</code></strong></p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code>new Intl.NumberFormat([<var>locales</var>[, <var>options</var>]]) +Intl.NumberFormat.call(<var>this</var>[, <var>locales</var>[, <var>options</var>]]) +</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>locales</code></dt> + <dd> + <p>可选。缩写语言代码（BCP 47 language tag，例如: cmn-Hans-CN）的字符串或者这些字符串组成的数组. 关于参数 locales 的一般形式和解释请参见<a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Intl#Locale_identification_and_negotiation" title="国际化的构造函数和其他构造函数的几个语言敏感的方法（可见See also）一样，使用同样的模式来识别语言区域和确定使用哪一种语言格式：他们都接收 locales 和 options 参数，使用 options.localeMatcher 属性指定的一个算法来对比应用请求的和支持的语言区域，来确定使用哪一个语言区域。">Intl page</a>. 下面的这些 Unicode 扩展键也是被允许的:</p> + + <p>译者注:下面扩展的使用方式是language[-scripts][-region]-u-nu-*,例如:zh-u-nu-hanidec(表示中文十进制数字) </p> + + <dl> + <dt><code>nu</code></dt> + <dd>要使用的编号系统。可能的值有: <code>"arab"</code>, <code>"arabext"</code>, <code>"bali"</code>, <code>"beng"</code>, <code>"deva"</code>, <code>"fullwide"</code>, <code>"gujr"</code>, <code>"guru"</code>, <code>"hanidec"(中文十进制数字)</code>, <code>"khmr"</code>, <code>"knda"</code>, <code>"laoo"</code>, <code>"latn"</code>, <code>"limb"</code>, <code>"mlym"</code>, <code>"mong"</code>, <code>"mymr"</code>, <code>"orya"</code>, <code>"tamldec"</code>, <code>"telu"</code>, <code>"thai"</code>, <code>"tibt"</code>.</dd> + </dl> + </dd> + <dt><code>options</code></dt> + <dd> + <p>可选. 包含一些或所有的下面属性的类:</p> + + <ul> + <li><code>“decimal”</code> 用于纯数字格式；</li> + <li><code>“currency”</code> 用于货币格式；</li> + <li><code>“percent”</code> 用于百分比格式;</li> + <li><code>“unit”</code> {{Experimental_inline}} 用于单位格式</li> + </ul> + + <dl> + <dt><code>localeMatcher</code></dt> + <dd>使用的 local 的匹配算法. 可能的值有 <code>"lookup</code> 和 <code>"best fit"</code>; 默认值是 <code>"best fit"</code>. 有关此选项更多的信息, 请参见 {{jsxref("Global_Objects/Intl", "Intl page", "#Locale_negotiation", 1)}}.</dd> + <dt><code>style</code></dt> + <dd>要使用的格式样式，默认为 “decimal”。</dd> + <dt><code>numberingSystem</code> {{Experimental_inline}}</dt> + <dd>编号系统。可能的值包括："<code>arab</code>"，"<code>arabext</code>"，" <code>bali</code>"，"<code>beng</code>"，"<code>deva</code>"，"<code>fullwide</code>"，" <code>gujr</code>"，"<code>guru</code>"，"<code>hanidec</code>"，"<code>khmr</code>"，" <code>knda</code>"，"<code>laoo</code>", "<code>latn</code>"，"<code>limb</code>"，"<code>mlym</code>"，" <code>mong</code>"，"<code>mymr</code>"，"<code>orya</code>"，"<code>tamldec</code>"，" <code>telu</code>"，"<code>thai</code>"，"<code>tibt</code>"。</dd> + <dt><code>unit</code>{{Experimental_inline}}</dt> + <dd><code>unit</code> 格式中使用的单位，可能的值为在 <a href="http://unicode.org/reports/tr35/tr35-general.html#Unit_Elements" rel="nofollow">UTS #35, Part 2, Section 6</a> 定义的核心单元标识符。已从<a href="https://github.com/unicode-org/cldr/blob/master/common/validity/unit.xml">完整列表</a>中选择了一个<a href="https://tc39.es/proposal-unified-intl-numberformat/section6/locales-currencies-tz_proposed_out.html#sec-issanctionedsimpleunitidentifier">单位子集</a>以用于ECMAScript。可以将成对的简单单位与 <code>“ -per-”</code> 连接以组成一个复合单位。没有默认值；如果 <code>style</code> 为 <code>“unit”</code>，必须提供<code>unit</code> 属性。</dd> + <dt><code>unitDisplay</code>{{Experimental_inline}}</dt> + <dd><code>unit</code> 格式化中使用的单位格式化样式，默认值为“ short”。</dd> + <dd> + <ul> + <li><code>“long”</code> (e.g., <code>16 litres</code>)</li> + <li><code>“short“</code> (e.g., <code>16 l</code>)</li> + <li><code>”narrow“</code> (e.g., <code>16l</code>)</li> + </ul> + </dd> + <dt><code>currency</code></dt> + <dd>在货币格式化中使用的货币符号. 可能的值是<em>ISO</em>的货币代码 (the ISO 4217 currency codes,) 例如 <code>"USD"</code> 表示美元, <code>"EUR"</code> 表示欧元, 或者 <code>"CNY"是人民币</code> — 更多请参考 <a href="http://www.currency-iso.org/en/home/tables/table-a1.html">Current currency & funds code list</a>。没有默认值，如果 <code>style</code> 是 <code>“currency”</code>，必须提 <code>currency</code> 属性.</dd> + <dt><code>currencyDisplay</code></dt> + <dd>如何在货币格式化中显示货币. 可能的值有 <code>"symbol"</code> 表示使用本地化的货币符号，例如 €, <code>"code"</code> 表示使用国际标准组织货币代码, <code>"name"</code> 表示使用本地化的货币名称，如 <code>"dollar"</code>; 默认值是 <code>"symbol"</code>.</dd> + <dt><code>useGrouping</code></dt> + <dd>是否使用分组分隔符，如千位分隔符或千/万/亿分隔符。可能的值是 true 和 false，默认值是 true。</dd> + </dl> + + <p>下面的属性分为两组：<code>minimumintegerdigits</code>，<code>minimumfractiondigits</code>，<code>maximumfractiondigits</code> 作为一组，<code>minimumsignificantdigits</code> 和 <code>maximumsignificantdigits</code> 作为一组。如果定义了第二组中的任意一个属性,则忽略第一组的设置.</p> + + <dl> + <dt><code>minimumIntegerDigits</code></dt> + <dd>使用的整数数字的最小数目.可能的值是从1到21,默认值是1.</dd> + <dt><code>minimumFractionDigits</code></dt> + <dd>使用的小数位数的最小数目.可能的值是从 0 到 20；默认为普通的数字和百分比格式为 0；默认为货币格式是由 <a href="http://www.currency-iso.org/en/home/tables/table-a1.html">ISO 4217 currency code list</a> 提供 (如果列表中没有提供则值为 2)。</dd> + <dt><code>maximumFractionDigits</code></dt> + <dd>使用的小数位数的最大数目。可能的值是从 0 到 20；纯数字格式的默认值是<code>minimumfractiondigits</code> 和 3 中大的那一个；货币格式默认值是<code>minimumfractiondigits</code> 和 <a href="http://www.currency-iso.org/en/home/tables/table-a1.html">ISO 4217 currency code list</a> 中大的那一个(如果列表中没有提供则值为2)；百分比格式默认值是 <code>minimumfractiondigits</code> 和 0 中大的那一个。</dd> + <dt><code>minimumSignificantDigits</code></dt> + <dd>使用的有效数字的最小数目。可能的值是从1到21；默认值是1。</dd> + <dt><code>maximumSignificantDigits</code></dt> + <dd>使用的有效数字的最大数量。可能的值是从1到21；默认是 21.</dd> + <dt><code>notation</code>{{Experimental_inline}}</dt> + <dd>该号码应显示的格式，默认为 <code>“standard”</code>。 + <ul> + <li>"<code>standard</code>" 纯数字格式；</li> + <li>"<code>scientific</code>" 返回格式化数字的大小顺序；</li> + <li>"<code>engineering</code>" 当被三除时返回十的指数</li> + <li>"<code>compact</code>" 代表指数的字符串，默认使用 <code>“short”</code> 格式 + <ul> + <li>"<code>compactDisplay</code>" 仅在 <code>notation</code> 为 <code>“compact”</code> 时使用，采用 <code>“short”</code>（默认）或“<code>long</code>”</li> + </ul> + </li> + </ul> + </dd> + </dl> + </dd> +</dl> + +<h2 id="描述">描述</h2> + +<h3 id="属性">属性</h3> + +<dl> + <dt>{{jsxref("NumberFormat.prototype", "Intl.NumberFormat.prototype")}}</dt> + <dd>允许将属性添加到所有对象上。</dd> +</dl> + +<h3 id="方法">方法</h3> + +<dl> + <dt>{{jsxref("NumberFormat.supportedLocalesOf", "Intl.NumberFormat.supportedLocalesOf()")}}</dt> + <dd>返回一个数组包含的那些被提供的可以被支持的locales，运行时的默认的 locale 不会出现在该数组中.</dd> +</dl> + +<h2 id="NumberFormat_实例"><code>NumberFormat</code> 实例</h2> + +<h3 id="属性_2">属性</h3> + +<p><code>NumberFormat</code> 实例继承一下原型的属性:</p> + +<div>{{page('/en-US/docs/Web/JavaScript/Reference/Global_Objects/NumberFormat/prototype', 'Properties')}}</div> + +<h3 id="方法_2">方法</h3> + +<p><code>NumberFormat</code> 实例继承一下原型的方法:</p> + +<div>{{page('/en-US/docs/Web/JavaScript/Reference/Global_Objects/NumberFormat/prototype', 'Methods')}}</div> + +<h2 id="例子">例子</h2> + +<h3 id="基本用法">基本用法</h3> + +<p>在不指定locale的基本用法中, 一个使用默认locale和默认options的字符串被返回.</p> + +<pre class="brush: js">var number = 3500; + +console.log(new Intl.NumberFormat().format(number)); +// 如果在美国英语地区 → '3,500' +</pre> + +<h3 id="使用locales">使用<code>locales</code></h3> + +<p>这个例子显示了一些本地化的数字格式的一些变化。为了获得用于您的应用程序的用户界面的语言格式，请确保设定了语言（可能还有一些回退语言）参数：</p> + +<pre class="brush: js">var number = 123456.789; + +// 德语使用逗号作为小数点,使用.作为千位分隔符 +console.log(new Intl.NumberFormat('de-DE').format(number)); +// → 123.456,789 + +// 大多数阿拉伯语国家使用阿拉伯语数字 +console.log(new Intl.NumberFormat('ar-EG').format(number)); +// → ١٢٣٤٥٦٫٧٨٩ + +// India uses thousands/lakh/crore separators +console.log(new Intl.NumberFormat('en-IN').format(number)); +// → 1,23,456.789 + +// 通过编号系统中的nu扩展键请求, 例如<code>中文十进制数字</code> +console.log(new Intl.NumberFormat('zh-Hans-CN-u-nu-hanidec').format(number)); +// → 一二三,四五六.七八九 + +//当请求的语言不被支持,例如巴里,包含一个回滚语言印尼,这时候就会使用印尼语 +console.log(new Intl.NumberFormat(['ban', 'id']).format(number)); +// → 123.456,789 +</pre> + +<h3 id="可用的选项">可用的选项</h3> + +<p>可用的选项参数,返回的值可以被设置成想要的形式：</p> + +<pre class="brush: js">var number = 123456.789; + +// 请求一个货币格式 +console.log(new Intl.NumberFormat('de-DE', { style: 'currency', currency: 'EUR' }).format(number)); +// → 123.456,79 € + +// the Japanese yen doesn't use a minor unit +console.log(new Intl.NumberFormat('ja-JP', { style: 'currency', currency: 'JPY' }).format(number)); +// → ￥123,457 + +// 只显示三个有效数字 +console.log(new Intl.NumberFormat('en-IN', { maximumSignificantDigits: 3 }).format(number)); +// → 1,23,000 + +</pre> + +<h3 id="Using_notation">Using <font face="consolas, Liberation Mono, courier, monospace">notation</font></h3> + +<pre><code>console.log(new Intl.NumberFormat('en-US', { notation: "scientific" }).format(987654321)); +// → 9.877E8 + +console.log(new Intl.NumberFormat('pt-PT', { notation: "scientific" }).format(987654321)); +// → 9,877E8 + +console.log(new Intl.NumberFormat('en-GB', { notation: "engineering" }).format(987654321)); +// → 987.654E6 + +console.log(new Intl.NumberFormat('de', { notation: "engineering" }).format(987654321)); +// → 987,654E6 + +console.log(new Intl.NumberFormat('zh-CN', { notation: "compact" }).format(987654321)); +// → 9.9亿 + +console.log(new Intl.NumberFormat('fr', { notation: "compact" , compactDisplay: "long" }).format(987654321)); +// → 988 millions + +console.log(new Intl.NumberFormat('en-GB', { notation: "compact" , compactDisplay: "short" }).format(987654321)); +// → 988M</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>{{SpecName('ES Int 1.0', '#sec-11.1', 'Intl.NumberFormat')}}</td> + <td>{{Spec2('ES Int 1.0')}}</td> + <td>初始定义</td> + </tr> + <tr> + <td>{{SpecName('ES Int 2.0', '#sec-11.1', 'Intl.NumberFormat')}}</td> + <td>{{Spec2('ES Int 2.0')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES Int Draft', '#numberformat-objects', 'Intl.NumberFormat')}}</td> + <td>{{Spec2('ES Int Draft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div></div> + +<div id="compat-mobile">{{Compat("javascript.builtins.Intl.NumberFormat")}}</div> + +<h2 id="参见">参见</h2> + +<div>{{page('/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl', 'See_also')}}</div> diff --git a/files/zh-cn/web/javascript/reference/global_objects/intl/pluralrules/index.html b/files/zh-cn/web/javascript/reference/global_objects/intl/pluralrules/index.html new file mode 100644 index 0000000000..e6da9a523c --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/intl/pluralrules/index.html @@ -0,0 +1,150 @@ +--- +title: Intl.PluralRules +slug: Web/JavaScript/Reference/Global_Objects/Intl/PluralRules +translation_of: Web/JavaScript/Reference/Global_Objects/Intl/PluralRules +--- +<div><font><font><font><font>{{JSRef}}</font></font></font></font></div> + +<p><font><font><font><font>该</font></font></font></font><font><font><font><font>对象的英文请立即获取iTunes多种敏感格式状语从句：多种语言规则</font></font></font><font><font><font>的</font></font></font><font><font><font>对象的构造函数。</font></font></font></font><strong><code>Intl.PluralRules</code></strong></p> + +<h2 id="句法"><font><font><font><font>句法</font></font></font></font></h2> + +<pre class="syntaxbox"><code>new Intl.PluralRules([<var>locales</var>[, <var>options</var>]]) Intl.PluralRules.call(<var>this</var>[, <var>locales</var>[, <var>options</var>]]) +</code></pre> + +<h3 id="参数"><font><font><font><font>参数</font></font></font></font></h3> + +<dl> + <dt><code>locales</code></dt> + <dd> + <p><font><font><font><font>可选的。</font></font></font><font><font><font>一个带有BCP 47语言标签的字符串或这种字符串的数组。</font></font></font><font><font><font>有关参数的一般形式和解释</font></font></font></font><code>locales</code><font><font><font><font>，请参阅</font></font></font></font>{{jsxref("Intl", "Intl page", "#Locale_identification_and_negotiation", 1)}}<font><font><font><font>。</font></font></font></font></p> + </dd> + <dt><code>options</code></dt> + <dd> + <p><font><font><font><font>可选的，</font></font></font><font><font><font>具有部分或全部以下属性的对象：</font></font></font></font></p> + + <dl> + <dt><code>localeMatcher</code></dt> + <dd><font><font><font><font>要使用的语言环境匹配算法。</font></font></font><font><font><font>可能的值是</font></font></font></font><code>"lookup"</code><font><font><font><font>和</font></font></font></font><code>"best fit"</code><font><font><font><font>; </font></font></font><font><font><font>默认是</font></font></font></font><code>"best fit"</code><font><font><font><font>。</font></font></font><font><font><font>有关此选项的信息，请参阅</font></font></font></font>{{jsxref("Global_Objects/Intl", "Intl page", "#Locale_negotiation", 1)}}<font><font><font><font>。</font></font></font></font></dd> + <dt><code>type</code></dt> + <dd><font><font><font><font>要使用的类型。</font></font></font><font><font><font>可能的值是：</font></font></font></font> + <ul> + <li><code>"cardinal"</code><font><font><font><font>对于基数（指的是事物的数量）。</font></font></font><font><font><font>这是默认值。</font></font></font></font></li> + <li><code>"ordinal"</code><font><font><font><font> 对于序号（指的是事物的排序或排名，例如英文中的“1st”，“2nd”，“3rd”）。</font></font></font></font></li> + </ul> + </dd> + </dl> + </dd> +</dl> + +<h2 id="描述"><font><font><font><font>描述</font></font></font></font></h2> + +<h3 id="属性"><font><font><font><font>属性</font></font></font></font></h3> + +<dl> + <dt>{{jsxref("PluralRules.prototype", "Intl.PluralRules.prototype")}}</dt> + <dd><font><font><font><font>允许为所有对象添加属性。</font></font></font></font></dd> +</dl> + +<h3 id="方法"><font><font><font><font>方法</font></font></font></font></h3> + +<dl> + <dt>{{jsxref("PluralRules.supportedLocalesOf", "Intl.PluralRules.supportedLocalesOf()")}}</dt> + <dd><font><font><font><font>返回一个数组，其中包含提供的语言环境的支持，而不必回退到运行时的默认语言环境。</font></font></font></font></dd> +</dl> + +<h2 id="PluralRules_实例"><code>PluralRules</code><font><font><font><font> 实例</font></font></font></font></h2> + +<h3 id="属性_2"><font><font><font><font>属性</font></font></font></font></h3> + +<p><code>PluralRules</code><font><font><font><font> 实例从其原型继承了以下属性：</font></font></font></font></p> + +<div>{{page('/en-US/docs/Web/JavaScript/Reference/Global_Objects/PluralRules/prototype', 'Properties')}}</div> + +<h3 id="方法_2"><font><font><font><font>方法</font></font></font></font></h3> + +<p><code>PluralRules</code><font><font><font><font> 实例从它们的原型继承了以下方法：</font></font></font></font></p> + +<div>{{page('/en-US/docs/Web/JavaScript/Reference/Global_Objects/PluralRules/prototype', 'Methods')}}</div> + +<h2 id="例子"><font><font><font><font>例子</font></font></font></font></h2> + +<h3 id="基本用法"><font><font><font><font>基本用法</font></font></font></font></h3> + +<p><font><font><font><font>在没有指定语言环境的基本使用中</font><font>，返回默认语言环境中的格式化字符串和默认选项</font><font>。</font></font></font><font><font><font>这有助于区分单数和复数形式，例如“dog”和“dogs”。</font></font></font></font></p> + +<pre class="brush: js">var pr = new Intl.PluralRules(); + +pr.select(0); +// → 'other' if in US English locale + +pr.select(1); +// → 'one' if in US English locale + +pr.select(2); +// → 'other' if in US English locale</pre> + +<h3 id="运用_locales"><font><font><font><font>运用 </font></font></font></font><code>locales</code></h3> + +<p><font><font><font><font>这个例子展示了局部复数规则的一些变化。</font></font></font><font><font><font>为了获得应用程序用户界面中使用的语言格式，请确保使用</font></font></font></font><code>locales</code><font><font><font><font>参数</font></font></font><font><font><font>指定该语言（可能还有一些备用语言）</font></font></font><font><font><font>：</font></font></font></font></p> + +<pre class="brush: js">// Arabic has different plural rules + +new Intl.PluralRules('ar-EG').select(0); +// → 'zero' +new Intl.PluralRules('ar-EG').select(1); +// → 'one' +new Intl.PluralRules('ar-EG').select(2); +// → 'two' +new Intl.PluralRules('ar-EG').select(6); +// → 'few' +new Intl.PluralRules('ar-EG').select(18); +// → 'many'</pre> + +<h3 id="运用_options"><font><font><font><font>运用 </font></font></font></font><code>options</code></h3> + +<p><font><font><font><font>可以查询查询结果使用</font></font></font></font><code>options</code><font><font><font><font>参数</font></font></font><font><font><font>进行自定义，该</font></font></font><font><font><font>参数具有一个</font></font></font></font><code>type</code><font><font><font><font>您可以设置的</font></font></font><font><font><font>属性</font></font></font></font><code>ordinal</code><font><font><font><font>。</font></font></font><font><font><font>这对计算序数指标很有用，例如“第一”，“第二”，“第三”，“第四”，“42”等。</font></font></font></font></p> + +<pre class="brush: js">var pr = new Intl.PluralRules('en-US', { type: 'ordinal' }); + +pr.select(0); +// → 'other' +pr.select(1); +// → 'one' +pr.select(2); +// → 'two' +pr.select(3); +// → 'few' +pr.select(4); +// → 'other' +pr.select(42); +// → 'two'</pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col"><font><font><font><font>规范</font></font></font></font></th> + <th scope="col"><font><font><font><font>状态</font></font></font></font></th> + <th scope="col"><font><font><font><font>评论</font></font></font></font></th> + </tr> + <tr> + <td><a href="https://rawgit.com/caridy/intl-plural-rules-spec/master/index.html"><font><font><font><font>国际复数规则草案</font></font></font></font></a></td> + <td><font><font><font><font>{{Spec2('ES Int Draft')}}</font></font></font></font></td> + <td><font><font><font><font>初始定义</font></font></font></font></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性"><font><font><font><font>浏览器兼容性</font></font></font></font></h2> + +<div> +<div class="hidden"><font><font><font><font>此页面上的兼容性表格由结构化数据生成</font><font>。</font></font></font><font><font><font>如果您想为数据做出贡献，请查看</font></font></font></font><a href="https://github.com/mdn/browser-compat-data"><font><font><font><font>https://github.com/mdn/browser-compat-data</font></font></font></font></a><font><font><font><font>并向我们发送拉取请求。</font></font></font></font></div> + +<p>{{Compat("javascript.builtins.Intl.PluralRules")}}</p> +</div> + +<h2 id="也可以看看"><font><font><font><font>也可以看看</font></font></font></font></h2> + +<div>{{page('/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl', 'See_also')}}</div> diff --git a/files/zh-cn/web/javascript/reference/global_objects/intl/relativetimeformat/index.html b/files/zh-cn/web/javascript/reference/global_objects/intl/relativetimeformat/index.html new file mode 100644 index 0000000000..561af8a1fe --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/intl/relativetimeformat/index.html @@ -0,0 +1,165 @@ +--- +title: Intl.RelativeTimeFormat +slug: Web/JavaScript/Reference/Global_Objects/Intl/RelativeTimeFormat +translation_of: Web/JavaScript/Reference/Global_Objects/Intl/RelativeTimeFormat +--- +<div> +<div>{{JSRef}}</div> + +<p><strong><code>Intl.RelativeTimeFormat</code></strong>对象启用本地化的相对时间格式。</p> + +<div>{{EmbedInteractiveExample("pages/js/intl-relativetimeformat.html")}}</div> + +<p class="hidden">此交互式示例的源存储在GitHub存储库中。如果您想参与交互式示例项目,请克隆<a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a>并向我们发送拉取请求。</p> + +<h2 id="句法">句法</h2> + +<pre class="notranslate"><code>new Intl.RelativeTimeFormat([<var>locales</var>[, <var>options</var>]]) +</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>locales</code></dt> + <dd> + <p>可选的。带有BCP 47语言标记的字符串,或此类字符串的数组。有关参数的一般形式和解释<code>locales</code>,请参阅{{jsxref("Global_Objects/Intl","Intl page","＃Locale_identification_and_negotiation",1)}}。</p> + </dd> + <dt><code>options</code></dt> + <dd>可选的。具有以下部分或全部属性的对象： + <ul> + <li><code>localeMatcher</code><br> + 要使用的区域设置匹配算法。可能的值是<code>"lookup"</code>和<code>"best fit"</code>; 默认是<code>"best fit"</code>。有关此选项的信息,请参阅<a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl#Locale_negotiation" rel="nofollow"><code>Intl</code></a>。</li> + <li><code>numeric</code><br> + 输出消息的格式。可能的值是： + <ul> + <li><code>"always"</code>(默认,例如,<code>1 day ago</code>),</li> + <li>或<code>"auto"</code>(例如<code>yesterday</code>)。该<code>"auto"</code>值允许不必总是在输出中使用数值。</li> + </ul> + </li> + <li><code>style</code><br> + 国际化信息的长度。可能的值是： + <ul> + <li><code>"long"</code>(默认,例如,<code>in 1 month</code>)</li> + <li><code>"short"</code>(例如<code>in 1 mo.</code>),</li> + <li>或<code>"narrow"</code>(例如<code>in 1 mo.</code>)。狭窄的风格可能类似于某些语言环境的短风格。</li> + </ul> + </li> + </ul> + </dd> +</dl> + +<h2 id="描述">描述</h2> + +<h3 id="属性">属性</h3> + +<dl> + <dt>{{jsxref("RelativeTimeFormat.prototype","Intl.RelativeTimeFormat.prototype")}}</dt> + <dd>允许向所有对象添加属性。</dd> +</dl> + +<h3 id="方法">方法</h3> + +<dl> + <dt>{{jsxref("RelativeTimeFormat.supportedLocalesOf","Intl.RelativeTimeFormat.supportedLocalesOf()")}}</dt> + <dd>返回一个数组,其中包含所支持的语言环境,而不必回退到运行时的默认语言环境。</dd> +</dl> + +<h2 id="RelativeTimeFormat_实例"><code>RelativeTimeFormat</code> 实例</h2> + +<h3 id="属性_2">属性</h3> + +<p><code>RelativeTimeFormat</code> 实例从其原型继承以下属性：</p> + +<p>{{page('/en-US/docs/Web/JavaScript/Reference/Global_Objects/RelativeTimeFormat/prototype','Properties')}}</p> + +<h3 id="方法_2">方法</h3> + +<p><code>RelativeTimeFormat</code> 实例从其原型继承以下方法：</p> + +<p>{{page('/en-US/docs/Web/JavaScript/Reference/Global_Objects/RelativeTimeFormat/prototype','Methods')}}</p> + +<h2 id="例子">例子</h2> + +<h3 id="基本format用法">基本<code>format</code>用法</h3> + +<p>以下示例显示如何使用英语创建相对时间格式化程序。</p> + +<pre class="brush: js notranslate">//在语言环境中创建相对时间格式化程序 +//显式传入默认值。 +const rtf = new Intl.RelativeTimeFormat("en",{ + localeMatcher: "bestfit",//其他值："lookup" + numeric: "always",//其他值："auto" + style: "long",//其他值："short"或"narrow" +}); + +//使用负值(-1)格式化相对时间。 +rtf.format(-1,"day"); +//>"1 day ago" + +//使用正值(1)格式化相对时间。 +rtf.format(1,"day"); +//>"in 1 day"</pre> + +<h3 id="使用auto选项">使用<code>auto</code>选项</h3> + +<p>如果<code>numeric:auto</code>选项被传递,它将生成字符串<code>yesterday</code>或<code>tomorrow</code>代替<code>1 day ago</code>或<code>in 1 day</code>。这允许不必总是在输出中使用数值。</p> + +<pre class="brush: js notranslate">//在语言环境中创建相对时间格式化程序 +//使用数字：传入"auto"选项值。 +const rtf = new Intl.RelativeTimeFormat("en",{numeric: "auto"}); + +//使用负值(-1)格式化相对时间。 +rtf.format(-1,"day"); +//>"yesterday" + +//使用正日单位(1)格式化相对时间。 +rtf.format(1,"day"); +//>"tomorrow" +</pre> + +<h3 id="运用_formatToParts">运用 <code>formatToParts</code></h3> + +<p>以下示例显示如何创建返回格式化部件的相对时间格式器</p> + +<pre class="brush: js notranslate">const rtf = new Intl.RelativeTimeFormat("en",{numeric: "auto"}); + +//使用日期单位格式化相对时间。 +rtf.formatToParts(-1,"day"); +//> [{type: "literal",value: "yesterday"}] + +rtf.formatToParts(100,"day"); +//> [{type: "literal",value: "in"}, +//> {type: "integer",value: "100",unit: "day"}, +//> {type: "literal",value: "days"}]</pre> +</div> + +<h2 id="Specifications">Specifications</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 href="https://tc39.es/proposal-intl-relative-time/#sec-intl-relativetimeformat-constructor">Intl.RelativeTimeFormat Constructor</a></td> + <td>Stage 3</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility">Browser compatibility</h2> + +<div> + + +<p>{{Compat("javascript.builtins.Intl.RelativeTimeFormat")}}</p> + +<h2 id="See_also">See also</h2> + +<ul> + <li><a href="https://developers.google.com/web/updates/2018/10/intl-relativetimeformat">The Intl.RelativeTimeFormat API</a></li> +</ul> +</div> diff --git a/files/zh-cn/web/javascript/reference/global_objects/isfinite/index.html b/files/zh-cn/web/javascript/reference/global_objects/isfinite/index.html new file mode 100644 index 0000000000..b8f1c4d53c --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/isfinite/index.html @@ -0,0 +1,107 @@ +--- +title: isFinite() +slug: Web/JavaScript/Reference/Global_Objects/isFinite +tags: + - JavaScript + - isFinite +translation_of: Web/JavaScript/Reference/Global_Objects/isFinite +--- +<div>{{jsSidebar("Objects")}}</div> + +<p>该全局 <strong><code>isFinite()</code></strong> 函数用来判断被传入的参数值是否为一个有限数值（finite number）。在必要情况下，参数会首先转为一个数值。</p> + +<div>{{EmbedInteractiveExample("pages/js/globalprops-isfinite.html")}}</div> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox language-html" style="margin-bottom: 0px; padding: 1em; border-left-width: 6px; border-left-style: solid; font-family: Consolas, Monaco, 'Andale Mono', monospace; font-size: 14px; direction: ltr; white-space: normal; text-shadow: none; background-color: rgba(212, 221, 228, 0.498039);">isFinite(<em>testValue</em>)</pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>testValue</code></dt> + <dd>用于检测有限性（finiteness）的值。</dd> +</dl> + +<h3 id="Description" name="Description">描述</h3> + +<dl> + <dd>isFinite 是全局的方法，不与任何对象有关系。</dd> +</dl> + +<p>你可以用这个方法来判定一个数字是否是有限数字。<code>isFinite</code> 方法检测它参数的数值。如果参数是 <code>NaN</code>，正无穷大或者负无穷大，会返回<code>false</code>，其他返回 <code>true</code>。</p> + +<h2 id="Examples" name="Examples" style="margin-bottom: 20px; line-height: 30px;">示例</h2> + +<pre class="brush: js language-js" style="padding: 1em 0px 1em 30px; border-left-width: 6px; border-left-style: solid; font-family: Consolas, Monaco, 'Andale Mono', monospace; font-size: 14px; direction: ltr; white-space: normal; text-shadow: none; background-color: rgba(234, 239, 242, 0.247059);"><code class="language-js" style="font-family: Consolas, Monaco, 'Andale Mono', monospace; direction: ltr; white-space: pre; color: inherit; text-shadow: none;"><span class="function token">isFinite<span class="punctuation token" style="color: #999999;">(</span></span><span class="number token" style="color: #990055;">Infinity</span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span> <span class="comment token" style="color: #708090; display: inherit;"> // false +</span><span class="function token">isFinite<span class="punctuation token" style="color: #999999;">(</span></span><span class="number token" style="color: #990055;">NaN</span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span> <span class="comment token" style="color: #708090; display: inherit;"> // false +</span><span class="function token">isFinite<span class="punctuation token" style="color: #999999;">(</span></span><span class="operator token" style="background: rgba(255, 255, 255, 0.498039); color: #a67f59;">-</span><span class="number token" style="color: #990055;">Infinity</span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span><span class="comment token" style="color: #708090; display: inherit;"> // false +</span> +<span class="function token">isFinite<span class="punctuation token" style="color: #999999;">(</span></span><span class="number token" style="color: #990055;">0</span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span> <span class="comment token" style="color: #708090; display: inherit;"> // true +</span><span class="function token">isFinite<span class="punctuation token" style="color: #999999;">(</span></span><span class="number token" style="color: #990055;">2e64</span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span> <span class="comment token" style="color: #708090; display: inherit;"> // true, 在更强壮的Number.isFinite(null)中将会得到false +</span> + +<span class="function token">isFinite<span class="punctuation token" style="color: #999999;">(</span></span><span class="string token" style="color: #669900;">"0"</span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span> <span class="comment token" style="color: #708090; display: inherit;"> // true, 在更强壮的Number.isFinite('0')中将会得到false</span></code></pre> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 0px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 19px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 38px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 57px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 76px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 95px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 114px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 133px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 152px; background: 0px 0px;"> </div> + +<h2 id="规范" style="margin-bottom: 20px; line-height: 30px;">规范</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('ES3')}}</td> + <td>{{Spec2('ES3')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.1.2.5', 'isFinite')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-isfinite-number', 'isFinite')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-isfinite-number', 'isFinite')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性" style="margin-bottom: 20px; line-height: 30px;">浏览器兼容性</h2> + +<p>{{Compat("javascript.builtins.isFinite")}}</p> + +<h2 id="See_Also" name="See_Also" style="margin-bottom: 20px; line-height: 30px;">相关链接</h2> + +<ul> + <li>{{jsxref("Number.isFinite()")}}</li> + <li>{{jsxref("Number.NaN()")}}</li> + <li>{{jsxref("Number.POSITIVE_INFINITY")}}</li> + <li>{{jsxref("Number.NEGATIVE_INFINITY")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/isnan/index.html b/files/zh-cn/web/javascript/reference/global_objects/isnan/index.html new file mode 100644 index 0000000000..e9fd9ff613 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/isnan/index.html @@ -0,0 +1,192 @@ +--- +title: isNaN() +slug: Web/JavaScript/Reference/Global_Objects/isNaN +tags: + - JavaScript + - Method + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/isNaN +--- +<div>{{jsSidebar("Objects")}}</div> + +<p><code><strong>isNaN()</strong></code> 函数用来确定一个值是否为{{jsxref("NaN")}} 。注：<code>isNaN</code>函数内包含一些非常有趣的<a href="#Description">规则</a>；你也可以使用 ECMAScript 2015 中定义的 {{jsxref("Number.isNaN()")}} 来判断。</p> + +<p>{{EmbedInteractiveExample("pages/js/globalprops-isnan.html")}}</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code>isNaN(value)</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>value</code></dt> + <dd>要被检测的值。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>如果给定值为 {{jsxref("NaN")}}则返回值为<code>true</code>；否则为<code>false</code>。</p> + +<h2 id="Description" name="Description">描述</h2> + +<h3 id="The_necessity_of_an_isNaN_function" name="The_necessity_of_an_isNaN_function"><code>isNaN</code> 函数的必要性</h3> + +<p>与 JavaScript 中其他的值不同，{{jsxref("Global_Objects/NaN", "NaN")}}不能通过相等操作符（== 和 ===）来判断 ，因为 <code>NaN == NaN</code> 和 <code>NaN === NaN</code> 都会返回 <code>false</code>。 因此，<code>isNaN</code> 就很有必要了。</p> + +<h3 id="Origin_of_NaN_values" name="Origin_of_NaN_values"><code>NaN值</code>的产生</h3> + +<p><font face="Courier New, Andale Mono, monospace">当算术运算返回一个未定义的或无法表示的值时，<code>NaN</code>就产生了。但是，<code>NaN</code>并不一定用于表示某些值超出表示范围的情况。</font><font face="Consolas, Monaco, 'Andale Mono', monospace">将某些不能强制转换为数值的非数值转换为数值的时候，也会得到<code>NaN</code></font>。</p> + +<p>例如，0 除以0会返回<code>NaN </code>—— 但是其他数除以0则不会返回<code>NaN</code>。</p> + +<h3 id="令人费解的怪异行为">令人费解的怪异行为</h3> + +<p>如果<code>isNaN</code>函数的参数不是<code>Number</code>类型， <code>isNaN</code>函数会首先尝试将这个参数转换为数值，然后才会对转换后的结果是否是{{jsxref("NaN")}}进行判断。因此，对于能被强制转换为有效的非NaN数值来说（空字符串和布尔值分别会被强制转换为数值0和1），返回<code>false</code>值也许会让人感觉莫名其妙。比如说，空字符串就明显“不是数值（not a number）”。这种怪异行为起源于："不是数值（not a number）"在基于IEEE-754数值的浮点计算体制中代表了一种特定的含义。<code>isNaN</code>函数其实等同于回答了这样一个问题：被测试的值在被强制转换成数值时会不会返回IEEE-754中所谓的“不是数值（not a number）”。</p> + +<p>下一个版本的ECMAScript (ES2015)包含{{jsxref("Number.isNaN()")}}函数。通过<code>Number.isNaN(x)</code>来检测变量<code>x</code>是否是一个<code>NaN</code><font face="'Open Sans', sans-serif">将会是一种可靠的做法</font>。然而，在缺少<code>Number.isNaN</code>函数的情况下, 通过表达式<code>(x != x)</code> 来检测<code>变量x</code>是否是<code>NaN</code>会更加可靠。</p> + +<p>一个<code>isNaN</code>的 polyfill 可以理解为（这个polyfill利用了<code>NaN</code>自身永不相等于自身这一特征 ）：</p> + +<pre class="brush: js line-numbers language-js"><code class="language-js"><span class="keyword token">var</span> isNaN <span class="operator token">=</span> <span class="keyword token">function</span><span class="punctuation token">(</span>value<span class="punctuation token">)</span> <span class="punctuation token">{</span> + <span class="keyword token">var</span> n <span class="operator token">=</span> <span class="function token">Number</span><span class="punctuation token">(</span>value<span class="punctuation token">)</span><span class="punctuation token">;</span> + <span class="keyword token">return</span> n <span class="operator token">!==</span> n<span class="punctuation token">;</span> +<span class="punctuation token">}</span><span class="punctuation token">;</span></code></pre> + +<h2 id="Examples" name="Examples">示例</h2> + +<pre class="brush: js">isNaN(NaN); // true +isNaN(undefined); // true +isNaN({}); // true + +isNaN(true); // false +isNaN(null); // false +isNaN(37); // false + +// strings +isNaN("37"); // false: 可以被转换成数值37 +isNaN("37.37"); // false: 可以被转换成数值37.37 +isNaN("37,5"); // true +isNaN('123ABC'); // true: parseInt("123ABC")的结果是 123, 但是Number("123ABC")结果是 NaN +isNaN(""); // false: 空字符串被转换成0 +isNaN(" "); // false: 包含空格的字符串被转换成0 + +// dates +isNaN(new Date()); // false +isNaN(new Date().toString()); // true + +isNaN("blabla") // true: "blabla"不能转换成数值 + // 转换成数值失败， 返回NaN +</pre> + +<h3 id="有用的特殊行为">有用的特殊行为</h3> + +<p>有许多方式来看待<code>isNaN()</code>：如果<code>isNaN(x)</code>返回false，那么x在任何算数表达式中都不会使表达式等于NaN；如果返回true，x会使所有算数表达式返回NaN。这就意味着，在JavaScript中，isNaN(x)==true等价于x-0=NaN(在JavaScript中 x-0 == NaN 总是返回false，所以你不用去测试它)。实际上， <code>isNaN(x)</code>, <code>isNaN(x - 0)</code>,<code>isNaN(Number(x))</code>, <code>Number.isNaN(x - 0)</code>,和<code>Number.isNaN(Number(x))</code> 的返回值都是一样的 并且在JavaScript中isNaN(x)是这些表达式中最短的表达。</p> + +<p>举个例子，可以利用这个特殊行为来检测函数的参数是可运算的（可以像number一样进行加减乘除等运算）。如果不可运算，则可赋予这个参数一个默认的值或其他合适的内容。这样，就可以得到一个隐式转换参数值的函数，而这得益于Javascript的全功能性。</p> + +<h2 id="例子">例子</h2> + +<pre class="brush: js">function increment(x) { + if (isNaN(x)) x = 0; + return x + 1; +}; + +// The same effect with Number.isNaN(): +function increment(x) { + if (Number.isNaN(Number(x))) x = 0; + return x + 1; +}; + +// In the following cases for the function's argument x, +// isNaN(x) is always false, although x is indeed not a +// number, but can be used as such in arithmetical +// expressions +increment(""); // 1: "" is converted to 0 +increment(new String()); // 1: String object representing an empty string is converted to 0 +increment([]); // 1: [] is converted to 0 +increment(new Array()); // 1: Array object representing an empty array is converted to 0 +increment("0"); // 1: "0" is converted to 0 +increment("1"); // 2: "1" is converted to 1 +increment("0.1"); // 1.1: "0.1" is converted to 0.1 +increment("Infinity"); // Infinity: "Infinity" is converted to Infinity +increment(null); // 1: null is converted to 0 +increment(false); // 1: false is converted to 0 +increment(true); // 2: true is converted to 1 +increment(new Date()); // returns current date/time in milliseconds plus 1 + +// In the following cases for the function's argument x, +// isNaN(x) is always false and x is indeed a number +increment(-1); // 0 +increment(-0.1); // 0.9 +increment(0); // 1 +increment(1); // 2 +increment(2); // 3 +// ... and so on ... +increment(Infinity); // Infinity + +// In the following cases for the function's argument x, +// isNaN(x) is always true and x is really not a number, +// thus the function replaces it by 0 and returns 1 +increment(String); // 1 +increment(Array); // 1 +increment("blabla"); // 1 +increment("-blabla"); // 1 +increment(0/0); // 1 +increment("0/0"); // 1 +increment(Infinity/Infinity); // 1 +increment(NaN); // 1 +increment(undefined); // 1 +increment(); // 1 + +// isNaN(x) is always the same as isNaN(Number(x)), +// but the presence of x is mandatory here! +isNaN(x) == isNaN(Number(x)) // true for every value of x, including x == undefined, + // because isNaN(undefined) == true and Number(undefined) returns NaN, + // but ... +isNaN() == isNaN(Number()) // false, because isNaN() == true and Number() == 0</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('ES1')}}</td> + <td>{{Spec2('ES1')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.1.2.4', 'isNaN')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-isnan-number', 'isNaN')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-isnan-number', 'isNaN')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.isNaN")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("NaN")}}</li> + <li>{{jsxref("Number.isNaN()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/iterator/index.html b/files/zh-cn/web/javascript/reference/global_objects/iterator/index.html new file mode 100644 index 0000000000..775c8d60d6 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/iterator/index.html @@ -0,0 +1,188 @@ +--- +title: Iterator +slug: Web/JavaScript/Reference/Global_Objects/Iterator +tags: + - Deprecated +translation_of: Archive/Web/Iterator +--- +<div>{{jsSidebar("Objects")}}</div> + +<div class="warning"><strong>非标准。</strong> <code><strong>Iterator</strong></code> 函数是一个 SpiderMonkey 专有特性，并且会在某一时刻被删除。为将来使用的话，请考虑使用 {{jsxref("Statements/for...of", "for...of")}} 循环和 <a href="/zh-CN/docs/Web/JavaScript/Guide/The_Iterator_protocol">迭代协议</a>。</div> + +<p><code><strong>Iterator</strong></code> 函数返回一个对象，它实现了遗留的迭代协议，并且迭代了一个对象的可枚举属性。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">Iterator(<var>object</var>, [keyOnly])</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>object</code></dt> + <dd>要迭代属性的对象。</dd> + <dt><code>keyOnly</code></dt> + <dd> 如果<code>keyOnly</code>是真值，<code>Iterator.prototype.next</code> <code>只返回property_name</code> 。</dd> +</dl> + +<h2 id="描述">描述</h2> + +<p><code>返回迭代了object的Iterator</code> 实例。如果<code>keyOnly</code>为假值，则<code>Iterator</code> 实例返回每次迭代而生成的 <code>[property_name, property_value]</code> 数组，否则，如果<code>keyOnly</code>是真值，则它返回每次迭代的 <code>property_name</code>。如果<code>object</code> 是 <code>Iterator</code> 实例或 {{jsxref("Generator")}} 实例 ，则它返回 <code>object</code> 自身。</p> + +<h2 id="属性">属性</h2> + +<dl> + <dt><code><strong>Iterator.prototype[@@iterator]</strong></code></dt> + <dd>返回一个函数，它返回符合{{jsxref("Iteration_protocols", "迭代协议", "", 1)}}的迭代对象。</dd> +</dl> + +<h2 id="方法">方法</h2> + +<dl> + <dt><code><strong>Iterator.prototype.next</strong></code></dt> + <dd>返回<code>[property_name, property_value]</code> 格式或<code>property_name</code> 的下一项。 如果没有更多项，抛出 <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/StopIteration">StopIteration</a></code> 。</dd> +</dl> + +<h2 id="示例">示例</h2> + +<h3 id="迭代一个对象的属性">迭代一个对象的属性</h3> + +<pre class="brush: js">var a = { + x: 10, + y: 20, +}; +var iter = Iterator(a); +console.log(iter.next()); // ["x", 10] +console.log(iter.next()); // ["y", 20] +console.log(iter.next()); // throws StopIteration +</pre> + +<h3 id="使用遗留的解构for-in迭代对象的属性">使用遗留的<code>解构for-in迭代对象的属性</code></h3> + +<pre class="brush: js">var a = { + x: 10, + y: 20, +}; + +for (var [name, value] in Iterator(a)) { + console.log(name, value); // x 10 + // y 20 +} +</pre> + +<h3 id="使用for-of迭代">使用<code>for-of迭代</code></h3> + +<pre class="brush: js">var a = { + x: 10, + y: 20, +}; + +for (var [name, value] of Iterator(a)) { // @@iterator is used + console.log(name, value); // x 10 + // y 20 +} +</pre> + +<h3 id="迭代属性名">迭代属性名</h3> + +<pre class="brush: js">var a = { + x: 10, + y: 20, +}; + +for (var name in Iterator(a, true)) { + console.log(name); // x + // y +} +</pre> + +<h3 id="传入_Generator_实例">传入 Generator 实例</h3> + +<pre class="brush: js">function* f() { + yield 'a'; + yield 'b'; +} +var g = f(); + +console.log(g == Iterator(g)); // true + +for (var v in Iterator(g)) { + console.log(v); // a + // b +} +</pre> + +<h3 id="传入_Iterator_实例">传入 Iterator 实例</h3> + +<pre class="brush: js">var a = { + x: 10, + y: 20, +}; + +var i = Iterator(a); + +console.log(i == Iterator(i)); // true +</pre> + +<h2 id="规范">规范</h2> + +<p>非标准。不是目前任何标准文档的一部分。</p> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{CompatibilityTable}}</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>{{CompatNo}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</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>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li><a href="/zh-CN/docs/JavaScript/Guide/Iterators_and_Generators" title="/en-US/docs/JavaScript/Guide/Iterators_and_Generators">Iterators and Generators</a></li> + <li><code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/StopIteration">StopIteration</a></code><br> + </li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/json/index.html b/files/zh-cn/web/javascript/reference/global_objects/json/index.html new file mode 100644 index 0000000000..98b734c78d --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/json/index.html @@ -0,0 +1,203 @@ +--- +title: JSON +slug: Web/JavaScript/Reference/Global_Objects/JSON +tags: + - JSON + - JavaScript + - Object + - Reference + - polyfill +translation_of: Web/JavaScript/Reference/Global_Objects/JSON +--- +<div>{{JSRef}}</div> + +<p><strong><code>JSON</code></strong>对象包含两个方法: 用于解析 <a class="external" href="http://json.org/">JavaScript Object Notation</a> ({{glossary("JSON")}}) 的 <code>parse()</code> 方法，以及将对象/值转换为 JSON字符串的 <code>stringify()</code> 方法。除了这两个方法, JSON这个对象本身并没有其他作用，也不能被调用或者作为构造函数调用。</p> + +<h2 id="Description" name="Description">描述</h2> + +<h3 id="JavaScript_Object_Notation" name="JavaScript_Object_Notation">JavaScript Object Notation</h3> + +<p><strong>JSON</strong> 是一种语法，用来序列化对象、数组、数值、字符串、布尔值和 {{jsxref("null")}} 。它基于 JavaScript 语法，但与之不同：<strong>JavaScript不是JSON，JSON也不是JavaScript</strong>。<span style="line-height: 1.5;">参考 </span><a href="http://timelessrepo.com/json-isnt-a-javascript-subset" style="line-height: 1.5; text-decoration: underline;">JSON：并不是JavaScript 的子集</a>。</p> + +<table> + <caption>JavaScript 与 JSON 的区别</caption> + <thead> + <tr> + <th scope="col">JavaScript类型</th> + <th scope="col">JSON 的不同点</th> + </tr> + </thead> + <tbody> + <tr> + <td>对象和数组</td> + <td> + <p>属性名称必须是双引号括起来的字符串；最后一个属性后不能有逗号。</p> + </td> + </tr> + <tr> + <td>数值</td> + <td>禁止出现前导零（ JSON.stringify 方法自动忽略前导零，而在 JSON.parse 方法中将会抛出 SyntaxError）；如果有小数点, 则后面至少跟着一位数字。</td> + </tr> + <tr> + <td>字符串</td> + <td> + <p>只有有限的一些字符可能会被转义；禁止某些控制字符； Unicode 行分隔符 （<a href="http://unicode-table.com/cn/2028/">U+2028</a>）和段分隔符 （<a href="http://unicode-table.com/cn/2029/">U+2029</a>）被允许 ; 字符串必须用双引号括起来。请参考下面的示例，可以看到 {{jsxref("JSON.parse()")}} 能够正常解析，但将其当作JavaScript解析时会抛出 {{jsxref("SyntaxError")}} 错误：</p> + + <pre class="brush: js"> +let code = '"\u2028\u2029"'; +JSON.parse(code); // 正常 +eval(code); // 错误 +</pre> + </td> + </tr> + </tbody> +</table> + +<p>完整的JSON语法定义如下：</p> + +<pre>JSON = null + or true or false + or JSONNumber + or JSONString + or JSONObject + or JSONArray + +JSONNumber = - PositiveNumber + or PositiveNumber +PositiveNumber = DecimalNumber + or DecimalNumber . Digits + or DecimalNumber . Digits ExponentPart + or DecimalNumber ExponentPart +DecimalNumber = 0 + or OneToNine Digits +ExponentPart = e Exponent + or E Exponent +Exponent = Digits + or + Digits + or - Digits +Digits = Digit + or Digits Digit +Digit = 0 through 9 +OneToNine = 1 through 9 + +JSONString = "" + or " StringCharacters " +StringCharacters = StringCharacter + or StringCharacters StringCharacter +StringCharacter = any character + except " or \ or U+0000 through U+001F + or EscapeSequence +EscapeSequence = \" or \/ or \\ or \b or \f or \n or \r or \t + or \u HexDigit HexDigit HexDigit HexDigit +HexDigit = 0 through 9 + or A through F + or a through f + +JSONObject = { } + or { Members } +Members = JSONString : JSON + or Members , JSONString : JSON + +JSONArray = [ ] + or [ ArrayElements ] +ArrayElements = JSON + or ArrayElements , JSON +</pre> + +<p>在<code>JSONNumber</code>（数字内部不允许包含空格）或<code>JSONString</code>（字符串内部的空格被解释为相应的字符，否则就有问题了）之外的任何位置可以有多余的空白字符。JSON只支持这些空白字符： 制表符（<a href="http://unicode-table.com/en/0009/">U+0009</a>），回车（<a href="http://unicode-table.com/en/000D/">U+000D</a>），换行（<a href="http://unicode-table.com/en/0020/">U+00</a>0A）以及空格（<a href="http://unicode-table.com/en/0020/">U+0020</a>）。</p> + +<h2 id="Methods" name="Methods">方法</h2> + +<dl> + <dt>{{jsxref("JSON.parse()")}}</dt> + <dd>解析JSON字符串并返回对应的值，可以额外传入一个转换函数，用来将生成的值和其属性, 在返回之前进行某些修改。</dd> + <dt>{{jsxref("JSON.stringify()")}}</dt> + <dd>返回与指定值对应的JSON字符串，可以通过额外的参数, 控制仅包含某些属性, 或者以自定义方法来替换某些key对应的属性值。</dd> +</dl> + +<h2 id="Polyfill" name="Polyfill">Polyfill</h2> + +<p><code>JSON</code>对象可能不被老版本的浏览器支持。可以将下面的代码放到JS脚本最开始的位置，这样就可以在没有原生支持 JSON 对象的浏览器（如IE6）中使用 <code>JSON</code>对象。</p> + +<p>以下算法是对原生<code>JSON</code>对象的模仿：</p> + +<pre class="brush: js">if (!window.JSON) { + window.JSON = { + parse: function(sJSON) { return eval('(' + sJSON + ')'); }, + stringify: (function () { + var toString = Object.prototype.toString; + var isArray = Array.isArray || function (a) { return toString.call(a) === '[object Array]'; }; + var escMap = {'"': '\\"', '\\': '\\\\', '\b': '\\b', '\f': '\\f', '\n': '\\n', '\r': '\\r', '\t': '\\t'}; + var escFunc = function (m) { return escMap[m] || '\\u' + (m.charCodeAt(0) + 0x10000).toString(16).substr(1); }; + var escRE = /[\\"\u0000-\u001F\u2028\u2029]/g; + return function stringify(value) { + if (value == null) { + return 'null'; + } else if (typeof value === 'number') { + return isFinite(value) ? value.toString() : 'null'; + } else if (typeof value === 'boolean') { + return value.toString(); + } else if (typeof value === 'object') { + if (typeof value.toJSON === 'function') { + return stringify(value.toJSON()); + } else if (isArray(value)) { + var res = '['; + for (var i = 0; i < value.length; i++) + res += (i ? ', ' : '') + stringify(value[i]); + return res + ']'; + } else if (toString.call(value) === '[object Object]') { + var tmp = []; + for (var k in value) { + if (value.hasOwnProperty(k)) + tmp.push(stringify(k) + ': ' + stringify(value[k])); + } + return '{' + tmp.join(', ') + '}'; + } + } + return '"' + value.toString().replace(escRE, escFunc) + '"'; + }; + })() + }; +} +</pre> + +<p>业界更专业, 更强大的<code>JSON</code>对象 <a class="external" href="http://remysharp.com/2010/10/08/what-is-a-polyfill/" title="http://remysharp.com/2010/10/08/what-is-a-polyfill/">polyfills</a> 是 <a class="link-https" href="https://github.com/douglascrockford/JSON-js" title="https://github.com/douglascrockford/JSON-js">JSON2</a> 和 <a class="external" href="http://bestiejs.github.com/json3" title="http://bestiejs.github.com/json3">JSON3</a>。</p> + +<h2 id="Specifications" name="Specifications">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范</th> + <th scope="col">状态</th> + <th scope="col">说明</th> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.12', 'JSON')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-json-object', 'JSON')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-json-object', 'JSON')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">浏览器兼容性</h2> + +<div class="hidden">The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</div> + +<p>{{Compat("javascript.builtins.JSON")}}</p> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("Date.prototype.toJSON()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/json/parse/index.html b/files/zh-cn/web/javascript/reference/global_objects/json/parse/index.html new file mode 100644 index 0000000000..e1e970a1e4 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/json/parse/index.html @@ -0,0 +1,224 @@ +--- +title: JSON.parse() +slug: Web/JavaScript/Reference/Global_Objects/JSON/parse +tags: + - ECMAScript 5 + - JSON + - JavaScript + - 参考 + - 方法 +translation_of: Web/JavaScript/Reference/Global_Objects/JSON/parse +--- +<div>{{JSRef}}</div> + +<p><code><strong>JSON.parse()</strong></code> 方法用来解析JSON字符串，构造由字符串描述的JavaScript值或对象。提供可选的 <strong>reviver</strong> 函数用以在返回之前对所得到的对象执行变换(操作)。</p> + +<div>{{EmbedInteractiveExample("pages/js/json-parse.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">JSON.parse(<var>text</var>[, <var>reviver</var>])</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>text</code></dt> + <dd>要被解析成 JavaScript 值的字符串，关于JSON的语法格式,请参考：{{jsxref("JSON")}}。</dd> + <dt><code>reviver</code> {{optional_inline()}}</dt> + <dd>转换器, 如果传入该参数(函数)，可以用来修改解析生成的原始值，调用时机在 parse 函数返回之前。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>{{jsxref("Object")}} 类型, 对应给定 JSON 文本的对象/值。</p> + +<h3 id="异常">异常</h3> + +<p>若传入的字符串不符合 JSON 规范，则会抛出 {{jsxref("SyntaxError")}} 异常。</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用_JSON.parse">使用 <code>JSON.parse()</code></h3> + +<pre class="brush: js">JSON.parse('{}'); // {} +JSON.parse('true'); // true +JSON.parse('"foo"'); // "foo" +JSON.parse('[1, 5, "false"]'); // [1, 5, "false"] +JSON.parse('null'); // null +</pre> + +<h3 id="使用_reviver_函数">使用 <code>reviver</code> 函数</h3> + +<p>如果指定了 <code>reviver</code> 函数，则解析出的 JavaScript 值（解析值）会经过一次转换后才将被最终返回（返回值）。更具体点讲就是：解析值本身以及它所包含的所有属性，会按照一定的顺序（从最最里层的属性开始，一级级往外，最终到达顶层，也就是解析值本身）分别的去调用 <code>reviver</code> 函数，在调用过程中，当前属性所属的对象会作为 <code>this</code> 值，当前属性名和属性值会分别作为第一个和第二个参数传入 <code>reviver</code> 中。如果 <code>reviver</code> 返回 <code>undefined</code>，则当前属性会从所属对象中删除，如果返回了其他值，则返回的值会成为当前属性新的属性值。</p> + +<p>当遍历到最顶层的值（解析值）时，传入 <code>reviver</code> 函数的参数会是空字符串 <code>""</code>（因为此时已经没有真正的属性）和当前的解析值（有可能已经被修改过了），当前的 <code>this</code> 值会是 <code>{"": 修改过的解析值}</code>，在编写 <code>reviver</code> 函数时，要注意到这个特例。（这个函数的遍历顺序依照：从最内层开始，按照层级顺序，依次向外遍历）</p> + +<pre class="brush: js">JSON.parse('{"p": 5}', function (k, v) { + if(k === '') return v; // 如果到了最顶层，则直接返回属性值， + return v * 2; // 否则将属性值变为原来的 2 倍。 +}); // { p: 10 } + +JSON.parse('{"1": 1, "2": 2,"3": {"4": 4, "5": {"6": 6}}}', function (k, v) { + console.log(k); // 输出当前的属性名，从而得知遍历顺序是从内向外的， + // 最后一个属性名会是个空字符串。 + return v; // 返回原始属性值，相当于没有传递 reviver 参数。 +}); + +// 1 +// 2 +// 4 +// 6 +// 5 +// 3 +// "" +</pre> + +<h3 id="JSON.parse_不允许用逗号作为结尾"><code>JSON.parse()</code> 不允许用逗号作为结尾</h3> + +<pre class="example-bad brush: js">// both will throw a SyntaxError +JSON.parse("[1, 2, 3, 4, ]"); +JSON.parse('{"foo" : 1, }'); +</pre> + +<h2 id="Polyfill">Polyfill</h2> + +<pre class="brush: js">// From https://github.com/douglascrockford/JSON-js/blob/master/json2.js +if (typeof JSON.parse !== "function") { + var rx_one = /^[\],:{}\s]*$/; + var rx_two = /\\(?:["\\\/bfnrt]|u[0-9a-fA-F]{4})/g; + var rx_three = /"[^"\\\n\r]*"|true|false|null|-?\d+(?:\.\d*)?(?:[eE][+\-]?\d+)?/g; + var rx_four = /(?:^|:|,)(?:\s*\[)+/g; + var rx_dangerous = /[\u0000\u00ad\u0600-\u0604\u070f\u17b4\u17b5\u200c-\u200f\u2028-\u202f\u2060-\u206f\ufeff\ufff0-\uffff]/g; + JSON.parse = function(text, reviver) { + + // The parse method takes a text and an optional reviver function, and returns + // a JavaScript value if the text is a valid JSON text. + + var j; + + function walk(holder, key) { + + // The walk method is used to recursively walk the resulting structure so + // that modifications can be made. + + var k; + var v; + var value = holder[key]; + if (value && typeof value === "object") { + for (k in value) { + if (Object.prototype.hasOwnProperty.call(value, k)) { + v = walk(value, k); + if (v !== undefined) { + value[k] = v; + } else { + delete value[k]; + } + } + } + } + return reviver.call(holder, key, value); + } + + + // Parsing happens in four stages. In the first stage, we replace certain + // Unicode characters with escape sequences. JavaScript handles many characters + // incorrectly, either silently deleting them, or treating them as line endings. + + text = String(text); + rx_dangerous.lastIndex = 0; + if (rx_dangerous.test(text)) { + text = text.replace(rx_dangerous, function(a) { + return ( + "\\u" + + ("0000" + a.charCodeAt(0).toString(16)).slice(-4) + ); + }); + } + + // In the second stage, we run the text against regular expressions that look + // for non-JSON patterns. We are especially concerned with "()" and "new" + // because they can cause invocation, and "=" because it can cause mutation. + // But just to be safe, we want to reject all unexpected forms. + + // We split the second stage into 4 regexp operations in order to work around + // crippling inefficiencies in IE's and Safari's regexp engines. First we + // replace the JSON backslash pairs with "@" (a non-JSON character). Second, we + // replace all simple value tokens with "]" characters. Third, we delete all + // open brackets that follow a colon or comma or that begin the text. Finally, + // we look to see that the remaining characters are only whitespace or "]" or + // "," or ":" or "{" or "}". If that is so, then the text is safe for eval. + + if ( + rx_one.test( + text + .replace(rx_two, "@") + .replace(rx_three, "]") + .replace(rx_four, "") + ) + ) { + + // In the third stage we use the eval function to compile the text into a + // JavaScript structure. The "{" operator is subject to a syntactic ambiguity + // in JavaScript: it can begin a block or an object literal. We wrap the text + // in parens to eliminate the ambiguity. + + j = eval("(" + text + ")"); + + // In the optional fourth stage, we recursively walk the new structure, passing + // each name/value pair to a reviver function for possible transformation. + + return (typeof reviver === "function") ? + walk({ + "": j + }, "") : + j; + } + + // If the text is not JSON parseable, then a SyntaxError is thrown. + + throw new SyntaxError("JSON.parse"); + }; +}</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>{{SpecName('ES5.1', '#sec-15.12.2', 'JSON.parse')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td>首次定义，于 JavaScript 1.7 版本中实现。</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-json.parse', 'JSON.parse')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-json.parse', 'JSON.parse')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> + + +<p>{{Compat("javascript.builtins.JSON.parse")}}</p> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("JSON.stringify()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/json/stringify/index.html b/files/zh-cn/web/javascript/reference/global_objects/json/stringify/index.html new file mode 100644 index 0000000000..3ccfd067d3 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/json/stringify/index.html @@ -0,0 +1,267 @@ +--- +title: JSON.stringify() +slug: Web/JavaScript/Reference/Global_Objects/JSON/stringify +tags: + - JSON + - JSON.stringify() + - JavaScript + - Method + - Reference + - stringify + - 字符串 +translation_of: Web/JavaScript/Reference/Global_Objects/JSON/stringify +--- +<div>{{JSRef}}</div> + +<p><code><strong>JSON.stringify()</strong></code> 方法将一个 JavaScript 对象或值转换为 JSON 字符串，如果指定了一个 replacer 函数，则可以选择性地替换值，或者指定的 replacer 是数组，则可选择性地仅包含数组指定的属性。</p> + +<p>{{EmbedInteractiveExample("pages/js/json-stringify.html")}}</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox notranslate"><code>JSON.stringify(<em>value</em>[, <em>replacer</em> [, <em>space</em>]])</code> +</pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>value</code></dt> + <dd>将要序列化成 一个 JSON 字符串的值。</dd> + <dt><code>replacer</code> {{optional_inline}}</dt> + <dd>如果该参数是一个函数，则在序列化过程中，被序列化的值的每个属性都会经过该函数的转换和处理；如果该参数是一个数组，则只有包含在这个数组中的属性名才会被序列化到最终的 JSON 字符串中；如果该参数为 null 或者未提供，则对象所有的属性都会被序列化。</dd> + <dt><code>space</code> {{optional_inline}}</dt> + <dd>指定缩进用的空白字符串，用于美化输出（pretty-print）；如果参数是个数字，它代表有多少的空格；上限为10。该值若小于1，则意味着没有空格；如果该参数为字符串（当字符串长度超过10个字母，取其前10个字母），该字符串将被作为空格；如果该参数没有提供（或者为 null），将没有空格。</dd> + <dt> + <h3 id="返回值">返回值</h3> + </dt> + <dd>一个表示给定值的JSON字符串。</dd> +</dl> + +<h3 id="异常">异常</h3> + +<ul> + <li>当在循环引用时会抛出异常{{JSxRef("TypeError")}} ("cyclic object value")（循环对象值）</li> + <li>当尝试去转换 {{jsxref("BigInt")}} 类型的值会抛出{{JSxRef("TypeError")}} ("BigInt value can't be serialized in JSON")（BigInt值不能JSON序列化）.</li> +</ul> + +<h2 id="描述">描述</h2> + +<p><code>JSON.stringify()</code>将值转换为相应的JSON格式：</p> + +<ul> + <li>转换值如果有 toJSON() 方法，该方法定义什么值将被序列化。</li> + <li>非数组对象的属性不能保证以特定的顺序出现在序列化后的字符串中。</li> + <li>布尔值、数字、字符串的包装对象在序列化过程中会自动转换成对应的原始值。</li> + <li><code>undefined</code>、任意的函数以及 symbol 值，在序列化过程中会被忽略（出现在非数组对象的属性值中时）或者被转换成 <code>null</code>（出现在数组中时）。函数、undefined 被单独转换时，会返回 undefined，如<code>JSON.stringify(function(){})</code> or <code>JSON.stringify(undefined)</code>.</li> + <li>对包含循环引用的对象（对象之间相互引用，形成无限循环）执行此方法，会抛出错误。</li> + <li>所有以 symbol 为属性键的属性都会被完全忽略掉，即便 <code>replacer</code> 参数中强制指定包含了它们。</li> + <li>Date 日期调用了 toJSON() 将其转换为了 string 字符串（同Date.toISOString()），因此会被当做字符串处理。</li> + <li>NaN 和 Infinity 格式的数值及 null 都会被当做 null。</li> + <li>其他类型的对象，包括 Map/Set/WeakMap/WeakSet，仅会序列化可枚举的属性。</li> +</ul> + +<h2 id="示例">示例</h2> + +<h3 id="使用_JSON.stringify">使用 JSON.stringify</h3> + +<pre class="brush: js notranslate">JSON.stringify({}); // '{}' +JSON.stringify(true); // 'true' +JSON.stringify("foo"); // '"foo"' +JSON.stringify([1, "false", false]); // '[1,"false",false]' +JSON.stringify({ x: 5 }); // '{"x":5}' + +JSON.stringify({x: 5, y: 6}); +// "{"x":5,"y":6}" + +JSON.stringify([new Number(1), new String("false"), new Boolean(false)]); +// '[1,"false",false]' + +JSON.stringify({x: undefined, y: Object, z: Symbol("")}); +// '{}' + +JSON.stringify([undefined, Object, Symbol("")]); +// '[null,null,null]' + +JSON.stringify({[Symbol("foo")]: "foo"}); +// '{}' + +JSON.stringify({[Symbol.for("foo")]: "foo"}, [Symbol.for("foo")]); +// '{}' + +JSON.stringify( + {[Symbol.for("foo")]: "foo"}, + function (k, v) { + if (typeof k === "symbol"){ + return "a symbol"; + } + } +); + + +// undefined + +// 不可枚举的属性默认会被忽略： +JSON.stringify( + Object.create( + null, + { + x: { value: 'x', enumerable: false }, + y: { value: 'y', enumerable: true } + } + ) +); + +// "{"y":"y"}" +</pre> + +<h3 id="replacer参数"><code>replacer参数</code></h3> + +<p>replacer 参数可以是一个函数或者一个数组。作为函数，它有两个参数，键（key）和值（value），它们都会被序列化。</p> + +<p>在开始时, <code><var>replacer</var></code> 函数会被传入一个空字符串作为 <code>key</code> 值，代表着要被 <code>stringify</code> 的这个对象。随后每个对象或数组上的属性会被依次传入。 </p> + +<p>函数应当返回JSON字符串中的value, 如下所示:</p> + +<ul> + <li>如果返回一个 {{jsxref("Number")}}, 转换成相应的字符串作为属性值被添加入 JSON 字符串。</li> + <li>如果返回一个 {{jsxref("String")}}, 该字符串作为属性值被添加入 JSON 字符串。</li> + <li>如果返回一个 {{jsxref("Boolean")}}, "true" 或者 "false" 作为属性值被添加入 JSON 字符串。</li> + <li>如果返回任何其他对象，该对象递归地序列化成 JSON 字符串，对每个属性调用 replacer 方法。除非该对象是一个函数，这种情况将不会被序列化成 JSON 字符串。</li> + <li>如果返回 undefined，该属性值不会在 JSON 字符串中输出。</li> +</ul> + +<p><strong>注意:</strong> 不能用 replacer 方法，从数组中移除值（values），如若返回 undefined 或者一个函数，将会被 null 取代。</p> + +<h4 id="例子function">例子(function)</h4> + +<pre class="notranslate"><code>function replacer(key, value) { + if (typeof value === "string") { + return undefined; + } + return value; +} + +var foo = {foundation: "Mozilla", model: "box", week: 45, transport: "car", month: 7}; +var jsonString = JSON.stringify(foo, replacer);</code></pre> + +<p>JSON序列化结果为 <code>{"week":45,"month":7}</code>.</p> + +<h4 id="例子array">例子(array)</h4> + +<p>如果 <code>replacer</code> 是一个数组，数组的值代表将被序列化成 JSON 字符串的属性名。</p> + +<pre class="notranslate"><code>JSON.stringify(foo, ['week', 'month']); +// '{"week":45,"month":7}', 只保留 “week” 和 “month” 属性值。</code></pre> + +<h3 id="space_参数"><code>space</code> 参数</h3> + +<p><code>space </code>参数用来控制结果字符串里面的间距。如果是一个数字, 则在字符串化时每一级别会比上一级别缩进多这个数字值的空格（最多10个空格）；如果是一个字符串，则每一级别会比上一级别多缩进该字符串（或该字符串的前10个字符）。</p> + +<pre class="brush: js notranslate">JSON.stringify({ a: 2 }, null, " "); // '{\n "a": 2\n}'</pre> + +<p>使用制表符（\t）来缩进：</p> + +<pre class="brush: js notranslate">JSON.stringify({ uno: 1, dos : 2 }, null, '\t') +// '{ \ +// "uno": 1, \ +// "dos": 2 \ +// }' +</pre> + +<h3 id="toJSON_方法">toJSON 方法</h3> + +<p>如果一个被序列化的对象拥有 <code>toJSON</code> 方法，那么该 <code>toJSON</code> 方法就会覆盖该对象默认的序列化行为：不是该对象被序列化，而是调用 <code>toJSON</code> 方法后的返回值会被序列化，例如：</p> + +<pre class="brush: js notranslate">var obj = { + foo: 'foo', + toJSON: function () { + return 'bar'; + } +}; +JSON.stringify(obj); // <code>'"bar"'</code> +JSON.stringify({x: obj}); // <code>'{"x":"bar"}'</code> +</pre> + +<h3 id="JSON.stringify用作_JavaScript"><code>JSON.stringify</code>用作 JavaScript</h3> + +<p>注意 JSON 不是 JavaScript 严格意义上的子集，在 JSON 中不需要省略两条终线（Line separator 和 Paragraph separator），但在 JavaScript 中需要被省略。因此，如果 JSON 被用作 JSONP 时，下面方法可以使用：</p> + +<pre class="notranslate"><code>function jsFriendlyJSONStringify (s) { + return JSON.stringify(s). + replace(/\u2028/g, '\\u2028'). + replace(/\u2029/g, '\\u2029'); +} + +var s = { + a: String.fromCharCode(0x2028), + b: String.fromCharCode(0x2029) +}; +try { + eval('(' + JSON.stringify(s) + ')'); +} catch (e) { + console.log(e); // "SyntaxError: unterminated string literal" +} + +// No need for a catch +eval('(' + jsFriendlyJSONStringify(s) + ')'); + +// console.log in Firefox unescapes the Unicode if +// logged to console, so we use alert +alert(jsFriendlyJSONStringify(s)); // {"a":"\u2028","b":"\u2029"}</code></pre> + +<h3 id="使用_JSON.stringify_结合_localStorage_的例子">使用 JSON.stringify 结合 localStorage 的例子</h3> + +<p>一些时候，你想存储用户创建的一个对象，并且，即使在浏览器被关闭后仍能恢复该对象。下面的例子是 <code>JSON.stringify</code> 适用于这种情形的一个样板：</p> + +<pre class="brush: js notranslate">// 创建一个示例数据 +var session = { + 'screens' : [], + 'state' : true +}; +session.screens.push({"name":"screenA", "width":450, "height":250}); +session.screens.push({"name":"screenB", "width":650, "height":350}); +session.screens.push({"name":"screenC", "width":750, "height":120}); +session.screens.push({"name":"screenD", "width":250, "height":60}); +session.screens.push({"name":"screenE", "width":390, "height":120}); +session.screens.push({"name":"screenF", "width":1240, "height":650}); + +// 使用 JSON.stringify 转换为 JSON 字符串 +// 然后使用 localStorage 保存在 session 名称里 +localStorage.setItem('session', JSON.stringify(session)); + +// 然后是如何转换通过 JSON.stringify 生成的字符串，该字符串以 JSON 格式保存在 localStorage 里 +var restoredSession = JSON.parse(localStorage.getItem('session')); + +// 现在 restoredSession 包含了保存在 localStorage 里的对象 +console.log(restoredSession); +</pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范名称及链接</th> + <th scope="col">规范状态</th> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.12.3', 'JSON.stringify')}}</td> + <td>{{Spec2('ES5.1')}}</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-json.stringify', 'JSON.stringify')}}</td> + <td>{{Spec2('ES6')}}</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{Compat("javascript.builtins.JSON.stringify")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{JSxRef("JSON.parse()")}}</li> + <li><a href="https://github.com/douglascrockford/JSON-js/blob/master/cycle.js">cycle.js</a> – Introduces two functions: <code>JSON.decycle</code> and <code>JSON.retrocycle</code>. These allow encoding and decoding of cyclical structures and DAGs into an extended and retrocompatible JSON format.</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/map/@@iterator/index.html b/files/zh-cn/web/javascript/reference/global_objects/map/@@iterator/index.html new file mode 100644 index 0000000000..aa4c789a26 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/map/@@iterator/index.html @@ -0,0 +1,101 @@ +--- +title: 'Map.prototype[@@iterator]()' +slug: Web/JavaScript/Reference/Global_Objects/Map/@@iterator +tags: + - ECMAScript 2015 + - Iterator + - JavaScript + - Map + - Method + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Map/@@iterator +--- +<div>{{JSRef}}</div> + +<p><code><strong>@@iterator</strong></code><strong> </strong>属性的初始值与 {{jsxref("Map.prototype.entries()", "entries")}} 属性的初始值是同一个函数对象。</p> + +<div>{{EmbedInteractiveExample("pages/js/map-prototype-@@iterator.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><em>myMap</em>[Symbol.iterator]</code></pre> + +<h3 id="返回值">返回值</h3> + +<p>map 的 <strong>iterator</strong> 函数默认就是 {{jsxref("Map.prototype.entries()", "entries()")}} 函数。</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用_iterator()">使用 <code>[@@iterator]()</code></h3> + +<pre class="brush:js">var myMap = new Map(); +myMap.set('0', 'foo'); +myMap.set(1, 'bar'); +myMap.set({}, 'baz'); + +var mapIter = myMap[Symbol.iterator](); +//返回的其实是个generator +console.log(mapIter.next().value); // ["0", "foo"] +console.log(mapIter.next().value); // [1, "bar"] +console.log(mapIter.next().value); // [Object, "baz"] +</pre> + +<h3 id="在for..of中使用iterator()">在<code>for..of中</code>使用<code>[@@iterator]()</code> </h3> + +<pre class="brush:js">var myMap = new Map(); +myMap.set('0', 'foo'); +myMap.set(1, 'bar'); +myMap.set({}, 'baz'); + +for (const entry of myMap) { + console.log(entry); +} +// ["0", "foo"] +// [1, "bar"] +// [{}, "baz"] + +for (var v of myMap) { + console.log(v); +} + +// 0: foo +// 1: bar +// [Object]: baz</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-map.prototype-@@iterator', 'Map.prototype[@@iterator]()')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-map.prototype-@@iterator', 'Map.prototype[@@iterator]()')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容">浏览器兼容</h2> + + + +<p>{{Compat("javascript.builtins.Map.@@iterator")}}</p> + +<h2 id="另见">另见</h2> + +<ul> + <li>{{jsxref("Map.prototype.entries()")}}</li> + <li>{{jsxref("Map.prototype.keys()")}}</li> + <li>{{jsxref("Map.prototype.values()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/map/@@species/index.html b/files/zh-cn/web/javascript/reference/global_objects/map/@@species/index.html new file mode 100644 index 0000000000..ded2acd30b --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/map/@@species/index.html @@ -0,0 +1,67 @@ +--- +title: 'get Map[@@species]' +slug: Web/JavaScript/Reference/Global_Objects/Map/@@species +translation_of: Web/JavaScript/Reference/Global_Objects/Map/@@species +--- +<div>{{JSRef}}</div> + +<p> <code><strong>Map[@@species]</strong></code> 访问器属性会返回一个 <code>Map</code> 构造函数.</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">Map[Symbol.species] +</pre> + +<h2 id="描述">描述</h2> + +<p>The species accessor property returns the default constructor for <code>Map</code> objects. Subclass constructors may over-ride it to change the constructor assignment.</p> + +<h2 id="案例">案例</h2> + +<p>The species property returns the default constructor function, which is the <code>Map</code> constructor for <code>Map</code> objects:</p> + +<pre class="brush: js">Map[Symbol.species]; // function Map()</pre> + +<p>In a derived collection object (e.g. your custom map <code>MyMap</code>), the <code>MyMap</code> species is the <code>MyMap</code> constructor. However, you might want to overwrite this, in order to return parent <code>Map</code> objects in your derived class methods:</p> + +<pre class="brush: js">class MyMap extends Map { + // 重写覆盖 MyMap species to the parent Map constructor + static get [Symbol.species]() { return Map; } +}</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-get-map-@@species', 'get Map [ @@species ]')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-get-map-@@species', 'get Map [ @@species ]')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> + + +<p>{{Compat("javascript.builtins.Map.@@species")}}</p> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Map")}}</li> + <li>{{jsxref("Symbol.species")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/map/@@tostringtag/index.html b/files/zh-cn/web/javascript/reference/global_objects/map/@@tostringtag/index.html new file mode 100644 index 0000000000..c6a1e3c81b --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/map/@@tostringtag/index.html @@ -0,0 +1,95 @@ +--- +title: 'Map.prototype[@@toStringTag]' +slug: Web/JavaScript/Reference/Global_Objects/Map/@@toStringTag +translation_of: Web/JavaScript/Reference/Global_Objects/Map/@@toStringTag +--- +<div>{{JSRef}}</div> + +<p> <strong><code>Map[@@toStringTag]</code></strong> 的初始值是"Map".</p> + +<div>{{js_property_attributes(0,0,1)}}</div> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">Map[Symbol.toStringTag]</pre> + +<h2 id="示例">示例</h2> + +<pre class="brush:js">Object.prototype.toString.call(new Map()) // "[object Map]" +</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-map.prototype-@@tostringtag', 'Map.prototype[@@toStringTag]')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-map.prototype-@@tostringtag', 'Map.prototype[@@toStringTag]')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容">浏览器兼容</h2> + +<p>{{CompatibilityTable}} </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>{{ CompatChrome(44.0) }}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Android</th> + <th>Android Webview</th> + <th>Firefox Mobile (Gecko)</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + <th>Chrome for Android</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{ CompatNo }}</td> + <td>{{ CompatChrome(44.0) }}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatChrome(44.0)}}</td> + </tr> + </tbody> +</table> +</div> diff --git a/files/zh-cn/web/javascript/reference/global_objects/map/clear/index.html b/files/zh-cn/web/javascript/reference/global_objects/map/clear/index.html new file mode 100644 index 0000000000..8244d179c2 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/map/clear/index.html @@ -0,0 +1,76 @@ +--- +title: Map.prototype.clear() +slug: Web/JavaScript/Reference/Global_Objects/Map/clear +tags: + - ECMAScript 2015 + - JavaScript + - Map +translation_of: Web/JavaScript/Reference/Global_Objects/Map/clear +--- +<div>{{JSRef}}</div> + +<p><code>clear()</code>方法会移除Map对象中的所有元素。</p> + +<div>{{EmbedInteractiveExample("pages/js/map-prototype-clear.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><em>myMap</em>.clear();</code> +</pre> + +<h3 id="返回值">返回值</h3> + +<p>{{jsxref("undefined")}}.</p> + +<h2 id="示例">示例</h2> + +<h3 id="调用clear方法">调用<code>clear</code>方法</h3> + +<pre class="brush: js">var myMap = new Map(); +myMap.set("bar", "baz"); +myMap.set(1, "foo"); + +myMap.size; // 2 +myMap.has("bar"); // true + +myMap.clear(); + +myMap.size; // 0 +myMap.has("bar") // false +</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-map.prototype.clear', 'Map.prototype.clear')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-map.prototype.clear', 'Map.prototype.clear')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容">浏览器兼容</h2> + + + +<p>{{Compat("javascript.builtins.Map.clear")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Map")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/map/delete/index.html b/files/zh-cn/web/javascript/reference/global_objects/map/delete/index.html new file mode 100644 index 0000000000..4b8fb98c3f --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/map/delete/index.html @@ -0,0 +1,83 @@ +--- +title: Map.prototype.delete() +slug: Web/JavaScript/Reference/Global_Objects/Map/delete +tags: + - ECMAScript 2015 + - JavaScript + - Map + - Method + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Map/delete +--- +<div>{{JSRef}}</div> + +<p><strong> </strong><code><strong><strong>delete()</strong></strong></code><strong> </strong>方法用于移除 <code>Map</code> 对象中指定的元素。</p> + +<div>{{EmbedInteractiveExample("pages/js/map-prototype-delete.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="brush: js">myMap.delete(key);</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt>key</dt> + <dd>必须。从 <code>Map</code> 对象中移除的元素的键。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<dl> + <dt>Boolean</dt> + <dd>如果 <code>Map</code> 对象中存在该元素，则移除它并返回<em> <code>true</code></em>；否则如果该元素不存在则返回 <code><em>false</em></code>。</dd> +</dl> + +<h2 id="示例">示例</h2> + +<h3 id="使用_delete_方法">使用 <code>delete</code> 方法</h3> + +<pre class="brush: js">var myMap = new Map(); +myMap.set("bar", "foo"); + +myMap.delete("bar"); // 返回 true。成功地移除元素 +myMap.has("bar"); // 返回 false。"bar" 元素将不再存在于 Map 实例中 +</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('ES6', '#sec-map.prototype.delete', 'Map.prototype.delete')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-map.prototype.delete', 'Map.prototype.delete')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div class="hidden"> +<p>The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> +</div> + +<p>{{Compat("javascript.builtins.Map.delete")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Map")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/map/entries/index.html b/files/zh-cn/web/javascript/reference/global_objects/map/entries/index.html new file mode 100644 index 0000000000..f97881755e --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/map/entries/index.html @@ -0,0 +1,72 @@ +--- +title: Map.prototype.entries() +slug: Web/JavaScript/Reference/Global_Objects/Map/entries +tags: + - Map +translation_of: Web/JavaScript/Reference/Global_Objects/Map/entries +--- +<div>{{JSRef}}</div> + +<p><code><strong>entries()</strong></code> 方法返回一个新的包含 <code>[key, value]</code> 对的 <code><strong>Iterator</strong></code> 对象，返回的迭代器的迭代顺序与 <code>Map</code> 对象的插入顺序相同。</p> + +<p>{{EmbedInteractiveExample("pages/js/map-prototype-entries.html")}}</p> + +<h2 id="语法">语法</h2> + +<pre><code><var>myMap</var>.entries()</code> +</pre> + +<h3 id="返回值">返回值</h3> + +<p>一个新的 {{jsxref("Map")}} 迭代器对象.</p> + +<h2 id="示例">示例</h2> + +<h3 id="entries()的使用"><code>entries()</code>的使用</h3> + +<pre class="brush:js">var myMap = new Map(); +myMap.set("0", "foo"); +myMap.set(1, "bar"); +myMap.set({}, "baz"); + +var mapIter = myMap.entries(); + +console.log(mapIter.next().value); // ["0", "foo"] +console.log(mapIter.next().value); // [1, "bar"] +console.log(mapIter.next().value); // [Object, "baz"] +</pre> + +<h2 id="规范">规范</h2> + +<table> + <thead> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-map.prototype.entries', 'Map.prototype.entries')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES2015', '#sec-map.prototype.entries', 'Map.prototype.entries')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>Initial definition.</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{Compat("javascript.builtins.Map.entries")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Map.prototype.keys()")}}</li> + <li>{{jsxref("Map.prototype.values()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/map/foreach/index.html b/files/zh-cn/web/javascript/reference/global_objects/map/foreach/index.html new file mode 100644 index 0000000000..f6540d7412 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/map/foreach/index.html @@ -0,0 +1,109 @@ +--- +title: Map.prototype.forEach() +slug: Web/JavaScript/Reference/Global_Objects/Map/forEach +tags: + - ECMAScript 2015 + - JavaScript + - Map + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Map/forEach +--- +<div>{{JSRef}}</div> + +<p><span class="seoSummary"><code><strong>forEach()</strong></code> 方法按照插入顺序依次对 <code>Map</code> 中每个键/值对执行一次给定的函数</span></p> + +<div>{{EmbedInteractiveExample("pages/js/map-prototype-foreach.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox notranslate"><code><var>myMap</var>.forEach(<var>callback([<var>value</var>][,<var>key</var>][,<var>map</var>])[, <var>thisArg</var>])</var></code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code><var>callback</var></code></dt> + <dd> + <p><code><var>myMap</var></code> 中每个元素所要执行的函数。它具有如下的参数</p> + + <dl> + <dt><code><var>value</var></code> {{Optional_Inline}}</dt> + <dd>每个迭代的值。</dd> + <dt><code><var>key</var></code> {{Optional_Inline}}</dt> + <dd>每个迭代的键。</dd> + <dt><code><var>map</var></code> {{Optional_Inline}}</dt> + <dd>被迭代的map（上文语法框中的 <code><var>myMap</var></code>）。</dd> + </dl> + </dd> + <dt><code><var>thisArg</var></code> {{Optional_Inline}}</dt> + <dd>在 <code><var>callback</var></code> 执行中使用的 <code>this</code> 的值。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>{{jsxref("undefined")}}.</p> + +<h2 id="描述">描述</h2> + +<p><code>forEach</code> 方法会对map中每个真实存在的键执行一次给定的 <code><var>callback</var></code> 函数。它不会对被删除的键执行函数。然而，它会对每个值为 <code>undefined</code> 的键执行函数。</p> + +<p><code><var>callback</var></code> 接收<strong>三个参数</strong>：</p> + +<ul> + <li>当前的 <code><var>value</var></code></li> + <li>当前的 <code><var>key</var></code></li> + <li>正在被遍历的 <strong><code>Map</code> 对象</strong></li> +</ul> + +<p>如果 <code>forEach</code> 中含有 <code><var>thisArg</var></code> 参数，那么每次 <code><var>callback</var></code> 被调用时，都会被用作 <code>this</code> 的值。否则，<code>undefined</code> 将会被用作 <code>this</code> 的值。按照<a href="/en-US/docs/Web/JavaScript/Reference/Operators/this">函数观察到 <code>this</code> 的常用规则</a>，<code><var>callback</var></code> 函数最终可观察到 <code>this</code> 值。</p> + +<p>每个值只被访问一次，除非它被删除了或者在 <code>forEach</code> 结束前被改变了。<code><var>callback</var></code> 不会对在被访问前就删除的元素执行。在 <code>forEach</code> 结束前被添加的元素将会被访问。</p> + +<p><code>forEach</code> 会对 <code>Map</code> 对象中的每个元素执行一次 <code><var>callback</var></code>。它不会返回值。</p> + +<h2 id="示例">示例</h2> + +<h3 id="输出一个_Map_对象中的内容">输出一个 <code>Map</code> 对象中的内容</h3> + +<p>以下的代码在每行中打印一个 <code>Map</code> 对象中的元素</p> + +<pre class="brush:js notranslate">function logMapElements(value, key, map) { + console.log(`map.get('${key}') = ${value}`) +} +new Map([['foo', 3], ['bar', {}], ['baz', undefined]]).forEach(logMapElements) +// logs: +// "map.get('foo') = 3" +// "map.get('bar') = [object Object]" +// "map.get('baz') = undefined" +</pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">规范</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-map.prototype.foreach', 'Map.prototype.forEach')}}</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容">浏览器兼容</h2> + + + +<p>{{Compat("javascript.builtins.Map.forEach")}}</p> + +<h2 id="参见">参见</h2> + +<ul> + <li>{{jsxref("Array.prototype.forEach()")}}</li> + <li>{{jsxref("Set.prototype.forEach()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/map/get/index.html b/files/zh-cn/web/javascript/reference/global_objects/map/get/index.html new file mode 100644 index 0000000000..1de9947bc4 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/map/get/index.html @@ -0,0 +1,81 @@ +--- +title: Map.prototype.get() +slug: Web/JavaScript/Reference/Global_Objects/Map/get +tags: + - ECMAScript 2015 + - JavaScript + - Map + - Method + - Prototype + - 方法 +translation_of: Web/JavaScript/Reference/Global_Objects/Map/get +--- +<div>{{JSRef}}</div> + +<p><code><strong>get()</strong></code> 方法返回某个 <code>Map</code> 对象中的一个指定元素。</p> + +<div>{{EmbedInteractiveExample("pages/js/map-prototype-get.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><em>myMap</em>.get(key);</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt>key</dt> + <dd>必须参数，也是它唯一的参数，要从目标 <code>Map</code> 对象中获取的元素的键。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>返回一个 <code>Map</code> 对象中与指定键相关联的值，如果找不到这个键则返回 <code>undefined</code>。</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用_get_方法">使用 <code>get</code> 方法</h3> + +<pre class="brush: js">var myMap = new Map(); +myMap.set("bar", "foo"); + +myMap.get("bar"); // 返回 "foo" +myMap.get("baz"); // 返回 undefined +</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>{{SpecName('ES2015', '#sec-map.prototype.get', 'Map.prototype.get')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-map.prototype.get', 'Map.prototype.get')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.Map.get")}}</p> + +<h2 id="参见">参见</h2> + +<ul> + <li>{{jsxref("Map")}}</li> + <li>{{jsxref("Map.prototype.set()")}}</li> + <li>{{jsxref("Map.prototype.has()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/map/has/index.html b/files/zh-cn/web/javascript/reference/global_objects/map/has/index.html new file mode 100644 index 0000000000..73eb4550d0 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/map/has/index.html @@ -0,0 +1,120 @@ +--- +title: Map.prototype.has() +slug: Web/JavaScript/Reference/Global_Objects/Map/has +tags: + - ECMAScript 2015 + - JavaScript + - Map + - Method + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Map/has +--- +<div>{{JSRef}}</div> + +<p>方法<code><strong>has()</strong></code> 返回一个bool值，用来表明map 中是否存在指定元素.</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><em>myMap</em>.has(key);</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt>key</dt> + <dd>必填. 用来检测是否存在指定元素的键值.</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<dl> + <dt>Boolean</dt> + <dd>如果指定元素存在于Map中，则返回true。其他情况返回false</dd> +</dl> + +<h2 id="案例">案例</h2> + +<h3 id="使用has方法">使用has方法</h3> + +<pre class="brush: js">var myMap = new Map(); +myMap.set("bar", "foo"); + +myMap.has("bar"); // returns true +myMap.has("baz"); // returns false +</pre> + +<h2 id="规范列表">规范列表</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范名称</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-map.prototype.has', 'Map.prototype.has')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{CompatibilityTable}}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>浏览器</th> + <th>Chrome谷歌</th> + <th>Firefox (Gecko)火狐</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>兼容版本</td> + <td>38</td> + <td>{{CompatGeckoDesktop("13.0")}}</td> + <td>11</td> + <td>25</td> + <td>7.1</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>浏览器</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>兼容版本</td> + <td>{{CompatNo}}</td> + <td>38</td> + <td>{{CompatGeckoMobile("13.0")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>8</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Map")}}</li> + <li>{{jsxref("Map.prototype.set()")}}</li> + <li>{{jsxref("Map.prototype.get()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/map/index.html b/files/zh-cn/web/javascript/reference/global_objects/map/index.html new file mode 100644 index 0000000000..b84dfb2304 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/map/index.html @@ -0,0 +1,340 @@ +--- +title: Map +slug: Web/JavaScript/Reference/Global_Objects/Map +tags: + - ECMAScript6 + - JavaScript + - Map +translation_of: Web/JavaScript/Reference/Global_Objects/Map +--- +<div> +<div>{{JSRef}}</div> +</div> + +<p><strong><code>Map</code></strong> 对象保存键值对，并且能够记住键的原始插入顺序。任何值(对象或者{{Glossary("Primitive", "原始值")}}) 都可以作为一个键或一个值。</p> + +<dl> +</dl> + +<h2 id="描述">描述</h2> + +<p>一个Map对象在迭代时会根据对象中元素的插入顺序来进行 — 一个 {{jsxref("Statements/for...of", "for...of")}} 循环在每次迭代后会返回一个形式为[key，value]的数组。</p> + +<h3 id="键的相等Key_equality">键的相等(Key equality)</h3> + +<ul> + <li>键的比较是基于 <code><a href="/zh-CN/docs/Web/JavaScript/Equality_comparisons_and_sameness#零值相等">sameValueZero</a></code> 算法：</li> + <li>{{jsxref("NaN")}} 是与 <code>NaN</code> 相等的（虽然 <code>NaN !== NaN</code>），剩下所有其它的值是根据 <code>===</code> 运算符的结果判断是否相等。</li> + <li>在目前的ECMAScript规范中，<code>-0</code>和<code>+0</code>被认为是相等的，尽管这在早期的草案中并不是这样。有关详细信息，请参阅<a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Map#浏览器兼容性">浏览器兼容性</a> 表中的“Value equality for -0 and 0”。</li> +</ul> + +<h3 id="Objects_和_maps_的比较">Objects 和 maps 的比较</h3> + +<p>{{jsxref("Object", "Objects")}} 和 <code>Maps</code> 类似的是，它们都允许你按键存取一个值、删除键、检测一个键是否绑定了值。因此（并且也没有其他内建的替代方式了）过去我们一直都把对象当成 <code>Maps</code> 使用。不过 <code>Maps</code> 和 <code>Objects</code> 有一些重要的区别，在下列情况里使用 <code>Map</code> 会是更好的选择：</p> + +<table class="standard-table"> + <thead> + <tr> + <th scope="row"></th> + <th scope="col">Map</th> + <th scope="col">Object</th> + </tr> + </thead> + <tbody> + <tr> + <th scope="row">意外的键</th> + <td><code>Map</code> 默认情况不包含任何键。只包含显式插入的键。</td> + <td> + <p>一个 <code>Object</code> 有一个原型, 原型链上的键名有可能和你自己在对象上的设置的键名产生冲突。</p> + + <div class="blockIndicator note"> + <p><strong>注意:</strong> 虽然 ES5 开始可以用 <code>Object.create(null)</code> 来创建一个没有原型的对象，但是这种用法不太常见。</p> + </div> + </td> + </tr> + <tr> + <th scope="row">键的类型</th> + <td>一个 <code>Map</code>的键可以是<strong>任意值</strong>，包括函数、对象或任意基本类型。</td> + <td>一个<code>Object</code> 的键必须是一个 {{jsxref("String")}} 或是{{jsxref("Symbol")}}。</td> + </tr> + <tr> + <th scope="row">键的顺序</th> + <td> + <p><code>Map</code> 中的 key 是有序的。因此，当迭代的时候，一个 <code>Map</code> 对象以插入的顺序返回键值。</p> + </td> + <td> + <p>一个 <code>Object</code> 的键是无序的</p> + + <div class="blockIndicator note"> + <p>注意：自ECMAScript 2015规范以来，对象<em>确实</em>保留了字符串和Symbol键的创建顺序； 因此，在只有字符串键的对象上进行迭代将按插入顺序产生键。</p> + </div> + </td> + </tr> + <tr> + <th scope="row">Size</th> + <td> <code>Map</code> 的键值对个数可以轻易地通过{{jsxref("Map.prototype.size", "size")}} 属性获取</td> + <td><code>Object</code> 的键值对个数只能手动计算</td> + </tr> + <tr> + <th scope="row">迭代</th> + <td><code>Map</code> 是 <a href="/en-US/docs/Web/JavaScript/Guide/iterable">iterable</a> 的，所以可以直接被迭代。</td> + <td>迭代一个<code>Object</code>需要以某种方式获取它的键然后才能迭代。</td> + </tr> + <tr> + <th scope="row">性能</th> + <td> + <p>在频繁增删键值对的场景下表现更好。</p> + </td> + <td> + <p>在频繁添加和删除键值对的场景下未作出优化。</p> + </td> + </tr> + </tbody> +</table> + +<h2 id="构造函数">构造函数</h2> + +<dl> + <dt>{{jsxref("Global_Objects/Map/Map", "Map()")}}</dt> + <dd>创建 <code>Map</code> 对象</dd> +</dl> + +<h2 id="属性">属性</h2> + +<dl> + <dt><code>Map.length</code></dt> + <dd>属性 length 的值为 0 。<br> + 想要计算一个<code>Map</code> 中的条目数量， 使用 {{jsxref("Map.prototype.size")}}.</dd> + <dt>{{jsxref("Map.@@species", "get Map[@@species]")}}</dt> + <dd>本构造函数用于创建派生对象。</dd> + <dt>{{jsxref("Map.prototype")}}</dt> + <dd>表示 <code>Map</code> 构造器的原型。 允许添加属性从而应用于所有的 <code>Map</code> 对象。</dd> +</dl> + +<h2 id="Map_实例"><code>Map</code> 实例</h2> + +<p><font face="Open Sans, Arial, sans-serif">所有的 </font><code>Map</code> 对象实例都会继承 {{jsxref("Map.prototype")}}。</p> + +<h3 id="属性_2">属性</h3> + +<p>{{page('zh-CN/Web/JavaScript/Reference/Global_Objects/Map/prototype','属性')}}</p> + +<h3 id="方法">方法</h3> + +<p>{{page('zh-CN/Web/JavaScript/Reference/Global_Objects/Map/prototype','方法')}}</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用_Map_对象">使用 <code>Map</code> 对象</h3> + +<pre class="brush: js">let myMap = new Map(); + +let keyObj = {}; +let keyFunc = function() {}; +let keyString = 'a string'; + +// 添加键 +myMap.set(keyString, "和键'a string'关联的值"); +myMap.set(keyObj, "和键keyObj关联的值"); +myMap.set(keyFunc, "和键keyFunc关联的值"); + +myMap.size; // 3 + +// 读取值 +myMap.get(keyString); // "和键'a string'关联的值" +myMap.get(keyObj); // "和键keyObj关联的值" +myMap.get(keyFunc); // "和键keyFunc关联的值" + +myMap.get('a string'); // "和键'a string'关联的值" + // 因为keyString === 'a string' +myMap.get({}); // undefined, 因为keyObj !== {} +myMap.get(function() {}); // undefined, 因为keyFunc !== function () {}</pre> + +<h3 id="将_NaN_作为_Map_的键">将 <code>NaN</code> 作为 <code>Map</code> 的键</h3> + +<p><code>NaN</code> 也可以作为<code>Map</code>对象的键。虽然 <code>NaN</code> 和任何值甚至和自己都不相等(<code>NaN !== NaN</code> 返回true)，但下面的例子表明，<code>NaN</code>作为Map的键来说是没有<span><span>区别的</span></span>:</p> + +<pre class="brush: js">let myMap = new Map(); +myMap.set(NaN, "not a number"); + +myMap.get(NaN); // "not a number" + +let otherNaN = Number("foo"); +myMap.get(otherNaN); // "not a number" +</pre> + +<h3 id="使用_for..of_方法迭代_Map">使用 <code>for..of</code> 方法迭代 <code>Map</code></h3> + +<p><code>Map</code>可以使用<code>for..of</code>循环来实现迭代：</p> + +<pre class="brush: js">let myMap = new Map(); +myMap.set(0, "zero"); +myMap.set(1, "one"); +for (let [key, value] of myMap) { + console.log(key + " = " + value); +} +// 将会显示两个log。一个是"0 = zero"另一个是"1 = one" + +for (let key of myMap.keys()) { + console.log(key); +} +// 将会显示两个log。 一个是 "0" 另一个是 "1" + +for (let value of myMap.values()) { + console.log(value); +} +// 将会显示两个log。 一个是 "zero" 另一个是 "one" + +for (let [key, value] of myMap.entries()) { + console.log(key + " = " + value); +} +// 将会显示两个log。 一个是 "0 = zero" 另一个是 "1 = one"</pre> + +<h3 id="使用_forEach_方法迭代_Map">使用 <code>forEach()</code> 方法迭代 <code>Map</code></h3> + +<p><code>Map</code>也可以通过<code>forEach()</code>方法迭代：</p> + +<pre class="brush: js">myMap.forEach(function(value, key) { + console.log(key + " = " + value); +}) +// 将会显示两个logs。 一个是 "0 = zero" 另一个是 "1 = one" +</pre> + +<h3 id="Map_与数组的关系"><code>Map</code> 与数组的关系</h3> + +<pre class="brush: js">let kvArray = [["key1", "value1"], ["key2", "value2"]]; + +// 使用常规的Map构造函数可以将一个二维键值对数组转换成一个Map对象 +let myMap = new Map(kvArray); + +myMap.get("key1"); // 返回值为 "value1" + +// 使用Array.from函数可以将一个Map对象转换成一个二维键值对数组 +console.log(Array.from(myMap)); // 输出和kvArray相同的数组 + +// 更简洁的方法来做如上同样的事情，使用展开运算符 +console.log([...myMap]); + +// 或者在键或者值的迭代器上使用Array.from，进而得到只含有键或者值的数组 +console.log(Array.from(myMap.keys())); // 输出 ["key1", "key2"] +</pre> + +<h3 id="复制或合并_Maps">复制或合并 <code>Maps</code></h3> + +<p>Map 能像数组一样被复制：</p> + +<pre class="brush: js">let original = new Map([ + [1, 'one'] +]); + +let clone = new Map(original); + +console.log(clone.get(1)); // one +console.log(original === clone); // false. 浅比较 不为同一个对象的引用 +</pre> + +<div class="blockIndicator note"> +<p>重要：请记住，<em>数据本身</em>未被克隆。</p> +</div> + +<p>Map对象间可以进行合并，但是会保持键的唯一性。</p> + +<pre class="brush: js">let first = new Map([ + [1, 'one'], + [2, 'two'], + [3, 'three'], +]); + +let second = new Map([ + [1, 'uno'], + [2, 'dos'] +]); + +// 合并两个Map对象时，如果有重复的键值，则后面的会覆盖前面的。 +// 展开运算符本质上是将Map对象转换成数组。 +let merged = new Map([...first, ...second]); + +console.log(merged.get(1)); // uno +console.log(merged.get(2)); // dos +console.log(merged.get(3)); // three</pre> + +<p>Map对象也能与数组合并：</p> + +<pre class="brush: js">let first = new Map([ + [1, 'one'], + [2, 'two'], + [3, 'three'], +]); + +let second = new Map([ + [1, 'uno'], + [2, 'dos'] +]); + +// Map对象同数组进行合并时，如果有重复的键值，则后面的会覆盖前面的。 +let merged = new Map([...first, ...second, [1, 'eins']]); + +console.log(merged.get(1)); // eins +console.log(merged.get(2)); // dos +console.log(merged.get(3)); // three</pre> + +<h2 id="使用说明">使用说明</h2> + +<p>请注意！为Map设置对象属性也是可以的，但是可能引起大量的混乱。</p> + +<p>所以，你还是<em>可以这样做.</em>..</p> + +<pre class="syntaxbox example-bad brush js">let wrongMap = new Map() +wrongMap['bla'] = 'blaa' +wrongMap['bla2'] = 'blaaa2' + +console.log(wrongMap) // Map { bla: 'blaa', bla2: 'blaaa2' } +</pre> + +<p>...但是，这样做的话，它的行为会不符合预期:</p> + +<pre class="syntaxbox example-bad brush js">wrongMap.has('bla') // false +wrongMap.delete('bla') // false +console.log(wrongMap) // Map { bla: 'blaa', bla2: 'blaaa2' }</pre> + +<p>无论如何，和正确用法比较起来，几乎没有什么不同: </p> + +<pre class="syntaxbox brush js example-good">let myMap = new Map() +myMap.set('bla','blaa') +myMap.set('bla2','blaa2') +console.log(myMap) // Map { 'bla' => 'blaa', 'bla2' => 'blaa2' } + +myMap.has('bla') // true +myMap.delete('bla') // true +console.log(myMap) // Map { 'bla2' => 'blaa2' }</pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Specification</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-map-objects', 'Map')}}</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div class="hidden"> +<p>The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> +</div> + +<p>{{Compat("javascript.builtins.Map")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Set")}}</li> + <li>{{jsxref("WeakMap")}}</li> + <li>{{jsxref("WeakSet")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/map/keys/index.html b/files/zh-cn/web/javascript/reference/global_objects/map/keys/index.html new file mode 100644 index 0000000000..5d27dffc82 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/map/keys/index.html @@ -0,0 +1,79 @@ +--- +title: Map.prototype.keys() +slug: Web/JavaScript/Reference/Global_Objects/Map/keys +tags: + - ECMAScript6 + - Iterator + - JavaScript + - Map + - Method + - Prototype + - 方法 +translation_of: Web/JavaScript/Reference/Global_Objects/Map/keys +--- +<div>{{JSRef}}</div> + +<p><code><strong>keys()</strong></code> 返回一个引用的 <code><strong>Iterator</strong></code> 对象。它包含按照顺序插入 <code>Map</code> 对象中每个元素的key值。</p> + +<div>{{EmbedInteractiveExample("pages/js/map-prototype-keys.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox notranslate"><code><em>myMap</em>.keys()</code></pre> + +<h3 id="返回值">返回值</h3> + +<p>一个存在引用关系的 {{jsxref("Map")}} iterator 对象.</p> + +<h2 id="例子">例子</h2> + +<h3 id="使用_keys">使用 <code>keys()</code></h3> + +<pre class="brush:js notranslate">var myMap = new Map(); +myMap.set("0", "foo"); +myMap.set(1, "bar"); +myMap.set({}, "baz"); + +var mapIter = myMap.keys(); + +console.log(mapIter.next().value); // "0" +console.log(mapIter.next().value); // 1 +console.log(mapIter.next().value); // Object +</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>{{SpecName('ES2015', '#sec-map.prototype.keys', 'Map.prototype.keys')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-map.prototype.keys', 'Map.prototype.keys')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.Map.keys")}}</p> + +<h2 id="参见">参见</h2> + +<ul> + <li>{{jsxref("Map.prototype.entries()")}}</li> + <li>{{jsxref("Map.prototype.values()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/map/map/index.html b/files/zh-cn/web/javascript/reference/global_objects/map/map/index.html new file mode 100644 index 0000000000..643f5b2b4d --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/map/map/index.html @@ -0,0 +1,57 @@ +--- +title: Map() 构造函数 +slug: Web/JavaScript/Reference/Global_Objects/Map/Map +translation_of: Web/JavaScript/Reference/Global_Objects/Map/Map +--- +<div>{{JSRef}}</div> + +<p><strong><code>Map()</code> 构造函数</strong> 创建 {{jsxref("Map")}} 对象.</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">new Map([<var>iterable</var>])</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code><var>iterable</var></code></dt> + <dd>Iterable 可以是一个{{jsxref("Array", "数组")}}或者其他 <a href="/zh-CN/docs/Web/JavaScript/Guide/iterable">iterable</a> 对象，其元素为键值对(两个元素的数组，例如: [[ 1, 'one' ],[ 2, 'two' ]])。 每个键值对都会添加到新的 Map。<code>null</code> 会被当做 <code>undefined。</code></dd> +</dl> + +<h2 id="示例">示例</h2> + +<pre class="brush: js">let myMap = new Map([ + [1, 'one'], + [2, 'two'], + [3, 'three'], +]) +</pre> + +<h2 id="Specifications">Specifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Specification</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-map-constructor', 'Map constructor')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility">Browser compatibility</h2> + + + +<p>{{Compat("javascript.builtins.Map.Map")}}</p> + +<h2 id="See_also">See also</h2> + +<ul> + <li>{{jsxref("Set")}}</li> + <li>{{jsxref("WeakMap")}}</li> + <li>{{jsxref("WeakSet")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/map/prototype/index.html b/files/zh-cn/web/javascript/reference/global_objects/map/prototype/index.html new file mode 100644 index 0000000000..99c2f0de08 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/map/prototype/index.html @@ -0,0 +1,130 @@ +--- +title: Map.prototype +slug: Web/JavaScript/Reference/Global_Objects/Map/prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Map +--- +<div>{{JSRef}}</div> + +<p><code><strong>Map</strong></code><strong><code>.prototype</code></strong> 属性表示 {{jsxref("Map")}}构造函数的原型对象。</p> + +<div>{{js_property_attributes(0,0,0)}}</div> + +<h2 id="描述">描述</h2> + +<p>{{jsxref("Map")}} 实例继承自{{jsxref("Map.prototype")}}。你可以使用这个构造函数的原型对象来给所有的Map实例添加属性或者方法。</p> + +<h2 id="属性">属性</h2> + +<dl> + <dt><code>Map.prototype.constructor</code></dt> + <dd>返回一个函数，它创建了实例的原型。默认是{{jsxref("Map")}}函数。</dd> + <dt>{{jsxref("Map.prototype.size")}}</dt> + <dd>返回Map对象的键/值对的数量。</dd> +</dl> + +<h2 id="方法">方法</h2> + +<dl> + <dt>{{jsxref("Map.prototype.clear()")}}</dt> + <dd>移除Map对象的所有键/值对 。</dd> + <dt>{{jsxref("Map.delete", "Map.prototype.delete(key)")}}</dt> + <dd>如果 <code>Map</code> 对象中存在该元素，则移除它并返回<em> <code>true</code></em>；否则如果该元素不存在则返回 <code><em>false</em></code>。随后调用 <code>Map.prototype.has(key)</code> 将返回 <code>false</code> 。</dd> + <dt>{{jsxref("Map.prototype.entries()")}}</dt> + <dd>返回一个新的 <code>Iterator</code> 对象，它按插入顺序包含了Map对象中每个元素的 <strong><code>[key, value]</code></strong> <code><strong>数组</strong></code>。</dd> + <dt>{{jsxref("Map.forEach", "Map.prototype.forEach(callbackFn[, thisArg])")}}</dt> + <dd>按插入顺序，为 <code>Map</code>对象里的每一键值对调用一次callbackFn函数。如果为forEach提供了thisArg，它将在每次回调中作为this值。</dd> + <dt>{{jsxref("Map.get", "Map.prototype.get(key)")}}</dt> + <dd>返回键对应的值，如果不存在，则返回undefined。</dd> + <dt>{{jsxref("Map.has", "Map.prototype.has(key)")}}</dt> + <dd>返回一个布尔值，表示Map实例是否包含键对应的值。</dd> + <dt>{{jsxref("Map.prototype.keys()")}}</dt> + <dd>返回一个新的 <code>Iterator</code>对象， 它按插入顺序包含了Map对象中每个元素的<strong>键 </strong>。</dd> + <dt>{{jsxref("Map.set", "Map.prototype.set(key, value)")}}</dt> + <dd>设置Map对象中键的值。返回该Map对象。</dd> + <dt>{{jsxref("Map.prototype.values()")}}</dt> + <dd>返回一个新的<code>Iterator</code>对象，它按插入顺序包含了Map对象中每个元素的<strong>值</strong> 。</dd> + <dt>{{jsxref("Map.@@iterator", "Map.prototype[@@iterator]()")}}</dt> + <dd>返回一个新的<code>Iterator</code>对象，它按插入顺序包含了Map对象中每个元素的 <strong><code>[key, value]</code></strong> <code><strong>数组</strong></code>。</dd> +</dl> + +<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('ES6', '#sec-map.prototype', 'Map.prototype')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-map.prototype', 'Map.prototype')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{CompatibilityTable}}</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>38</td> + <td>{{ CompatGeckoDesktop("13") }}</td> + <td>11</td> + <td>25</td> + <td>7.1</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>{{CompatNo}}</td> + <td>38</td> + <td>{{CompatGeckoMobile("13")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td> + <p>8</p> + </td> + </tr> + </tbody> +</table> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Set.prototype")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/map/set/index.html b/files/zh-cn/web/javascript/reference/global_objects/map/set/index.html new file mode 100644 index 0000000000..8184278bc3 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/map/set/index.html @@ -0,0 +1,96 @@ +--- +title: Map.prototype.set() +slug: Web/JavaScript/Reference/Global_Objects/Map/set +tags: + - ECMAScript6 + - JavaScript + - Map + - Method + - Prototype + - 方法 +translation_of: Web/JavaScript/Reference/Global_Objects/Map/set +--- +<p id="sect1">{{JSRef}}</p> + +<p><code><strong>set()</strong></code> 方法为 <code>Map</code> 对象添加或更新一个指定了键（<code>key</code>）和值（<code>value</code>）的（新）键值对。</p> + +<div>{{EmbedInteractiveExample("pages/js/map-prototype-set.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><em>myMap</em>.set(key, value);</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt>key</dt> + <dd>要添加至相应 <code>Map</code> 对象的元素的键。</dd> + <dt>value</dt> + <dd>要添加至相应 <code>Map</code> 对象的元素的值。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p><code>Map</code> 对象</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用_set_方法">使用 <code>set</code> 方法</h3> + +<pre class="brush: js">var myMap = new Map(); + +// 将一个新元素添加到 Map 对象 +myMap.set("bar", "foo"); +myMap.set(1, "foobar"); + +// 在Map对象中更新某个元素的值 +myMap.set("bar", "baz"); +</pre> + +<h3 id="链式使用_set_方法">链式使用 <code>set</code> 方法</h3> + +<p>因为 Set() 方法返回 Map 对象本身，所以你可以像下面这样链式调用它:</p> + +<pre class="brush: js">// Add new elements to the map with chaining. +myMap.set('bar', 'foo') + .set(1, 'foobar') + .set(2, 'baz'); +</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>{{SpecName('ES2015', '#sec-map.prototype.set', 'Map.prototype.set')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-map.prototype.set', 'Map.prototype.set')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div class="hidden">这个页面上的浏览器兼容性表格是基于结构化数据生成的。如果您想贡献数据，请查看https://github.com/mdn/browser-compat-data并向我们发送请求。</div> + +<p>{{Compat("javascript.builtins.Map.set")}}</p> + +<h2 id="参见">参见</h2> + +<ul> + <li>{{jsxref("Map")}}</li> + <li>{{jsxref("Map.prototype.get()")}}</li> + <li>{{jsxref("Map.prototype.has()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/map/size/index.html b/files/zh-cn/web/javascript/reference/global_objects/map/size/index.html new file mode 100644 index 0000000000..14fb449e92 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/map/size/index.html @@ -0,0 +1,77 @@ +--- +title: Map.prototype.size +slug: Web/JavaScript/Reference/Global_Objects/Map/size +tags: + - ECMAScript 2015 + - JavaScript + - Map + - Property +translation_of: Web/JavaScript/Reference/Global_Objects/Map/size +--- +<div>{{JSRef}}<br> + </div> + +<p><code><strong>size</strong></code> 是可访问属性，用于返回 一个{{jsxref("Map")}} 对象的成员数量。</p> + +<p>{{EmbedInteractiveExample("pages/js/map-prototype-size.html")}}</p> + +<p>这个示例源码保存在GitHub：<a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a>。如果你想贡献代码，修改后在GitHub上发推送请求给我们。</p> + +<p> </p> + +<h2 id="描述">描述</h2> + +<p>size 属性的值是一个整数，表示 Map 对象有多少个键值对。size 是只读属性，用set 方法修改size返回 undefined，即不能改变它的值。</p> + +<h2 id="示例">示例</h2> + +<pre class="brush:js">var myMap = new Map(); +myMap.set("a", "alpha"); +myMap.set("b", "beta"); +myMap.set("g", "gamma"); + +myMap.size // 3 +</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('ES6', '#sec-get-map.prototype.size', 'Map.prototype.size')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-get-map.prototype.size', 'Map.prototype.size')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容">浏览器兼容</h2> + +<p>此页的兼容性表格请查阅：<a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> <br> + 如果你想更新数据，请在GitHub上给我们发推送请求。</p> + +<div class="blockIndicator warning"> +<p><strong>异常提醒</strong></p> +</div> + +<ul> + <li>在JavaScript中直接书写Map.prototype.size可能得到以下异常：<br> + <code>Uncaught TypeError: Method get Map.prototype.size called on incompatible receiver #<Map></code><br> + 异常原因查看：<a href="/zh-CN/docs/">https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Errors/Called_on_incompatible_type</a></li> +</ul> + +<h2 id="相关阅读">相关阅读</h2> + +<ul> + <li>{{jsxref("Map")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/map/values/index.html b/files/zh-cn/web/javascript/reference/global_objects/map/values/index.html new file mode 100644 index 0000000000..30336e98ce --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/map/values/index.html @@ -0,0 +1,112 @@ +--- +title: Map.prototype.values() +slug: Web/JavaScript/Reference/Global_Objects/Map/values +translation_of: Web/JavaScript/Reference/Global_Objects/Map/values +--- +<div><code><strong>values()</strong></code> 方法返回一个新的Iterator对象。它包含按顺序插入Map对象中每个元素的value值。</div> + +<div> </div> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><em>myMap</em>.values()</code></pre> + +<h3 id="返回值">返回值</h3> + +<p>一个新的 <a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Map" title="此页面仍未被本地化, 期待您的翻译!"><code>Map</code></a> 可迭代对象.</p> + +<h2 id="例子">例子</h2> + +<h3 id="使用_values()"><code>使用 values()</code></h3> + +<pre class="brush:js">var myMap = new Map(); +myMap.set("0", "foo"); +myMap.set(1, "bar"); +myMap.set({}, "baz"); + +var mapIter = myMap.values(); + +console.log(mapIter.next().value); // "foo" +console.log(mapIter.next().value); // "bar" +console.log(mapIter.next().value); // "baz"</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>{{SpecName('ES6', '#sec-map.prototype.values', 'Map.prototype.values')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>初始定义</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-map.prototype.values', 'Map.prototype.values')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{CompatibilityTable}}</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>38</td> + <td>{{ CompatGeckoDesktop("20") }}</td> + <td>{{CompatNo}}</td> + <td>25</td> + <td>7.1</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>{{CompatNo}}</td> + <td>38</td> + <td>{{ CompatGeckoMobile("20") }}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>8</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="查看">查看</h2> + +<ul> + <li>{{jsxref("Map.prototype.entries()")}}</li> + <li>{{jsxref("Map.prototype.keys()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/math/abs/index.html b/files/zh-cn/web/javascript/reference/global_objects/math/abs/index.html new file mode 100644 index 0000000000..13f5f96b79 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/math/abs/index.html @@ -0,0 +1,125 @@ +--- +title: Math.abs() +slug: Web/JavaScript/Reference/Global_Objects/Math/abs +translation_of: Web/JavaScript/Reference/Global_Objects/Math/abs +--- +<div>{{JSRef("Global_Objects", "Math")}}</div> + +<p><code><strong>Math.abs(x)</strong></code> 函数返回指定数字 “x“ 的绝对值。如下：</p> + +<p><math display="block"><semantics><mrow><mstyle mathvariant="monospace"><mrow><mo lspace="0em" rspace="thinmathspace">Math.abs</mo><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo></mrow></mstyle><mo>=</mo><mrow><mo stretchy="false">|</mo><mi>x</mi><mo stretchy="false">|</mo></mrow><mo>=</mo><mrow><mo>{</mo><mtable columnalign="left left"><mtr><mtd><mi>x</mi></mtd><mtd><mtext>if</mtext><mspace width="1em"></mspace><mi>x</mi><mo>≥</mo><mn>0</mn></mtd></mtr><mtr><mtd><mo>-</mo><mi>x</mi></mtd><mtd><mtext>if</mtext><mspace width="1em"></mspace><mi>x</mi><mo><</mo><mn>0</mn></mtd></mtr></mtable></mrow></mrow><annotation encoding="TeX">{\mathtt{\operatorname{Math.abs}(x)}} = {|x|} = \begin{cases} x & \text{if} \quad x \geq 0 \\ -x & \text{if} \quad x < 0 \end{cases} </annotation></semantics></math></p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox">Math.abs(<em>x</em>);</pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>x</code></dt> + <dd>一个数值</dd> +</dl> + +<h2 id="Description" name="Description">说明</h2> + +<p><code><font face="Open Sans, sans-serif"><span style="line-height: 21px;">由于 </span></font>Math.abs()</code> <code>是</code> <code>Math</code> 中的一个静态方法，你应该通过 <code>Math.abs()</code> <code>调用。</code>（Math 不是构造器）</p> + +<h2 id="Examples" name="Examples">示例</h2> + +<h3 id="Example:_Math.abs_behavior" name="Example:_Math.abs_behavior"><code>Math.abs()函数的行为</code></h3> + +<p>传入一个非数字形式的字符串或者 undefined/empty 变量，将返回 <code>NaN</code>。传入 null 将返回 0。</p> + +<pre class="brush:js">Math.abs('-1'); // 1 +Math.abs(-2); // 2 +Math.abs(null); // 0 +Math.abs("string"); // NaN +Math.abs(); // NaN</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>ECMAScript 1st Edition. Implemented in JavaScript 1.0</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.8.2.1', 'Math.abs')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-math.abs', 'Math.abs')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{ CompatibilityTable() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>The {{jsxref("Global_Objects/Math", "Math")}} object it belongs to.</li> + <li>{{jsxref("Math.ceil()")}}</li> + <li>{{jsxref("Math.floor()")}}</li> + <li>{{jsxref("Math.round()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/math/acos/index.html b/files/zh-cn/web/javascript/reference/global_objects/math/acos/index.html new file mode 100644 index 0000000000..7ff574d177 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/math/acos/index.html @@ -0,0 +1,115 @@ +--- +title: Math.acos() +slug: Web/JavaScript/Reference/Global_Objects/Math/acos +translation_of: Web/JavaScript/Reference/Global_Objects/Math/acos +--- +<div> + {{JSRef("Global_Objects", "Math")}}</div> +<h2 id="Summary" name="Summary">概述</h2> +<p><code><strong>Math.acos()</strong></code> 返回一个数的反余弦值（单位为弧度），即：</p> +<p><math display="block"><semantics><mrow><mo>∀</mo><mi>x</mi><mo>∊</mo><mo stretchy="false">[</mo><mrow><mo>-</mo><mn>1</mn></mrow><mo>;</mo><mn>1</mn><mo stretchy="false">]</mo><mo>,</mo><mspace width="thickmathspace"></mspace><mstyle mathvariant="monospace"><mrow><mo lspace="0em" rspace="thinmathspace">Math.acos</mo><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo></mrow></mstyle><mo>=</mo><mo lspace="0em" rspace="0em">arccos</mo><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo><mo>=</mo><mtext> the unique </mtext><mspace width="thickmathspace"></mspace><mi>y</mi><mo>∊</mo><mo stretchy="false">[</mo><mn>0</mn><mo>;</mo><mi>π</mi><mo stretchy="false">]</mo><mspace width="thinmathspace"></mspace><mtext>such that</mtext><mspace width="thickmathspace"></mspace><mo lspace="0em" rspace="0em">cos</mo><mo stretchy="false">(</mo><mi>y</mi><mo stretchy="false">)</mo><mo>=</mo><mi>x</mi></mrow><annotation encoding="TeX">\forall x \in [{-1};1],\;\mathtt{\operatorname{Math.acos}(x)} = \arccos(x) = \text{ the unique } \; y \in [0; \pi] \, \text{such that} \; \cos(y) = x</annotation></semantics></math></p> +<h2 id="Syntax" name="Syntax">语法</h2> +<pre class="syntaxbox">Math.acos(<em>x</em>) </pre> +<h2 id="Parameters" name="Parameters">参数</h2> +<dl> + <dt> + <code>x</code></dt> + <dd> + 一个数值</dd> +</dl> +<h2 id="Description" name="Description">描述</h2> +<p><code>acos</code> 方法以 -1 到 1 的一个数为参数，返回一个 0 到 pi （弧度）的数值。如果传入的参数值超出了限定的范围，将返回 <code>NaN</code>。</p> +<p>由于 <code>acos</code> 是 <code>Math</code> 的静态方法，所以应该像这样使用：<code>Math.acos()</code>，而不是作为你创建的 <code>Math</code> 实例的属性（<code>Math</code> 不是一个构造函数）。</p> +<h2 id="Examples" name="Examples">示例</h2> +<h3 id="Example:_Using_Math.acos" name="Example:_Using_Math.acos">例子：使用 <code>Math.acos</code></h3> +<pre class="brush:js">Math.acos(-2); // NaN +Math.acos(-1); // 3.141592653589793 +Math.acos(0); // 1.5707963267948966 +Math.acos(0.5); // 1.0471975511965979 +Math.acos(1); // 0 +Math.acos(2); // NaN +</pre> +<p>对于小于 -1 或大于 1 的值，<code>Math.acos</code> 返回 <code>NaN</code>。</p> +<h2 id="规范">规范</h2> +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范版本</th> + <th scope="col">规范状态</th> + <th scope="col">注解</th> + </tr> + <tr> + <td>ECMAScript 1st Edition. Implemented in JavaScript 1.0</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.8.2.2', 'Math.acos')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-math.acos', 'Math.acos')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> +<h2 id="浏览器兼容性">浏览器兼容性</h2> +<p>{{ CompatibilityTable() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> + </table> +</div> +<h2 id="See_also" name="See_also">相关链接</h2> +<ul> + <li>The {{jsxref("Global_Objects/Math", "Math")}} object it belongs to.</li> + <li>{{jsxref("Math.asin()")}}</li> + <li>{{jsxref("Math.atan()")}}</li> + <li>{{jsxref("Math.atan2()")}}</li> + <li>{{jsxref("Math.cos()")}}</li> + <li>{{jsxref("Math.sin()")}}</li> + <li>{{jsxref("Math.tan()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/math/asin/index.html b/files/zh-cn/web/javascript/reference/global_objects/math/asin/index.html new file mode 100644 index 0000000000..de7ebe61b3 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/math/asin/index.html @@ -0,0 +1,114 @@ +--- +title: Math.asin() +slug: Web/JavaScript/Reference/Global_Objects/Math/asin +translation_of: Web/JavaScript/Reference/Global_Objects/Math/asin +--- +<div> + {{JSRef("Global_Objects", "Math")}}</div> +<h2 id="Summary" name="Summary">概述</h2> +<p><code><strong>Math.asin()</strong></code> 方法返回一个数值的反正弦（单位为弧度），即：</p> +<p><math display="block"><semantics><mrow><mo>∀</mo><mi>x</mi><mo>∊</mo><mo stretchy="false">[</mo><mrow><mo>-</mo><mn>1</mn></mrow><mo>;</mo><mn>1</mn><mo stretchy="false">]</mo><mo>,</mo><mspace width="thickmathspace"></mspace><mstyle mathvariant="monospace"><mrow><mo lspace="0em" rspace="thinmathspace">Math.asin</mo><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo></mrow></mstyle><mo>=</mo><mo lspace="0em" rspace="0em">arcsin</mo><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo><mo>=</mo><mtext> the unique </mtext><mspace width="thickmathspace"></mspace><mi>y</mi><mo>∊</mo><mrow><mo>[</mo><mrow><mo>-</mo><mfrac><mi>π</mi><mn>2</mn></mfrac><mo>;</mo><mfrac><mi>π</mi><mn>2</mn></mfrac></mrow><mo>]</mo></mrow><mspace width="thinmathspace"></mspace><mtext>such that</mtext><mspace width="thickmathspace"></mspace><mo lspace="0em" rspace="0em">sin</mo><mo stretchy="false">(</mo><mi>y</mi><mo stretchy="false">)</mo><mo>=</mo><mi>x</mi></mrow><annotation encoding="TeX">\forall x \in [{-1};1],\;\mathtt{\operatorname{Math.asin}(x)} = \arcsin(x) = \text{ the unique } \; y \in \left[-\frac{\pi}{2}; \frac{\pi}{2}\right] \, \text{such that} \; \sin(y) = x</annotation></semantics></math></p> +<h2 id="Syntax" name="Syntax">语法</h2> +<pre class="syntaxbox">Math.asin(<em>x</em>)</pre> +<h3 id="Parameters" name="Parameters">参数</h3> +<dl> + <dt> + <code>x</code></dt> + <dd> + 一个数值</dd> +</dl> +<h2 id="Description" name="Description">描述</h2> +<p><code>asin</code> 方法接受 -1 到 1 之间的数值作为参数，返回一个介于 <math><semantics><mrow><mo>-</mo><mfrac><mi>π</mi><mn>2</mn></mfrac></mrow><annotation encoding="TeX">-\frac{\pi}{2}</annotation></semantics></math> 到 <math><semantics><mfrac><mi>π</mi><mn>2</mn></mfrac><annotation encoding="TeX">\frac{\pi}{2}</annotation></semantics></math> 弧度的数值。如果接受的参数值超出范围，则返回 <code>NaN</code>。</p> +<p>由于 <code>asin</code> 是 <code>Math</code> 的静态方法，所有应该像这样使用：<code>Math.asin()</code>，而不是作为你创建的 <code>Math</code> 实例的方法。</p> +<h2 id="Examples" name="Examples">示例</h2> +<h3 id="Example:_Using_Math.asin" name="Example:_Using_Math.asin">例子：使用 <code>Math.asin()</code></h3> +<pre class="brush:js">Math.asin(-2); // NaN +Math.asin(-1); // -1.5707963267948966 (-pi/2) +Math.asin(0); // 0 +Math.asin(0.5); // 0.5235987755982989 +Math.asin(1); // 1.570796326794897 (pi/2) +Math.asin(2); // NaN</pre> +<p>对于小于 -1 或大于 1 的参数值，<code>Math.asin</code> 返回 <code>NaN</code>。</p> +<h2 id="规范">规范</h2> +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范版本</th> + <th scope="col">规范状态</th> + <th scope="col">注解</th> + </tr> + <tr> + <td>ECMAScript 1st Edition. Implemented in JavaScript 1.0</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.8.2.3', 'Math.asin')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-math.asin', 'Math.asin')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> +<h2 id="浏览器兼容性">浏览器兼容性</h2> +<p>{{ CompatibilityTable() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> + </table> +</div> +<h2 id="See_also" name="See_also">相关链接</h2> +<ul> + <li>The {{jsxref("Global_Objects/Math", "Math")}} object it belongs to.</li> + <li>{{jsxref("Math.acos()")}}</li> + <li>{{jsxref("Math.atan()")}}</li> + <li>{{jsxref("Math.atan2()")}}</li> + <li>{{jsxref("Math.cos()")}}</li> + <li>{{jsxref("Math.sin()")}}</li> + <li>{{jsxref("Math.tan()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/math/asinh/index.html b/files/zh-cn/web/javascript/reference/global_objects/math/asinh/index.html new file mode 100644 index 0000000000..2d7afa3b8f --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/math/asinh/index.html @@ -0,0 +1,87 @@ +--- +title: Math.asinh() +slug: Web/JavaScript/Reference/Global_Objects/Math/asinh +translation_of: Web/JavaScript/Reference/Global_Objects/Math/asinh +--- +<div>{{JSRef}}</div> + +<p><strong><code>Math.asinh()</code></strong> 返回一个数值的反双曲正弦值，即：</p> + +<p><math display="block"><semantics><mrow><mstyle mathvariant="monospace"><mrow><mo lspace="0em" rspace="thinmathspace">Math.asinh</mo><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo></mrow></mstyle><mo>=</mo><mo lspace="0em" rspace="thinmathspace">arsinh</mo><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo><mo>=</mo><mtext> the unique </mtext><mspace width="thickmathspace"></mspace><mi>y</mi><mspace width="thickmathspace"></mspace><mtext>such that</mtext><mspace width="thickmathspace"></mspace><mo lspace="0em" rspace="0em">sinh</mo><mo stretchy="false">(</mo><mi>y</mi><mo stretchy="false">)</mo><mo>=</mo><mi>x</mi></mrow><annotation encoding="TeX">\mathtt{\operatorname{Math.asinh}(x)} = \operatorname{arsinh}(x) = \text{ the unique } \; y \; \text{such that} \; \sinh(y) = x</annotation></semantics></math></p> + +<div>{{EmbedInteractiveExample("pages/js/math-asinh.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code>Math.asinh(<var>x</var>)</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>x</code></dt> + <dd>一个数值.</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>返回指定数值的反双曲正弦值.</p> + +<h2 id="描述">描述</h2> + +<p>由于 <code>asinh()</code> 是 <code>Math 的静态方法</code>,所以应该像这样使用：<code>Math.asinh()</code>，而不是作为你创建的 <code>Math</code> 实例的方法（<code>Math 不是一个构造函数</code>）。</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用_Math.asinh"> 使用 <code>Math.asinh()</code></h3> + +<pre class="brush: js">Math.asinh(1); // 0.881373587019543 +Math.asinh(0); // 0 +</pre> + +<h2 id="Polyfill">Polyfill</h2> + +<p>As a quick and dirty hack the expression <math><semantics><mrow><mo lspace="0em" rspace="thinmathspace">arsinh</mo><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo><mo>=</mo><mo lspace="0em" rspace="0em">ln</mo><mrow><mo>(</mo><mrow><mi>x</mi><mo>+</mo><msqrt><mrow><msup><mi>x</mi><mn>2</mn></msup><mo>+</mo><mn>1</mn></mrow></msqrt></mrow><mo>)</mo></mrow></mrow><annotation encoding="TeX">\operatorname {arsinh} (x) = \ln \left(x + \sqrt{x^{2} + 1} \right)</annotation></semantics></math> may be used directly for a coarse emulation by the following function:</p> + +<pre class="brush: js">Math.asinh = Math.asinh || function(x) { + if (x === -Infinity) { + return x; + } else { + return Math.log(x + Math.sqrt(x * x + 1)); + } +}; +</pre> + +<p>Been formally correct it suffers from a number of issues related to floating point computations. Accurate result requires special handling of positive/negative, small/large arguments as it done e.g. in <a href="https://sourceware.org/git/?p=glibc.git;a=blob;f=sysdeps/ieee754/dbl-64/s_asinh.c">glibc</a> or <a href="http://git.savannah.gnu.org/cgit/gsl.git/tree/sys/invhyp.c">GNU Scientific Library</a>.</p> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Specification</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-math.asinh', 'Math.asinh')}}</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Math.asinh")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Math.acosh()")}}</li> + <li>{{jsxref("Math.atanh()")}}</li> + <li>{{jsxref("Math.cosh()")}}</li> + <li>{{jsxref("Math.sinh()")}}</li> + <li>{{jsxref("Math.tanh()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/math/atan/index.html b/files/zh-cn/web/javascript/reference/global_objects/math/atan/index.html new file mode 100644 index 0000000000..cd10d30644 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/math/atan/index.html @@ -0,0 +1,110 @@ +--- +title: Math.atan() +slug: Web/JavaScript/Reference/Global_Objects/Math/atan +translation_of: Web/JavaScript/Reference/Global_Objects/Math/atan +--- +<div> + {{JSRef("Global_Objects", "Math")}}</div> +<h2 id="Summary" name="Summary">概述</h2> +<p><code><strong>Math.atan()</strong></code> 函数返回一个数值的反正切（以弧度为单位），即：</p> +<p><math display="block"><semantics><mrow><mstyle mathvariant="monospace"><mrow><mo lspace="0em" rspace="thinmathspace">Math.atan</mo><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo></mrow></mstyle><mo>=</mo><mo lspace="0em" rspace="0em">arctan</mo><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo><mo>=</mo><mtext> the unique </mtext><mspace width="thickmathspace"></mspace><mi>y</mi><mo>∊</mo><mrow><mo>[</mo><mrow><mo>-</mo><mfrac><mi>π</mi><mn>2</mn></mfrac><mo>;</mo><mfrac><mi>π</mi><mn>2</mn></mfrac></mrow><mo>]</mo></mrow><mspace width="thinmathspace"></mspace><mtext>such that</mtext><mspace width="thickmathspace"></mspace><mo lspace="0em" rspace="0em">tan</mo><mo stretchy="false">(</mo><mi>y</mi><mo stretchy="false">)</mo><mo>=</mo><mi>x</mi></mrow><annotation encoding="TeX">\mathtt{\operatorname{Math.atan}(x)} = \arctan(x) = \text{ the unique } \; y \in \left[-\frac{\pi}{2}; \frac{\pi}{2}\right] \, \text{such that} \; \tan(y) = x</annotation></semantics></math></p> +<h2 id="Syntax" name="Syntax">语法</h2> +<pre class="syntaxbox">Math.atan(<em>x</em>)</pre> +<h3 id="Parameters" name="Parameters">参数</h3> +<dl> + <dt> + <code>x</code></dt> + <dd> + 一个数值</dd> +</dl> +<h2 id="Description" name="Description">描述</h2> +<p><code>atan</code> 返回一个 <math><semantics><mrow><mo>-</mo><mfrac><mi>π</mi><mn>2</mn></mfrac></mrow><annotation encoding="TeX">-\frac{\pi}{2}</annotation></semantics></math> 到 <math><semantics><mfrac><mi>π</mi><mn>2</mn></mfrac><annotation encoding="TeX">\frac{\pi}{2}</annotation></semantics></math> 弧度之间的数值。</p> +<p>由于 <code>atan</code> 是 <code>Math</code> 的静态方法，所以应该像这样使用：<code>Math.atan()</code>，而不是作为你创建的 <code>Math</code> 实例的方法。</p> +<h2 id="Examples" name="Examples">示例</h2> +<h3 id="Example:_Using_Math.atan" name="Example:_Using_Math.atan">例子：使用 <code>Math.atan</code></h3> +<pre class="brush:js">Math.atan(1); // 0.7853981633974483 +Math.atan(0); // 0 +</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>ECMAScript 1st Edition. Implemented in JavaScript 1.0</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.8.2.4', 'Math.atan')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-math.atan', 'Math.atan')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> +<h2 id="浏览器兼容性">浏览器兼容性</h2> +<p>{{ CompatibilityTable() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> + </table> +</div> +<h2 id="See_also" name="See_also">相关链接</h2> +<ul> + <li>The {{jsxref("Global_Objects/Math", "Math")}} object it belongs to.</li> + <li>{{jsxref("Math.acos()")}}</li> + <li>{{jsxref("Math.asin()")}}</li> + <li>{{jsxref("Math.atan2()")}}</li> + <li>{{jsxref("Math.cos()")}}</li> + <li>{{jsxref("Math.sin()")}}</li> + <li>{{jsxref("Math.tan()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/math/atan2/index.html b/files/zh-cn/web/javascript/reference/global_objects/math/atan2/index.html new file mode 100644 index 0000000000..7bf921655d --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/math/atan2/index.html @@ -0,0 +1,140 @@ +--- +title: Math.atan2() +slug: Web/JavaScript/Reference/Global_Objects/Math/atan2 +translation_of: Web/JavaScript/Reference/Global_Objects/Math/atan2 +--- +<div>{{JSRef("Global_Objects", "Math")}}</div> + +<h2 id="Summary" name="Summary">概述</h2> + +<p><code><strong>Math.atan2(</strong></code><code><strong>)</strong></code> 返回从原点(0,0)到(x,y)点的线段与x轴正方向之间的平面角度(弧度值)，也就是Math.atan2(y,x)</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox">Math.atan2(<em>y</em>, <em>x</em>) </pre> + +<h2 id="Parameters" name="Parameters">参数</h2> + +<dl> + <dt><code>y, x</code></dt> + <dd>数值</dd> +</dl> + +<h2 id="Description" name="Description">描述</h2> + +<p><code>atan2</code> 方法返回一个 -pi 到 pi 之间的数值，表示点 (x, y) 对应的偏移角度。这是一个逆时针角度，以弧度为单位，正X轴和点 (x, y) 与原点连线 之间。注意此函数接受的参数：先传递 y 坐标，然后是 x 坐标。</p> + +<p><code>atan2</code> 接受单独的 x 和 y 参数，而 <code>atan</code> 接受两个参数的比值。</p> + +<p>由于 <code>atan2</code> 是 <code>Math</code> 的静态方法，所以应该像这样使用：<code>Math.atan2()</code>，而不是作为你创建的 <code>Math</code> 实例的方法。</p> + +<h2 id="Examples" name="Examples">示例</h2> + +<h3 id="Example_Using_Math.atan2" name="Example:_Using_Math.atan2">例子：使用 <code>Math.atan2</code></h3> + +<pre class="brush:js">Math.atan2(90, 15) // 1.4056476493802699 +Math.atan2(15, 90) // 0.16514867741462683 + +<code>Math.atan2( ±0, -0 )</code> // <code>±PI</code>. +<code>Math.atan2( ±0, +0 )</code> // <code>±0</code>. +<code>Math.atan2( ±0, -x )</code> // <code>±PI</code> for x > 0. +<code>Math.atan2( ±0, x )</code> // <code>±0</code> for x > 0. +<code>Math.atan2( </code><code>-y, ±0 )</code> // -<code>PI/2</code> for y > 0. +<code>Math.atan2( </code><code>y, ±0 )</code> // <code>PI/2</code> for y > 0. +<code>Math.atan2( ±y, -Infinity )</code> // <code>±PI</code> for finite y > 0. +<code>Math.atan2( ±y, +Infinity )</code> // <code>±0</code> for finite y > 0. +<code>Math.atan2( ±Infinity, x )</code> // <code>±PI/2</code> for finite x. +<code>Math.atan2( ±Infinity, -Infinity )</code> // <code>±3*PI/4</code>. +<code>Math.atan2( ±Infinity, +Infinity )</code> // <code>±PI/4</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>ECMAScript 1st Edition. Implemented in JavaScript 1.0</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.8.2.5', 'Math.atan2')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-math.atan2', 'Math.atan2')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{ CompatibilityTable() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>The {{jsxref("Global_Objects/Math", "Math")}} object it belongs to.</li> + <li>{{jsxref("Math.acos()")}}</li> + <li>{{jsxref("Math.asin()")}}</li> + <li>{{jsxref("Math.atan()")}}</li> + <li>{{jsxref("Math.cos()")}}</li> + <li>{{jsxref("Math.sin()")}}</li> + <li>{{jsxref("Math.tan()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/math/atanh/index.html b/files/zh-cn/web/javascript/reference/global_objects/math/atanh/index.html new file mode 100644 index 0000000000..08af33d242 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/math/atanh/index.html @@ -0,0 +1,132 @@ +--- +title: Math.atanh() +slug: Web/JavaScript/Reference/Global_Objects/Math/atanh +translation_of: Web/JavaScript/Reference/Global_Objects/Math/atanh +--- +<div>{{JSRef}}</div> + +<p><strong><code>Math.atanh()</code></strong> 函数返回一个数值反双曲正切值, 即：</p> + +<p><math display="block"><semantics><mrow><mo>∀</mo><mi>x</mi><mo>∊</mo><mrow><mo>(</mo><mrow><mo>-</mo><mn>1</mn><mo>,</mo><mn>1</mn></mrow><mo>)</mo></mrow><mo>,</mo><mstyle mathvariant="monospace"><mrow><mo lspace="0em" rspace="thinmathspace">Math.atanh</mo><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo></mrow></mstyle><mo>=</mo><mo lspace="0em" rspace="thinmathspace">arctanh</mo><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo><mo>=</mo><mtext> the unique </mtext><mspace width="thickmathspace"></mspace><mi>y</mi><mspace width="thickmathspace"></mspace><mtext>such that</mtext><mspace width="thickmathspace"></mspace><mo lspace="0em" rspace="0em">tanh</mo><mo stretchy="false">(</mo><mi>y</mi><mo stretchy="false">)</mo><mo>=</mo><mi>x</mi></mrow><annotation encoding="TeX">\forall x \in \left( -1, 1 \right), \mathtt{\operatorname{Math.atanh}(x)} = \operatorname{arctanh}(x) = \text{ the unique } \; y \; \text{such that} \; \tanh(y) = x</annotation></semantics></math></p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code>Math.atanh(<var>x</var>)</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>x</code></dt> + <dd>一个数值</dd> +</dl> + +<h2 id="描述">描述</h2> + +<p>由于 <code>atanh()</code> 是 <code>Math 的静态方法</code>,所以应该像这样使用：<code>Math.atanh()</code>，而不是作为你创建的 <code>Math</code> 实例的方法（<code>Math 不是一个构造函数</code>）。 </p> + +<h2 id="示例">示例</h2> + +<h3 id="使用_Math.atanh()"><code>使用 Math.atanh()</code></h3> + +<pre class="brush: js">Math.atanh(-2); // NaN +Math.atanh(-1); // -Infinity +Math.atanh(0); // 0 +Math.atanh(0.5); // 0.5493061443340548 +Math.atanh(1); // Infinity +Math.atanh(2); // NaN +</pre> + +<p>对于大于1或是小于－1的值，函数返回 {{jsxref("NaN")}} 。</p> + +<h2 id="Polyfill">Polyfill</h2> + +<p>For \left|x\right| < 1, we have \operatorname {artanh} (x) = \frac{1}{2}\ln \left( \frac{1 + x}{1 - x} \right) so this can be emulated by the following function:</p> + +<pre class="brush: js">Math.atanh = Math.atanh || function(x) { + return Math.log((1+x)/(1-x)) / 2; +}; +</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('ES6', '#sec-math.atanh', 'Math.atanh')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-math.atanh', 'Math.atanh')}}</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>{{CompatChrome("38")}}</td> + <td>{{CompatGeckoDesktop("25")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatOpera("25")}}</td> + <td>{{CompatSafari("7.1")}}</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>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatGeckoMobile("25")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>8</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Math.acosh()")}}</li> + <li>{{jsxref("Math.asinh()")}}</li> + <li>{{jsxref("Math.cosh()")}}</li> + <li>{{jsxref("Math.sinh()")}}</li> + <li>{{jsxref("Math.tanh()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/math/cbrt/index.html b/files/zh-cn/web/javascript/reference/global_objects/math/cbrt/index.html new file mode 100644 index 0000000000..d583caf717 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/math/cbrt/index.html @@ -0,0 +1,140 @@ +--- +title: Math.cbrt() +slug: Web/JavaScript/Reference/Global_Objects/Math/cbrt +translation_of: Web/JavaScript/Reference/Global_Objects/Math/cbrt +--- +<div>{{JSRef("Global_Objects", "Math")}}</div> + +<h2 id="Summary" name="Summary">概述</h2> + +<p><code><strong>Math.cbrt()</strong></code> 函数返回任意数字的立方根.</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox">Math.cbrt(<em>x</em>)</pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>x</code></dt> + <dd>任意数字.</dd> +</dl> + +<h3 id="返回值">返回值</h3> + + + +<p>给定数字的立方根</p> + + + +<h2 id="Description" name="Description">描述</h2> + +<p>该方法为Math的静态方法,因此请直接通过Math.cbrt()方式调用.</p> + +<p>而不是作为您创建的Math对象的方法(Math不是构造函数)。</p> + +<p><span style="font-family: 'Courier New','Andale Mono',monospace; font-weight: inherit; line-height: normal;">cbrt 是 "cube root" 的缩写, 意思是立方根.</span></p> + +<h2 id="Examples" name="Examples">示例</h2> + +<h3 id="使用_Math.cbrt">使用 Math.cbrt()</h3> + +<pre class="brush: js">Math.cbrt(NaN); // NaN +Math.cbrt(-1); // -1 +Math.cbrt(-0); // -0 +Math.cbrt(-Infinity); // -Infinity +Math.cbrt(0); // 0 +Math.cbrt(1); // 1 +Math.cbrt(Infinity); // Infinity +Math.cbrt(null); // 0 +Math.cbrt(2); // 1.2599210498948734</pre> + +<h2 id="Polyfill"><font face="consolas, Liberation Mono, courier, monospace"><span style="background-color: rgba(220, 220, 220, 0.5);">Polyfill</span></font></h2> + +<p>为了与旧版浏览器兼容, 可使用下方函数模拟cbrt():</p> + +<pre class="brush: js" dir="rtl">if (!Math.cbrt) { + Math.cbrt = function(x) { + var y = Math.pow(Math.abs(x), 1/3); + return x < 0 ? -y : y; + }; +}</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('ES6', '#sec-math.cbrt', 'Math.cbrt')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{ CompatibilityTable() }}</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>{{CompatNo}}</td> + <td>{{CompatGeckoDesktop("25")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</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>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatGeckoMobile("25")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + + + +<h2 id="另请参见">另请参见</h2> + +<ul> + <li>{{jsxref("Math.pow()")}}</li> + <li>{{jsxref("Math.sqrt()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/math/ceil/index.html b/files/zh-cn/web/javascript/reference/global_objects/math/ceil/index.html new file mode 100644 index 0000000000..9b316f075a --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/math/ceil/index.html @@ -0,0 +1,164 @@ +--- +title: Math.ceil() +slug: Web/JavaScript/Reference/Global_Objects/Math/ceil +tags: + - JavaScript + - Math + - 参考 + - 数学 + - 方法 +translation_of: Web/JavaScript/Reference/Global_Objects/Math/ceil +--- +<div>{{JSRef}}</div> + +<p><strong><code>Math.ceil()</code></strong> 函数返回大于或等于一个给定数字的最小整数。</p> + +<p><strong>Note: </strong><code>Math.ceil({{jsxref("null")}})</code> returns integer 0 and does not give a {{jsxref("NaN")}} error.</p> + +<div>{{EmbedInteractiveExample("pages/js/math-ceil.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code>Math.ceil(<var>x</var>)</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>x</code></dt> + <dd>一个数值。</dd> + <dt> + <h3 id="返回值">返回值</h3> + + <p>大于或等于给定数字的最小整数。</p> + </dt> +</dl> + +<h2 id="描述">描述</h2> + +<p>由于 <code>ceil</code> 是 <code>Math</code> 的静态方法，所以应该像这样使用：<code>Math.ceil()</code>，而不是作为你创建的 <code>Math</code> 实例的方法。</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用_Math.ceil">使用 <code>Math.ceil</code></h3> + +<p>下例展示了 <code>Math.ceil()</code> 的使用：</p> + +<pre class="brush: js">// Closure +(function() { + /** + * Decimal adjustment of a number. + * + * @param {String} type The type of adjustment. + * @param {Number} value The number. + * @param {Integer} exp The exponent (the 10 logarithm of the adjustment base). + * @returns {Number} The adjusted value. + */ + function decimalAdjust(type, value, exp) { + // If the exp is undefined or zero... + if (typeof exp === 'undefined' || +exp === 0) { + return Math[type](value); + } + value = +value; + exp = +exp; + // If the value is not a number or the exp is not an integer... + if (isNaN(value) || !(typeof exp === 'number' && exp % 1 === 0)) { + return NaN; + } + // Shift + value = value.toString().split('e'); + value = Math[type](+(value[0] + 'e' + (value[1] ? (+value[1] - exp) : -exp))); + // Shift back + value = value.toString().split('e'); + return +(value[0] + 'e' + (value[1] ? (+value[1] + exp) : exp)); + } + + // Decimal round + if (!Math.round10) { + Math.round10 = function(value, exp) { + return decimalAdjust('round', value, exp); + }; + } + // Decimal floor + if (!Math.floor10) { + Math.floor10 = function(value, exp) { + return decimalAdjust('floor', value, exp); + }; + } + // Decimal ceil + if (!Math.ceil10) { + Math.ceil10 = function(value, exp) { + return decimalAdjust('ceil', value, exp); + }; + } +})(); + +// Round +Math.round10(55.55, -1); // 55.6 +Math.round10(55.549, -1); // 55.5 +Math.round10(55, 1); // 60 +Math.round10(54.9, 1); // 50 +Math.round10(-55.55, -1); // -55.5 +Math.round10(-55.551, -1); // -55.6 +Math.round10(-55, 1); // -50 +Math.round10(-55.1, 1); // -60 +// Floor +Math.floor10(55.59, -1); // 55.5 +Math.floor10(59, 1); // 50 +Math.floor10(-55.51, -1); // -55.6 +Math.floor10(-51, 1); // -60 +// Ceil +Math.ceil10(55.51, -1); // 55.6 +Math.ceil10(51, 1); // 60 +Math.ceil10(-55.59, -1); // -55.5 +Math.ceil10(-59, 1); // -50 +</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>{{SpecName('ES1')}}</td> + <td>{{Spec2('ES1')}}</td> + <td>Initial definition. Implemented in JavaScript 1.0.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.8.2.6', 'Math.ceil')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-math.ceil', 'Math.ceil')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-math.ceil', 'Math.ceil')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Math.ceil")}}</p> + +<h2 id="参见">参见</h2> + +<ul> + <li>{{jsxref("Math.abs()")}}</li> + <li>{{jsxref("Math.floor()")}}</li> + <li>{{jsxref("Math.round()")}}</li> + <li>{{jsxref("Math.sign()")}}</li> + <li>{{jsxref("Math.trunc()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/math/clz32/index.html b/files/zh-cn/web/javascript/reference/global_objects/math/clz32/index.html new file mode 100644 index 0000000000..76501c5be5 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/math/clz32/index.html @@ -0,0 +1,169 @@ +--- +title: Math.clz32() +slug: Web/JavaScript/Reference/Global_Objects/Math/clz32 +translation_of: Web/JavaScript/Reference/Global_Objects/Math/clz32 +--- +<div>{{JSRef("Global_Objects", "Math")}}</div> + +<h2 id="Summary" name="Summary">概述</h2> + +<p><code><strong>Math.clz32() </strong></code>函数返回一个数字在转换成 32 无符号整形数字的二进制形式后, 开头的 0 的个数, 比如 <code>1000000</code> 转换成 32 位无符号整形数字的二进制形式后是 <code>00000000000011110100001001000000</code>, 开头的 0 的个数是 12 个, 则 <code>Math.clz32(1000000)</code> 返回 <code>12</code>.</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code>Math.clz32 (x) +</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt>x</dt> + <dd>一个数字.</dd> +</dl> + +<h2 id="描述" style="line-height: 30px;">描述</h2> + +<p>"clz32" 是 CountLeadingZeroes32 的缩写.</p> + +<p>如果 <code>x</code> 不是数字类型, 则它首先会被转换成数字类型, 然后再转成 32 位无符号整形数字. </p> + +<p>如果转换后的 32 位无符号整形数字是 <code>0</code>, 则返回 <code>32</code>, 因为此时所有位上都是 <code>0</code>.</p> + +<p><code>NaN</code>, <code>Infinity</code>,<code> -Infinity</code> 这三个数字转成 32 位无符号整形数字后都是 <code>0</code>.</p> + +<p><span>这个函数主要用于那些编译目标为 JS 语言的系统中, 比如 Emscripten.</span></p> + +<h2 id="示例">示例</h2> + +<pre class="brush: js">Math.clz32(1) // 31 +Math.clz32(1000) // 22 +Math.clz32() // 32 +[NaN, Infinity, -Infinity, 0, -0, null, undefined, "foo", {}, []].filter(function (n) { + return Math.clz32(n) !== 32 +}) // [] +Math.clz32(true) // 31 +Math.clz32(3.5) // 30 +</pre> + +<h2 id="Compatibility" name="Compatibility">计算前导1的个数</h2> + +<p>目前javascript尚未提供<code>Math.clon</code>函数来计算前导1的个数（之所以叫“clon”而非“clo”，是因为“clo”与“clz”太过相似，特别对那些母语不是英语的人来说），但是你可以通过将一个数取反并将其作为<code>Math.clz32</code>的参数来实现clon函数。其中的原理非常简单，因为对1取反是0，反之亦然，所以用<code>Math.clz32</code>计算前导0的个数就变成计算前导1的个数。</p> + +<p>先看以下代码：</p> + +<pre>var a = 32776; // 00000000000000001000000000001000 (16个前导0) +Math.clz32(a); // 16 + +var b = ~32776; // 11111111111111110111111111110111 (对32776取反, 0个前导0) +Math.clz32(b); // 0 (相当于0个前导1)</pre> + +<p>通过以上方法，<code>clon</code> 函数可以定义如下：</p> + +<pre>var clz = Math.clz32; +function clon(integer){ + return clz(~integer); +}</pre> + +<p>现在，我们可以进一步实现计算“尾随0”和“尾随1”的个数了。下面的<code>ctrz</code>函数将第一个1之后的高数位全部置为1然后取反，再用<code>Math.clz32求得</code>尾随0的个数。</p> + +<pre>var clz = Math.clz32; +function ctrz(integer){ // 计算尾随0个数 + // 1. 将第一个1之后的高数位全部置为1 + // 00000000000000001000000000001000 => 11111111111111111111111111111000 + integer |= integer << 16; + integer |= integer << 8; + integer |= integer << 4; + integer |= integer << 2; + integer |= integer << 1; + // 2. 然后，对该数取反，此时低位的1的个数即为所求 + return 32 - clz(~integer) |0; // `|0`用于保证结果为整数 +} +function ctron(integer){ // 计算尾随1个数 + // JavaScript中没有移位补1的运算符 + // 所以下面的代码是最快的 + return ctrz(~integer); + /* 为了看起来比较对称，你也可以使用以下代码： + // 1. 将第一个0之后的高数位全部置为0 + integer &= (integer << 16) | 0xffff; + integer &= (integer << 8 ) | 0x00ff; + integer &= (integer << 4 ) | 0x000f; + integer &= (integer << 2 ) | 0x0003; + integer &= (integer << 1 ) | 0x0001; + // 2. 然后，对该数取反，此时低位的0的个数即为所求 + return 32 - clon(~integer) |0; + */ +}</pre> + +<p>将以上函数改写成 ASM.JS模块——然后，你就可以去跟别人炫耀了！ASM.JS就是用来干这个的。</p> + +<pre>var countTrailsMethods = (function(stdlib, foreign, heap) { + "use asm"; + var clz = stdlib.Math.clz32; + function ctrz(integer) { // 计算尾随0个数 + integer = integer | 0; // 确保是整数 + // 1. 将第一个1之后的高数位全部置为1 + // ASMjs中不允许^=、&=、和|= + integer = integer | (integer << 16); + integer = integer | (integer << 8); + integer = integer | (integer << 4); + integer = integer | (integer << 2); + integer = integer | (integer << 1); + // 2. 然后，对该数取反，此时低位的1的个数即为所求 + return 32 - clz(~integer) |0; + } + function ctron(integer) { // 计算尾随1个数 + integer = integer | 0; // 确保是整数 + return ctrz(~integer) |0; + } + // 蛋疼的是，ASM.JS必须使用糟糕的object类型： + // unfourtunately, ASM.JS demands slow crummy objects: + return {a: ctrz, b: ctron}; +})(window, null, null); +var ctrz = countTrailsMethods.a; +var ctron = countTrailsMethods.b;</pre> + +<h2 id="Compatibility" name="Compatibility">Polyfill</h2> + +<p>这个polyfill效率最高。</p> + +<pre>if (!Math.clz32) Math.clz32 = (function(log, LN2){ + return function(x) { + var asUint = x >>> 0; // 将x转换为Uint32类型 + if (asUint === 0) { + return 32; + } + return 31 - (log(asUint) / LN2 | 0) |0; // "| 0"相当于Math.floor + }; +})(Math.log, Math.LN2);</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('ES6', '#sec-Math.clz32', 'Math.clz32')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div class="hidden"> +<p>The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> +</div> + +<p>{{Compat("javascript.builtins.Math.clz32")}}</p> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("Math")}}</li> + <li>{{jsxref("Math.imul")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/math/cos/index.html b/files/zh-cn/web/javascript/reference/global_objects/math/cos/index.html new file mode 100644 index 0000000000..55b273cad1 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/math/cos/index.html @@ -0,0 +1,106 @@ +--- +title: Math.cos() +slug: Web/JavaScript/Reference/Global_Objects/Math/cos +translation_of: Web/JavaScript/Reference/Global_Objects/Math/cos +--- +<div> + {{JSRef("Global_Objects", "Math")}}</div> +<h2 id="Summary" name="Summary">概述</h2> +<p><code><strong>Math.cos()</strong></code> 函数返回一个数值的余弦值。</p> +<h2 id="Syntax" name="Syntax">语法</h2> +<pre class="syntaxbox">Math.cos(<em>x</em>)</pre> +<h3 id="Parameters" name="Parameters">参数</h3> +<dl> + <dt> + <code>x</code></dt> + <dd> + 一个以弧度为单位的数值。</dd> +</dl> +<h2 id="Description" name="Description">描述</h2> +<p><code>cos</code> 方法返回一个 -1 到 1 之间的数值，表示角度（单位：弧度）的余弦值。</p> +<p>由于 <code>cos</code> 是 <code>Math</code> 的静态方法，所以应该像这样使用：<code>Math.cos()</code>，而不是作为你创建的 <code>Math</code> 实例的方法。</p> +<h2 id="Examples" name="Examples">示例</h2> +<h3 id="Example:_Using_Math.cos" name="Example:_Using_Math.cos">例子：使用 <code>Math.cos</code></h3> +<pre class="brush:js">Math.cos(0); // 1 +Math.cos(1); // 0.5403023058681398 + +Math.cos(Math.PI); // -1 +Math.cos(2 * Math.PI); // 1 +</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>ECMAScript 1st Edition. Implemented in JavaScript 1.0</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.8.2.7', 'Math.cos')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-math.cos', 'Math.cos')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> +<h2 id="浏览器兼容性">浏览器兼容性</h2> +<p>{{ CompatibilityTable() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> + </table> +</div> +<h2 id="See_also" name="See_also">相关链接</h2> +<ul> + <li>The {{jsxref("Global_Objects/Math", "Math")}} object it belongs to.</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/math/cosh/index.html b/files/zh-cn/web/javascript/reference/global_objects/math/cosh/index.html new file mode 100644 index 0000000000..cd5e578571 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/math/cosh/index.html @@ -0,0 +1,130 @@ +--- +title: Math.cosh() +slug: Web/JavaScript/Reference/Global_Objects/Math/cosh +translation_of: Web/JavaScript/Reference/Global_Objects/Math/cosh +--- +<div>{{JSRef}}</div> + +<p><strong><code>Math.cosh()</code></strong> 函数返回数值的双曲余弦函数, 可用 {{jsxref("Math.E", "constant e", "", 1)}} 表示:</p> + +<p><math display="block"><semantics><mrow><mstyle mathvariant="monospace"><mo lspace="0em" rspace="thinmathspace">Math.cosh(x)</mo></mstyle><mo>=</mo><mfrac><mrow><msup><mi>e</mi><mi>x</mi></msup><mo>+</mo><msup><mi>e</mi><mrow><mo>-</mo><mi>x</mi></mrow></msup></mrow><mn>2</mn></mfrac></mrow><annotation encoding="TeX">\mathtt{\operatorname{Math.cosh(x)}} = \frac{e^x + e^{-x}}{2}</annotation></semantics></math></p> + +<h2 id="Syntax">Syntax</h2> + +<pre class="syntaxbox"><code>Math.cosh(<var>x</var>)</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>x</code></dt> + <dd>数值.</dd> +</dl> + +<h2 id="描述">描述</h2> + +<p>由于<code>cosh()</code> 是Math的静态函数, 只需通过<code>Math.cosh() </code>调用,而不用通过创建Math对象来调用.</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用_Math.cosh()">使用 <code>Math.cosh()</code></h3> + +<pre class="brush: js">Math.cosh(0); // 1 +Math.cosh(1); // 1.5430806348152437 +Math.cosh(-1); // 1.5430806348152437 +</pre> + +<h2 id="Polyfill">Polyfill</h2> + +<p>可通过 {{jsxref("Math.exp()")}} 函数模拟实现:</p> + +<pre class="brush: js">Math.cosh = Math.cosh || function(x) { + return (Math.exp(x) + Math.exp(-x)) / 2; +} +</pre> + +<p>或只调用一次 {{jsxref("Math.exp()")}} 函数:</p> + +<pre class="brush: js">Math.cosh = Math.cosh || function(x) { + var y = Math.exp(x); + return (y + 1 / y) / 2; +}; +</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('ES6', '#sec-math.cosh', 'Math.cosh')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</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>{{CompatChrome("38")}}</td> + <td>{{CompatGeckoDesktop("25")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatOpera("25")}}</td> + <td>{{CompatSafari("7.1")}}</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>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatGeckoMobile("25")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>8</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Math.acosh()")}} {{experimental_inline}}</li> + <li>{{jsxref("Math.asinh()")}} {{experimental_inline}}</li> + <li>{{jsxref("Math.atanh()")}} {{experimental_inline}}</li> + <li>{{jsxref("Math.sinh()")}} {{experimental_inline}}</li> + <li>{{jsxref("Math.tanh()")}} {{experimental_inline}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/math/e/index.html b/files/zh-cn/web/javascript/reference/global_objects/math/e/index.html new file mode 100644 index 0000000000..ffa4251bac --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/math/e/index.html @@ -0,0 +1,99 @@ +--- +title: Math.E +slug: Web/JavaScript/Reference/Global_Objects/Math/E +translation_of: Web/JavaScript/Reference/Global_Objects/Math/E +--- +<div> + {{JSRef("Global_Objects", "Math")}}</div> +<h2 id="Summary" name="Summary">概述</h2> +<p><code><strong>Math.E</strong></code> 属性表示自然对数的底数（或称为基数），e，约等于 2.718。</p> +<p><math display="block"><semantics><mrow><mstyle mathvariant="monospace"><mi>Math.E</mi></mstyle><mo>=</mo><mi>e</mi><mo>≈</mo><mn>2.718</mn></mrow><annotation encoding="TeX">\mathtt{\mi{Math.E}} = e \approx 2.718</annotation></semantics></math></p> +<div> + {{js_property_attributes(0,0,0)}}</div> +<h2 id="Description" name="Description">描述</h2> +<p>由于 <code>E</code> 是 <code>Math</code> 对象的静态属性，所以应该像这样使用：<code>Math.E</code>，而不是作为你创建的 <code>Math</code> 实例对象的属性（<code>Math</code> 不是构造函数）。</p> +<h2 id="Examples" name="Examples">示例</h2> +<h3 id="Example:_Using_Math.E" name="Example:_Using_Math.E">例子：使用 <code>Math.E</code></h3> +<p>下面的函数返回 e：</p> +<pre class="brush:js">function getNapier() { + return Math.E +} + +getNapier() // 2.718281828459045</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>ECMAScript 1st Edition. Implemented in JavaScript 1.0</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.8.1.1', 'Math.E')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-math.e', 'Math.E')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> +<h2 id="浏览器兼容性">浏览器兼容性</h2> +<p>{{ CompatibilityTable() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> + </table> +</div> +<h2 id="See_also" name="See_also">相关链接</h2> +<ul> + <li>The {{jsxref("Global_Objects/Math", "Math")}} object it belongs to.</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/math/exp/index.html b/files/zh-cn/web/javascript/reference/global_objects/math/exp/index.html new file mode 100644 index 0000000000..6295073e83 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/math/exp/index.html @@ -0,0 +1,105 @@ +--- +title: Math.exp() +slug: Web/JavaScript/Reference/Global_Objects/Math/exp +translation_of: Web/JavaScript/Reference/Global_Objects/Math/exp +--- +<div> + {{JSRef("Global_Objects", "Math")}}</div> +<h2 id="Summary" name="Summary">概述</h2> +<p><code><strong>Math.exp()</strong></code> 函数返回 <code>e<sup>x</sup></code>，<code>x</code> 表示参数，<code>e</code> 是<a href="/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Math/E">欧拉常数（Euler's constant）</a>，自然对数的底数。</p> +<h2 id="Syntax" name="Syntax">语法</h2> +<pre class="syntaxbox"><code>Math.exp(<em>x</em>)</code></pre> +<h3 id="Parameters" name="Parameters">参数</h3> +<dl> + <dt> + <code>x</code></dt> + <dd> + 一个数值</dd> +</dl> +<h2 id="Description" name="Description">描述</h2> +<p>由于 <code>exp</code> 是 <code>Math</code> 的静态方法，所以应该像这样使用：<code>Math.exp()</code>，而不是作为你创建的 <code>Math</code> 实例的方法。</p> +<h2 id="Examples" name="Examples">示例</h2> +<h3 id="Example:_Using_Math.exp" name="Example:_Using_Math.exp">例子：使用 <code>Math.exp</code></h3> +<pre class="brush:js">Math.exp(-1); // 0.36787944117144233 +Math.exp(0); // 1 +Math.exp(1); // 2.718281828459045</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>ECMAScript 1st Edition. Implemented in JavaScript 1.0</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.8.2.8', 'Math.exp')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-math.exp', 'Math.exp')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> +<h2 id="浏览器兼容性">浏览器兼容性</h2> +<p>{{ CompatibilityTable() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> + </table> +</div> +<h2 id="See_also" name="See_also">相关链接</h2> +<ul> + <li>The {{jsxref("Global_Objects/Math", "Math")}} object it belongs to.</li> + <li>{{jsxref("Math.E")}}</li> + <li>{{jsxref("Math.log()")}}</li> + <li>{{jsxref("Math.pow()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/math/expm1/index.html b/files/zh-cn/web/javascript/reference/global_objects/math/expm1/index.html new file mode 100644 index 0000000000..74502e9d83 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/math/expm1/index.html @@ -0,0 +1,119 @@ +--- +title: Math.expm1() +slug: Web/JavaScript/Reference/Global_Objects/Math/expm1 +translation_of: Web/JavaScript/Reference/Global_Objects/Math/expm1 +--- +<div>{{JSRef("Global_Objects", "Math")}}</div> + +<h2 id="Summary" name="Summary">概述</h2> + +<p><code><strong>Math.expm1()</strong></code> 函数返回 <code>E<sup>x</sup> - 1</code>, 其中 <code>x</code> 是该函数的参数, <code>E</code> 是自然对数的底数 <code>2.718281828459045.</code></p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code>Math.expm1(<em>x</em>)</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>x</code></dt> + <dd>任意数字.</dd> +</dl> + +<h2 id="Description" name="Description">描述</h2> + +<p><code><span style="color: #4d4e53; font-family: 'Open Sans',sans-serif; line-height: 21px;">参数 </span><code style="font-size: 14px; line-height: inherit; margin: 0px; padding: 0px; border: 0px; color: rgb(77, 78, 83);">x</code><span style="color: #4d4e53; font-family: 'Open Sans',sans-serif; line-height: 21px;"> 会被自动类型转换成 </span><code style="font-size: 14px; line-height: inherit; margin: 0px; padding: 0px; border: 0px; color: rgb(77, 78, 83);">number </code><span style="color: #4d4e53; font-family: 'Open Sans',sans-serif; line-height: 21px;">类型.</span></code></p> + +<p><code>expm1 是 "exponent minus 1" 的缩写.</code></p> + +<h2 id="Examples" name="Examples">示例</h2> + +<pre class="brush:js">Math.expm1(1) // 1.7182818284590453 +Math.expm1(-38) // -1 +Math.expm1("-38") // -1 +Math.expm1("foo") // NaN +</pre> + +<h2 id="Polyfill">Polyfill</h2> + +<p>因为我们已经有了 <code>Math.exp </code>函数, 所以很容易 polyfill.</p> + +<pre class="brush: js">Math.expm1 = Math.expm1 || function (x) { + return Math.exp(x) - 1 +} +</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('ES6', '#sec-math.expm1', 'Math.expm1')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{ CompatibilityTable() }}</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>{{CompatNo}}</td> + <td>{{CompatGeckoDesktop("25")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</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>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatGeckoMobile("25")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("Global_Objects/Math", "Math")}} 对象.</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/math/floor/index.html b/files/zh-cn/web/javascript/reference/global_objects/math/floor/index.html new file mode 100644 index 0000000000..f41d9aedfc --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/math/floor/index.html @@ -0,0 +1,222 @@ +--- +title: Math.floor() +slug: Web/JavaScript/Reference/Global_Objects/Math/floor +tags: + - Math.floor() + - 向下取整 +translation_of: Web/JavaScript/Reference/Global_Objects/Math/floor +--- +<div>{{JSRef}}<br> + </div> + +<p><code><strong>Math.floor()</strong></code> 返回小于或等于一个给定数字的最大整数。</p> + +<div class="note"> +<p>Note: 可以理解 <code><strong>Math.floor()</strong></code>为向下取整</p> +</div> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox notranslate"><code>Math.floor(<em>x</em>) </code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>x</code></dt> + <dd>一个数字。</dd> + <dt> + <h3 id="返回值">返回值 </h3> + + <p>一个表示小于或等于指定数字的最大整数的数字。</p> + </dt> +</dl> + +<h2 id="Description" name="Description">描述</h2> + +<p>由于 <code>floor</code> 是 <code>Math</code> 的一个静态方法，你总是应该像这样使用它 <code>Math.floor()</code>，而不是作为你创建的一个Math对象的一种方法（Math不是一个构造函数）。</p> + +<h2 id="Examples" name="Examples">示例</h2> + +<h3 id="Example_Using_Math.floor" name="Example:_Using_Math.floor">例子：使用 <code>Math.floor</code></h3> + +<pre class="brush:js notranslate">Math.floor( 45.95); +// 45 +Math.floor( 45.05); +// 45 +Math.floor( 4 ); +// 4 +Math.floor(-45.05); +// -46 +Math.floor(-45.95); +// -46 + +</pre> + +<h3 id="Example_Decimal_adjustment" name="Example:_Decimal_adjustment">例子：十进制调整</h3> + +<pre class="brush:js notranslate">// Closure +(function(){ + + /** + * Decimal adjustment of a number. + * + * @param {String} type The type of adjustment. + * @param {Number} value The number. + * @param {Integer} exp The exponent (the 10 logarithm of the adjustment base). + * @returns {Number} The adjusted value. + */ + function decimalAdjust(type, value, exp) { + // If the exp is undefined or zero... + if (typeof exp === 'undefined' || +exp === 0) { + return Math[type](value); + } + value = +value; + exp = +exp; + // If the value is not a number or the exp is not an integer... + if (isNaN(value) || !(typeof exp === 'number' && exp % 1 === 0)) { + return NaN; + } + // Shift + value = value.toString().split('e'); + value = Math[type](+(value[0] + 'e' + (value[1] ? (+value[1] - exp) : -exp))); + // Shift back + value = value.toString().split('e'); + return +(value[0] + 'e' + (value[1] ? (+value[1] + exp) : exp)); + } + + // Decimal round + if (!Math.round10) { + Math.round10 = function(value, exp) { + return decimalAdjust('round', value, exp); + }; + } + // Decimal floor + if (!Math.floor10) { + Math.floor10 = function(value, exp) { + return decimalAdjust('floor', value, exp); + }; + } + // Decimal ceil + if (!Math.ceil10) { + Math.ceil10 = function(value, exp) { + return decimalAdjust('ceil', value, exp); + }; + } + +})(); + +// Round +Math.round10(55.55, -1); // 55.6 +Math.round10(55.549, -1); // 55.5 +Math.round10(55, 1); // 60 +Math.round10(54.9, 1); // 50 +Math.round10(-55.55, -1); // -55.5 +Math.round10(-55.551, -1); // -55.6 +Math.round10(-55, 1); // -50 +Math.round10(-55.1, 1); // -60 +// Floor +Math.floor10(55.59, -1); // 55.5 +Math.floor10(59, 1); // 50 +Math.floor10(-55.51, -1); // -55.6 +Math.floor10(-51, 1); // -60 +// Ceil +Math.ceil10(55.51, -1); // 55.6 +Math.ceil10(51, 1); // 60 +Math.ceil10(-55.59, -1); // -55.5 +Math.ceil10(-59, 1); // -50 +</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>ECMAScript 1st Edition. Implemented in JavaScript 1.0</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.8.2.9', 'Math.floor')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-math.floor', 'Math.floor')}}<span style="display: none;"> </span></td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-math.floor', 'Math.floor')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{ CompatibilityTable() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>The {{jsxref("Global_Objects/Math", "Math")}} object it belongs to.</li> + <li>{{jsxref("Math.abs")}}</li> + <li>{{jsxref("Math.ceil()")}}</li> + <li>{{jsxref("Math.round()")}}</li> + <li>{{jsxref("Math.sign()")}}</li> + <li>{{jsxref("Math.trunc()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/math/fround/index.html b/files/zh-cn/web/javascript/reference/global_objects/math/fround/index.html new file mode 100644 index 0000000000..022e84dbb6 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/math/fround/index.html @@ -0,0 +1,154 @@ +--- +title: Math.fround() +slug: Web/JavaScript/Reference/Global_Objects/Math/fround +translation_of: Web/JavaScript/Reference/Global_Objects/Math/fround +--- +<div>{{JSRef("Global_Objects", "Math")}}</div> + +<h2 id="Summary" name="Summary">概述</h2> + +<p><strong><code>Math.fround()</code></strong> 可以将任意的数字转换为离它最近的<a class="external" href="https://en.wikipedia.org/wiki/Single-precision_floating-point_format" title="link to the wikipedia page on single-precision floating-point format">单精度浮点数</a>形式的数字。</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="brush: js"><code>Math.fround(<var>doubleFloat</var>)</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>doubleFloat</code></dt> + <dd>一个 {{jsxref("Number")}}。若参数为非数字类型，则会被转投成数字。无法转换时，设置成{{jsxref("NaN")}}。</dd> +</dl> + +<h3 id="Parameters" name="Parameters">返回值</h3> + +<p>指定数字最接近的<a href="https://en.wikipedia.org/wiki/Single-precision_floating-point_format">32位单精度</a>浮点数表示。</p> + +<h2 id="Examples" name="Examples">描述</h2> + +<p>JavaScript 内部使用64位的双浮点数字，支持很高的精度。但是，有时你需要用32位浮点数字，比如你从一个{{jsxref("Float32Array")}} 读取值时。这时会产生混乱：检查一个64位浮点数和一个32位浮点数是否相等会失败，即使二个数字几乎一模一样。</p> + +<p>要解决这个问题，可以使用 <code>Math.fround()</code> 来将64位的浮点数转换为32位浮点数。在内部，JavaScript 继续把这个数字作为64位浮点数看待，仅仅是在尾数部分的第23位执行了“舍入到偶数”的操作，并将后续的尾数位设置为0。如果数字超出32位浮点数的范围，则返回 {{jsxref("Infinity")}} 或 <code>-Infinity</code>。</p> + +<p>因为<code>fround()</code> 是<code>Math</code> 的静态方法，你必须通过 <code>Math.fround()</code> 来使用，而不是调用你创建的<code>Math</code> 对象的一个实例方法（<code>Math</code>不是一个构造函数）。</p> + +<h2 id="Examples" name="Examples">示例</h2> + +<h3 id="使用_Math.fround()">使用 Math.fround()</h3> + +<p>数字1.5可以在二进制数字系统中精确表示，32位和64位的值相同：</p> + +<pre class="brush: js">Math.fround(1.5); // 1.5 +Math.fround(1.5) === 1.5; // true</pre> + +<p>但是，数字1.337却无法在二进制数字系统中精确表示，所以32位和64位的值是不同的：</p> + +<pre class="brush: js">Math.fround(1.337); // 1.3370000123977661 +Math.fround(1.337) === 1.337; // false +</pre> + +<p>2<sup>150</sup> 超出32位浮点，所以返回<code>Infinity</code>：</p> + +<pre class="brush: js">2 ** 150; // 1.42724769270596e+45 +Math.fround(2 ** 150); // Infinity +</pre> + +<p>如果参数无法转换成数字，或者为 {{jsxref("NaN")}} （<code>NaN</code>），<code>Math.fround()</code> 会返回 <code>NaN</code>：</p> + +<pre class="brush: js">Math.fround('abc'); // NaN +Math.fround(NaN); // NaN +</pre> + +<p>在某些精度不高的场合下，可以通过将二个浮点数转换成32位浮点数进行比较，以解决64位浮点数比较结果不正确的问题：</p> + +<pre class="brush: js">0.1 + 0.2 == 0.3; //false + +function equal(v1, v2) { + return Math.fround(v1) == Math.fround(v2); +} + +equal(0.1 + 0.2, 0.3); //true +</pre> + +<h2 id="Polyfill" name="Polyfill">Polyfill</h2> + +<p>下面的函数可以模拟这个 API，前提是浏览器必须已经支持 {{jsxref("Float32Array")}}：</p> + +<pre class="brush: js">Math.fround = Math.fround || (function (array) { + return function(x) { + return array[0] = x, array[0]; + }; +})(new Float32Array(1));</pre> + +<h2 id="Specifications" name="Specifications">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范名称</th> + <th scope="col">规范状态</th> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-math.fround', 'Math.fround')}}</td> + <td>{{Spec2('ES6')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">浏览器兼容性</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>{{CompatChrome("38")}}</td> + <td>{{CompatGeckoDesktop("26")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatOpera("25")}}</td> + <td>{{CompatSafari("7.1")}}</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>{{CompatNo}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>iOS 8</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("Math.round()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/math/hypot/index.html b/files/zh-cn/web/javascript/reference/global_objects/math/hypot/index.html new file mode 100644 index 0000000000..ab2b81bd7b --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/math/hypot/index.html @@ -0,0 +1,118 @@ +--- +title: Math.hypot() +slug: Web/JavaScript/Reference/Global_Objects/Math/hypot +tags: + - JavaScript + - Math + - 方法 +translation_of: Web/JavaScript/Reference/Global_Objects/Math/hypot +--- +<div>{{JSRef}}</div> + +<p><code><strong>Math.hypot()</strong></code> 函数返回所有参数的平方和的平方根，即：</p> + +<p><math display="block"><semantics><mrow><mstyle mathvariant="monospace"><mrow><mo lspace="0em" rspace="thinmathspace">Math.hypot</mo><mo stretchy="false">(</mo><msub><mi>v</mi><mn>1</mn></msub><mo>,</mo><msub><mi>v</mi><mn>2</mn></msub><mo>,</mo><mo>…</mo><mo>,</mo><msub><mi>v</mi><mi>n</mi></msub><mo stretchy="false">)</mo></mrow></mstyle><mo>=</mo><msqrt><mrow><munderover><mo>∑</mo><mrow><mi>i</mi><mo>=</mo><mn>1</mn></mrow><mi>n</mi></munderover><msubsup><mi>v</mi><mi>i</mi><mn>2</mn></msubsup></mrow></msqrt><mo>=</mo><msqrt><mrow><msubsup><mi>v</mi><mn>1</mn><mn>2</mn></msubsup><mo>+</mo><msubsup><mi>v</mi><mn>2</mn><mn>2</mn></msubsup><mo>+</mo><mo>…</mo><mo>+</mo><msubsup><mi>v</mi><mi>n</mi><mn>2</mn></msubsup></mrow></msqrt></mrow><annotation encoding="TeX">\mathtt{\operatorname{Math.hypot}(v_1, v_2, \dots, v_n)} = \sqrt{\sum_{i=1}^n v_i^2} = \sqrt{v_1^2 + v_2^2 + \dots + v_n^2}</annotation></semantics></math></p> + +<div>{{EmbedInteractiveExample("pages/js/math-hypot.html")}}</div> + + + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code>Math.hypot([<em>value1</em>[,<em>value2</em>, ...]]) </code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>value1, value2, ...</code></dt> + <dd>任意个数字。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>将所提供的参数求平方和后开平方根。如果有参数不能转换为数字，则返回 {{jsxref("NaN")}}。</p> + +<h2 id="Description" name="Description">描述</h2> + +<p>计算直角三角形的斜边，或复数的幅值时可以使用函数 <code>Math.sqrt(v1*v1 + v2*v2)</code> ，其中 v1 和 v2 是三角形的两个直角边或复数的实部和虚部。如果想计算更多维度，那么只需要在后面添加更多的数的平方就可以了，比如 <code>Math.sqrt(v1*v1 + v2*v2 + v3*v3 + v4*v4)</code>。</p> + +<p>本函数比 <code>Math.sqrt()</code> 更简单也更快，你只需要调用 <code>Math.hypot(v1, v2)</code> 或 <code>Math.hypot(v1, v2, v3, v4, ...)</code>。</p> + +<p>它还避免了幅值过大的问题。 JS 中最大的双精度浮点数是 <code>Number.MAX_VALUE = 1.797...e+308</code>。如果你的数字比约 1e154 大，计算其平方值会返回 Infinity，使你的结果出现问题。比如，<code>Math.sqrt(1e200*1e200 + 1e200*1e200) = Infinity</code>。如果你改用 <code>hypot()</code> 函数，你可以得到正确的答案：<code>Math.hypot(1e200, 1e200) = 1.4142...e+200</code>。在数字非常小的时候同样如此，比如 <code>Math.sqrt(1e-200*1e-200 + 1e-200*1e-200) = 0</code>，但 <code>Math.hypot(1e-200, 1e-200) =</code><code>1.4142...e-200</code> 则是正确的结果。</p> + +<p>由于 <code>hypot</code> 是 <code>Math</code> 的静态方法，所以应该以 <code>Math.hypot()</code>的方式使用，而不是作为你创建的 <code>Math</code> 对象的属性（<code>Math</code> 不是一个构造函数）。</p> + +<p>如果不传入任何参数, 则返回 +0 .</p> + +<p>如果参数列表中有至少一个参数不能被转换为数字，则返回 {{jsxref("NaN")}}。</p> + +<p>如果只传入一个参数, <code>Math.hypot(x)</code> 等同于 <code>Math.abs(x)</code>.</p> + +<h2 id="Examples" name="Examples">示例</h2> + +<h3 id="Using_Math.hypot">Using <code>Math.hypot()</code></h3> + +<pre class="brush: js">Math.hypot(3, 4); // 5 +Math.hypot(3, 4, 5); // 7.0710678118654755 +Math.hypot(); // 0 +Math.hypot(NaN); // NaN +Math.hypot(3, 4, 'foo'); // NaN, +'foo' => NaN +Math.hypot(3, 4, '5'); // 7.0710678118654755, +'5' => 5 +Math.hypot(-3); // 3, the same as Math.abs(-3) +</pre> + +<h2 id="向下兼容">向下兼容</h2> + +<p>此函数可以使用如下代码模拟：</p> + +<pre class="brush: js">if (!Math.hypot) Math.hypot = function() { + var y = 0, i = arguments.length; + while (i--) y += arguments[i] * arguments[i]; + return Math.sqrt(y); +}; +</pre> + +<p>另一种避免结果溢出的实现：</p> + +<pre class="brush: js">if (!Math.hypot) Math.hypot = function (x, y) { + // https://bugzilla.mozilla.org/show_bug.cgi?id=896264#c28 + var max = 0; + var s = 0; + for (var i = 0; i < arguments.length; i += 1) { + var arg = Math.abs(Number(arguments[i])); + if (arg > max) { + s *= (max / arg) * (max / arg); + max = arg; + } + s += arg === 0 && max === 0 ? 0 : (arg / max) * (arg / max); + } + return max === 1 / 0 ? 1 / 0 : max * Math.sqrt(s); +}; +</pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范</th> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-math.hypot', 'Math.hypot')}}</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Math.hypot")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Math.abs()")}}</li> + <li>{{jsxref("Math.pow()")}}</li> + <li>{{jsxref("Math.sqrt()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/math/imul/index.html b/files/zh-cn/web/javascript/reference/global_objects/math/imul/index.html new file mode 100644 index 0000000000..67da70040d --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/math/imul/index.html @@ -0,0 +1,141 @@ +--- +title: Math.imul() +slug: Web/JavaScript/Reference/Global_Objects/Math/imul +translation_of: Web/JavaScript/Reference/Global_Objects/Math/imul +--- +<div>{{JSRef("Global_Objects", "Math")}}</div> + +<div>该函数将两个参数分别转换为 32 位整数，相乘后返回 32 位结果，类似 C 语言的 32 位整数相乘。</div> + +<div> +<p>{{EmbedInteractiveExample("pages/js/math-imul.html")}}</p> +</div> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code>var<em> product</em> = Math.imul(a, b)</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>a</code></dt> + <dd>被乘数.</dd> + <dt><code>b</code></dt> + <dd>乘数.</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>类似 C 语言 32 位整数相乘的结果。</p> + +<h2 id="描述">描述</h2> + +<p><code>Math.imul()</code> 可以进行类似 C 语言的 32 位整数相乘。该特性对于一些项目比如 <a href="http://en.wikipedia.org/wiki/Emscripten" title="http://en.wikipedia.org/wiki/Emscripten">Emscripten</a> 很有用。因为 <code>imul()</code> 是 <code>Math</code> 的静态方法，所以用法是 <code>Math.imul()</code>，而不是新创建的 <code>Math</code> 对象的方法(<code>Math</code> 不是构造函数)。如果使用 JavaScript 浮点数做为 <code>imul</code> 的参数，会有性能损失。这是因为相乘前 imul 会将浮点数转换为整数，相乘后会将整数重新转换为浮点数，这两步转换的开销是比较大的。imul 存在的原因是在 AsmJS(目前为止唯一一种环境)下它是快速的。AsmJS 使 JIST-optimizers 更容易实现 JavaScript 内部的整数。现代浏览器中，唯一能体现出 imul 性能优越的场景是两个 Number 内部以整数的形式相乘(仅在 AsmJS 下可行)。</p> + +<h2 id="例子">例子</h2> + +<pre class="brush: js">Math.imul(2, 4) // 8 +Math.imul(-1, 8) // -8 +Math.imul(-2, -2) // 4 +Math.imul(0xffffffff, 5) //-5 +Math.imul(0xfffffffe, 5) //-10 +</pre> + +<h2 id="Polyfill">Polyfill</h2> + +<p>下面的 JavaScript 代码可以实现该函数:</p> + +<pre class="brush: js"><span style='background-color: transparent; font-family: consolas,"Liberation Mono",courier,monospace; font-size: 1rem; font-weight: inherit; letter-spacing: -0.00278rem; white-space: pre;'>if (!Math.imul) Math.imul = function(a, b) {</span> + var aHi = (a >>> 16) & 0xffff; + var aLo = a & 0xffff; + var bHi = (b >>> 16) & 0xffff; + var bLo = b & 0xffff; + // the shift by 0 fixes the sign on the high part + // the final |0 converts the unsigned value into a signed value + return ((aLo * bLo) + (((aHi * bLo + aLo * bHi) << 16) >>> 0) | 0); +};</pre> + +<p>然而，下面的实现性能会更好一些。因为运行这段 polyfill 的浏览器很有可能会在内部使用浮点数，而不是整数表示 javascript 的 Number。</p> + +<pre class="brush: js"><span style='background-color: transparent; font-family: consolas,"Liberation Mono",courier,monospace; font-size: 1rem; font-weight: inherit; letter-spacing: -0.00278rem; white-space: pre;'>if (!Math.imul) Math.imul = function(opA, opB) {</span> + opB |= 0; // ensure that opB is an integer. opA will automatically be coerced. + // floating points give us 53 bits of precision to work with plus 1 sign bit + // automatically handled for our convienence: + // 1. 0x003fffff /*opA & 0x000fffff*/ * 0x7fffffff /*opB*/ = 0x1fffff7fc00001 + // 0x1fffff7fc00001 < Number.MAX_SAFE_INTEGER /*0x1fffffffffffff*/ + var result = (opA & 0x003fffff) * opB; + // 2. We can remove an integer coersion from the statement above because: + // 0x1fffff7fc00001 + 0xffc00000 = 0x1fffffff800001 + // 0x1fffffff800001 < Number.MAX_SAFE_INTEGER /*0x1fffffffffffff*/ + if (opA & 0xffc00000 /*!== 0*/) result += (opA & 0xffc00000) * opB |0; + return result |0; +};</pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Specification</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-math.imul', 'Math.imul')}}</td> + </tr> + </tbody> +</table> + + + + + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{ CompatibilityTable() }}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Firefox (Gecko)</th> + <th>Chrome</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{ CompatGeckoDesktop("20") }}</td> + <td>{{ CompatUnknown() }}</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>Firefox Mobile (Gecko)</th> + <th>Android</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{ CompatGeckoMobile("20") }}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + </tr> + </tbody> +</table> +</div> diff --git a/files/zh-cn/web/javascript/reference/global_objects/math/index.html b/files/zh-cn/web/javascript/reference/global_objects/math/index.html new file mode 100644 index 0000000000..924ac82fc4 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/math/index.html @@ -0,0 +1,187 @@ +--- +title: Math +slug: Web/JavaScript/Reference/Global_Objects/Math +tags: + - JavaScript + - Math + - 参考 + - 数学 + - 计算 +translation_of: Web/JavaScript/Reference/Global_Objects/Math +--- +<div>{{JSRef}}</div> + +<p><strong><code>Math</code></strong> 是一个内置对象，它拥有一些数学常数属性和数学函数方法。<code>Math</code> 不是一个函数对象。</p> + +<p><code>Math</code> 用于 {{jsxref("Number")}} 类型。它不支持 {{jsxref("BigInt")}}。</p> + +<h2 id="描述">描述</h2> + +<p>与其他全局对象不同的是，<code>Math</code> 不是一个构造器。<code>Math</code> 的所有属性与方法都是静态的。引用圆周率的写法是 <code>Math.PI</code>，调用正余弦函数的写法是 <code>Math.sin(x)</code>，<code>x</code> 是要传入的参数。<code>Math</code> 的常量是使用 JavaScript 中的全精度浮点数来定义的。</p> + +<h2 id="属性">属性</h2> + +<dl> + <dt>{{jsxref("Math.E")}}</dt> + <dd>欧拉常数，也是自然对数的底数，约等于 <code>2.718</code>。</dd> + <dt>{{jsxref("Math.LN2")}}</dt> + <dd><code>2</code> 的自然对数，约等于 <code>0.693</code>。</dd> + <dt>{{jsxref("Math.LN10")}}</dt> + <dd><code>10</code> 的自然对数，约等于 <code>2.303</code>。</dd> + <dt>{{jsxref("Math.LOG2E")}}</dt> + <dd>以 <code>2</code> 为底的 <code>E</code> 的对数，约等于 <code>1.443</code>。</dd> + <dt>{{jsxref("Math.LOG10E")}}</dt> + <dd>以 <code>10</code> 为底的 <code>E</code> 的对数，约等于 <code>0.434</code>。</dd> + <dt>{{jsxref("Math.PI")}}</dt> + <dd>圆周率，一个圆的周长和直径之比，约等于 <code>3.14159</code>。</dd> + <dt>{{jsxref("Math.SQRT1_2")}}</dt> + <dd>二分之一 ½ 的平方根，同时也是 <code>2</code> 的平方根的倒数 <math><mfrac><mn>1</mn><mrow><msqrt><mn>2</mn><mrow></mrow></msqrt></mrow></mfrac></math>，约等于 <code>0.707</code>。</dd> + <dt>{{jsxref("Math.SQRT2")}}</dt> + <dd><code>2</code> 的平方根，约等于 <code>1.414</code>。</dd> +</dl> + +<h2 id="方法">方法</h2> + +<div class="note"> +<p>需要注意的是，三角函数 <code>sin()</code>、<code>cos()</code>、<code>tan()</code>、<code>asin()</code>、<code>acos()</code>、<code>atan()</code> 和 <code>atan2()</code> 返回的值是<em>弧度</em>而非角度。</p> + +<p>若要转换，弧度除以 <code>(Math.PI / 180)</code> 即可转换为角度，同理，角度乘以这个数则能转换为弧度。</p> +</div> + +<div class="note"> +<p>需要注意的是，很多 <code>Math</code> 函数都有一个精度，而且这个精度在不同实现中也是不相同的。这意味着不同的浏览器会给出不同的结果，甚至，在不同的系统或架构下，相同的 JS 引擎也会给出不同的结果！</p> +</div> + +<dl> + <dt>{{jsxref("Global_Objects/Math/abs", "Math.abs(<var>x</var>)")}}</dt> + <dd>返回一个数的绝对值。</dd> + <dt>{{jsxref("Global_Objects/Math/acos", "Math.acos(<var>x</var>)")}}</dt> + <dd>返回一个数的反余弦值。</dd> + <dt>{{jsxref("Global_Objects/Math/acosh", "Math.acosh(<var>x</var>)")}}</dt> + <dd>返回一个数的反双曲余弦值。</dd> + <dt>{{jsxref("Global_Objects/Math/asin", "Math.asin(<var>x</var>)")}}</dt> + <dd>返回一个数的反正弦值。</dd> + <dt>{{jsxref("Global_Objects/Math/asinh", "Math.asinh(<var>x</var>)")}}</dt> + <dd>返回一个数的反双曲正弦值。</dd> + <dt>{{jsxref("Global_Objects/Math/atan", "Math.atan(<var>x</var>)")}}</dt> + <dd>返回一个数的反正切值。</dd> + <dt>{{jsxref("Global_Objects/Math/atanh", "Math.atanh(<var>x</var>)")}}</dt> + <dd>返回一个数的反双曲正切值。</dd> + <dt>{{jsxref("Global_Objects/Math/atan2", "Math.atan2(<var>y</var>, <var>x</var>)")}}</dt> + <dd>返回 <code>y/x</code> 的反正切值。</dd> + <dt>{{jsxref("Global_Objects/Math/cbrt", "Math.cbrt(<var>x</var>)")}}</dt> + <dd>返回一个数的立方根。</dd> + <dt>{{jsxref("Global_Objects/Math/ceil", "Math.ceil(<var>x</var>)")}}</dt> + <dd>返回大于一个数的最小整数，即一个数向上取整后的值。</dd> + <dt>{{jsxref("Global_Objects/Math/clz32", "Math.clz32(<var>x</var>)")}}</dt> + <dd>返回一个 32 位整数的前导零的数量。</dd> + <dt>{{jsxref("Global_Objects/Math/cos", "Math.cos(<var>x</var>)")}}</dt> + <dd>返回一个数的余弦值。</dd> + <dt>{{jsxref("Global_Objects/Math/cosh", "Math.cosh(<var>x</var>)")}}</dt> + <dd>返回一个数的双曲余弦值。</dd> + <dt>{{jsxref("Global_Objects/Math/exp", "Math.exp(<var>x</var>)")}}</dt> + <dd>返回欧拉常数的参数次方，<code>E<var><sup>x</sup></var></code>，其中 <code><var>x</var></code> 为参数，<code>E</code> 是欧拉常数（2.718...，自然对数的底数）。</dd> + <dt>{{jsxref("Global_Objects/Math/expm1", "Math.expm1(<var>x</var>)")}}</dt> + <dd>返回 <code>exp(x) - 1</code> 的值。</dd> + <dt>{{jsxref("Global_Objects/Math/floor", "Math.floor(<var>x</var>)")}}</dt> + <dd>返回小于一个数的最大整数，即一个数向下取整后的值。</dd> + <dt>{{jsxref("Global_Objects/Math/fround", "Math.fround(<var>x</var>)")}}</dt> + <dd>返回最接近一个数的<a href="https://zh.wikipedia.org/wiki/%E5%96%AE%E7%B2%BE%E5%BA%A6%E6%B5%AE%E9%BB%9E%E6%95%B8">单精度浮点型</a>表示。</dd> + <dt>{{jsxref("Global_Objects/Math/hypot", "Math.hypot([<var>x</var>[, <var>y</var>[, …]]])")}}</dt> + <dd>返回其所有参数平方和的平方根。</dd> + <dt>{{jsxref("Global_Objects/Math/imul", "Math.imul(<var>x</var>, <var>y</var>)")}}</dt> + <dd>返回 32 位整数乘法的结果。</dd> + <dt>{{jsxref("Global_Objects/Math/log", "Math.log(<var>x</var>)")}}</dt> + <dd>返回一个数的自然对数（㏒<sub>e</sub>，即 ㏑）。</dd> + <dt>{{jsxref("Global_Objects/Math/log1p", "Math.log1p(<var>x</var>)")}}</dt> + <dd>返回一个数加 1 的和的自然对数（㏒<sub>e</sub>，即 ㏑）。</dd> + <dt>{{jsxref("Global_Objects/Math/log10", "Math.log10(<var>x</var>)")}}</dt> + <dd>返回一个数以 10 为底数的对数。</dd> + <dt>{{jsxref("Global_Objects/Math/log2", "Math.log2(<var>x</var>)")}}</dt> + <dd>返回一个数以 2 为底数的对数。</dd> + <dt>{{jsxref("Global_Objects/Math/max", "Math.max([<var>x</var>[, <var>y</var>[, …]]])")}}</dt> + <dd>返回零到多个数值中最大值。</dd> + <dt>{{jsxref("Global_Objects/Math/min", "Math.min([<var>x</var>[, <var>y</var>[, …]]])")}}</dt> + <dd>返回零到多个数值中最小值。</dd> + <dt>{{jsxref("Global_Objects/Math/pow", "Math.pow(<var>x</var>, <var>y</var>)")}}</dt> + <dd>返回一个数的 y 次幂。</dd> + <dt>{{jsxref("Global_Objects/Math/random", "Math.random()")}}</dt> + <dd>返回一个 0 到 1 之间的伪随机数。</dd> + <dt>{{jsxref("Global_Objects/Math/round", "Math.round(<var>x</var>)")}}</dt> + <dd>返回四舍五入后的整数。</dd> + <dt>{{jsxref("Global_Objects/Math/sign", "Math.sign(<var>x</var>)")}}</dt> + <dd>返回一个数的符号，得知一个数是正数、负数还是 0。</dd> + <dt>{{jsxref("Global_Objects/Math/sin", "Math.sin(<var>x</var>)")}}</dt> + <dd>返回一个数的正弦值。</dd> + <dt>{{jsxref("Global_Objects/Math/sinh", "Math.sinh(<var>x</var>)")}}</dt> + <dd>返回一个数的双曲正弦值。</dd> + <dt>{{jsxref("Global_Objects/Math/sqrt", "Math.sqrt(<var>x</var>)")}}</dt> + <dd>返回一个数的平方根。</dd> + <dt>{{jsxref("Global_Objects/Math/tan", "Math.tan(<var>x</var>)")}}</dt> + <dd>返回一个数的正切值。</dd> + <dt>{{jsxref("Global_Objects/Math/tanh", "Math.tanh(<var>x</var>)")}}</dt> + <dd>返回一个数的双曲正切值。</dd> + <dt><code>Math.toSource()</code></dt> + <dd>返回字符串 <code>"Math"</code>。</dd> + <dt>{{jsxref("Global_Objects/Math/trunc", "Math.trunc(<var>x</var>)")}}</dt> + <dd>返回一个数的整数部分，直接去除其小数点及之后的部分。</dd> +</dl> + +<div class="hidden"> +<div class="note"> +<p>已被移除的内容：</p> +</div> + +<h2 id="拓展_Math_对象">拓展 <code>Math</code> 对象</h2> + +<p>As with most of the built-in objects in JavaScript, the <code>Math</code> object can be extended with custom properties and methods. To extend the <code>Math</code> object, you do not use <code>prototype</code>. Instead, you directly extend <code>Math</code>:</p> + +<pre>Math.propName = propValue; +Math.methodName = methodRef;</pre> + +<p>For instance, the following example adds a method to the <code>Math</code> object for calculating the <em>greatest common divisor</em> of a list of arguments.</p> + +<pre class="brush: js">/* Variadic function -- Returns the greatest common divisor of a list of arguments */ +Math.gcd = function() { + if (arguments.length == 2) { + if (arguments[1] == 0) + return arguments[0]; + else + return Math.gcd(arguments[1], arguments[0] % arguments[1]); + } else if (arguments.length > 2) { + var result = Math.gcd(arguments[0], arguments[1]); + for (var i = 2; i < arguments.length; i++) + result = Math.gcd(result, arguments[i]); + return result; + } +};</pre> + +<p>试试运行下面的代码：</p> + +<pre class="brush: js">console.log(Math.gcd(20, 30, 15, 70, 40)); // `5`</pre> +</div> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范</th> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-math-object', 'Math')}}</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Math")}}</p> + +<h2 id="参见">参见</h2> + +<ul> + <li>{{jsxref("Number")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/math/ln10/index.html b/files/zh-cn/web/javascript/reference/global_objects/math/ln10/index.html new file mode 100644 index 0000000000..dac9f67466 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/math/ln10/index.html @@ -0,0 +1,99 @@ +--- +title: Math.LN10 +slug: Web/JavaScript/Reference/Global_Objects/Math/LN10 +translation_of: Web/JavaScript/Reference/Global_Objects/Math/LN10 +--- +<div> + {{JSRef("Global_Objects", "Math")}}</div> +<h2 id="Summary" name="Summary">概述</h2> +<p><code><strong>Math.LN10</strong></code> 属性表示 10 的自然对数，约为 2.302：</p> +<p><math display="block"><semantics><mrow><mstyle mathvariant="monospace"><mi>Math.LN10</mi></mstyle><mo>=</mo><mo lspace="0em" rspace="0em">ln</mo><mo stretchy="false">(</mo><mn>10</mn><mo stretchy="false">)</mo><mo>≈</mo><mn>2.302</mn></mrow><annotation encoding="TeX">\mathtt{\mi{Math.LN10}} = \ln(10) \approx 2.302</annotation></semantics></math></p> +<div> + {{js_property_attributes(0,0,0)}}</div> +<h2 id="Description" name="Description">描述</h2> +<p>由于 <code>LN10</code> 是 <code>Math</code> 的静态属性，所以应该像这样使用：<code>Math.LN10</code>，而不是作为你创建的 <code>Math</code> 实例的属性（<code>Math</code> 不是构造函数）。</p> +<h2 id="Examples" name="Examples">示例</h2> +<h3 id="Example:_Using_Math.LN10" name="Example:_Using_Math.LN10">例子：使用 <code>Math.LN10</code></h3> +<p>下面的函数返回 10 的自然对数：</p> +<pre class="brush:js">function getNatLog10() { + return Math.LN10 +} + +getNatLog10() // 2.302585092994046</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>ECMAScript 1st Edition. Implemented in JavaScript 1.0</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.8.1.2', 'Math.LN10')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-math.ln10', 'Math.LN10')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> +<h2 id="浏览器兼容性">浏览器兼容性</h2> +<p>{{ CompatibilityTable() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> + </table> +</div> +<h2 id="See_also" name="See_also">相关链接</h2> +<ul> + <li>The {{jsxref("Global_Objects/Math", "Math")}} object it belongs to.</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/math/ln2/index.html b/files/zh-cn/web/javascript/reference/global_objects/math/ln2/index.html new file mode 100644 index 0000000000..ab79666f23 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/math/ln2/index.html @@ -0,0 +1,99 @@ +--- +title: Math.LN2 +slug: Web/JavaScript/Reference/Global_Objects/Math/LN2 +translation_of: Web/JavaScript/Reference/Global_Objects/Math/LN2 +--- +<div> + {{JSRef("Global_Objects", "Math")}}</div> +<h2 id="Summary" name="Summary">概述</h2> +<p><code><strong>Math.LN2</strong></code> 属性表示 2 的自然对数，约为 0.693：</p> +<p><math display="block"><semantics><mrow><mstyle mathvariant="monospace"><mi>Math.LN2</mi></mstyle><mo>=</mo><mo lspace="0em" rspace="0em">ln</mo><mo stretchy="false">(</mo><mn>2</mn><mo stretchy="false">)</mo><mo>≈</mo><mn>0.693</mn></mrow><annotation encoding="TeX">\mathtt{\mi{Math.LN2}} = \ln(2) \approx 0.693</annotation></semantics></math></p> +<div> + {{js_property_attributes(0,0,0)}}</div> +<h2 id="Description" name="Description">描述</h2> +<p>由于 <code>LN2</code> 是 <code>Math</code> 的静态属性，所以应该像这样使用：<code>Math.LN2</code>，而不是作为你创建的 <code>Math</code> 实例的属性（<code>Math</code> 不是构造函数）。</p> +<h2 id="Examples" name="Examples">示例</h2> +<h3 id="Example:_Using_Math.LN2" name="Example:_Using_Math.LN2">例子：使用 <code>Math.LN2</code></h3> +<p>下面的函数返回 2 的自然对数：</p> +<pre class="brush:js">function getNatLog2() { + return Math.LN2 +} + +getNatLog2() // 0.6931471805599453</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>ECMAScript 1st Edition. Implemented in JavaScript 1.0</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.8.1.3', 'Math.LN2')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-math.ln2', 'Math.LN2')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> +<h2 id="浏览器兼容性">浏览器兼容性</h2> +<p>{{ CompatibilityTable() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> + </table> +</div> +<h2 id="See_also" name="See_also">相关链接</h2> +<ul> + <li>The {{jsxref("Global_Objects/Math", "Math")}} object it belongs to.</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/math/log/index.html b/files/zh-cn/web/javascript/reference/global_objects/math/log/index.html new file mode 100644 index 0000000000..d91a937ec1 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/math/log/index.html @@ -0,0 +1,139 @@ +--- +title: Math.log() +slug: Web/JavaScript/Reference/Global_Objects/Math/log +translation_of: Web/JavaScript/Reference/Global_Objects/Math/log +--- +<p id="Summary">{{JSRef("Global_Objects", "Math")}}</p> + +<h2 id="Summary" name="Summary">概述</h2> + +<p><code><strong>Math.log()</strong></code> 函数返回一个数的自然对数，即：</p> + +<p><math><semantics><mrow><mo>∀</mo><mi>x</mi><mo>></mo><mn>0</mn><mo>,</mo><mstyle mathvariant="monospace"><mrow><mo lspace="0em" rspace="thinmathspace">Math.log</mo><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo></mrow></mstyle><mo>=</mo><mo lspace="0em" rspace="0em">ln</mo><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo><mo>=</mo><mtext>the unique</mtext><mspace width="thickmathspace"></mspace><mi>y</mi><mspace width="thickmathspace"></mspace><mtext>such that</mtext><mspace width="thickmathspace"></mspace><msup><mi>e</mi><mi>y</mi></msup><mo>=</mo><mi>x</mi></mrow><annotation encoding="TeX">\forall x > 0, \mathtt{\operatorname{Math.log}(x)} = \ln(x) = \text{the unique} \; y \; \text{such that} \; e^y = x</annotation></semantics></math></p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code>Math.log(<em>x</em>)</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>x</code></dt> + <dd>一个数字.</dd> +</dl> + +<h2 id="Description" name="Description">描述</h2> + +<p>如果指定的 <code>number</code> 为负数，则返回值为 <code>NaN</code>。</p> + +<p>由于 <code style="font-style: normal;">log</code> 是 <code style="font-style: normal;">Math</code> 的静态方法，所以应该像这样使用：<code style="font-style: normal;">Math.log()</code>，而不是作为你创建的 <code style="font-style: normal;">Math</code> 对象的方法。</p> + +<h2 id="示例">示例</h2> + +<h3 id="Example:_Using_Math.log" name="Example:_Using_Math.log">例子1:使用<code>Math.log</code></h3> + +<p>下面的函数返回指定变量的自然对数：</p> + +<pre class="brush:js">Math.log(-1); // NaN, out of range +Math.log(0); // -Infinity +Math.log(1); // 0 +Math.log(10); // 2.302585092994046</pre> + +<h3 id="例子2_使用Math.log时基于不同的底数">例子2: 使用<code>Math.log</code>时基于不同的底数</h3> + +<p>下面的函数返回以 <code>x</code> 为底 <code>y</code> 的对数（即log<sub>x</sub> y）：</p> + +<pre class="brush:js">function getBaseLog(x, y) { + return Math.log(y) / Math.log(x); +}</pre> + +<p>如果你运行 <code>getBaseLog(10, 1000)，则会返回</code><code>2.9999999999999996，非常接近实际答案：3，原因是浮点数精度问题。</code></p> + +<h2 id="规范" style="margin-bottom: 20px; line-height: 30px;">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范版本</th> + <th scope="col">规范状态</th> + <th scope="col">注解</th> + </tr> + <tr> + <td>ECMAScript 1st Edition. Implemented in JavaScript 1.0</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.8.2.10', 'Math.log')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-math.log', 'Math.log')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性" style="margin-bottom: 20px; line-height: 30px;">浏览器兼容性</h2> + +<p>{{ CompatibilityTable() }}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th style="line-height: 16px;">Feature</th> + <th style="line-height: 16px;">Chrome</th> + <th style="line-height: 16px;">Firefox (Gecko)</th> + <th style="line-height: 16px;">Internet Explorer</th> + <th style="line-height: 16px;">Opera</th> + <th style="line-height: 16px;">Safari</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th style="line-height: 16px;">Feature</th> + <th style="line-height: 16px;">Android</th> + <th style="line-height: 16px;">Chrome for Android</th> + <th style="line-height: 16px;">Firefox Mobile (Gecko)</th> + <th style="line-height: 16px;">IE Mobile</th> + <th style="line-height: 16px;">Opera Mobile</th> + <th style="line-height: 16px;">Safari Mobile</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="See_also" name="See_also" style="margin-bottom: 20px; line-height: 30px;">相关链接</h2> + +<p></p> + +<ul> + <li>The {{jsxref("Global_Objects/Math", "Math")}} object it belongs to.</li> + <li>{{jsxref("Math.exp()")}}</li> + <li>{{jsxref("Math.pow()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/math/log10/index.html b/files/zh-cn/web/javascript/reference/global_objects/math/log10/index.html new file mode 100644 index 0000000000..7819f922e8 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/math/log10/index.html @@ -0,0 +1,113 @@ +--- +title: Math.log10() +slug: Web/JavaScript/Reference/Global_Objects/Math/log10 +translation_of: Web/JavaScript/Reference/Global_Objects/Math/log10 +--- +<div> +<div>{{JSRef("Global_Objects", "Math")}}</div> +</div> + +<h2 id="Summary" name="Summary">概述</h2> + +<p><code><strong>Math.log10()</strong></code> 函数返回<span style="color: #4d4e53; line-height: 1.5;">一个数字以 10 为底的对数.</span></p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code>Math.log10(<em>x</em>)</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>x</code></dt> + <dd>任意数字.</dd> +</dl> + +<h2 id="Description" name="Description">描述</h2> + +<p>如果传入的参数小于 0, 则返回 NaN.</p> + +<h2 id="Examples" name="Examples">示例</h2> + +<pre class="brush:js">Math.log10(10) // 1 +Math.log10(100) // 2 +Math.log10("100")// 2 +Math.log10(1) // 0 +Math.log10(0) // -Infinity +Math.log10(-2) // NaN +Math.log10("foo")// NaN +</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('ES6', '#sec-math.log10', 'Math.log10')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{ CompatibilityTable() }}</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>{{CompatNo}}</td> + <td>{{CompatGeckoDesktop("25")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</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>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatGeckoMobile("25")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("Global_Objects/Math", "Math")}} 对象.</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/math/log10e/index.html b/files/zh-cn/web/javascript/reference/global_objects/math/log10e/index.html new file mode 100644 index 0000000000..3a929935f1 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/math/log10e/index.html @@ -0,0 +1,99 @@ +--- +title: Math.LOG10E +slug: Web/JavaScript/Reference/Global_Objects/Math/LOG10E +translation_of: Web/JavaScript/Reference/Global_Objects/Math/LOG10E +--- +<div> + {{JSRef("Global_Objects", "Math")}}</div> +<h2 id="Summary" name="Summary">概述</h2> +<p><code><strong>Math.LOG10E</strong></code> 属性表示以 10 为底数，e 的对数，约为 0.434：</p> +<p><math display="block"><semantics><mrow><mstyle mathvariant="monospace"><mi>Math.LOG10E</mi></mstyle><mo>=</mo><msub><mo lspace="0em" rspace="0em">log</mo><mn>10</mn></msub><mo stretchy="false">(</mo><mi>e</mi><mo stretchy="false">)</mo><mo>≈</mo><mn>0.434</mn></mrow><annotation encoding="TeX">\mathtt{\mi{Math.LOG10E}} = \log_10(e) \approx 0.434</annotation></semantics></math></p> +<div> + {{js_property_attributes(0,0,0)}}</div> +<h2 id="Description" name="Description">描述</h2> +<p>由于 <code>LOG10E</code> 是 <code>Math</code> 的静态属性，所以应该像这样使用：<code>Math.LOG10E</code>，而不是作为你创建的 <code>Math</code> 实例的属性（<code>Math</code> 不是一个构造函数）。</p> +<h2 id="Examples" name="Examples">示例</h2> +<h3 id="Example:_Using_Math.LOG10E" name="Example:_Using_Math.LOG10E">例子：使用 <code>Math.LOG10E</code></h3> +<p>下面的函数返回以 10为底数，E的对数：</p> +<pre class="brush:js">function getLog10e() { + return Math.LOG10E +} + +getLog10e() // 0.4342944819032518</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>ECMAScript 1st Edition. Implemented in JavaScript 1.0</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.8.1.5', 'Math.LOG10E')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-math.log10e', 'Math.LOG10E')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> +<h2 id="浏览器兼容性">浏览器兼容性</h2> +<p>{{ CompatibilityTable() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> + </table> +</div> +<h2 id="See_also" name="See_also">相关链接</h2> +<ul> + <li>The {{jsxref("Global_Objects/Math", "Math")}} object it belongs to.</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/math/log1p/index.html b/files/zh-cn/web/javascript/reference/global_objects/math/log1p/index.html new file mode 100644 index 0000000000..2f9b0c64a5 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/math/log1p/index.html @@ -0,0 +1,116 @@ +--- +title: Math.log1p() +slug: Web/JavaScript/Reference/Global_Objects/Math/log1p +translation_of: Web/JavaScript/Reference/Global_Objects/Math/log1p +--- +<div> +<div>{{JSRef("Global_Objects", "Math")}}</div> +</div> + +<h2 id="Summary" name="Summary">概述</h2> + +<p><code><strong>Math.log1p()</strong></code> 函数返回一个数字加1后的自然对数 (底为 <code>E</code>), 既<code>log(x+1)</code>.</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code>Math.log1p(<em>x</em>)</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>x</code></dt> + <dd>任意数字.</dd> +</dl> + +<h2 id="Description" name="Description">描述</h2> + +<p>如果参数的值小于<code> -1</code>, 则返回 <code>NaN.</code></p> + +<p><code>函数 y = log(x+1) 的图形是这样的:</code></p> + +<p> <img alt="log(x+1)" src="https://mdn.mozillademos.org/files/6467/logx1.jpg" style="height: 300px; width: 400px;"></p> + +<p><strong style="font-size: 30px; font-weight: 700; letter-spacing: -1px; line-height: 30px;">示例</strong></p> + +<pre class="brush:js">Math.log1p(Math.E-1) // 1 +Math.log1p(0) // 0 +Math.log1p("0") // 0 +Math.log1p(-1) // -Infinity +Math.log1p(-2) // NaN +Math.log1p("foo") // NaN +</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('ES6', '#sec-math.log1p', 'Math.log1p')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{ CompatibilityTable() }}</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>{{CompatNo}}</td> + <td>{{CompatGeckoDesktop("25")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</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>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatGeckoMobile("25")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("Global_Objects/Math", "Math")}} 对象.</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/math/log2/index.html b/files/zh-cn/web/javascript/reference/global_objects/math/log2/index.html new file mode 100644 index 0000000000..bb048cd49a --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/math/log2/index.html @@ -0,0 +1,113 @@ +--- +title: Math.log2() +slug: Web/JavaScript/Reference/Global_Objects/Math/log2 +translation_of: Web/JavaScript/Reference/Global_Objects/Math/log2 +--- +<div> +<div>{{JSRef("Global_Objects", "Math")}}</div> +</div> + +<h2 id="Summary" name="Summary">概述</h2> + +<p><code><strong>Math.log2()</strong></code> 函数返回一个数字以 2 为底的对数.</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code>Math.log2(<em>x</em>)</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>x</code></dt> + <dd>任意数字.</dd> +</dl> + +<h2 id="Description" name="Description">描述</h2> + +<p>如果传入的参数小于 0, 则返回 <code>NaN</code>.</p> + +<h2 id="Examples" name="Examples">示例</h2> + +<pre class="brush:js">Math.log2(2) // 1 +Math.log2(1024) // 10 +Math.log2(1) // 0 +Math.log2(0) // -Infinity +Math.log2(-2) // NaN +Math.log2("1024")// 10 +Math.log2("foo") // NaN +</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('ES6', '#sec-math.log2', 'Math.log2')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{ CompatibilityTable() }}</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>{{CompatNo}}</td> + <td>{{CompatGeckoDesktop("25")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</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>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatGeckoMobile("25")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("Global_Objects/Math", "Math")}} 对象.</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/math/log2e/index.html b/files/zh-cn/web/javascript/reference/global_objects/math/log2e/index.html new file mode 100644 index 0000000000..9c68f4cc57 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/math/log2e/index.html @@ -0,0 +1,99 @@ +--- +title: Math.LOG2E +slug: Web/JavaScript/Reference/Global_Objects/Math/LOG2E +translation_of: Web/JavaScript/Reference/Global_Objects/Math/LOG2E +--- +<div> + {{JSRef("Global_Objects", "Math")}}</div> +<h2 id="Summary" name="Summary">概述</h2> +<p><code><strong>Math.LOG2E</strong></code> 属性表示以 2 为底数，e 的对数，约为 1.442：</p> +<p><math display="block"><semantics><mrow><mstyle mathvariant="monospace"><mi>Math.LOG2E</mi></mstyle><mo>=</mo><msub><mo lspace="0em" rspace="0em">log</mo><mn>2</mn></msub><mo stretchy="false">(</mo><mi>e</mi><mo stretchy="false">)</mo><mo>≈</mo><mn>1.442</mn></mrow><annotation encoding="TeX">\mathtt{\mi{Math.LOG2E}} = \log_2(e) \approx 1.442</annotation></semantics></math></p> +<div> + {{js_property_attributes(0,0,0)}}</div> +<h2 id="Description" name="Description">描述</h2> +<p>由于 <code>LOG2E</code> 是 <code>Math</code> 的静态属性，所以应该像这样使用：<code>Math.LOG2E</code>，而不是作为你创建的 <code>Math</code> 对象的属性（<code>Math</code> 不是一个构造函数）。</p> +<h2 id="Examples" name="Examples">示例</h2> +<h3 id="Example:_Using_Math.LOG2E" name="Example:_Using_Math.LOG2E">例子：使用 <code>Math.LOG2E</code></h3> +<p>下面的函数返回以 2 为底数，E 的对数：</p> +<pre class="brush:js">function getLog2e() { + return Math.LOG2E +} + +getLog2e() // 1.4426950408889634</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>ECMAScript 1st Edition. Implemented in JavaScript 1.0</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.8.1.4', 'Math.LOG2E')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-math.log2e', 'Math.LOG2E')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> +<h2 id="浏览器兼容性">浏览器兼容性</h2> +<p>{{ CompatibilityTable() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> + </table> +</div> +<h2 id="See_also" name="See_also">相关链接</h2> +<ul> + <li>The {{jsxref("Global_Objects/Math", "Math")}} object it belongs to.</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/math/max/index.html b/files/zh-cn/web/javascript/reference/global_objects/math/max/index.html new file mode 100644 index 0000000000..593776318e --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/math/max/index.html @@ -0,0 +1,99 @@ +--- +title: Math.max() +slug: Web/JavaScript/Reference/Global_Objects/Math/max +tags: + - JavaScript + - Math +translation_of: Web/JavaScript/Reference/Global_Objects/Math/max +--- +<div>{{JSRef}}</div> + +<p><code><strong>Math.max()</strong></code> 函数返回一组数中的最大值。</p> + +<p>{{EmbedInteractiveExample("pages/js/math-max.html")}}</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code>Math.max(<em>value1</em>[,<em>value2</em>, ...]) </code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>value1, value2, ...</code></dt> + <dd>一组数值</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>返回给定的一组数字中的最大值。如果给定的参数中至少有一个参数无法被转换成数字，则会返回 {{jsxref("NaN")}}。</p> + +<h2 id="Description" name="Description">描述</h2> + +<p>由于 <code>max</code> 是 <code>Math</code> 的静态方法，所以应该像这样使用：<code>Math.max()</code>，而不是创建的 <code>Math</code> 实例的方法（<code>Math</code> 不是构造函数）。</p> + +<p>如果没有参数，则结果为 - {{jsxref("Infinity")}}。</p> + +<p>如果有任一参数不能被转换为数值，则结果为 {{jsxref("NaN")}}。</p> + +<h2 id="Examples" name="Examples">示例</h2> + +<h3 id="Example_Using_Math.max" name="Example:_Using_Math.max">使用 <code>Math.max()</code></h3> + +<pre>Math.max(10, 20); // 20 +Math.max(-10, -20); // -10 +Math.max(-10, 20); // 20</pre> + +<p>下面的方法使用 {{jsxref("Global_Objects/Function/apply", "apply")}} 方法寻找一个数值数组中的最大元素。<code>getMaxOfArray([1,2,3])</code> 等价于 <code>Math.max(1, 2, 3)</code>，但是你可以使用 <code>getMaxOfArray</code> ()作用于任意长度的数组上。</p> + +<pre class="brush:js">function getMaxOfArray(numArray) { + return Math.max.apply(null, numArray); +} +</pre> + +<p>或者通过使用最新的扩展语句{{jsxref("Operators/Spread_operator", "spread operator")}}，获得数组中的最大值变得更容易。</p> + +<pre class="brush: js">var arr = [1, 2, 3]; +var max = Math.max(...arr); +</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>{{SpecName('ES1')}}</td> + <td>{{Spec2('ES1')}}</td> + <td>Initial definition. Implemented in JavaScript 1.0.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.8.2.11', 'Math.max')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-math.max', 'Math.max')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-math.max', 'Math.max')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{Compat("javascript.builtins.Math.max")}}</p> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("Math.min()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/math/min/index.html b/files/zh-cn/web/javascript/reference/global_objects/math/min/index.html new file mode 100644 index 0000000000..2cc029c6c3 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/math/min/index.html @@ -0,0 +1,155 @@ +--- +title: Math.min() +slug: Web/JavaScript/Reference/Global_Objects/Math/min +tags: + - JavaScript + - Math + - Math.min + - 参考 + - 方法 +translation_of: Web/JavaScript/Reference/Global_Objects/Math/min +--- +<div>{{JSRef}}</div> + +<p><code><strong>Math.min()</strong></code> 返回零个或更多个数值的最小值。</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code>Math.min([<em>value1</em>[,<em>value2</em>, ...]]) </code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>value1, value2, ...</code></dt> + <dd>一组数值</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>给定数值中最小的数。如果任一参数不能转换为数值，则返回{{jsxref("NaN")}}。</p> + +<h2 id="Description" name="Description">描述</h2> + +<p>由于 <code>min</code> 是 <code>Math</code> 的静态方法，所以应该像这样使用：<code>Math.min()</code>，而不是作为你创建的 <code>Math</code> 实例的方法（Math 不是构造函数）。</p> + +<p>如果没有参数，结果为{{jsxref("Infinity")}}。</p> + +<p>如果有任一参数不能被转换为数值，结果为 {{jsxref("NaN")}}。</p> + +<h2 id="Examples" name="Examples">示例</h2> + +<h3 id="Example:_Using_Math.min" name="Example:_Using_Math.min">使用 <code>Math.min()</code></h3> + +<p>下例找出 x 和 y 的最小值，并把它赋值给 z：</p> + +<pre class="brush:js">var x = 10, y = -20; +var z = Math.min(x, y); +</pre> + +<h3 id="Example.3A_Clipping_a_value_with_Math.min" name="Example.3A_Clipping_a_value_with_Math.min">使用 <code>Math.min()</code> 裁剪值（Clipping a value）</h3> + +<p><code>Math.min</code> 经常用于裁剪一个值，以便使其总是小于或等于某个边界值。例如：</p> + +<pre class="brush: js">var x = f(foo); + +if (x > boundary) { + x = boundary; +}</pre> + +<p>可以写成：</p> + +<pre class="brush:js">var x = Math.min(f(foo), boundary);</pre> + +<div>另外，{{jsxref("Math.max()")}} 也可以被用来以相似的方式裁剪一个值。</div> + +<div> </div> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范版本</th> + <th scope="col">规范状态</th> + <th scope="col">注解</th> + </tr> + <tr> + <td>ECMAScript 1st Edition. Implemented in JavaScript 1.0</td> + <td>{{Spec2('ES1')}}</td> + <td>初始定义。在 JavaScript 1.0 中实现。</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.8.2.12', 'Math.min')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-math.min', 'Math.min')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-math.min', 'Math.min')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{ CompatibilityTable() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("Math.max()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/math/pi/index.html b/files/zh-cn/web/javascript/reference/global_objects/math/pi/index.html new file mode 100644 index 0000000000..77f373196e --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/math/pi/index.html @@ -0,0 +1,115 @@ +--- +title: Math.PI +slug: Web/JavaScript/Reference/Global_Objects/Math/PI +translation_of: Web/JavaScript/Reference/Global_Objects/Math/PI +--- +<div>{{JSRef("Global_Objects", "Math")}}</div> + +<h2 id="Summary" name="Summary">概述</h2> + +<p><code><strong>Math.PI</strong></code> 表示一个圆的周长与直径的比例，约为 3.14159：</p> + +<p><math><semantics><mrow><mstyle mathvariant="monospace"><mi>Math.PI</mi></mstyle><mo>=</mo><mi>π</mi><mo>≈</mo><mn>3.14159</mn></mrow><annotation encoding="TeX">\mathtt{\mi{Math.PI}} = \pi \approx 3.14159</annotation></semantics></math></p> + +<div>{{js_property_attributes(0,0,0)}}</div> + +<h2 id="Description" name="Description">描述</h2> + +<p>由于 <code>PI</code> 是 <code>Math</code> 的静态属性，所以应该像这样使用：<code>Math.PI</code>，而不是作为你创建的 <code>Math</code> 实例的属性（<code>Math</code> 不是构造函数）。</p> + +<h2 id="Examples" name="Examples">示例</h2> + +<h3 id="Example:_Using_PI" name="Example:_Using_PI">使用 <code>Math.PI</code></h3> + +<p>下面的函数使用 Math.PI 计算给定半径的圆周长：</p> + +<pre class="brush:js language-js" style="padding: 1em 0px 1em 30px; font-size: 14px; white-space: normal; color: rgb(77, 78, 83);"><code class="language-js" style="direction: ltr; white-space: pre;"><span class="keyword token" style="color: rgb(0, 119, 170);">function</span> calculateCircumference <span class="punctuation token" style="color: rgb(153, 153, 153);">(</span>radius<span class="punctuation token" style="color: rgb(153, 153, 153);">)</span> <span class="punctuation token" style="color: rgb(153, 153, 153);">{</span> + <span class="keyword token" style="color: rgb(0, 119, 170);">return</span> <span class="number token" style="color: rgb(153, 0, 85);">2</span> <span class="operator token" style="background: rgba(255, 255, 255, 0.498039); color: rgb(166, 127, 89);">*</span> Math<span class="punctuation token" style="color: rgb(153, 153, 153);">.</span>PI <span class="operator token" style="background: rgba(255, 255, 255, 0.498039); color: rgb(166, 127, 89);">*</span> radius<span class="punctuation token" style="color: rgb(153, 153, 153);">;</span> +<span class="punctuation token" style="color: rgb(153, 153, 153);">}</span> + +<span class="function token" style="color: rgb(221, 74, 104);">calculateCircumference<span class="punctuation token" style="color: rgb(153, 153, 153);">(</span></span><span class="number token" style="color: rgb(153, 0, 85);">1</span><span class="punctuation token" style="color: rgb(153, 153, 153);">)</span><span class="punctuation token" style="color: rgb(153, 153, 153);">;</span> <span class="comment token" style="color: rgb(112, 128, 144);"> // 6.283185307179586</span></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>ECMAScript 1st Edition. Implemented in JavaScript 1.0</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.8.1.6', 'Math.PI')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-math.pi', 'Math.PI')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{ CompatibilityTable() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>The {{jsxref("Global_Objects/Math", "Math")}} object it belongs to.</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/math/pow/index.html b/files/zh-cn/web/javascript/reference/global_objects/math/pow/index.html new file mode 100644 index 0000000000..32489252c0 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/math/pow/index.html @@ -0,0 +1,78 @@ +--- +title: Math.pow() +slug: Web/JavaScript/Reference/Global_Objects/Math/pow +translation_of: Web/JavaScript/Reference/Global_Objects/Math/pow +--- +<div>{{JSRef}}</div> + +<p><code><strong>Math.pow()</strong></code> 函数返回基数（<code>base</code>）的指数（<code>exponent</code>）次幂，即<span style="line-height: 1.572;"> </span><code style="font-size: 14px;">base<sup>exponent</sup></code><span style="line-height: 1.572;">。</span></p> + +<p>{{EmbedInteractiveExample("pages/js/math-pow.html")}}</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code>Math.pow(<em>base</em>, <em>exponent</em>) </code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>base</code></dt> + <dd>基数</dd> + <dt><code>exponent</code></dt> + <dd>指数</dd> +</dl> + +<h2 id="Description" name="Description">描述</h2> + +<p>由于 <code>pow</code> 是 <code>Math</code> 的静态方法，所以应该像这样使用：<code>Math.pow()</code>，而不是作为你创建的 <code>Math</code> 对象的方法。</p> + +<h2 id="Examples" name="Examples">示例</h2> + +<h3 id="Example_Using_Math.pow" name="Example:_Using_Math.pow">使用 <code>Math.pow</code></h3> + +<pre class="brush:js">function raisePower(x,y) { + return Math.pow(x,y) +}</pre> + +<p>如果 <code>x</code> 是 2 ，且 <code>y</code> 是 7，则 raisePower 函数返回 128 （2 的 7 次幂）。</p> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范版本</th> + <th scope="col">规范状态</th> + <th scope="col">注解</th> + </tr> + <tr> + <td>ECMAScript 1st Edition. Implemented in JavaScript 1.0</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.8.2.13', 'Math.pow')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-math.pow', 'Math.pow')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{Compat("javascript.builtins.Math.pow")}}</p> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("Math.cbrt()")}}</li> + <li>{{jsxref("Math.exp()")}}</li> + <li>{{jsxref("Math.log()")}}</li> + <li>{{jsxref("Math.sqrt()")}}</li> + <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Arithmetic_Operators#Exponentiation" title="Arithmetic operators take numerical values (either literals or variables) as their operands and return a single numerical value. The standard arithmetic operators are addition (+), subtraction (-), multiplication (*), and division (/).">Exponentiation operator</a> {{experimental_inline}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/math/random/index.html b/files/zh-cn/web/javascript/reference/global_objects/math/random/index.html new file mode 100644 index 0000000000..46aad728b8 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/math/random/index.html @@ -0,0 +1,94 @@ +--- +title: Math.random() +slug: Web/JavaScript/Reference/Global_Objects/Math/random +tags: + - JavaScript + - Math + - Math.random() + - Method + - 随机数 +translation_of: Web/JavaScript/Reference/Global_Objects/Math/random +--- +<div>{{JSRef}}</div> + +<div><code><strong>Math.random()</strong></code> 函数返回一个浮点, 伪随机数在范围从<strong>0到</strong>小于<strong>1</strong>，也就是说，从0（包括0）往上，但是不包括1（排除1），然后您可以缩放到所需的范围。实现将初始种子选择到随机数生成算法;它不能被用户选择或重置。</div> + +<p>{{EmbedInteractiveExample("pages/js/math-random.html")}}</p> + +<div class="note"> +<p><code>Math.random()</code> <em>不能</em>提供像密码一样安全的随机数字。不要使用它们来处理有关安全的事情。使用Web Crypto API 来代替, 和更精确的{{domxref("RandomSource.getRandomValues()", "window.crypto.getRandomValues()")}} 方法.</p> +</div> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox notranslate"><code>Math.random()</code></pre> + +<h3 id="Parameters" name="Parameters">返回值</h3> + +<p>一个浮点型伪随机数字，在<code>0</code>（包括0）和<code>1</code>（不包括）之间。</p> + +<h2 id="Examples" name="Examples">示例</h2> + +<p>请注意, 由于 JavaScript 中的数字是 IEEE 754 浮点数字，具有最近舍入（ round-to-nearest-even）的行为, 因此以下函数的范围 (不包括<code>Math.random()</code> 本身) 并不准确。如果选择了非常大的边界 (2<sup>53</sup> 或更高), 在极罕见的情况下会计算通常-排除（usually-excluded）的上界。（注：round-to-nearest-even采用最近舍入的去偶数舍入的方式，对.5的舍入上，采用取偶数的方式）</p> + +<h3 id="得到一个大于等于0，小于1之间的随机数">得到一个大于等于0，小于1之间的随机数</h3> + +<pre class="brush: js notranslate">function getRandom() { + return Math.random(); +}</pre> + +<h3 id="得到一个两数之间的随机数">得到一个两数之间的随机数</h3> + +<p>这个例子返回了一个在指定值之间的随机数。这个值不小于 <code>min</code>（有可能等于），并且小于（不等于）<code>max</code>。</p> + +<pre class="brush: js notranslate">function getRandomArbitrary(min, max) { + return Math.random() * (max - min) + min; +} +</pre> + +<h3 id="得到一个两数之间的随机整数">得到一个两数之间的随机整数</h3> + +<p>这个例子返回了一个在指定值之间的随机整数。这个值不小于 <code>min</code> （如果 <code>min</code> 不是整数，则不小于 <code>min</code> 的向上取整数），且小于（不等于）<code>max</code>。</p> + +<pre class="brush: js line-numbers language-js notranslate"><code class="language-js"><span class="keyword token">function</span> <span class="function token">getRandomInt</span><span class="punctuation token">(</span>min<span class="punctuation token">,</span> max<span class="punctuation token">)</span> <span class="punctuation token">{</span> + min <span class="operator token">=</span> Math<span class="punctuation token">.</span><span class="function token">ceil</span><span class="punctuation token">(</span>min<span class="punctuation token">)</span><span class="punctuation token">;</span> + max <span class="operator token">=</span> Math<span class="punctuation token">.</span><span class="function token">floor</span><span class="punctuation token">(</span>max<span class="punctuation token">)</span><span class="punctuation token">;</span> + <span class="keyword token">return</span> Math<span class="punctuation token">.</span><span class="function token">floor</span><span class="punctuation token">(</span>Math<span class="punctuation token">.</span><span class="function token">random</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="operator token">*</span> <span class="punctuation token">(</span>max <span class="operator token">-</span> min<span class="punctuation token">)</span><span class="punctuation token">)</span> <span class="operator token">+</span> min<span class="punctuation token">;</span> </code>//不含最大值，含最小值<code class="language-js"> +<span class="punctuation token">}</span></code></pre> + +<div class="note"> +<p>也许很容易想到用 <code>Math.round()</code> 来实现，但是这会导致你的随机数处于一个不均匀的分布，这可能不符合你的需求。</p> +</div> + +<h3 id="得到一个两数之间的随机整数，包括两个数在内">得到一个两数之间的随机整数，包括两个数在内</h3> + +<p>上一个例子提到的函数 <code>getRandomInt()</code> 结果范围包含了最小值，但不含最大值。如果你的随机结果需要同时包含最小值和最大值，怎么办呢? <code>getRandomIntInclusive()</code> 函数可以实现。</p> + +<pre class="brush: js line-numbers language-js notranslate"><code class="language-js"><span class="keyword token">function</span> <span class="function token">getRandomIntInclusive</span><span class="punctuation token">(</span>min<span class="punctuation token">,</span> max<span class="punctuation token">)</span> <span class="punctuation token">{</span> + min <span class="operator token">=</span> Math<span class="punctuation token">.</span><span class="function token">ceil</span><span class="punctuation token">(</span>min<span class="punctuation token">)</span><span class="punctuation token">;</span> + max <span class="operator token">=</span> Math<span class="punctuation token">.</span><span class="function token">floor</span><span class="punctuation token">(</span>max<span class="punctuation token">)</span><span class="punctuation token">;</span> + <span class="keyword token">return</span> Math<span class="punctuation token">.</span><span class="function token">floor</span><span class="punctuation token">(</span>Math<span class="punctuation token">.</span><span class="function token">random</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="operator token">*</span> <span class="punctuation token">(</span>max <span class="operator token">-</span> min <span class="operator token">+</span> <span class="number token">1</span><span class="punctuation token">)</span><span class="punctuation token">)</span> <span class="operator token">+</span> min<span class="punctuation token">;</span> <span class="comment token">//含最大值，含最小值 </span> +<span class="punctuation token">}</span></code></pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范</th> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-math.random', 'Math.random')}}</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{Compat("javascript.builtins.Math.random")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/API/RandomSource/getRandomValues" title="The documentation about this has not yet been written; please consider contributing!"><code>window.crypto.getRandomValues()</code></a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/math/round/index.html b/files/zh-cn/web/javascript/reference/global_objects/math/round/index.html new file mode 100644 index 0000000000..c1fae674cc --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/math/round/index.html @@ -0,0 +1,356 @@ +--- +title: Math.round() +slug: Web/JavaScript/Reference/Global_Objects/Math/round +tags: + - Math.round() + - 四舍五入 +translation_of: Web/JavaScript/Reference/Global_Objects/Math/round +--- +<p>{{JSRef}}</p> + +<p><code><strong>Math.round()</strong></code> 函数返回一个数字四舍五入后最接近的整数。</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code>Math.round(<em>x</em>) </code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>x</code></dt> + <dd>一个数值。</dd> + <dt> + <h3 id="返回值">返回值</h3> + + <p>给定数字的值四舍五入到最接近的整数。</p> + </dt> +</dl> + +<h2 id="Description" name="Description">描述</h2> + +<p>如果参数的小数部分大于 0.5，则舍入到相邻的绝对值更大的整数。 如果参数的小数部分小于 0.5，则舍入到相邻的绝对值更小的整数。如果参数的小数部分恰好等于0.5，则舍入到相邻的在正无穷（+∞）方向上的整数。<strong>注意，与很多其他语言中的<code>round()函数</code>不同，<code>Math.round()并不总是舍入到远离0的方向（尤其是在负数的小数部分恰好等于0.5的情况下）。</code></strong></p> + +<p>因为 <code>round()</code> 是 <code>Math</code> 的静态方法，你应该直接使用 <code>Math.round()</code>，而不是作为你创建的 <code>Math</code> 对象的一个实例方法来使用（<code>Math</code>没有构造函数）。</p> + +<h2 id="Examples" name="Examples">示例</h2> + +<pre class="brush:js">x = Math.round(20.49); //20 +x = Math.round(20.5); //21 +x = Math.round(-20.5); //-20 +x = Math.round(-20.51); //-21 +</pre> + +<h3 id="Example:_Decimal_rounding" name="Example:_Decimal_rounding" style="line-height: 24px;">小数舍入</h3> + +<pre class="brush: js">// 闭包 +(function(){ + + /** + * Decimal adjustment of a number. + * + * @param {String} type The type of adjustment. + * @param {Number} value The number. + * @param {Integer} exp The exponent (the 10 logarithm of the adjustment base). + * @returns {Number} The adjusted value. + */ + function decimalAdjust(type, value, exp) { + // If the exp is undefined or zero... + if (typeof exp === 'undefined' || +exp === 0) { + return Math[type](value); + } + value = +value; + exp = +exp; + // If the value is not a number or the exp is not an integer... + if (isNaN(value) || !(typeof exp === 'number' && exp % 1 === 0)) { + return NaN; + } + // Shift + value = value.toString().split('e'); + value = Math[type](+(value[0] + 'e' + (value[1] ? (+value[1] - exp) : -exp))); + // Shift back + value = value.toString().split('e'); + return +(value[0] + 'e' + (value[1] ? (+value[1] + exp) : exp)); + } + + // Decimal round + if (!Math.round10) { + Math.round10 = function(value, exp) { + return decimalAdjust('round', value, exp); + }; + } + // Decimal floor + if (!Math.floor10) { + Math.floor10 = function(value, exp) { + return decimalAdjust('floor', value, exp); + }; + } + // Decimal ceil + if (!Math.ceil10) { + Math.ceil10 = function(value, exp) { + return decimalAdjust('ceil', value, exp); + }; + } + +})(); + +// Round +Math.round10(55.55, -1); // 55.6 +Math.round10(55.549, -1); // 55.5 +Math.round10(55, 1); // 60 +Math.round10(54.9, 1); // 50 +Math.round10(-55.55, -1); // -55.5 +Math.round10(-55.551, -1); // -55.6 +Math.round10(-55, 1); // -50 +Math.round10(-55.1, 1); // -60 +Math.round10(1.005, -2); // 1.01 -- compare this with Math.round(1.005*100)/100 above +// Floor +Math.floor10(55.59, -1); // 55.5 +Math.floor10(59, 1); // 50 +Math.floor10(-55.51, -1); // -55.6 +Math.floor10(-51, 1); // -60 +// Ceil +Math.ceil10(55.51, -1); // 55.6 +Math.ceil10(51, 1); // 60 +Math.ceil10(-55.59, -1); // -55.5 +Math.ceil10(-59, 1); // -50 +</pre> + +<p>或：</p> + +<pre class="brush: js">function round(number, precision) { + return Math.round(+number + 'e' + precision) / Math.pow(10, precision); + //same as: + //return Number(Math.round(+number + 'e' + precision) + 'e-' + precision); +} + +round(1.005, 2); //1.01 +</pre> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 0px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 19px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 38px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 57px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 76px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 95px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 114px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 133px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 152px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 171px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 190px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 209px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 228px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 247px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 266px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 285px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 304px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 323px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 342px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 361px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 380px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 399px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 418px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 437px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 456px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 475px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 494px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 513px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 532px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 551px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 570px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 589px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 608px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 627px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 646px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 665px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 684px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 703px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 722px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 741px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 760px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 779px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 798px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 817px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 836px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 855px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 874px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 893px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 912px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 931px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 950px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 969px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 988px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 1007px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 1026px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 1045px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 1064px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 1083px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 1102px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 1121px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 1140px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 1159px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 1178px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 1197px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 1216px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 1235px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 1254px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 1273px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 1292px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 1311px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 1330px; background: 0px 0px;"> </div> + +<h2 id="规范" style="margin-bottom: 20px; line-height: 30px;">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范版本</th> + <th scope="col">规范状态</th> + <th scope="col">注解</th> + </tr> + <tr> + <td>ECMAScript 1st Edition. Implemented in JavaScript 1.0.</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.8.2.15', 'Math.round')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-math.round', 'Math.round')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性" style="margin-bottom: 20px; line-height: 30px;">浏览器兼容性</h2> + +<div>{{CompatibilityTable}}</div> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th style="line-height: 16px;">Feature</th> + <th style="line-height: 16px;">Chrome</th> + <th style="line-height: 16px;">Firefox (Gecko)</th> + <th style="line-height: 16px;">Internet Explorer</th> + <th style="line-height: 16px;">Opera</th> + <th style="line-height: 16px;">Safari (WebKit)</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th style="line-height: 16px;">Feature</th> + <th style="line-height: 16px;">Android</th> + <th style="line-height: 16px;">Firefox Mobile (Gecko)</th> + <th style="line-height: 16px;">IE Phone</th> + <th style="line-height: 16px;">Opera Mobile</th> + <th style="line-height: 16px;">Safari Mobile</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="See_also" name="See_also" style="margin-bottom: 20px; line-height: 30px;">相关链接</h2> + +<p></p> + +<ul> + <li>{{jsxref("Math.abs()")}}</li> + <li>{{jsxref("Math.ceil()")}}</li> + <li>{{jsxref("Math.floor()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/math/sign/index.html b/files/zh-cn/web/javascript/reference/global_objects/math/sign/index.html new file mode 100644 index 0000000000..ca7678c9f0 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/math/sign/index.html @@ -0,0 +1,152 @@ +--- +title: Math.sign() +slug: Web/JavaScript/Reference/Global_Objects/Math/sign +tags: + - JavaScript + - Math + - Math.sign() +translation_of: Web/JavaScript/Reference/Global_Objects/Math/sign +--- +<div>{{JSRef}}</div> + +<div> </div> + +<p><strong><code>Math.sign()</code></strong> 函数返回一个数字的符号, 指示数字是正数，负数还是零。</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code>Math.sign(<em>x</em>);</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>x</code></dt> + <dd>任意数字.</dd> +</dl> + +<h2 id="Description" name="Description">描述</h2> + +<p>因为 <code>sign </code>是 <code>Math </code>的一个静态方法，所以你应该使用 Math.sign() ，而不是作为你创建的一个Math对象的一种方法 （Math不是一个构造函数）。</p> + +<p>而不是作为您创建的Math对象的一种方法（Math不是构造函数）。</p> + +<p>此函数共有5种返回值, 分别是<strong> 1, -1, 0, -0, NaN.</strong> 代表的各是<strong>正数, 负数, 正零, 负零, NaN</strong>。</p> + +<p>传入该函数的参数会被<strong>隐式转换</strong>成数字类型。</p> + +<h2 id="Examples" name="Examples">示例</h2> + +<h3 id="使用Math.sign()">使用Math.sign()</h3> + +<pre class="brush:js">Math.sign(3); // 1 +Math.sign(-3); // -1 +Math.sign("-3"); // -1 +Math.sign(0); // 0 +Math.sign(-0); // -0 +Math.sign(NaN); // NaN +Math.sign("foo"); // NaN +Math.sign(); // NaN +</pre> + +<h2 id="Compatibility" name="Compatibility">Polyfill</h2> + +<pre class="brush: js language-js"><code class="language-js"><span class="keyword token">function</span> <span class="function token">sign<span class="punctuation token">(</span></span>x<span class="punctuation token">)</span> <span class="punctuation token">{</span> + x <span class="operator token">=</span> <span class="operator token">+</span>x<span class="comment token"> ;// convert to a number +</span> <span class="keyword token">if</span> <span class="punctuation token">(</span>x <span class="operator token">===</span> <span class="number token">0</span> <span class="operator token">||</span> <span class="function token">isNaN<span class="punctuation token">(</span></span>x<span class="punctuation token">)</span><span class="punctuation token">)</span> + <span class="keyword token">return</span> x; + <span class="keyword token">return</span> x <span class="operator token">></span> <span class="number token">0</span> <span class="operator token">?</span> <span class="number token">1</span> <span class="punctuation token">:</span> <span class="operator token">-</span><span class="number token">1;</span> +<span class="punctuation token">}</span></code></pre> + +<p> </p> + +<pre><code>if (!Math.sign) { + Math.sign = function(x) { + // If x is NaN, the result is NaN. + // If x is -0, the result is -0. + // If x is +0, the result is +0. + // If x is negative and not -0, the result is -1. + // If x is positive and not +0, the result is +1. + x = +x; // convert to a number + if (x === 0 || isNaN(x)) { + return Number(x); + } + return x > 0 ? 1 : -1; + }; +}</code></pre> + +<p> </p> + +<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('ES6', '#sec-math.sign', 'Math.sign')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{ CompatibilityTable() }}</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>38</td> + <td>{{CompatGeckoDesktop("25")}}</td> + <td>{{CompatNo}}</td> + <td>25</td> + <td>{{CompatNo}}</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>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatGeckoMobile("25")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("Global_Objects/Math", "Math")}} 对象</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/math/sin/index.html b/files/zh-cn/web/javascript/reference/global_objects/math/sin/index.html new file mode 100644 index 0000000000..989c5af7e5 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/math/sin/index.html @@ -0,0 +1,80 @@ +--- +title: Math.sin() +slug: Web/JavaScript/Reference/Global_Objects/Math/sin +translation_of: Web/JavaScript/Reference/Global_Objects/Math/sin +--- +<div>{{JSRef("Global_Objects", "Math")}}</div> + +<h2 id="Summary" name="Summary">概述</h2> + +<p><code><strong>Math.sin()</strong></code> 函数返回一个数值的正弦值。</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox notranslate">Math.sin(<em>x</em>)</pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>x</code></dt> + <dd>一个数值（以弧度为单位）。</dd> +</dl> + +<h2 id="Description" name="Description">描述</h2> + +<p><code>sin</code> 方法返回一个 -1 到 1 之间的数值，表示给定角度（单位：弧度）的正弦值。</p> + +<p>由于 <code>sin</code> 是 <code>Math</code> 的静态方法，所以应该像这样使用：<code>Math.sin()</code>，而不是作为你创建的 <code>Math</code> 实例的方法。</p> + +<h2 id="Examples" name="Examples">示例</h2> + +<h3 id="Example_Using_Math.sin" name="Example:_Using_Math.sin">例子：使用 <code>Math.sin</code></h3> + +<pre class="brush:js notranslate">Math.sin(0); // 0 +Math.sin(1); // 0.8414709848078965 + +Math.sin(Math.PI / 2); // 1</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>ECMAScript 1st Edition. Implemented in JavaScript 1.0</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.8.2.16', 'Math.sin')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-math.sin', 'Math.sin')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{ Compat("javascript.builtins.Math.sin") }}</p> + +<div id="compat-desktop"></div> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("Math.acos()")}}</li> + <li>{{jsxref("Math.asin()")}}</li> + <li>{{jsxref("Math.atan()")}}</li> + <li>{{jsxref("Math.atan2()")}}</li> + <li>{{jsxref("Math.cos()")}}</li> + <li>{{jsxref("Math.tan()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/math/sinh/index.html b/files/zh-cn/web/javascript/reference/global_objects/math/sinh/index.html new file mode 100644 index 0000000000..c9f0d376f9 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/math/sinh/index.html @@ -0,0 +1,123 @@ +--- +title: Math.sinh() +slug: Web/JavaScript/Reference/Global_Objects/Math/sinh +translation_of: Web/JavaScript/Reference/Global_Objects/Math/sinh +--- +<div>{{JSRef("Global_Objects", "Math")}}</div> + +<h2 id="Summary" name="Summary">概述</h2> + +<p> <code><strong>Math.sinh()</strong></code> 函数返回一个数字(单位为角度)的双曲正弦值.</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox notranslate">Math.sinh(<em>x</em>)</pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>x</code></dt> + <dd>任意数字 (单位为度).</dd> +</dl> + +<h2 id="Description" name="Description">描述</h2> + +<p>双曲正弦的图像如下:</p> + +<p><img alt="" src="http://upload.wikimedia.org/wikipedia/commons/1/17/Sinh.png" style="height: 300px; width: 300px;"></p> + +<h2 id="Examples" name="Examples">示例</h2> + +<pre class="brush:js notranslate">Math.sinh(0) // 0 +Math.sinh(1) // 1.1752011936438014 +Math.sinh("-1") // -1.1752011936438014 +Math.sinh("foo") // NaN +</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('ES6', '#sec-math.sinh', 'Math.sinh')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial defintion</td> + </tr> + </tbody> +</table> + +<h2 id="Polyfill">Polyfill</h2> + +<p>该函数可以使用 {{jsxref("Math.exp()")}}<code> 函数来实现</code>:</p> + +<pre class="brush: js language-js notranslate">function sinh(x){ + return (Math.exp(x) - Math.exp(-x)) / 2; +}</pre> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{ CompatibilityTable() }}</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>{{CompatNo}}</td> + <td>{{CompatGeckoDesktop("25")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</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>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatGeckoMobile("25")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("Math.acos()")}}</li> + <li>{{jsxref("Math.asin()")}}</li> + <li>{{jsxref("Math.atan()")}}</li> + <li>{{jsxref("Math.atan2()")}}</li> + <li>{{jsxref("Math.cos()")}}</li> + <li>{{jsxref("Math.tan()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/math/sqrt/index.html b/files/zh-cn/web/javascript/reference/global_objects/math/sqrt/index.html new file mode 100644 index 0000000000..badb08802a --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/math/sqrt/index.html @@ -0,0 +1,81 @@ +--- +title: Math.sqrt() +slug: Web/JavaScript/Reference/Global_Objects/Math/sqrt +translation_of: Web/JavaScript/Reference/Global_Objects/Math/sqrt +--- +<div>{{JSRef}}</div> + +<p><code><strong>Math.sqrt()</strong></code> 函数返回一个数的平方根，即：</p> + +<p><math display="block"><semantics><mrow><mo>∀</mo><mi>x</mi><mo>≥</mo><mn>0</mn><mo>,</mo><mstyle mathvariant="monospace"><mrow><mi>M</mi><mi>a</mi><mi>t</mi><mi>h</mi><mo>.</mo><mi>s</mi><mi>q</mi><mi>r</mi><mi>t</mi><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo></mrow></mstyle><mo>=</mo><msqrt><mi>x</mi></msqrt><mo>=</mo><mtext>the unique</mtext><mspace width="thickmathspace"></mspace><mi>y</mi><mo>≥</mo><mn>0</mn><mspace width="thickmathspace"></mspace><mtext>such that</mtext><mspace width="thickmathspace"></mspace><msup><mi>y</mi><mn>2</mn></msup><mo>=</mo><mi>x</mi></mrow><annotation encoding="TeX">\forall x \geq 0, \mathtt{Math.sqrt(x)} = \sqrt{x} = \text{the unique} \; y \geq 0 \; \text{such that} \; y^2 = x</annotation></semantics></math></p> + +<p>{{EmbedInteractiveExample("pages/js/math-sqrt.html")}}</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code>Math.sqrt(<em>x</em>) </code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>x</code></dt> + <dd>一个数值</dd> +</dl> + +<h2 id="Description" name="Description">描述</h2> + +<p>如果参数 <code>number</code> 为负值，则 <code>sqrt</code> 返回{{jsxref("NaN")}}。</p> + +<p>由于 <code>sqrt</code> 是 <code>Math</code> 的静态方法，所以应该像这样使用：<code>Math.sqrt()</code>，而不是作为你创建的 <code>Math</code> 实例的方法。</p> + +<h2 id="Examples" name="Examples">示例</h2> + +<h3 id="Example_Using_Math.sqrt" name="Example:_Using_Math.sqrt">使用 <code>Math.sqrt</code></h3> + +<pre><code>Math.sqrt(9); // 3 +Math.sqrt(2); // 1.414213562373095 + +Math.sqrt(1); // 1 +Math.sqrt(0); // 0 +Math.sqrt(-1); // NaN +Math.sqrt(-0); // -0</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>ECMAScript 1st Edition. Implemented in JavaScript 1.0</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.8.2.17', 'Math.sqrt')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-math.sqrt', 'Math.sqrt')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{Compat("javascript.builtins.Math.sqrt")}}</p> + +<h2 id="参见">参见</h2> + +<ul> + <li>{{jsxref("Math.cbrt()")}}</li> + <li>{{jsxref("Math.exp()")}}</li> + <li>{{jsxref("Math.log()")}}</li> + <li>{{jsxref("Math.pow()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/math/sqrt1_2/index.html b/files/zh-cn/web/javascript/reference/global_objects/math/sqrt1_2/index.html new file mode 100644 index 0000000000..47e0557901 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/math/sqrt1_2/index.html @@ -0,0 +1,100 @@ +--- +title: Math.SQRT1_2 +slug: Web/JavaScript/Reference/Global_Objects/Math/SQRT1_2 +translation_of: Web/JavaScript/Reference/Global_Objects/Math/SQRT1_2 +--- +<div> + {{JSRef("Global_Objects", "Math")}}</div> +<h2 id="Summary" name="Summary">概述</h2> +<p><code><strong>Math.SQRT1_2</strong></code> 属性表示 1/2 的平方根，约为 0.707：</p> +<p><math display="block"><semantics><mrow><mstyle mathvariant="monospace"><mi>Math.SQRT1_2</mi></mstyle><mo>=</mo><msqrt><mfrac><mn>1</mn><mn>2</mn></mfrac></msqrt><mo>=</mo><mfrac><mn>1</mn><msqrt><mn>2</mn></msqrt></mfrac><mo>≈</mo><mn>0.707</mn></mrow><annotation encoding="TeX">\mathtt{\mi{Math.SQRT1_2}} = \sqrt{\frac{1}{2}} = \frac{1}{\sqrt{2}} \approx 0.707</annotation></semantics></math></p> +<div> + {{js_property_attributes(0,0,0)}}</div> +<h2 id="Description" name="Description">描述</h2> +<p>由于 <code>SQRT1_2</code> 是 <code>Math</code> 对象的静态属性，所以应该像这样使用：<code>Math.SQRT1_2</code>，而不是作为你创建的 <code>Math</code> 实例的属性（<code>Math</code> 不是构造函数）。</p> +<h2 id="Examples" name="Examples">示例</h2> +<h3 id="Example:_Using_SQRT1_2" name="Example:_Using_SQRT1_2">例子：使用 <code>SQRT1_2</code></h3> +<p>下面的函数返回 1/2 的平方根：</p> +<pre class="brush:js">function getRoot1_2() { + return Math.SQRT1_2 +} + +getRoot1_2() // 0.7071067811865476</pre> +<p></p> +<h2 id="规范">规范</h2> +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范版本</th> + <th scope="col">规范状态</th> + <th scope="col">注解</th> + </tr> + <tr> + <td>ECMAScript 1st Edition. Implemented in JavaScript 1.0</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.8.1.7', 'Math.SQRT1_2')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-math.sqrt1_2', 'Math.SQRT1_2')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> +<h2 id="浏览器兼容性">浏览器兼容性</h2> +<p>{{ CompatibilityTable() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> + </table> +</div> +<h2 id="See_also" name="See_also">相关链接</h2> +<ul> + <li>The {{jsxref("Global_Objects/Math", "Math")}} object it belongs to.</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/math/sqrt2/index.html b/files/zh-cn/web/javascript/reference/global_objects/math/sqrt2/index.html new file mode 100644 index 0000000000..a9eb2ddcd4 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/math/sqrt2/index.html @@ -0,0 +1,96 @@ +--- +title: Math.SQRT2 +slug: Web/JavaScript/Reference/Global_Objects/Math/SQRT2 +translation_of: Web/JavaScript/Reference/Global_Objects/Math/SQRT2 +--- +<p>{{JSRef("Global_Objects", "Math")}}</p> +<h2 id="Summary" name="Summary">概述</h2> +<p><code><strong>Math.SQRT2</strong></code> 属性表示 2 的平方根，约为 1.414：</p> +<h2 id="Description" name="Description">描述</h2> +<p>由于 <code>SQRT2</code> 是 <code>Math</code> 的静态属性，所以应该像这样使用：<code>Math.SQRT2</code>，而不是作为你创建的 <code>Math</code> 实例的属性（<code>Math</code> 不是构造函数）。</p> +<h2 id="Examples" name="Examples">示例</h2> +<h3 id="Example:_Using_Math.SQRT2" name="Example:_Using_Math.SQRT2">例子：使用 <code>Math.SQRT2</code></h3> +<p>下面的函数返回 2 的平方根：</p> +<pre class="brush:js">function getRoot2() { + return Math.SQRT2; +} + +getRoot2(); // 1.4142135623730951</pre> +<h2 id="规范" style="margin-bottom: 20px; line-height: 30px;">规范</h2> +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范版本</th> + <th scope="col">规范状态</th> + <th scope="col">注解</th> + </tr> + <tr> + <td>ECMAScript 1st Edition. Implemented in JavaScript 1.0</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.8.1.8', 'Math.SQRT2')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-math.sqrt2', 'Math.SQRT2')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> +<h2 id="浏览器兼容性" style="margin-bottom: 20px; line-height: 30px;">浏览器兼容性</h2> +<p>{{ CompatibilityTable() }}</p> +<div id="compat-desktop"> + <table class="compat-table"> + <tbody> + <tr> + <th style="line-height: 16px;">Feature</th> + <th style="line-height: 16px;">Chrome</th> + <th style="line-height: 16px;">Firefox (Gecko)</th> + <th style="line-height: 16px;">Internet Explorer</th> + <th style="line-height: 16px;">Opera</th> + <th style="line-height: 16px;">Safari</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> + </table> +</div> +<div id="compat-mobile"> + <table class="compat-table"> + <tbody> + <tr> + <th style="line-height: 16px;">Feature</th> + <th style="line-height: 16px;">Android</th> + <th style="line-height: 16px;">Chrome for Android</th> + <th style="line-height: 16px;">Firefox Mobile (Gecko)</th> + <th style="line-height: 16px;">IE Mobile</th> + <th style="line-height: 16px;">Opera Mobile</th> + <th style="line-height: 16px;">Safari Mobile</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> + </table> +</div> +<h2 id="See_also" name="See_also" style="margin-bottom: 20px; line-height: 30px;">相关链接</h2> +<ul> + <li>The {{jsxref("Global_Objects/Math", "Math")}} object it belongs to.</li> +</ul> +<p></p> diff --git a/files/zh-cn/web/javascript/reference/global_objects/math/tan/index.html b/files/zh-cn/web/javascript/reference/global_objects/math/tan/index.html new file mode 100644 index 0000000000..9e2464d76e --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/math/tan/index.html @@ -0,0 +1,107 @@ +--- +title: Math.tan() +slug: Web/JavaScript/Reference/Global_Objects/Math/tan +translation_of: Web/JavaScript/Reference/Global_Objects/Math/tan +--- +<div> + {{JSRef("Global_Objects", "Math")}}</div> +<h2 id="Summary" name="Summary">概述</h2> +<p><code><strong>Math.tan()</strong></code> 方法返回一个数值的正切值。</p> +<h2 id="Syntax" name="Syntax">语法</h2> +<pre class="syntaxbox">Math.tan(<em>x</em>)</pre> +<h3 id="Parameters" name="Parameters">参数</h3> +<dl> + <dt> + <code>x</code></dt> + <dd> + 一个数值，表示一个角（单位：弧度）。</dd> +</dl> +<h2 id="Description" name="Description">描述</h2> +<p><code>tan</code> 方法返回一个数值，表示一个角的正切值。</p> +<p>由于 <code>tan</code> 是 <code>Math</code> 的静态方法，所以应该像这样使用 <code>Math.tan()</code>，而不是作为你创建的 <code>Math</code> 实例的方法。</p> +<h2 id="Examples" name="Examples">示例</h2> +<h3 id="Example:_Using_Math.tan" name="Example:_Using_Math.tan">例子：使用 <code>Math.tan</code></h3> +<p>下面的函数返回变量 <code>x</code> 的正切值：</p> +<pre class="brush:js">function getTan(x) { + return Math.tan(x); +}</pre> +<p>由于 <code>Math.tan()</code> 函数接受弧度数值，但是通常使用度更方便，下面的函数可以接受以度为单位的数值，将其转为弧度，然后返回其正切值。</p> +<pre class="brush:js">function getTanDeg(deg) { + var rad = deg * Math.PI/180; + return Math.tan(rad); +} +</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>ECMAScript 1st Edition. Implemented in JavaScript 1.0</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.8.2.18', 'Math.tan')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-math.tan', 'Math.tan')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> +<h2 id="浏览器兼容性">浏览器兼容性</h2> +<p>{{ CompatibilityTable() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> + </table> +</div> +<p> </p> diff --git a/files/zh-cn/web/javascript/reference/global_objects/math/tanh/index.html b/files/zh-cn/web/javascript/reference/global_objects/math/tanh/index.html new file mode 100644 index 0000000000..9a3eb0f21d --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/math/tanh/index.html @@ -0,0 +1,85 @@ +--- +title: Math.tanh() +slug: Web/JavaScript/Reference/Global_Objects/Math/tanh +tags: + - ECMAScript6 + - JavaScript + - Math + - Method + - tanh + - 双曲正切 +translation_of: Web/JavaScript/Reference/Global_Objects/Math/tanh +--- +<div>{{JSRef}}</div> + +<p><strong><code>Math.tanh()</code></strong> 函数将会返回一个数的双曲正切函数值，公式如下：</p> + +<p><math display="block"><semantics><mrow><mo lspace="0em" rspace="0em">tanh</mo><mi>x</mi><mo>=</mo><mfrac><mrow><mo lspace="0em" rspace="0em">sinh</mo><mi>x</mi></mrow><mrow><mo lspace="0em" rspace="0em">cosh</mo><mi>x</mi></mrow></mfrac><mo>=</mo><mfrac><mrow><msup><mi>e</mi><mi>x</mi></msup><mo>-</mo><msup><mi>e</mi><mrow><mo>-</mo><mi>x</mi></mrow></msup></mrow><mrow><msup><mi>e</mi><mi>x</mi></msup><mo>+</mo><msup><mi>e</mi><mrow><mo>-</mo><mi>x</mi></mrow></msup></mrow></mfrac><mo>=</mo><mfrac><mrow><msup><mi>e</mi><mrow><mn>2</mn><mi>x</mi></mrow></msup><mo>-</mo><mn>1</mn></mrow><mrow><msup><mi>e</mi><mrow><mn>2</mn><mi>x</mi></mrow></msup><mo>+</mo><mn>1</mn></mrow></mfrac></mrow><annotation encoding="TeX">\tanh x = \frac{\sinh x}{\cosh x} = \frac {e^x - e^{-x}} {e^x + e^{-x}} = \frac{e^{2x} - 1}{e^{2x}+1}</annotation></semantics></math></p> + +<div>{{EmbedInteractiveExample("pages/js/math-tanh.html")}}</div> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code>Math.tanh(<var>x</var>)</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>x</code></dt> + <dd>待计算的数字。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>所给数字的双曲正切值。</p> + +<h2 id="描述">描述</h2> + +<p>因为 <code>tanh()</code> 是 <code>Math</code> 的静态方法，所以总应该直接调用 <code>Math.tanh()</code> ，而不是创建 <code>Math</code> 对象再调用该方法（<code>Math</code> 不是一个构造函数）。</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用_Math.tanh">使用 <code>Math.tanh()</code></h3> + +<pre class="brush: js">Math.tanh(0); // 0 +Math.tanh(Infinity); // 1 +Math.tanh(1); // 0.7615941559557649 +</pre> + +<h2 id="向下兼容">向下兼容</h2> + +<p><code>tanh()</code> 可以通过 {{jsxref("Math.exp()")}} 函数实现：</p> + +<pre class="brush: js">Math.tanh = Math.tanh || function(x){ + var a = Math.exp(+x), b = Math.exp(-x); + return a == Infinity ? 1 : b == Infinity ? -1 : (a - b) / (a + b); +}</pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范</th> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-math.tanh', 'Math.tanh')}}</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Math.tanh")}}</p> + +<h2 id="参见">参见</h2> + +<ul> + <li>{{jsxref("Math.acosh()")}}</li> + <li>{{jsxref("Math.asinh()")}}</li> + <li>{{jsxref("Math.atanh()")}}</li> + <li>{{jsxref("Math.cosh()")}}</li> + <li>{{jsxref("Math.sinh()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/math/trunc/index.html b/files/zh-cn/web/javascript/reference/global_objects/math/trunc/index.html new file mode 100644 index 0000000000..f260b85c58 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/math/trunc/index.html @@ -0,0 +1,116 @@ +--- +title: Math.trunc() +slug: Web/JavaScript/Reference/Global_Objects/Math/trunc +tags: + - ECMAScript 2015 + - JavaScript + - Math + - Method +translation_of: Web/JavaScript/Reference/Global_Objects/Math/trunc +--- +<div>{{JSRef}}</div> + +<p><code><strong>Math.trunc()</strong></code> 方法会将数字的小数部分去掉，只保留整数部分。</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox">Math.trunc(<em>value</em>)</pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>value</code></dt> + <dd>任意数字</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>给定数字的整数部分</p> + +<h2 id="Description" name="Description">描述</h2> + +<p>不像 <code>Math</code> 的其他三个方法： {{jsxref("Math.floor()")}}、{{jsxref("Math.ceil()")}}、{{jsxref("Math.round()")}} ，<code>Math.trunc()</code> 的执行逻辑很简单，仅仅是<strong>删除</strong>掉数字的小数部分和小数点，不管参数是正数还是负数。</p> + +<p>传入该方法的参数会被隐式转换成数字类型。</p> + +<p>因为 <code>trunc()</code> 是 <code>Math</code> 对象的静态方法，你必须用 <code>Math.trunc()</code> 来使用，而不是调用你创建的 <code>Math</code> 对象的一个实例方法（<code>Math</code> 没有构造函数）</p> + +<h2 id="Examples" name="Examples">示例</h2> + +<pre class="brush:js">Math.trunc(13.37) // 13 +Math.trunc(42.84) // 42 +Math.trunc(0.123) // 0 +Math.trunc(-0.123) // -0 +Math.trunc("-1.123") // -1 +Math.trunc(NaN) // NaN +Math.trunc("foo") // NaN +Math.trunc() // NaN</pre> + +<h2 id="Polyfill">Polyfill</h2> + +<pre><code>if (!Math.trunc) { + Math.trunc = function(v) { + v = +v; + if (!isFinite(v)) return v; + + return (v - v % 1) || (v < 0 ? -0 : v === 0 ? v : 0); + + // 返回: + // 0 -> 0 + // -0 -> -0 + // 0.2 -> 0 + // -0.2 -> -0 + // 0.7 -> 0 + // -0.7 -> -0 + // Infinity -> Infinity + // -Infinity -> -Infinity + // NaN -> NaN + // null -> 0 + }; +}</code> +</pre> + +<p>或:</p> + +<pre><code>if (!Math.trunc) { + Math.trunc = function(v) { + v = +v; + return (v - v % 1) || (!isFinite(v) || v === 0 ? v : v < 0 ? -0 : 0); + }; +}</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>{{SpecName('ES2015', '#sec-math.trunc', 'Math.trunc')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-math.trunc', 'Math.trunc')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{Compat("javascript.builtins.Math.trunc")}}</p> + +<p><strong style="color: #4d4e53; font-size: 2.14286rem; font-weight: 700; letter-spacing: -1px;">相关链接</strong></p> + +<ul> + <li>{{jsxref("Math.abs()")}}</li> + <li>{{jsxref("Math.ceil()")}}</li> + <li>{{jsxref("Math.floor()")}}</li> + <li>{{jsxref("Math.round()")}}</li> + <li>{{jsxref("Math.sign()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/math/反双曲余弦值/index.html b/files/zh-cn/web/javascript/reference/global_objects/math/反双曲余弦值/index.html new file mode 100644 index 0000000000..7869661836 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/math/反双曲余弦值/index.html @@ -0,0 +1,91 @@ +--- +title: Math.acosh() +slug: Web/JavaScript/Reference/Global_Objects/Math/反双曲余弦值 +tags: + - JavaScript + - 双曲函数 + - 数学 + - 方法 +translation_of: Web/JavaScript/Reference/Global_Objects/Math/acosh +--- +<div>{{JSRef}}</div> + +<p><strong><code>Math.acosh()</code> </strong>函数返回一个数的反双曲余弦值，即：</p> + +<p><math display="block"><semantics><mrow><mo>∀</mo><mi>x</mi><mo>≥</mo><mn>1</mn><mo>,</mo><mstyle mathvariant="monospace"><mrow><mo lspace="0em" rspace="thinmathspace">Math.acosh</mo><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo></mrow></mstyle><mo>=</mo><mo lspace="0em" rspace="thinmathspace">arcosh</mo><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo><mo>=</mo><mtext> the unique </mtext><mspace width="thickmathspace"></mspace><mi>y</mi><mo>≥</mo><mn>0</mn><mspace width="thickmathspace"></mspace><mtext>such that</mtext><mspace width="thickmathspace"></mspace><mo lspace="0em" rspace="0em">cosh</mo><mo stretchy="false">(</mo><mi>y</mi><mo stretchy="false">)</mo><mo>=</mo><mi>x</mi></mrow><annotation encoding="TeX">\forall x \geq 1, \mathtt{\operatorname{Math.acosh}(x)} = \operatorname{arcosh}(x) = \text{ 唯一的} \; y \geq 0 \; \text{使得} \; \cosh(y) = x</annotation></semantics></math></p> + +<div>{{EmbedInteractiveExample("pages/js/math-acosh.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code>Math.acosh(<var>x</var>)</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>x</code></dt> + <dd>一个数字。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>返回给定数的反双曲余弦值，如果该数小于 <strong>1</strong> 则返回 {{jsxref("NaN")}}。</p> + +<h2 id="描述">描述</h2> + +<p>因为 <code>acosh()</code> 是 <code>Math</code> 的静态方法，所以总应该直接调用 <code>Math.acosh()</code> ，而不是创建 <code>Math</code> 对象再调用该方法（<code>Math</code> 不是一个构造函数）。</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用_Math.acosh">使用 <code>Math.acosh()</code></h3> + +<pre class="brush: js">Math.acosh(-1); // NaN +Math.acosh(0); // NaN +Math.acosh(0.5); // NaN +Math.acosh(1); // 0 +Math.acosh(2); // 1.3169578969248166 +</pre> + +<p>当参数小于1时， <code>Math.acosh()</code>将返回 {{jsxref("NaN")}}。</p> + +<h2 id="向下兼容">向下兼容</h2> + +<p>当 <math><semantics><mrow><mi>x</mi><mo>≥</mo><mn>1</mn></mrow><annotation encoding="TeX">x \geq 1</annotation></semantics></math> 时，都有 <math><semantics><mrow><mo lspace="0em" rspace="thinmathspace">arcosh</mo><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo><mo>=</mo><mo lspace="0em" rspace="0em">ln</mo><mrow><mo>(</mo><mrow><mi>x</mi><mo>+</mo><msqrt><mrow><msup><mi>x</mi><mn>2</mn></msup><mo>-</mo><mn>1</mn></mrow></msqrt></mrow><mo>)</mo></mrow></mrow><annotation encoding="TeX">\operatorname {arcosh} (x) = \ln \left(x + \sqrt{x^{2} - 1} \right)</annotation></semantics></math> ，因此可以使用以下函数实现：</p> + +<pre class="brush: js">Math.acosh = Math.acosh || function(x) { + return Math.log(x + Math.sqrt(x * x - 1)); +}; +</pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Specification</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-math.acosh', 'Math.acosh')}}</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Math.acosh")}}</p> + +<h2 id="参见">参见</h2> + +<ul> + <li>{{jsxref("Math.asinh()")}}</li> + <li>{{jsxref("Math.atanh()")}}</li> + <li>{{jsxref("Math.cosh()")}}</li> + <li>{{jsxref("Math.sinh()")}}</li> + <li>{{jsxref("Math.tanh()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/nan/index.html b/files/zh-cn/web/javascript/reference/global_objects/nan/index.html new file mode 100644 index 0000000000..777e6a15ce --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/nan/index.html @@ -0,0 +1,68 @@ +--- +title: NaN +slug: Web/JavaScript/Reference/Global_Objects/NaN +tags: + - NaN +translation_of: Web/JavaScript/Reference/Global_Objects/NaN +--- +<div>{{jsSidebar("Objects")}}</div> + +<p>全局属性 <strong><code>NaN</code></strong> 的值表示不是一个数字（Not-A-Number）。</p> + +<p>{{js_property_attributes(0,0,0)}}</p> + +<div>{{EmbedInteractiveExample("pages/js/globalprops-nan.html")}}</div> + +<h2 id="Description" name="Description">描述</h2> + +<p><code>NaN</code> 是一个<em>全局对象</em>的属性。</p> + +<p><font face="monospace">NaN </font>属性的初始值就是 NaN，和 {{jsxref("Number.NaN")}} 的值一样。在现代浏览器中（ES5中）， <code>NaN</code> 属性是一个不可配置（non-configurable），不可写（non-writable）的属性。但在ES3中，这个属性的值是可以被更改的，但是也应该避免覆盖。</p> + +<p>编码中很少直接使用<code>到 NaN</code>。通常都是在计算失败时，作为 Math 的某个方法的返回值出现的（例如：<code>Math.sqrt(-1)</code>）或者尝试将一个字符串解析成数字但失败了的时候（例如：<code>parseInt("blabla")</code>）。</p> + +<h3 id="判断一个值是否是NaN">判断一个值是否是<code>NaN</code></h3> + +<p><code>NaN</code>如果通过 <code>==</code> 、 <code>!=</code> 、 <code>===</code> 、以及 <code>!==</code>与其他任何值比较都将不相等 -- 包括与其他 NAN值进行比较。必须使用 {{jsxref("Number.isNaN()")}} 或 {{jsxref("Global_Objects/isNaN", "isNaN()")}} 函数。在执行自比较之中：NaN，也只有NaN，比较之中不等于它自己。</p> + +<pre class="brush: js">NaN === NaN; // false +Number.NaN === NaN; // false +isNaN(NaN); // true +isNaN(Number.NaN); // true + +function valueIsNaN(v) { return v !== v; } +valueIsNaN(1); // false +valueIsNaN(NaN); // true +valueIsNaN(Number.NaN); // true</pre> + +<p>但是，请注意isNaN（）和Number.isNaN（）之间的区别：如果当前值是NaN，或者将其强制转换为数字后将是NaN，则前者将返回true。而后者仅当值当前为NaN时才为true：</p> + +<pre><code>isNaN('hello world'); // true +Number.isNaN('hello world'); // false</code></pre> + +<h2 id="规范" style="margin-bottom: 20px; line-height: 30px;">规范</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">规范</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-value-properties-of-the-global-object-nan', 'NaN')}}</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性" style="margin-bottom: 20px; line-height: 30px;">浏览器兼容性</h2> + +<p>{{Compat("javascript.builtins.NaN")}}</p> + +<h2 id="See_also" name="See_also" style="margin-bottom: 20px; line-height: 30px;">相关链接</h2> + +<ul> + <li>{{jsxref("Number.NaN")}}</li> + <li>{{jsxref("Number.isNaN()")}}</li> + <li>{{jsxref("isNaN", "isNaN()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/null/index.html b/files/zh-cn/web/javascript/reference/global_objects/null/index.html new file mode 100644 index 0000000000..b2c434ace0 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/null/index.html @@ -0,0 +1,93 @@ +--- +title: 'null' +slug: Web/JavaScript/Reference/Global_Objects/null +tags: + - JavaScript + - Literal + - Primitive +translation_of: Web/JavaScript/Reference/Global_Objects/null +--- +<div>{{jsSidebar("Objects")}}</div> + +<p>值 <code>null</code> 特指对象的值未设置。它是 JavaScript {{Glossary("Primitive", "基本类型")}} 之一，在布尔运算中被认为是<a href="https://developer.mozilla.org/en-US/docs/Glossary/Falsy">falsy</a>。</p> + +<div>{{EmbedInteractiveExample("pages/js/globalprops-null.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">null</pre> + +<h2 id="描述">描述</h2> + +<p>值 <code>null</code> 是一个字面量，不像 {{jsxref("Global_Objects/undefined","undefined")}}，它不是全局对象的一个属性。<code>null</code> 是表示缺少的标识，指示变量未指向任何对象。把 <code>null</code> 作为尚未创建的对象，也许更好理解。在 API 中，<code>null</code> 常在返回类型应是一个对象，但没有关联的值的地方使用。</p> + +<pre class="brush: js">// foo 不存在，它从来没有被定义过或者是初始化过： +foo; +"ReferenceError: foo is not defined" + +// foo 现在已经是知存在的，但是它没有类型或者是值： +var foo = null; +foo; +null</pre> + +<h3 id="null_与_undefined_的不同点："><code>null</code> 与 <code>undefined</code> 的不同点：</h3> + +<p>当检测 <code>null</code> 或 <code>undefined</code> 时，注意<a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Comparison_Operators">相等（==）与全等（===）两个操作符的区别</a> ，前者会执行类型转换：</p> + +<pre class="brush: js">typeof null // "object" (因为一些以前的原因而不是'null') +typeof undefined // "undefined" +null === undefined // false +null == undefined // true +null === null // true +null == null // true +!null //true +isNaN(1 + null) // false +isNaN(1 + undefined) // true +</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>{{SpecName('ES1')}}</td> + <td>{{Spec2('ES1')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-4.3.11', 'null value')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-null-value', 'null value')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-null-value', 'null value')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.null")}}</p> + +<h2 id="参见">参见</h2> + +<ul> + <li>{{jsxref("undefined")}}</li> + <li>{{jsxref("NaN")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/number/epsilon/index.html b/files/zh-cn/web/javascript/reference/global_objects/number/epsilon/index.html new file mode 100644 index 0000000000..fea6ee1bb8 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/number/epsilon/index.html @@ -0,0 +1,114 @@ +--- +title: Number.EPSILON +slug: Web/JavaScript/Reference/Global_Objects/Number/EPSILON +translation_of: Web/JavaScript/Reference/Global_Objects/Number/EPSILON +--- +<div>{{JSRef}}</div> + +<p><strong><code>Number.EPSILON</code></strong> 属性表示 1 与{{jsxref("Number")}}可表示的大于 1 的最小的浮点数之间的差值。</p> + +<p>你不必创建一个 {{jsxref("Number")}} 对象来访问这个静态属性（直接使用 <code>Number.EPSILON</code>）。</p> + +<div>{{js_property_attributes(0, 0, 0)}}</div> + +<h2 id="描述">描述</h2> + +<p><code>EPSILON</code> 属性的值接近于 <code>2.2204460492503130808472633361816E-16</code>，或者 <code>2<sup>-52。</sup></code></p> + +<h2 id="示例">示例</h2> + +<h3 id="测试是否相等">测试是否相等</h3> + +<pre class="brush: js">x = 0.2; +y = 0.3; +z = 0.1; +equal = (Math.abs(x - y + z) < Number.EPSILON); +</pre> + +<h2 id="Polyfill">Polyfill</h2> + +<pre><code>if (Number.EPSILON === undefined) { + Number.EPSILON = Math.pow(2, -52); +}</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>{{SpecName('ES6', '#sec-number.epsilon', 'Number.EPSILON')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>最初定义</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-number.epsilon', 'Number.EPSILON')}}</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>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoDesktop("25.0")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>9</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>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatGeckoMobile("25.0")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>9</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Number")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/number/index.html b/files/zh-cn/web/javascript/reference/global_objects/number/index.html new file mode 100644 index 0000000000..9e20355b94 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/number/index.html @@ -0,0 +1,195 @@ +--- +title: Number +slug: Web/JavaScript/Reference/Global_Objects/Number +tags: + - JavaScript + - Number + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Number +--- +<div>{{JSRef}}</div> + +<p> JavaScript 的 <strong><code>Number</code></strong> 对象是经过封装的能让你处理数字值的对象。<code>Number</code> 对象由 <code>Number()</code> 构造器创建。</p> + +<p>JavaScript的<code>Number</code>类型为<a href="https://en.wikipedia.org/wiki/Floating-point_arithmetic">双精度IEEE 754 64位浮点</a>类型。</p> + +<p>最近出了stage3{{jsxref("BigInt")}} <font><font>任意精度数字类型，已经进入stage3规范</font></font></p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre>new Number(<em>value</em>); +var <em>a</em> = new Number('123'); // a === 123 is false +var <em>b</em> = Number('123'); // b === 123 is true +<em>a</em> instanceof Number; // is true +<em>b</em> instanceof Number; // is false</pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>value</code></dt> + <dd>被创建对象的数字值。</dd> +</dl> + +<h2 id="Description" name="Description">描述</h2> + +<p><code>Number</code> 对象主要用于：</p> + +<ul> + <li>如果参数无法被转换为数字，则返回 {{jsxref("NaN")}}。</li> + <li>在非构造器上下文中 (如：没有 {{jsxref("Operators/new", "new")}} 操作符)，<code>Number</code> 能被用来执行类型转换。</li> +</ul> + +<h2 id="Properties" name="Properties">属性</h2> + +<dl> + <dt>{{jsxref("Number.EPSILON")}}</dt> + <dd>两个可表示(representable)数之间的最小间隔。</dd> + <dt>{{jsxref("Number.MAX_SAFE_INTEGER")}}</dt> + <dd>JavaScript 中最大的安全整数 (<code>2<sup>53</sup> - 1</code>)。</dd> + <dt>{{jsxref("Number.MAX_VALUE")}}</dt> + <dd>能表示的最大正数。最小的负数是 <code>-MAX_VALUE</code>。</dd> + <dt>{{jsxref("Number.MIN_SAFE_INTEGER")}}</dt> + <dd>JavaScript 中最小的安全整数 (<code>-(2<sup>53</sup> - 1)</code>).</dd> + <dt>{{jsxref("Number.MIN_VALUE")}}</dt> + <dd>能表示的最小正数即最接近 0 的正数 (实际上不会变成 0)。最大的负数是 <code>-MIN_VALUE</code>。</dd> + <dt>{{jsxref("Number.NaN")}}</dt> + <dd>特殊的“非数字”值。</dd> + <dt>{{jsxref("Number.NEGATIVE_INFINITY")}}</dt> + <dd>特殊的负无穷大值，在溢出时返回该值。</dd> + <dt>{{jsxref("Number.POSITIVE_INFINITY")}}</dt> + <dd>特殊的正无穷大值，在溢出时返回该值。</dd> + <dt>{{jsxref("Number.prototype")}}</dt> + <dd>Number 对象上允许的额外属性。</dd> +</dl> + +<h2 id="Methods" name="Methods">方法</h2> + +<dl> + <dt>{{jsxref("Number.isNaN()")}}</dt> + <dd>确定传递的值是否是 NaN。</dd> + <dt>{{jsxref("Number.isFinite()")}}</dt> + <dd>确定传递的值类型及本身是否是有限数。</dd> + <dt>{{jsxref("Number.isInteger()")}}</dt> + <dd>确定传递的值类型是“number”，且是整数。</dd> + <dt>{{jsxref("Number.isSafeInteger()")}}</dt> + <dd>确定传递的值是否为安全整数 ( -<code>(2<sup>53</sup> - 1)</code> 至 <code>2<sup>53</sup> - 1之间</code>)。</dd> + <dt>{{jsxref("Number.toInteger()")}} {{obsolete_inline}}</dt> + <dd>计算传递的值并将其转换为整数 (或无穷大)。</dd> +</dl> + +<div> +<dl> + <dt>{{jsxref("Number.parseFloat()")}}</dt> + <dd>和全局对象 {{jsxref("parseFloat", "parseFloat()")}} 一样。</dd> + <dt>{{jsxref("Number.parseInt()")}}</dt> + <dd>和全局对象 {{jsxref("parseInt", "parseInt()")}} 一样。</dd> +</dl> +</div> + +<h2 id="Number_instances" name="Number_instances"><code>Number</code> 实例</h2> + +<p>所有 <code>Number</code> 实例都继承自 {{jsxref("Number.prototype")}}。<code>被修改的 Number</code> 构造器的原型对象对全部 <code>Number</code> 实例都生效。</p> + +<h3 id="Methods_of_number_instance" name="Methods_of_number_instance">方法</h3> + +<div>{{page('/zh-CN/docs/JavaScript/Reference/Global_Objects/Number/prototype', 'Methods')}}</div> + +<h2 id="Examples" name="Examples">示例</h2> + +<h3 id="Example_Using_the_Number_object_to_assign_values_to_numeric_variables" name="Example:_Using_the_Number_object_to_assign_values_to_numeric_variables">使用 Number 对象给数字变量赋值</h3> + +<p>下例使用 <code>Number</code> 对象的属性给几个数字变量赋值：</p> + +<pre class="brush: js">var biggestNum = Number.MAX_VALUE; +var smallestNum = Number.MIN_VALUE; +var infiniteNum = Number.POSITIVE_INFINITY; +var negInfiniteNum = Number.NEGATIVE_INFINITY; +var notANum = Number.NaN; +</pre> + +<h3 id="整数类型的范围">整数类型的范围</h3> + +<p>JavaScript 能够准确表示的整数范围在<code>-2^53</code>到<code>2^53</code>之间（不含两个端点），超过这个范围，无法精确表示这个整数。 (详情请参阅 ECMAScript standard, chapter <em><a href="https://www.ecma-international.org/ecma-262/#sec-ecmascript-language-types-number-type">6.1.6 The Number Type</a></em>):</p> + +<pre class="brush: js">var biggestInt = Number.MAX_SAFE_INTEGER; +//9007199254740991 +var smallestInt = Number.MIN_SAFE_INTEGER; +//-9007199254740991</pre> + +<p>在解析序列化的JSON时，如果JSON解析器将它们强制转换为Number类型，那么超出此范围的整数值可能会被破坏。在工作中使用{{jsxref("String")}} 类型代替，是一个可行的解决方案。</p> + +<h3 id="Example_Using_Number_to_convert_a_Date_object" name="Example:_Using_Number_to_convert_a_Date_object">使用 <code>Number</code> 转换 <code>Date</code> 对象</h3> + +<p>下例使用 Number 作为函数来转换 <code>Date</code> 对象为数字值：</p> + +<pre class="brush: js">var d = new Date("December 17, 1995 03:24:00"); +print(Number(d)); +</pre> + +<p>这将输出 "819199440000"。</p> + +<h3 id="转换数字字符串为数字">转换数字字符串为数字</h3> + +<pre class="brush: js" dir="rtl">Number('123') // 123 +Number('12.3') // 12.3 +<code>Number('12.00') // 12</code> +Number('123e-1') // 12.3 +Number('') // 0 +Number(null) // 0 +Number('0x11') // 17 +Number('0b11') // 3 +Number('0o11') // 9 +Number('foo') // NaN +Number('100a') // NaN +Number('-Infinity') //-Infinity</pre> + +<h2 id="Specifications">Specifications</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('ES1')}}</td> + <td>{{Spec2('ES1')}}</td> + <td>初始定义。 实现于 JavaScript 1.1.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.7', 'Number')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-number-objects', 'Number')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>新增了方法和属性: {{jsxref("Number.EPSILON", "EPSILON")}}, {{jsxref("Number.isFinite", "isFinite")}}, {{jsxref("Number.isInteger", "isInteger")}}, {{jsxref("Number.isNaN", "isNaN")}}, {{jsxref("Number.parseFloat", "parseFloat")}}, {{jsxref("Number.parseInt", "parseInt")}}</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-number-objects', 'Number')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">浏览器兼容性</h2> + +<div id="compat-mobile"> +<div class="hidden"> +<p>The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>and send us a pull request.</p> +</div> + +<p>{{Compat("javascript.builtins.Number")}}</p> +</div> + +<h2 id="See_also" name="See_also">参阅</h2> + +<ul> + <li>{{jsxref("NaN")}}</li> + <li>全局对象 {{jsxref("Math")}} </li> + <li>Integers with arbitrary precision: {{jsxref("BigInt")}}</li> + <li><a href="https://medium.com/@maximus.koretskyi/javascripts-number-type-8d59199db1b6#.9whwe88tz">Number type in details</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/number/isfinite/index.html b/files/zh-cn/web/javascript/reference/global_objects/number/isfinite/index.html new file mode 100644 index 0000000000..aef163cfb6 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/number/isfinite/index.html @@ -0,0 +1,89 @@ +--- +title: Number.isFinite() +slug: Web/JavaScript/Reference/Global_Objects/Number/isFinite +tags: + - Experimental + - JavaScript + - Method + - Number + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Number/isFinite +--- +<div>{{JSRef}}</div> + +<p><strong><code>Number.isFinite()</code></strong> 方法用来检测传入的参数是否是一个有穷数。</p> + +<p>{{EmbedInteractiveExample("pages/js/number-isfinite.html")}}</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox notranslate"><code>Number.isFinite(v<var>alue</var>)</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>value</code></dt> + <dd>要被检测有穷性的值。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>一个 {{jsxref("Boolean", "布尔值")}} 表示给定的值是否是一个有穷数。</p> + +<h2 id="描述">描述</h2> + +<p>和全局的 {{jsxref("Global_Objects/isFinite", "isFinite()")}} 函数相比，这个方法不会强制将一个非数值的参数转换成数值，这就意味着，只有数值类型的值，且是有穷的（finite），才返回 <code>true</code>。</p> + +<h2 id="Polyfill">Polyfill</h2> + +<pre class="brush: js notranslate">if (Number.isFinite === undefined) Number.isFinite = function(value) { + return typeof value === 'number' && isFinite(value); +}</pre> + +<h2 id="示例">示例</h2> + +<pre class="brush: js notranslate">Number.isFinite(Infinity); // false +Number.isFinite(NaN); // false +Number.isFinite(-Infinity); // false + +Number.isFinite(0); // true +Number.isFinite(2e64); // true + +Number.isFinite('0'); // false, would've been true with + // global isFinite('0') +Number.isFinite(null); // false, would've been true with + // global isFinite(null) +</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>{{SpecName('ES6', '#sec-number.isfinite', 'Number.isInteger')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-number.isfinite', 'Number.isInteger')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">浏览器兼容性</h2> + +<div>{{Compat("javascript.builtins.Number.isFinite")}}</div> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>The {{jsxref("Number")}} object it belongs to.</li> + <li>The global function {{jsxref("isFinite")}}.</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/number/isinteger/index.html b/files/zh-cn/web/javascript/reference/global_objects/number/isinteger/index.html new file mode 100644 index 0000000000..742abe51a6 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/number/isinteger/index.html @@ -0,0 +1,92 @@ +--- +title: Number.isInteger() +slug: Web/JavaScript/Reference/Global_Objects/Number/isInteger +tags: + - JavaScript + - Method + - Number + - Reference + - 方法 +translation_of: Web/JavaScript/Reference/Global_Objects/Number/isInteger +--- +<div>{{JSRef}}</div> + +<p><strong><code>Number.isInteger()</code></strong> 方法用来判断给定的参数是否为整数。</p> + +<p>{{EmbedInteractiveExample("pages/js/number-isinteger.html")}}</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code>Number.isInteger(v<var>alue</var>)</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>value</code></dt> + <dd>要判断此参数是否为整数</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>判断给定值是否是整数的 {{jsxref("Boolean")}} 值。</p> + +<h2 id="Description" name="Description">描述</h2> + +<p>如果被检测的值是整数，则返回 <code>true</code>，否则返回 <code>false</code>。注意 {{jsxref("Global_Objects/NaN", "NaN")}} 和正负 {{jsxref("Global_Objects/Infinity", "Infinity")}} 不是整数。</p> + +<h2 id="Example" name="Example">示例</h2> + +<pre class="brush: js">Number.isInteger(0); // true +Number.isInteger(1); // true +Number.isInteger(-100000); // true + +Number.isInteger(0.1); // false +Number.isInteger(Math.PI); // false + +Number.isInteger(Infinity); // false +Number.isInteger(-Infinity); // false +Number.isInteger("10"); // false +Number.isInteger(true); // false +Number.isInteger(false); // false +Number.isInteger([1]); // false</pre> + +<h2 id="Polyfill" name="Polyfill">Polyfill</h2> + +<pre class="brush: js">Number.isInteger = Number.isInteger || function(value) { + return typeof value === "number" && + isFinite(value) && + Math.floor(value) === value; +}; +</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>{{SpecName('ES6', '#sec-number.isinteger', 'Number.isInteger')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-number.isinteger', 'Number.isInteger')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">浏览器兼容性</h2> + +<p>{{Compat("javascript.builtins.Number.isInteger")}}</p> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("Global_Objects/Number", "Number")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/number/isnan/index.html b/files/zh-cn/web/javascript/reference/global_objects/number/isnan/index.html new file mode 100644 index 0000000000..19be268773 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/number/isnan/index.html @@ -0,0 +1,102 @@ +--- +title: Number.isNaN() +slug: Web/JavaScript/Reference/Global_Objects/Number/isNaN +tags: + - ECMAScript 2015 + - JavaScript + - Method + - NaN + - Number + - 数字 + - 方法 +translation_of: Web/JavaScript/Reference/Global_Objects/Number/isNaN +--- +<div>{{JSRef}}</div> + +<p><strong><code>Number.isNaN()</code></strong> 方法确定传递的值是否为 {{jsxref("NaN")}}，并且检查其类型是否为 {{jsxref("Number")}}。它是原来的全局 {{jsxref("isNaN", "isNaN()")}} 的更稳妥的版本。</p> + +<p>{{EmbedInteractiveExample("pages/js/number-isnan.html", "taller")}}</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">Number.isNaN(v<var>alue</var>)</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>value</code></dt> + <dd>要检测是否为 {{jsxref("Global_Objects/NaN", "NaN")}} 的值。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>一个{{jsxref("Boolean", "布尔值")}}，表示给定的值是否是 {{jsxref("NaN")}}。</p> + +<h2 id="描述">描述</h2> + +<p>在 JavaScript 中，<code>NaN</code> 最特殊的地方就是，我们不能使用相等运算符（{{jsxref("Operators/Comparison_Operators", "==", "#Equality")}} 和 {{jsxref("Operators/Comparison_Operators", "===", "#Identity")}}）来判断一个值是否是 <code>NaN</code>，因为 <code>NaN == NaN</code> 和 <code>NaN === NaN</code> 都会返回 <code>false</code>。因此，必须要有一个判断值是否是 <code>NaN</code> 的方法。</p> + +<p>和全局函数 {{jsxref("Global_Objects/isNaN", "isNaN()")}} 相比，<code>Number.isNaN()</code> 不会自行将参数转换成数字，只有在参数是值为 <code>NaN</code> 的数字时，才会返回 <code>true</code>。</p> + +<h2 id="示例">示例</h2> + +<pre class="brush: js">Number.isNaN(NaN); // true +Number.isNaN(Number.NaN); // true +Number.isNaN(0 / 0) // true + +// 下面这几个如果使用全局的 isNaN() 时，会返回 true。 +Number.isNaN("NaN"); // false，字符串 "NaN" 不会被隐式转换成数字 NaN。 +Number.isNaN(undefined); // false +Number.isNaN({}); // false +Number.isNaN("blabla"); // false + +// 下面的都返回 false +Number.isNaN(true); +Number.isNaN(null); +Number.isNaN(37); +Number.isNaN("37"); +Number.isNaN("37.37"); +Number.isNaN(""); +Number.isNaN(" ");</pre> + +<h2 id="Polyfill">Polyfill</h2> + +<pre class="brush: js">Number.isNaN = Number.isNaN || function(value) { + return typeof value === "number" && isNaN(value); +} +</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('ES6', '#sec-number.isnan', 'Number.isnan')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-number.isnan', 'Number.isnan')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<div>{{Compat("javascript.builtins.Number.isNaN")}}</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Number")}}</li> + <li>{{jsxref("isNaN", "isNaN()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/number/issafeinteger/index.html b/files/zh-cn/web/javascript/reference/global_objects/number/issafeinteger/index.html new file mode 100644 index 0000000000..e0755f390a --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/number/issafeinteger/index.html @@ -0,0 +1,86 @@ +--- +title: Number.isSafeInteger() +slug: Web/JavaScript/Reference/Global_Objects/Number/isSafeInteger +translation_of: Web/JavaScript/Reference/Global_Objects/Number/isSafeInteger +--- +<div>{{JSRef}}</div> + +<p><strong><code>Number.isSafeInteger()</code></strong> 方法用来判断传入的参数值是否是一个“安全整数”（safe integer）。</p> + +<p>一个安全整数是一个符合下面条件的整数：</p> + +<ul> + <li>可以准确地表示为一个IEEE-754双精度数字,</li> + <li>其IEEE-754表示不能是舍入任何其他整数以适应IEEE-754表示的结果。.</li> +</ul> + +<p>比如，<code>2<sup>53</sup> - 1</code> 是一个安全整数，它能被精确表示，在任何 IEEE-754 舍入模式（rounding mode）下，没有其他整数舍入结果为该整数。作为对比，<code>2<sup>53</sup></code> 就不是一个安全整数，它能够使用 IEEE-754 表示，但是 <code>2<sup>53</sup> + 1</code> 不能使用 IEEE-754 直接表示，在就近舍入（round-to-nearest）和向零舍入中，会被舍入为 <code>2<sup>53</sup></code>。</p> + +<p>安全整数范围为 <code>-(2<sup>53</sup> - 1)到</code> <code>2<sup>53</sup> - 1 </code>之间的整数，包含 <code>-(2<sup>53</sup> - 1)和</code> <code>2<sup>53</sup> - 1</code>。</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code>Number.isSafeInteger(<var>testValue</var>)</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code><var>testValue</var></code></dt> + <dd>需要检测的参数。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>一个{{jsxref("Boolean", "布尔值")}} 表示给定的值是否是一个安全整数（safe integer）。</p> + +<h2 id="Example" name="Example">示例</h2> + +<pre class="brush:js">Number.isSafeInteger(3); // true +Number.isSafeInteger(Math.pow(2, 53)) // false +Number.isSafeInteger(Math.pow(2, 53) - 1) // true +Number.isSafeInteger(NaN); // false +Number.isSafeInteger(Infinity); // false +Number.isSafeInteger("3"); // false +Number.isSafeInteger(3.1); // false +Number.isSafeInteger(3.0); // true +</pre> + +<h2 id="Polyfill">Polyfill</h2> + +<pre><code>Number.isSafeInteger = Number.isSafeInteger || function (value) { + return Number.isInteger(value) && Math.abs(value) <= Number.MAX_SAFE_INTEGER; +};</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>{{SpecName('ES6', '#sec-number.issafeinteger', 'Number.isSafeInteger')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-number.issafeinteger', 'Number.isSafeInteger')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">浏览器兼容性</h2> + +<p>{{Compat("javascript.builtins.Number.isSafeInteger")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li> {{jsxref("Number")}}</li> + <li>{{jsxref("Number.MIN_SAFE_INTEGER")}}</li> + <li>{{jsxref("Number.MAX_SAFE_INTEGER")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/number/max_safe_integer/index.html b/files/zh-cn/web/javascript/reference/global_objects/number/max_safe_integer/index.html new file mode 100644 index 0000000000..2222e5a5ff --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/number/max_safe_integer/index.html @@ -0,0 +1,105 @@ +--- +title: Number.MAX_SAFE_INTEGER +slug: Web/JavaScript/Reference/Global_Objects/Number/MAX_SAFE_INTEGER +translation_of: Web/JavaScript/Reference/Global_Objects/Number/MAX_SAFE_INTEGER +--- +<div>{{JSRef}}</div> + +<p><strong><code>Number.MAX_SAFE_INTEGER</code></strong> 常量表示在 JavaScript 中最大的安全整数（maxinum safe integer)（<code>2<sup>53</sup> - 1）。</code></p> + +<div>{{js_property_attributes(0, 0, 0)}}</div> + +<h2 id="描述">描述</h2> + +<p><code>MAX_SAFE_INTEGER 是一个值为 9007199254740991的常量。因为Javascript的数字存储使用了</code><a href="http://en.wikipedia.org/wiki/IEEE_floating_point">IEEE 754</a>中规定的<a href="https://zh.wikipedia.org/zh-cn/%E9%9B%99%E7%B2%BE%E5%BA%A6%E6%B5%AE%E9%BB%9E%E6%95%B8">双精度浮点数</a>数据类型，而这一数据类型能够安全存储 <code>-(2<sup>53</sup> - 1)</code> 到 <code>2<sup>53</sup> - 1 之间的数值（包含边界值）。</code></p> + +<p>这里安全存储的意思是指能够准确区分两个不相同的值，例如 <code>Number.MAX_SAFE_INTEGER + 1 === Number.MAX_SAFE_INTEGER + 2 将得到 true的结果，而这在数学上是错误的，参考</code>{{jsxref("Number.isSafeInteger()")}}获取更多信息.</p> + +<p>由于 <code>MAX_SAFE_INTEGER 是</code>{{jsxref("Number")}}的一个<code>静态属性，所以你不用自己动手为</code>{{jsxref("Number")}}对象创建<code>Number.MAX_SAFE_INTEGER</code>这一属性，就可以直接使用它。</p> + +<h2 id="示例">示例</h2> + +<pre class="brush: js">Number.MAX_SAFE_INTEGER // 9007199254740991 +Math.pow(2, 53) - 1 // 9007199254740991 +</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('ES6', '#sec-number.max_safe_integer', 'Number.MAX_SAFE_INTEGER')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>首次定义</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-number.max_safe_integer', 'Number.MAX_SAFE_INTEGER')}}</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>{{CompatChrome("34")}}</td> + <td>{{CompatGeckoDesktop("31")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>9.0.2</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>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoMobile("32")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Number.MIN_SAFE_INTEGER")}}</li> + <li>{{jsxref("Number.isSafeInteger()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/number/max_value/index.html b/files/zh-cn/web/javascript/reference/global_objects/number/max_value/index.html new file mode 100644 index 0000000000..974f0a46e0 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/number/max_value/index.html @@ -0,0 +1,115 @@ +--- +title: Number.MAX_VALUE +slug: Web/JavaScript/Reference/Global_Objects/Number/MAX_VALUE +translation_of: Web/JavaScript/Reference/Global_Objects/Number/MAX_VALUE +--- +<div>{{JSRef("Global_Objects", "Number")}}</div> + +<h2 id="Summary" name="Summary">概述</h2> + +<p><code><strong>Number.MAX_VALUE</strong></code> 属性表示在 JavaScript 里所能表示的最大数值。</p> + +<p>{{js_property_attributes(0,0,0)}}</p> + +<h2 id="Description" name="Description">描述</h2> + +<p><code>MAX_VALUE</code> 属性值接近于 <code>1.79E+308</code>。大于 <code>MAX_VALUE</code> 的值代表 "<code>Infinity</code>"。</p> + +<p>因为 <code>MAX_VALUE</code> 是 <code>Number</code> 对象的一个静态属性，所以你应该直接使用<code>Number.MAX_VALUE</code> ，而不是作为一个创建的 <code>Number</code> 实例的属性。</p> + +<h2 id="Examples" name="Examples">示例</h2> + +<h3 id="Example:_Using_MAX_VALUE" name="Example:_Using_MAX_VALUE">例子：使用 <code>MAX_VALUE</code></h3> + +<p>下面的代码求两个数值的乘积。如果结果小于等于 <code>MAX_VALUE</code>，则调用 <code>func1</code> 函数；否则，调用 <code>func2</code> 函数。</p> + +<pre class="brush: js">if (num1 * num2 <= Number.MAX_VALUE) { + func1(); +} else { + func2(); +}</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>ECMAScript 1st Edition. Implemented in JavaScript 1.1</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.7.3.2', 'Number.MAX_VALUE')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-number.max_value', 'Number.MAX_VALUE')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{ CompatibilityTable() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("Number.MIN_VALUE")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/number/min_safe_integer/index.html b/files/zh-cn/web/javascript/reference/global_objects/number/min_safe_integer/index.html new file mode 100644 index 0000000000..9604955e5b --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/number/min_safe_integer/index.html @@ -0,0 +1,58 @@ +--- +title: Number.MIN_SAFE_INTEGER +slug: Web/JavaScript/Reference/Global_Objects/Number/MIN_SAFE_INTEGER +translation_of: Web/JavaScript/Reference/Global_Objects/Number/MIN_SAFE_INTEGER +--- +<div>{{JSRef}}</div> + +<p><strong><code>Number.MIN_SAFE_INTEGER</code></strong> 代表在 JavaScript中最小的安全的integer型数字 (<code>-(2<sup>53</sup> - 1)</code>).</p> + +<div>{{js_property_attributes(0, 0, 0)}}</div> + +<h2 id="描述">描述</h2> + +<p><code>MIN_SAFE_INTEGER</code> 的值是<code>-9007199254740991</code>. 形成这个数字的原因是 JavaScript 在 <a href="http://en.wikipedia.org/wiki/IEEE_floating_point">IEEE 754</a>中使用<a href="http://en.wikipedia.org/wiki/Double_precision_floating-point_format">double-precision floating-point format numbers</a> 作为规定。在这个规定中能安全的表示数字的范围在<code>-(2<sup>53</sup> - 1)</code> 到 <code>2<sup>53</sup> - 1之间</code>.</p> + +<p><code>由于MIN_SAFE_INTEGER</code> 是{{jsxref("Number")}}的一个静态属性,你可以直接使用<code>Number.MIN_SAFE_INTEGER</code>, 而不是自己去创建一个{{jsxref("Number")}}的属性。 </p> + +<h2 id="示例">示例</h2> + +<pre class="brush: js">Number.MIN_SAFE_INTEGER // -9007199254740991 +-(Math.pow(2, 53) - 1) // -9007199254740991 +</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('ES6', '#sec-number.min_safe_integer', 'Number.MIN_SAFE_INTEGER')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-number.min_safe_integer', 'Number.MIN_SAFE_INTEGER')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器支持">浏览器支持</h2> + +<div>{{CompatibilityTable}}</div> + +<p>{{Compat("javascript.builtins.Number.MIN_SAFE_INTEGER")}}</p> + + +<h2 id="参阅">参阅</h2> + +<ul> + <li>{{jsxref("Number.MAX_SAFE_INTEGER")}}</li> + <li>{{jsxref("Number.isSafeInteger()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/number/min_value/index.html b/files/zh-cn/web/javascript/reference/global_objects/number/min_value/index.html new file mode 100644 index 0000000000..0b90f3eb28 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/number/min_value/index.html @@ -0,0 +1,99 @@ +--- +title: Number.MIN_VALUE +slug: Web/JavaScript/Reference/Global_Objects/Number/MIN_VALUE +translation_of: Web/JavaScript/Reference/Global_Objects/Number/MIN_VALUE +--- +<div> + {{JSRef("Global_Objects", "Number")}}</div> +<h2 id="Summary" name="Summary">概述</h2> +<p><code><strong>Number.MIN_VALUE</strong></code> 属性表示在 JavaScript 中所能表示的最小的正值。</p> +<p>{{js_property_attributes(0,0,0)}}</p> +<h2 id="Description" name="Description">描述</h2> +<p><code>MIN_VALUE</code> 属性是 JavaScript 里最接近 0 的正值，而不是最小的负值。</p> +<p><code>MIN_VALUE</code> 的值约为 5e-324。小于 <code>MIN_VALUE</code> ("underflow values") 的值将会转换为 0。</p> +<p>因为 <code>MIN_VALUE</code> 是 <code>Number</code> 的一个静态属性，因此应该直接使用： <code>Number.MIN_VALUE，</code> 而不是作为一个创建的 <code>Number</code> 实例的属性。</p> +<h2 id="Examples" name="Examples">示例</h2> +<h3 id="Example:_Using_MIN_VALUE" name="Example:_Using_MIN_VALUE">例子：使用 <code>MIN_VALUE</code></h3> +<p>下面的代码里两个数值相除。如果结果大于或等于 <code>MIN_VALUE</code>，则调用 <code>func1</code> 函数；否则，调用 <code>func2</code> 函数。</p> +<pre class="brush:js">if (num1 / num2 >= Number.MIN_VALUE) { + func1(); +} else { + func2(); +}</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>ECMAScript 1st Edition. Implemented in JavaScript 1.1</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.7.3.3', 'Number.MIN_VALUE')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-number.min_value', 'Number.MIN_VALUE')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> +<h2 id="浏览器兼容性">浏览器兼容性</h2> +<p>{{ CompatibilityTable() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> + </table> +</div> +<h2 id="See_also" name="See_also">相关链接</h2> +<ul> + <li>{{jsxref("Number.MAX_VALUE")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/number/nan/index.html b/files/zh-cn/web/javascript/reference/global_objects/number/nan/index.html new file mode 100644 index 0000000000..9921175594 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/number/nan/index.html @@ -0,0 +1,105 @@ +--- +title: Number.NaN +slug: Web/JavaScript/Reference/Global_Objects/Number/NaN +translation_of: Web/JavaScript/Reference/Global_Objects/Number/NaN +--- +<div>{{JSRef("Global_Objects", "Number")}}</div> + +<h2 id="Summary" name="Summary" style="margin-bottom: 20px; line-height: 30px;">概述</h2> + +<p><code><strong>Number.NaN</strong></code> 表示“非数字”（Not-A-Number）。和 {{jsxref("Global_Objects/NaN", "NaN")}} 相同。</p> + +<p>不必创建一个 {{jsxref("Global_Objects/Number", "Number")}} 实例来访问该属性，使用 <code>Number.NaN</code> 来访问该静态属性。</p> + +<p>{{js_property_attributes(0,0,0)}}</p> + +<h2 id="规范" style="margin-bottom: 20px; line-height: 30px;">规范</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('ES1')}}</td> + <td>{{Spec2('ES1')}}</td> + <td>Initial definition. Implemented in JavaScript 1.1.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.7.3.4', 'Number.NaN')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-number.nan', 'Number.NaN')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-number.nan', 'Number.NaN')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性" style="margin-bottom: 20px; line-height: 30px;">浏览器兼容性</h2> + +<p>{{ CompatibilityTable() }}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th style="line-height: 16px;">Feature</th> + <th style="line-height: 16px;">Chrome</th> + <th style="line-height: 16px;">Firefox (Gecko)</th> + <th style="line-height: 16px;">Internet Explorer</th> + <th style="line-height: 16px;">Opera</th> + <th style="line-height: 16px;">Safari</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th style="line-height: 16px;">Feature</th> + <th style="line-height: 16px;">Android</th> + <th style="line-height: 16px;">Chrome for Android</th> + <th style="line-height: 16px;">Firefox Mobile (Gecko)</th> + <th style="line-height: 16px;">IE Mobile</th> + <th style="line-height: 16px;">Opera Mobile</th> + <th style="line-height: 16px;">Safari Mobile</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="See_also" name="See_also" style="margin-bottom: 20px; line-height: 30px;">相关链接</h2> + +<ul> + <li>全局对象 {{jsxref("Global_Objects/NaN", "NaN")}}</li> + <li>{{jsxref("Global_Objects/Number", "Number")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/number/negative_infinity/index.html b/files/zh-cn/web/javascript/reference/global_objects/number/negative_infinity/index.html new file mode 100644 index 0000000000..6649246cf5 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/number/negative_infinity/index.html @@ -0,0 +1,112 @@ +--- +title: Number.NEGATIVE_INFINITY +slug: Web/JavaScript/Reference/Global_Objects/Number/NEGATIVE_INFINITY +translation_of: Web/JavaScript/Reference/Global_Objects/Number/NEGATIVE_INFINITY +--- +<div> + {{JSRef("Global_Objects", "Number")}}</div> +<h2 id="Summary" name="Summary">概述</h2> +<p><code><strong>Number.NEGATIVE_INFINITY</strong></code> 属性表示负无穷大。</p> +<p>不用创建一个 {{jsxref("Global_Objects/Number", "Number")}} 实例，使用 <code>Number.NEGATIVE_INFINITY</code> 来访问该静态属性。</p> +<p>{{js_property_attributes(0,0,0)}}</p> +<h2 id="Description" name="Description">描述</h2> +<p><code>Number.NEGATIVE_INFINITY</code> 的值和全局对象的 {{jsxref("Global_Objects/Infinity", "Infinity")}} 属性的负值相同。</p> +<p>该值的行为同数学上的无穷大（infinity）有一点儿不同：</p> +<ul> + <li>任何正值，包括 <code>POSITIVE_INFINITY，</code>乘以 <code>NEGATIVE_INFINITY</code> 为 <code>NEGATIVE_INFINITY</code>。</li> + <li>任何负值，包括 <code>NEGATIVE_INFINITY</code>，乘以 <code>NEGATIVE_INFINITY</code> 为 <code>POSITIVE_INFINITY</code>。</li> + <li>0 乘以 <code>NEGATIVE_INFINITY</code> 为 <code>NaN</code>.</li> + <li>NaN 乘以 <code>NEGATIVE_INFINITY</code> 为<code> NaN</code>.</li> + <li><code>NEGATIVE_INFINITY</code> 除以任何负值（除了 <code>NEGATIVE_INFINITY）</code>为 <code>POSITIVE_INFINITY</code>。</li> + <li><code>NEGATIVE_INFINITY</code> 除以任何正值（除了 <code>POSITIVE_INFINITY</code>）为 <code>NEGATIVE_INFINITY</code>。</li> + <li><code>NEGATIVE_INFINITY</code> 除以 <code>NEGATIVE_INFINITY</code> 或 <code>POSITIVE_INFINITY</code> 是 <code>NaN</code>。</li> + <li>任何数除以 <code>NEGATIVE_INFINITY</code> 为 0。</li> +</ul> +<p>为了成功返回一个有限值，你可能会使用 <code>Number.NEGATIVE_INFINITY</code> 属性来判断是否显示一个条件错误 。然而 {{jsxref("Global_Objects/isFinite", "isFinite")}} 方法更适合这种情况。</p> +<h2 id="Example" name="Example">示例</h2> +<p>下例中，赋值给变量 <code>smallNumber</code> 一个明显小于 JavaScript 中的最小值的值。当 <code>if</code> 语句执行时，<code>smallNumber</code> 值为 "<code>-Infinity</code>"，因此在继续执行代码前，<code>smallNumber</code> 被设为一个更容易管理的值。</p> +<pre class="brush:js">var smallNumber = (-Number.MAX_VALUE) * 2 + +if (smallNumber == Number.NEGATIVE_INFINITY) { + smallNumber = returnFinite(); +} +</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>ECMAScript 1st Edition. Implemented in JavaScript 1.1</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.7.3.5', 'Number.NEGATIVE_INFINITY')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-number.negative_infinity', 'Number.NEGATIVE_INFINITY')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> +<h2 id="浏览器规范">浏览器规范</h2> +<p>{{ CompatibilityTable() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> + </table> +</div> +<h2 id="See_also" name="See_also">相关链接</h2> +<ul> + <li>{{jsxref("Number.POSITIVE_INFINITY")}}</li> + <li>{{jsxref("Global_Objects/Infinity", "Infinity")}}</li> + <li>{{jsxref("Global_Objects/isFinite", "isFinite")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/number/number/index.html b/files/zh-cn/web/javascript/reference/global_objects/number/number/index.html new file mode 100644 index 0000000000..e539061589 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/number/number/index.html @@ -0,0 +1,58 @@ +--- +title: Number() constructor +slug: Web/JavaScript/Reference/Global_Objects/Number/Number +translation_of: Web/JavaScript/Reference/Global_Objects/Number/Number +--- +<div>{{JSRef}}</div> + +<p><strong><code>Number()</code> 构造函数创建一个</strong> {{jsxref("Number")}} 对象。</p> + +<h2 id="语法">语法</h2> + +<pre class="brush: js notranslate">new Number(<var>value</var>) +</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code><var>value</var></code></dt> + <dd>创建的 <code>Number</code> 对象的数值。</dd> +</dl> + +<h2 id="例子">例子</h2> + +<h3 id="创建_Number_对象">创建 Number 对象</h3> + +<pre class="brush: js notranslate">const a = new Number('123'); // a === 123 is false +const b = Number('123'); // b === 123 is true +a instanceof Number; // is true +b instanceof Number; // is false</pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">规范</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-number-constructor', 'Number constructor')}}</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.Number.Number")}}</p> + +<h2 id="另请参阅">另请参阅</h2> + +<ul> + <li>{{jsxref("NaN")}}</li> + <li>全局对象 {{jsxref("Math")}}</li> + <li>任意精度的整数 {{jsxref("BigInt")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/number/parsefloat/index.html b/files/zh-cn/web/javascript/reference/global_objects/number/parsefloat/index.html new file mode 100644 index 0000000000..f55a3ceba8 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/number/parsefloat/index.html @@ -0,0 +1,109 @@ +--- +title: Number.parseFloat() +slug: Web/JavaScript/Reference/Global_Objects/Number/parseFloat +translation_of: Web/JavaScript/Reference/Global_Objects/Number/parseFloat +--- +<div>{{JSRef("Global_Objects", "Number")}}</div> + +<h2 id="Summary" name="Summary">概述</h2> + +<p><strong><code>Number.parseFloat()</code></strong> 方法可以把一个字符串解析成浮点数。该方法与全局的 {{jsxref("Global_Objects/parseFloat", "parseFloat()")}} 函数相同，并且处于 ECMAScript 6 规范中（用于全局变量的模块化）。</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code>Number.parseFloat(<var>string</var>)</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>string</code></dt> + <dd>被解析的字符串。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<dl> + <dd>给定值被解析成浮点数，如果无法被解析成浮点数，则返回<code>NaN</code></dd> +</dl> + +<h2 id="描述">描述</h2> + +<p>请移步全局函数 {{jsxref("Global_Objects/parseFloat", "parseFloat()")}} 页面查看更多的解释和示例。</p> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范版本</th> + <th scope="col">规范状态</th> + <th scope="col">注解</th> + </tr> + <tr> + <td> + <p>{{SpecName('ES6', '#sec-number.parsefloat', 'Number.parseFloat')}}</p> + </td> + <td>{{Spec2('ES6')}}</td> + <td>首次定义</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">浏览器兼容性</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>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoDesktop("25")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatNo}}</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>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatGeckoMobile("25")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("Global_Objects/Number", "Number")}}</li> + <li>{{jsxref("Global_Objects/parseFloat", "parseFloat()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/number/parseint/index.html b/files/zh-cn/web/javascript/reference/global_objects/number/parseint/index.html new file mode 100644 index 0000000000..56f1d834be --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/number/parseint/index.html @@ -0,0 +1,82 @@ +--- +title: Number.parseInt() +slug: Web/JavaScript/Reference/Global_Objects/Number/parseInt +tags: + - ECMAScript 2015 + - JavaScript + - Method + - Number +translation_of: Web/JavaScript/Reference/Global_Objects/Number/parseInt +--- +<div>{{JSRef}}</div> + +<h2 id="Summary" name="Summary">概述</h2> + +<p><strong><code>Number.parseInt()</code></strong> 方法依据指定基数 [ 参数 <strong>radix </strong>的值]，把字符串 [ 参数 <strong>string</strong> 的值] 解析成整数。</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code>Number.parseInt(<var>string</var>[, <var>radix</var>])</code> +</pre> + +<h3 id="参数">参数</h3> + +<p>{{page("en-US/docs/Web/JavaScript/Reference/Global_Objects/parseInt", "Parameters")}} </p> + +<p>参数string：要解析的值。 如果此参数不是字符串，则使用ToString抽象操作将其转换为字符串。忽略此参数中的前导空格。<br> + 参数radix：一个介于2到36之间的整数，代表字符串的基数(数学数字系统中的基)。小心-这并不是默认为10。</p> + +<h3 id="返回值">返回值</h3> + +<p>{{page("en-US/docs/Web/JavaScript/Reference/Global_Objects/parseInt", "Return value")}}</p> + +<p>从给定字符串中解析的整数。如果基数小于11，且第一个非空白字符不能转换为数字，则返回NaN。</p> + +<h2 id="描述">描述</h2> + +<p>这个方法和全局的 {{jsxref("parseInt", "parseInt()")}} 函数具有一样的函数功能:</p> + +<pre><code>Number.parseInt === parseInt; // true</code></pre> + +<p>ECMAScript 2015添加了这部分 (其目的是对全局变量进行模块化). 请另见 {{jsxref("parseInt", "parseInt()")}} 获取更多详情和示例.</p> + +<h2 id="Polyfill">Polyfill</h2> + +<pre><code>if (Number.parseInt === undefined) { + Number.parseInt = window.parseInt; +}</code></pre> + +<h2 id="说明">说明</h2> + +<table> + <tbody> + <tr> + <th scope="col">说明</th> + <th scope="col">状态</th> + <th scope="col">评论</th> + </tr> + <tr> + <td>{{SpecName('ES2015', '#sec-number.parseint', 'Number.parseInt')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>初始定义.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-number.parseint', 'Number.parseInt')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Number.parseInt")}}</p> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li><code>{{jsxref("Global_Objects/Number", "Number()")}}</code></li> + <li>全局的 {{jsxref("Global_Objects/parseInt", "parseInt()")}} 函数</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/number/positive_infinity/index.html b/files/zh-cn/web/javascript/reference/global_objects/number/positive_infinity/index.html new file mode 100644 index 0000000000..4207e72e5a --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/number/positive_infinity/index.html @@ -0,0 +1,130 @@ +--- +title: Number.POSITIVE_INFINITY +slug: Web/JavaScript/Reference/Global_Objects/Number/POSITIVE_INFINITY +translation_of: Web/JavaScript/Reference/Global_Objects/Number/POSITIVE_INFINITY +--- +<div>{{JSRef("Global_Objects", "Number")}}</div> + +<h2 id="概述">概述</h2> + +<p><code><strong>Number.POSITIVE_INFINITY</strong></code> 属性表示正无穷大。</p> + +<p>不必创建一个 {{jsxref("Global_Objects/Number", "Number")}} 实例，可使用 <code>Number.POSITIVE_INFINITY</code> 来访问该静态属性。</p> + +<p>{{js_property_attributes(0,0,0)}}</p> + +<h2 id="描述">描述</h2> + +<p><code>Number.POSITIVE_INFINITY</code> 的值同全局对象 {{jsxref("Global_Objects/Infinity", "Infinity")}} 属性的值相同。</p> + +<p>该值的表现同数学上的无穷大有点儿不同：</p> + +<ul> + <li>任何正值，包括 <code>POSITIVE_INFINITY</code>，乘以 <code>POSITIVE_INFINITY</code> 为 <code>POSITIVE_INFINITY</code>。</li> + <li>任何负值，包括 <code>NEGATIVE_INFINITY</code>，乘以 <code>POSITIVE_INFINITY</code> 为 <code>NEGATIVE_INFINITY</code>。</li> + <li>0 乘以 <code>POSITIVE_INFINITY</code> 为 NaN。</li> + <li>NaN 乘以 <code>POSITIVE_INFINITY</code> 为 NaN。</li> + <li><code>POSITIVE_INFINITY</code> 除以 <code>NEGATIVE_INFINITY</code> 以外的任何负值为 <code>NEGATIVE_INFINITY</code>。</li> + <li><code>POSITIVE_INFINITY</code> 除以 <code>POSITIVE_INFINITY</code> 以外的任何正值为 <code>POSITIVE_INFINITY</code>。</li> + <li><code>POSITIVE_INFINITY</code> 除以 <code>NEGATIVE_INFINITY</code> 或 <code>POSITIVE_INFINITY</code> 为 NaN。</li> + <li>任何数除以 <code>POSITIVE_INFINITY</code> 为 0。</li> +</ul> + +<p>You might use the <code>Number.POSITIVE_INFINITY</code> property to indicate an error condition that returns a finite number in case of success. Note, however, that {{jsxref("Global_Objects/isFinite", "isFinite")}} would be more appropriate in such a case.</p> + +<h2 id="示例">示例</h2> + +<p>下例中，赋值给变量 <code>bigNumber</code> 一个大于 JavaScript 中最大值的值。当 <code>if</code> 语句执行时，变量 <code>bigNumber</code> 值为 "<code>Infinity</code>"， 因此在继续执行代码前，为变量 <code>bigNumber</code> 设置一个容易管理的值。</p> + +<pre class="brush: js">var bigNumber = Number.MAX_VALUE * 2 +if (bigNumber == Number.POSITIVE_INFINITY) { + bigNumber = returnFinite(); +} +</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>ECMAScript 1st Edition. Implemented in JavaScript 1.1</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.7.3.6', 'Number.POSITIVE_INFINITY')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-number.positive_infinity', 'Number.POSITIVE_INFINITY')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{ CompatibilityTable() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("Number.NEGATIVE_INFINITY")}}</li> + <li>{{jsxref("Global_Objects/Infinity", "Infinity")}}</li> + <li>{{jsxref("Global_Objects/isFinite", "isFinite")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/number/prototype/index.html b/files/zh-cn/web/javascript/reference/global_objects/number/prototype/index.html new file mode 100644 index 0000000000..578011f564 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/number/prototype/index.html @@ -0,0 +1,131 @@ +--- +title: Number.prototype +slug: Web/JavaScript/Reference/Global_Objects/Number/prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Number +--- +<div> + {{JSRef("Global_Objects", "Number")}}</div> +<h2 id="Summary" name="Summary">概述</h2> +<p><strong><code>Number.prototype</code></strong> 属性表示 {{jsxref("Global_Objects/Number", "Number")}} 构造函数的原型。</p> +<div> + {{js_property_attributes(0,0,0)}}</div> +<h2 id="Description" name="Description">描述</h2> +<p>所有 <code>Number</code> 实例都继承自 <code>Number.prototype</code>。修改 {{jsxref("Global_Objects/Number", "Number")}} 构造函数的原型对象会影响到所有 <code>Number</code> 实例。.</p> +<h2 id="属性">属性</h2> +<dl> + <dt> + constructor</dt> + <dd> + 返回创建该实例对象的构造函数。默认为 {{jsxref("Global_Objects/Number", "Number")}} 对象。</dd> +</dl> +<div> + {{ jsOverrides("Object", "properties", "constructor") }}</div> +<h2 id="方法">方法</h2> +<dl> + <dt> + {{jsxref("Number.prototype.toExponential()")}}</dt> + <dd> + 返回一个使用指数表示法表示的该数值的字符串表示。</dd> + <dt> + {{jsxref("Number.prototype.toFixed()")}}</dt> + <dd> + 返回一个使用定点表示法表示的该数值的字符串表示。</dd> + <dt> + {{jsxref("Number.prototype.toLocaleString()")}}</dt> + <dd> + 返回一个与语言相关的该数值对象的字符串表示。覆盖了{{jsxref("Object.prototype.toLocaleString()")}} 方法。</dd> + <dt> + {{jsxref("Number.prototype.toPrecision()")}}</dt> + <dd> + 使用定点表示法或指数表示法来表示的指定显示位数的该数值对象的字符串表示。</dd> + <dt> + {{jsxref("Number.prototype.toSource()")}} {{ Non-standard_inline() }}</dt> + <dd> + Returns an object literal representing the specified Number object; you can use this value to create a new object. Overrides the {{jsxref("Object.prototype.toSource()")}} method.</dd> + <dt> + {{jsxref("Number.prototype.toString()")}}</dt> + <dd> + 返回一个表示该数值对象的字符串。覆盖了 {{jsxref("Object.prototype.toString()")}} 方法。</dd> + <dt> + {{jsxref("Number.prototype.valueOf()")}}</dt> + <dd> + 返回该数值对象的原始值。覆盖了 {{jsxref("Object.prototype.valueOf()")}} 方法。</dd> +</dl> +<div> + {{ jsOverrides("Object", "methods", "toExponential", "toFixed", "toLocaleString", "toPrecision", "toSource", "toString", "valueOf") }}</div> +<div> + </div> +<h2 id="规范">规范</h2> +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范版本</th> + <th scope="col">规范状态</th> + <th scope="col">注解</th> + </tr> + <tr> + <td>ECMAScript 1st Edition. Implemented in JavaScript 1.1</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.7.4', 'Number')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-properties-of-the-number-prototype-object', 'Number')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> +<h2 id="浏览器兼容性">浏览器兼容性</h2> +<p>{{ CompatibilityTable() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> + </table> +</div> +<p> </p> diff --git a/files/zh-cn/web/javascript/reference/global_objects/number/toexponential/index.html b/files/zh-cn/web/javascript/reference/global_objects/number/toexponential/index.html new file mode 100644 index 0000000000..a19013e4c4 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/number/toexponential/index.html @@ -0,0 +1,142 @@ +--- +title: Number.prototype.toExponential() +slug: Web/JavaScript/Reference/Global_Objects/Number/toExponential +translation_of: Web/JavaScript/Reference/Global_Objects/Number/toExponential +--- +<div>{{JSRef("Global_Objects", "Number")}}</div> + +<h2 id="Summary" name="Summary">概述</h2> + +<p><strong><code>toExponential()</code></strong> 方法以指数表示法返回该数值字符串表示形式。</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code><em>numObj</em>.toExponential(<em>fractionDigits</em>)</code></pre> + +<h3 id="Parameter" name="Parameter">参数</h3> + +<dl> + <dt>fractionDigits</dt> + <dd>可选。一个整数，用来指定小数点后有几位数字。默认情况下用尽可能多的位数来显示数字。</dd> +</dl> + +<h3 id="Returns" name="Returns">返回值</h3> + +<p>一个用幂的形式 (科学记数法) 来表示{{jsxref("Number")}} 对象的字符串。小数点后以fractionDigits 提供的值来四舍五入。如果 <code>fractionDigits</code> 参数被忽略了，小数点后的将尽可能用最多的位数来表示该数值。</p> + +<p>对数值字面量使用 <code>toExponential()</code> 方法，且该数值没有小数点和指数时，应该在该数值与该方法之间隔开一个空格，以避免点号被解释为一个小数点。也可以使用两个点号调用该方法。</p> + +<p>如果一个数值的小数位数多余 <code>fractionDigits</code> 参数所提供的，则该数值将会在 <code>fractionDigits</code> 指定的小数位数处四舍五入。可以查看 {{jsxref("Number.toFixed", "toFixed()")}} 方法描述中关于四舍五入的讨论，同样应用于 <code>toExponential() </code>方法。</p> + +<h3 id="Throws" name="Throws">异常</h3> + +<dl> + <dt>{{jsxref("Global_Objects/RangeError", "RangeError")}}</dt> + <dd>如果 <em>fractionDigits</em> 太小或太大将会抛出该错误。介于 0 和 20（包括20）之间的值不会引起 <code>RangeError</code> 。 执行环境也可以支持更大或更小范围。</dd> +</dl> + +<dl> + <dt>{{jsxref("Global_Objects/TypeError", "TypeError")}}</dt> + <dd>如果该方法在一个非数值类型对象上调用。</dd> +</dl> + +<h2 id="Example" name="Example">示例</h2> + +<pre class="brush:js">var numObj = 77.1234; + +alert("numObj.toExponential() is " + numObj.toExponential()); //输出 7.71234e+1 + +alert("numObj.toExponential(4) is " + numObj.toExponential(4)); //输出 7.7123e+1 + +alert("numObj.toExponential(2) is " + numObj.toExponential(2)); //输出 7.71e+1 + +alert("77.1234.toExponential() is " + 77.1234.toExponential()); //输出 7.71234e+1 + +alert("77 .toExponential() is " + 77 .toExponential()); //输出 7.7e+1</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>ECMAScript 3rd Edition. Implemented in JavaScript 1.5</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.7.4.6', 'Number.prototype.toExponential')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-number.prototype.toexponential', 'Number.prototype.toExponential')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{ CompatibilityTable() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="See_Also" name="See_Also">相关链接</h2> + +<ul> + <li>{{jsxref("Number.prototype.toFixed()")}}</li> + <li>{{jsxref("Number.prototype.toPrecision()")}}</li> + <li>{{jsxref("Number.prototype.toString()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/number/tofixed/index.html b/files/zh-cn/web/javascript/reference/global_objects/number/tofixed/index.html new file mode 100644 index 0000000000..03864f8c9e --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/number/tofixed/index.html @@ -0,0 +1,115 @@ +--- +title: Number.prototype.toFixed() +slug: Web/JavaScript/Reference/Global_Objects/Number/toFixed +translation_of: Web/JavaScript/Reference/Global_Objects/Number/toFixed +--- +<div>{{JSRef}}</div> + +<p><code><strong>toFixed()</strong></code> 方法使用定点表示法来格式化一个数值。</p> + +<div>{{EmbedInteractiveExample("pages/js/number-tofixed.html")}}</div> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code><em>numObj</em>.toFixed(<em>digits</em>)</code></pre> + +<h3 id="Parameter" name="Parameter">参数</h3> + +<dl> + <dt>digits</dt> + <dd>小数点后数字的个数；介于 0 到 20 （包括）之间，实现环境可能支持更大范围。如果忽略该参数，则默认为 0。</dd> +</dl> + +<h3 id="Returns" name="Returns">返回值</h3> + +<p>使用定点表示法表示给定数字的字符串。</p> + +<h3 id="Throws" name="Throws">抛出异常</h3> + +<dl> + <dt>{{jsxref("RangeError")}}</dt> + <dd>如果 <em>digits</em> 参数太小或太大。0 到 20（包括）之间的值不会引起 {{jsxref("RangeError")}}。实现环境（implementations）也可以支持更大或更小的值。</dd> +</dl> + +<dl> + <dt>{{jsxref("TypeError")}}</dt> + <dd>如果该方法在一个非{{jsxref( "Number")}}类型的对象上调用。</dd> +</dl> + +<h2 id="描述">描述</h2> + +<p><font face="Open Sans, sans-serif">一个数值的字符串表现形式，不使用指数记数法，而是在小数点后有 </font>digits<font face="Open Sans, sans-serif">（注：digits具体值取决于传入参数）位数字。</font>该数值在必要时进行四舍五入，另外在必要时会用 0 来填充小数部分，以便小数部分有指定的位数。 如果数值大于 1e+21，该方法会简单调用 {{jsxref("Number.prototype.toString()")}}并返回一个指数记数法格式的字符串。</p> + +<div class="warning"> +<p><strong>Warning:</strong> 浮点数不能精确地用二进制表示所有小数。这可能会导致意外的结果，例如 <code>0.1 + 0.2 === 0.3</code> 返回 <code>false</code> .</p> +</div> + +<h2 id="Example" name="Example">示例</h2> + +<h3 id="使用_toFixed">使用 <code>toFixed</code></h3> + +<pre class="brush: js">var numObj = 12345.6789; + +numObj.toFixed(); // 返回 "12346"：进行四舍六入五看情况，不包括小数部分 +numObj.toFixed(1); // 返回 "12345.7"：进行四舍六入五看情况 + +numObj.toFixed(6); // 返回 "12345.678900"：用0填充 + +(1.23e+20).toFixed(2); // 返回 "123000000000000000000.00" + +(1.23e-10).toFixed(2); // 返回 "0.00" + +2.34.toFixed(1); // 返回 "2.3" + +2.35.toFixed(1) // 返回 '2.4'. Note it rounds up + +2.55.toFixed(1) // 返回 '2.5'. Note it rounds down - see warning above + +-2.34.toFixed(1); // 返回 -2.3 （由于操作符优先级，负数不会返回字符串） + +(-2.34).toFixed(1); // 返回 "-2.3" （若用括号提高优先级，则返回字符串） + +</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('ES3')}}</td> + <td>{{Spec2('ES3')}}</td> + <td>Initial definition. Implemented in JavaScript 1.5.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.7.4.5', 'Number.prototype.toFixed')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-number.prototype.tofixed', 'Number.prototype.toFixed')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{Compat("javascript.builtins.Number.toFixed")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Number.prototype.toExponential()")}}</li> + <li>{{jsxref("Number.prototype.toPrecision()")}}</li> + <li>{{jsxref("Number.prototype.toString()")}}</li> +</ul> + +<div id="gtx-trans" style="position: absolute; left: 561px; top: 1828px;"> +<div class="gtx-trans-icon"></div> +</div> diff --git a/files/zh-cn/web/javascript/reference/global_objects/number/tointeger/index.html b/files/zh-cn/web/javascript/reference/global_objects/number/tointeger/index.html new file mode 100644 index 0000000000..24abe2125e --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/number/tointeger/index.html @@ -0,0 +1,97 @@ +--- +title: Number.toInteger() +slug: Web/JavaScript/Reference/Global_Objects/Number/toInteger +translation_of: Archive/Web/JavaScript/Number.toInteger +--- +<div>{{JSRef("Global_Objects", "Number")}} {{obsolete_header("33")}} {{non-standard_header}}</div> + +<h2 id="Summary" name="Summary">概览</h2> + +<p><strong><code>Number.toInteger()</code></strong> 用来将参数转换成整数,但该方法的实现已被移除.</p> + +<p>如果参数是 {{jsxref("Global_Objects/NaN", "NaN")}}, {{jsxref("Global_Objects/null", "null")}} 或 {{jsxref("Global_Objects/undefined", "undefined")}}, 会返回0 . 如果参数值是true返回1,false的话返回<span style="line-height: 19.0909080505371px;">0</span>.</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code>Number.toInteger(<var>number</var>)</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>number</code></dt> + <dd>将被转换成整数的参数.</dd> +</dl> + +<h2 id="Examples" name="Examples">示例</h2> + +<h3 id="Example:_Using_toInteger" name="Example:_Using_toInteger">例子: 使用 <code>toInteger()方法</code></h3> + +<pre class="brush: js">Number.toInteger(0.1); // 0 +Number.toInteger(1); // 1 +Number.toInteger(Math.PI); // 3 +Number.toInteger(null); // 0 +</pre> + +<h2 id="Specifications" name="Specifications">Specifications</h2> + +<ul> + <li><code>Number.toInteger()</code> 是<span style="line-height: 19.0909080505371px;">ECMAScript 6 起草的一部分</span>, 但在2013-8-23的Draft Rev 17 中被移除 .</li> +</ul> + +<h2 id="Browser_compatibility" name="Browser_compatibility">浏览器兼容性</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>{{CompatNo}}</td> + <td>Firefox 16 to 32</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</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>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>Firefox 16 to 32</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="See_also" name="See_also">See also</h2> + +<ul> + <li>归属于 {{jsxref("Global_Objects/Number", "Number")}} 对象.</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/number/tolocalestring/index.html b/files/zh-cn/web/javascript/reference/global_objects/number/tolocalestring/index.html new file mode 100644 index 0000000000..e907f810c9 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/number/tolocalestring/index.html @@ -0,0 +1,165 @@ +--- +title: Number.prototype.toLocaleString() +slug: Web/JavaScript/Reference/Global_Objects/Number/toLocaleString +tags: + - JavaScript + - 原型 + - 国际化 + - 数字 + - 方法 +translation_of: Web/JavaScript/Reference/Global_Objects/Number/toLocaleString +--- +<div>{{JSRef("Global_Objects", "Number")}}</div> + +<p><code><strong>toLocaleString()</strong></code> 方法返回这个数字在特定语言环境下的表示字符串。</p> + +<p>新的 <code>locales</code> 和 <code>options</code> 参数让应用程序可以指定要进行格式转换的语言，并且定制函数的行为。在旧的实现中，会忽略 <code>locales</code> 和 <code>options</code> 参数，使用的语言环境和返回的字符串的形式完全取决于实现方式。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><em>numObj</em>.toLocaleString(</code><code>[locales [, options]])</code></pre> + +<h3 id="参数">参数</h3> + +<p>查阅<a href="#Browser_Compatibility">浏览器兼容性</a>部分，了解哪些浏览器支持 <code>locales</code> 和 <code>options</code> 参数，通过<a href="#Checking_for_support_for_locales_and_options_arguments">示例: 检查 <code>locales</code> 和 <code>options</code> 参数的支持</a>了解特征检测。</p> + +<div class="note"> +<p><strong>注意:</strong> ECMAScript 国际化 API，在 Firefox 29 中得以实施，增加了 <code>locales</code> 参数的 <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number/toLocaleString"><code>Number.toLocaleString</code></a> 方法。如果参数为 <code>undefined</code>，此方法返回本地操作系统指定的位数，而 Firefox 的早期版本中返回<a href="https://en.wikipedia.org/wiki/Arabic_numerals">阿拉伯语</a>数字。这一变化已被报告为向后影响的兼容性问题并可能会被尽快修复。({{ bug(999003) }})</p> +</div> + +<div>{{page('/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/NumberFormat', '参数')}}</div> + +<h3 id="返回值">返回值</h3> + +<p>返回一个语言环境下的表示字符串。</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用_toLocaleString">使用 <code>toLocaleString</code></h3> + +<p>在没有指定区域的基本使用时，返回使用默认的语言环境和默认选项格式化的字符串。</p> + +<pre class="brush: js">var number = 3500; + +console.log(number.toLocaleString()); // Displays "3,500" if in U.S. English locale +</pre> + +<h3 id="检查_locales_和_options_参数的支持">检查 <code>locales</code> 和 <code>options</code> 参数的支持</h3> + +<p><code>locales</code> 和 <code>options</code> 参数目前还不是所有浏览器都支持的。在 ES5.1 和更新的实现中检查支持情况，可以依靠使用非法参数时规定抛出的 {{jsxref("Global_Objects/RangeError", "RangeError")}} 异常：</p> + +<pre class="brush: js">function toLocaleStringSupportsLocales() { + var number = 0; + try { + number.toLocaleString('i'); + } catch (e) { + return e.name === 'RangeError'; + } + return false; +} +</pre> + +<p>早于 ES5.1 的实现中，如果带参数调用 <code>toLocaleString</code> 并不会抛出范围异常。</p> + +<p>在所有宿主环境下，包括那些支持比 ed 5.1 还早的 ECMA-262 的环境，都能有效检测的方法是直接检测 ECMA-402 中的其它特性，它指定 <code>Number.prototype.toLocaleString</code> 需要支持地区选项：</p> + +<pre class="brush: js">function toLocaleStringSupportsOptions() { + return !!(typeof Intl == 'object' && Intl && typeof Intl.NumberFormat == 'function'); +} +</pre> + +<p>它测试全局的 <code>Intl</code> 对象，检测它不是 <code>null</code> 并且有 <code>NumberFormat</code> 的方法。</p> + +<h3 id="使用_locales">使用 <code>locales</code></h3> + +<p>这个示例展示了不同地区数字格式的差异。为了设置你的应用程序界面下使用的语言格式，请确保使用 <code>locales</code> 参数指定了使用的语言（可能还有一些备用语言）：</p> + +<pre class="brush: js">var number = 123456.789; + +// 德国使用逗号作为小数分隔符，分位周期为千位 +console.log(number.toLocaleString('de-DE')); +// → 123.456,789 + +// 在大多数阿拉伯语国家使用<a href="https://en.wikipedia.org/wiki/Eastern_Arabic_numerals">阿拉伯语</a>数字 +console.log(number.toLocaleString('ar-EG')); +// → ١٢٣٤٥٦٫٧٨٩ + +// 印度使用千位/拉克（十万）/克若尔（千万）分隔 +console.log(number.toLocaleString('en-IN')); +// → 1,23,456.789 + +// nu 扩展字段要求编号系统，e.g. 中文十进制 +console.log(number.toLocaleString('zh-Hans-CN-u-nu-hanidec')); +// → 一二三,四五六.七八九 + +// 当请求不支持的语言时，例如巴厘语，加入一个备用语言，比如印尼语 +console.log(number.toLocaleString(['ban', 'id'])); +// → 123.456,789 +</pre> + +<h3 id="使用_options">使用 <code>options</code></h3> + +<p>通过 <code>toLocaleString</code> 返回的结果可以通过 <code>options</code> 参数进行定制：</p> + +<pre class="brush: js">var number = 123456.789; + +// 要求货币格式 +console.log(number.toLocaleString('de-DE', { style: 'currency', currency: 'EUR' })); +// → 123.456,79 € + +// 日元不使用小数位 +console.log(number.toLocaleString('ja-JP', { style: 'currency', currency: 'JPY' })) +// → ￥123,457 + +// 限制三位有效数字 +console.log(number.toLocaleString('en-IN', { maximumSignificantDigits: 3 })); +// → 1,23,000 +</pre> + +<h2 id="性能">性能</h2> + +<p>当格式化大量数字时，最好建立一个 {{jsxref("Global_Objects/NumberFormat", "NumberFormat")}} 对象并且使用它提供的 {{jsxref("NumberFormat.format")}} 方法。</p> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范</th> + <th scope="col">状态</th> + <th scope="col">注解</th> + </tr> + <tr> + <td>ECMAScript 3rd Edition. Implemented in JavaScript 1.5</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.7.4.3', 'Number.prototype.toLocaleString')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-number.prototype.tolocalestring', 'Number.prototype.toLocaleString')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + <tr> + <td><a href="http://www.ecma-international.org/ecma-402/1.0/#sec-13.2.1">ECMAScript Internationalization API Specification, 1<sup>st</sup> Edition (ECMA-402)</a></td> + <td>Standard</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{Compat("javascript.builtins.Number.toLocaleString")}}</p> + +<div id="compat-mobile"> </div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Number.prototype.toString()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/number/toprecision/index.html b/files/zh-cn/web/javascript/reference/global_objects/number/toprecision/index.html new file mode 100644 index 0000000000..daa0fa0bc8 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/number/toprecision/index.html @@ -0,0 +1,133 @@ +--- +title: Number.prototype.toPrecision() +slug: Web/JavaScript/Reference/Global_Objects/Number/toPrecision +translation_of: Web/JavaScript/Reference/Global_Objects/Number/toPrecision +--- +<div>{{JSRef("Global_Objects", "Number")}}</div> + +<h2 id="Summary" name="Summary">概述</h2> + +<p><code><strong>toPrecision()</strong></code> 方法以指定的精度返回该数值对象的字符串表示。</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code><em>numObj</em>.toPrecision(<em>precision</em>)</code></pre> + +<h3 id="Parameter" name="Parameter">参数</h3> + +<dl> + <dt>precision</dt> + <dd>可选。一个用来指定有效数个数的整数。</dd> +</dl> + +<h3 id="Returns" name="Returns">返回值</h3> + +<p>以定点表示法或指数表示法表示的一个数值对象的字符串表示，四舍五入到 <code>precision</code> 参数指定的显示数字位数。查看 {{jsxref("Number.prototype.toFixed()")}} 方法关于四舍五入的讨论，同样应用于 <code>toPrecision</code> 方法。</p> + +<p>如果忽略 <code>precision</code> 参数，则该方法表现类似于 {{jsxref("Number.prototype.toString()")}}。如果该参数是一个非整数值，将会向下舍入到最接近的整数。</p> + +<h3 id="异常">异常</h3> + +<dl> + <dt>{{jsxref("Global_Objects/RangeError", "RangeError")}}</dt> + <dd>如果 <em>precison</em> 参数不在 1 和 100 （包括）之间，将会抛出一个 <code>RangeError</code> 。执行环境也可以支持更大或更小的范围。ECMA-262 只需要最多 21 位显示数字。</dd> +</dl> + +<h2 id="Example" name="Example">示例</h2> + +<pre class="brush: js">var numObj = 5.123456; +console.log("numObj.toPrecision() is " + numObj.toPrecision()); //输出 5.123456 +console.log("numObj.toPrecision(5) is " + numObj.toPrecision(5)); //输出 5.1235 +console.log("numObj.toPrecision(2) is " + numObj.toPrecision(2)); //输出 5.1 +console.log("numObj.toPrecision(1) is " + numObj.toPrecision(1)); //输出 5 + +// 注意：在某些情况下会以指数表示法返回 +console.log((1234.5).toPrecision(2)); // "1.2e+3" +</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>ECMAScript 3rd Edition. Implemented in JavaScript 1.5</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.7.4.7', 'Number.prototype.toPrecision')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-number.prototype.toprecision', 'Number.prototype.toPrecision')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{ CompatibilityTable() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="See_Also" name="See_Also">相关链接</h2> + +<ul> + <li>{{jsxref("Number.prototype.toFixed()")}}</li> + <li>{{jsxref("Number.prototype.toExponential()")}}</li> + <li>{{jsxref("Number.prototype.toString()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/number/tosource/index.html b/files/zh-cn/web/javascript/reference/global_objects/number/tosource/index.html new file mode 100644 index 0000000000..3ed14e1397 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/number/tosource/index.html @@ -0,0 +1,80 @@ +--- +title: Number.prototype.toSource() +slug: Web/JavaScript/Reference/Global_Objects/Number/toSource +translation_of: Web/JavaScript/Reference/Global_Objects/Number/toSource +--- +<div> + {{JSRef("Global_Objects", "Number")}} {{ Non-standard_header() }}</div> +<h2 id="Summary" name="Summary">概述</h2> +<p><code><strong>toSource()</strong></code> 方法返回该对象源码的字符串表示。</p> +<h2 id="Syntax" name="Syntax">语法</h2> +<pre class="syntaxbox">numObj.toSource(); +Number.toSource(); +</pre> +<h3 id="Parameters" name="Parameters">参数</h3> +<p>无</p> +<h2 id="Description" name="Description">描述</h2> +<p><code>toSource()</code> 方法返回下列值：</p> + +<ul> + <li>对于内置 <code>Number</code> 对象， <code>toSource()</code> 返回下面字符串，用来指明源码是不可见的。</li> +</ul> +<pre class="eval">function Number() { [native code] }</pre> +<ul> + <li>对于 <code>Number</code> 对象的实例，<code>toSource()</code> 返回一个表示源码的字符串。</li> +</ul> +<p>该方法通常被 JavaScript 内部调用，而不是在代码中显示调用。</p> +<h2 id="规范">规范</h2> +<p>不是任何标准的一部分。在 JavaScript 1.3 被实现。</p> +<h2 id="浏览器兼容性">浏览器兼容性</h2> +<p>{{ CompatibilityTable() }}</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>{{ CompatUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + </tr> + </tbody> + </table> +</div> +<h2 id="See_Also" name="See_Also">相关链接</h2> +<ul> + <li>{{jsxref("Object.prototype.toSource()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/number/tostring/index.html b/files/zh-cn/web/javascript/reference/global_objects/number/tostring/index.html new file mode 100644 index 0000000000..30fdc17406 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/number/tostring/index.html @@ -0,0 +1,149 @@ +--- +title: Number.prototype.toString() +slug: Web/JavaScript/Reference/Global_Objects/Number/toString +tags: + - Bug + - Number.prototype.toString() + - Tips +translation_of: Web/JavaScript/Reference/Global_Objects/Number/toString +--- +<p>{{JSRef}}</p> + +<p><strong><code>toString()</code></strong> 方法返回指定 {{jsxref("Number")}} 对象的字符串表示形式。</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre><code><var>numObj</var>.toString([<var>radix</var>])</code> +</pre> + +<h3 id="Parameter" name="Parameter">参数</h3> + +<dl> + <dt>radix</dt> + <dd>指定要用于数字到字符串的转换的基数(从2到36)。如果未指定 <samp>radix</samp> 参数，则默认值为 10。</dd> +</dl> + +<h3 id="异常信息">异常信息</h3> + +<dl> + <dt>{{jsxref("RangeError")}}</dt> + <dd> + <p>如果 <code>toString()</code> 的 radix 参数不在 2 到 36 之间，将会抛出一个 {{jsxref("RangeError")}}。</p> + </dd> +</dl> + +<h2 id="Description" name="Description">描述</h2> + +<p>{{jsxref("Number")}} 对象覆盖了 {{jsxref("Object")}} 对象上的 <code>toString()</code> 方法，它不是继承的 {{jsxref("Object.prototype.toString()")}}。对于 {{jsxref( "Number")}} 对象，<code>toString()</code> 方法以指定的基数返回该对象的字符串表示。</p> + +<p>如果转换的基数大于10，则会使用字母来表示大于9的数字，比如基数为16的情况，则使用a到f的字母来表示10到15。</p> + +<p>如果基数没有指定，则使用 10。</p> + +<p>如果对象是负数，则会保留负号。即使radix是2时也是如此：返回的字符串包含一个负号（-）前缀和正数的二进制表示，<strong>不是</strong> 数值的二进制补码。</p> + +<p>进行数字到字符串的转换时，建议<strong>用小括号将要转换的目标括起来</strong>，防止出错。</p> + +<h2 id="Examples" name="Examples">例子</h2> + +<pre class="brush: js"><code>var count = 10; + +console.log(count.toString()); // 输出 '10' +console.log((17).toString()); // 输出 '17' +console.log((17.2).toString()); // 输出 '17.2' + +var x = 6; + +console.log(x.toString(2)); // 输出 '110' +console.log((254).toString(16)); // 输出 'fe' + +console.log((-10).toString(2)); // 输出 '-1010' +console.log((-0xff).toString(2)); // 输出 '-11111111'</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>{{SpecName('ES1')}}</td> + <td>{{Spec2('ES1')}}</td> + <td>Initial definition. Implemented in JavaScript 1.1.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.7.4.2', 'Number.prototype.tostring')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-number.prototype.tostring', 'Number.prototype.tostring')}}</td> + <td>{{Spec2('ES6')}}</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>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</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>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Number.prototype.toFixed()")}}</li> + <li>{{jsxref("Number.prototype.toExponential()")}}</li> + <li>{{jsxref("Number.prototype.toPrecision()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/number/valueof/index.html b/files/zh-cn/web/javascript/reference/global_objects/number/valueof/index.html new file mode 100644 index 0000000000..81168e6ea0 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/number/valueof/index.html @@ -0,0 +1,122 @@ +--- +title: Number.prototype.valueOf() +slug: Web/JavaScript/Reference/Global_Objects/Number/valueOf +tags: + - JavaScript + - Method + - Number + - valueOf() +translation_of: Web/JavaScript/Reference/Global_Objects/Number/valueOf +--- +<div>{{JSRef("Global_Objects", "Number")}}</div> + +<h2 id="Summary" name="Summary">概述</h2> + +<p><strong><code>valueOf()</code></strong> 方法返回一个被 {{jsxref("Global_Objects/Number", "Number")}} 对象包装的原始值。</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code><var>numObj</var>.valueOf()</code></pre> + +<h3 id="Parameters" name="Parameters">返回值</h3> + +<p>表示指定 {{jsxref("Number")}} 对象的原始值的数字</p> + +<h2 id="Description" name="Description">描述</h2> + +<p>该方法通常是由 JavaScript 引擎在内部隐式调用的，而不是由用户在代码中显式调用的。</p> + +<h2 id="Examples" name="Examples">示例</h2> + +<pre class="brush: js">var numObj = new Number(10); +console.log(typeof numObj); // object + +var num = numObj.valueOf(); +console.log(num); // 10 +console.log(typeof num); // number +</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>ECMAScript 1st Edition.</td> + <td>Standard</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.7.4.4', 'Number.prototype.valueOf')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-number.prototype.valueof', 'Number.prototype.valueOf')}}</td> + <td>{{Spec2('ES6')}}</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>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</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>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("Number.prototype.toSource()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/object/__definegetter__/index.html b/files/zh-cn/web/javascript/reference/global_objects/object/__definegetter__/index.html new file mode 100644 index 0000000000..28773a6bc8 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/object/__definegetter__/index.html @@ -0,0 +1,107 @@ +--- +title: Object.prototype.__defineGetter__() +slug: Web/JavaScript/Reference/Global_Objects/Object/__defineGetter__ +translation_of: Web/JavaScript/Reference/Global_Objects/Object/__defineGetter__ +--- +<div> + {{JSRef("Global_Objects", "Object")}} {{non-standard_header}} {{deprecated_header}}</div> +<h2 id="Summary" name="Summary">概述</h2> +<p><code><strong>__defineGetter__</strong></code> 方法可以将一个函数绑定在当前对象的指定属性上，当那个属性的值被读取时，你所绑定的函数就会被调用。</p> +<h2 id="Syntax" name="Syntax">语法</h2> +<pre class="syntaxbox"><code><var>obj</var>.__defineGetter__(<var>prop</var>, <var>func</var>)</code></pre> +<h3 id="Parameters" name="Parameters">参数</h3> +<dl> + <dt> + <code>prop</code></dt> + <dd> + 一个字符串，表示指定的属性名。</dd> + <dt> + <code>func</code></dt> + <dd> + 一个函数，当 <code>prop</code> 属性的值被读取时自动被调用。</dd> +</dl> +<h2 id="Description" name="Description">描述</h2> +<p><code>__defineGetter__ 方法可以为一个已经存在的对象设置（新建或修改）访问器属性，</code>而 {{jsxref("Operators/get", "对象字面量中的 get 语法", "", 1)}} 只能在新建一个对象时使用。</p> +<h2 id="Examples" name="Examples"><span class="def"><span>示例</span></span></h2> +<pre class="brush: js">// 请注意，该方法是非标准的： + +var o = {}; +o.__defineGetter__('gimmeFive', function() { return 5; }); +console.log(o.gimmeFive); // 5 + + +// 请尽可能使用下面的两种推荐方式来代替： + +// 1. 在对象字面量中使用 get 语法 +var o = { get gimmeFive() { return 5; } }; +console.log(o.gimmeFive); // 5 + +// 2. 使用 Object.defineProperty 方法 +var o = {}; +Object.defineProperty(o, 'gimmeFive', { + get: function() { + return 5; + } +}); +console.log(o.gimmeFive); // 5 +</pre> +<h2 id="Specifications" name="Specifications">规范</h2> +<p>不属于任何规范。</p> +<h2 id="Browser_compatibility" name="Browser_compatibility">浏览器兼容性</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>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatIE("11")}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</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>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + </tbody> + </table> +</div> +<h2 id="See_also" name="See_also">相关链接</h2> +<ul> + <li>{{jsxref("Object.prototype.__defineSetter__()")}}</li> + <li>{{jsxref("Operators/get", "get")}} operator</li> + <li>{{jsxref("Object.defineProperty()")}}</li> + <li>{{jsxref("Object.prototype.__lookupGetter__()")}}</li> + <li><a href="/zh-CN/docs/Web/JavaScript/Guide/Working_with_Objects#Defining_getters_and_setters">JS 指南: 定义 Getter 和 Setter</a></li> + <li><a href="http://whereswalden.com/2010/04/16/more-spidermonkey-changes-ancient-esoteric-very-rarely-used-syntax-for-creating-getters-and-setters-is-being-removed/">[个人博文] defineGetter__ 和 __defineSetter__已被废弃</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/object/__definesetter__/index.html b/files/zh-cn/web/javascript/reference/global_objects/object/__definesetter__/index.html new file mode 100644 index 0000000000..81a159b69f --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/object/__definesetter__/index.html @@ -0,0 +1,92 @@ +--- +title: Object.prototype.__defineSetter__() +slug: Web/JavaScript/Reference/Global_Objects/Object/__defineSetter__ +translation_of: Web/JavaScript/Reference/Global_Objects/Object/__defineSetter__ +--- +<div> + {{JSRef("Global_Objects", "Object")}} {{non-standard_header}} {{deprecated_header}}</div> +<h2 id="Summary" name="Summary"><span class="def"><span>概述</span></span></h2> +<p><code><strong>__defineSetter__ </strong>方法可以将一个函数绑定在当前对象的指定属性</code>上，当那个属性被赋值时，你所绑定的函数就会被调用。</p> +<h2 id="Syntax" name="Syntax">语法</h2> +<pre class="syntaxbox"><code><var>obj</var>.__defineSetter__(<var>prop</var>, <var>fun</var>)</code></pre> +<h3 id="Parameters" name="Parameters">参数</h3> +<dl> + <dt> + <code>prop</code></dt> + <dd> + 一个字符串，表示指定的属性名。</dd> + <dt> + <code>fun</code></dt> + <dd> + 一个函数，当试图去为 <code>sprop</code> 属性赋值时被调用。通常你要给这个函数指定一个参数：<br> + <pre>function(<var>val</var>) { . . . }</pre> + <dl> + <dt> + <code>val</code></dt> + <dd> + 任意的参数名，在 fun 被调用时，该参数的值就是尝试给 <code>sprop</code> 属性所赋的值。</dd> + </dl> + </dd> +</dl> +<h2 id="Description" name="Description">描述</h2> +<p><code>__defineSetter__</code> 方法可以为一个已经存在的对象设置（新建或修改）访问器属性，而 {{jsxref("Operators/set", "对象字面量中的 set 语法", "", 1)}} 只能在新建一个对象时使用。</p> +<h2 id="Specifications" name="Specifications">规范</h2> +<p>不属于任何规范。</p> +<h2 id="Browser_compatibility" name="Browser_compatibility"><span class="def"><span>浏览器兼容性</span></span></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>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatIE("11")}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</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>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + </tbody> + </table> +</div> +<h2 id="See_also" name="See_also">相关链接</h2> +<ul> + <li>{{jsxref("Object.prototype.__defineGetter__()")}}</li> + <li>{{jsxref("Operators/set", "set")}} operator</li> + <li>{{jsxref("Object.defineProperty()")}}</li> + <li>{{jsxref("Object.prototype.__lookupSetter__()")}}</li> + <li><a href="/zh-CN/docs/Web/JavaScript/Guide/Working_with_Objects#Defining_getters_and_setters">JS 指南: 定义 Getter 和 Setter</a></li> + <li><a href="http://whereswalden.com/2010/04/16/more-spidermonkey-changes-ancient-esoteric-very-rarely-used-syntax-for-creating-getters-and-setters-is-being-removed/">[个人博客] defineGetter__ 和 __defineSetter__</a>已被废弃</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/object/__lookupgetter__/index.html b/files/zh-cn/web/javascript/reference/global_objects/object/__lookupgetter__/index.html new file mode 100644 index 0000000000..a94f293880 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/object/__lookupgetter__/index.html @@ -0,0 +1,121 @@ +--- +title: Object.prototype.__lookupGetter__() +slug: Web/JavaScript/Reference/Global_Objects/Object/__lookupGetter__ +translation_of: Web/JavaScript/Reference/Global_Objects/Object/__lookupGetter__ +--- +<div>{{JSRef("Global_Objects", "Object")}} {{ Non-standard_header }} {{ Deprecated_header }}</div> + +<h2 id="Summary" name="Summary">概述</h2> + +<p><code><strong>__lookupGetter__</strong></code> 方法会返回当前对象上指定属性的<strong>属性读取访问器函数（getter）。</strong></p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code><em>obj</em>.__lookupGetter__(<em>sprop</em>)</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>sprop</code></dt> + <dd>属性名</dd> +</dl> + +<h2 id="Examples" name="Examples">示例</h2> + +<pre class="brush: js">var obj = { + get foo() { + return Math.random() > 0.5 ? "foo" : "bar"; + } +}; + +obj.__lookupGetter__("foo") +// (function (){return Math.random() > 0.5 ? "foo" : "bar"}) </pre> + +<h2 id="Description" name="Description">附注</h2> + +<p><code><strong>__lookupGetter__</strong></code> 方法是非标准的，我们应该使用标准中定义的方法来完成同样的事情，那就是 {{jsxref("Object.getOwnPropertyDescriptor()")}} 方法：</p> + +<pre class="brush: js">var obj = { + get foo() { + return Math.random() > 0.5 ? "foo" : "bar"; + } +}; + +Object.getOwnPropertyDescriptor(obj, "foo").get +// (function (){return Math.random() > 0.5 ? "foo" : "bar"}) +</pre> + +<p>如果那个访问器属性是继承来的，你还需要使用 {{jsxref("Object.getPrototypeOf()")}}：</p> + +<pre class="brush: js">var obj = {}; +var prototype = Object.getPrototypeOf(obj); +Object.getOwnPropertyDescriptor(prototype, "foo").get +// function __proto__() {[native code]} +</pre> + +<h2 id="Specifications" name="Specifications">规范</h2> + +<p>不属于任何规范。</p> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{ CompatibilityTable() }}</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>{{CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{CompatVersionUnknown() }}</td> + <td>{{CompatVersionUnknown() }}</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>{{CompatVersionUnknown() }}</td> + <td>{{CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{CompatVersionUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("Object.__lookupSetter__", "Object.prototype.__lookupSetter__()")}}</li> + <li>{{jsxref("Operators/get", "get")}} 运算符</li> + <li>{{jsxref("Object.getOwnPropertyDescriptor()")}} 和 {{jsxref("Object.getPrototypeOf()")}}</li> + <li>{{jsxref("Object.__defineGetter__", "Object.prototype.__defineGetter__()")}}</li> + <li>{{jsxref("Object.__defineSetter__", "Object.prototype.__defineSetter__()")}}</li> + <li><a href="/zh-CN/docs/Web/JavaScript/Guide/Working_with_Objects#Defining_getters_and_setters" title="JavaScript/Guide/Creating_New_Objects/Defining_Getters_and_Setters">JS 指南：定义访问器属性</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/object/__lookupsetter__/index.html b/files/zh-cn/web/javascript/reference/global_objects/object/__lookupsetter__/index.html new file mode 100644 index 0000000000..6481c7f16b --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/object/__lookupsetter__/index.html @@ -0,0 +1,139 @@ +--- +title: Object.prototype.__lookupSetter__() +slug: Web/JavaScript/Reference/Global_Objects/Object/__lookupSetter__ +tags: + - 不建议使用 + - 原型 + - 对象 + - 方法 + - 过时的 + - 非标准 +translation_of: Web/JavaScript/Reference/Global_Objects/Object/__lookupSetter__ +--- +<div>{{JSRef}} {{deprecated_header}}</div> + +<div><code><strong>__lookupSetter__</strong></code> 方法是用来返回一个对象的某个属性上绑定了 setter （设置器）的钩子函数的引用。</div> + +<div> </div> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><var>obj</var>.__lookupSetter__(<var>sprop</var>)</code></pre> + +<h3 id="参数说明">参数说明</h3> + +<dl> + <dt><code>sprop</code></dt> + <dd>一个字符串类型，表示要返回的 setter 钩子的函数名。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>一个绑定了setter的特殊属性的函数引用。</p> + +<h2 id="描述">描述</h2> + +<p>如果一个 setter 被定义在了一个对象的属性上，则不能直接通过该属性来获取引用 setter 所设置的钩子的函数，因为该属性是该函数的返回值，但，__lookupSetter__ 可以被用来获取对 setter 函数的引用。</p> + +<p>不过现在可以使用标准的方法：</p> + +<p>{{jsxref("Object.getOwnPropertyDescriptor()")}}.</p> + +<h2 id="示例">示例</h2> + +<pre class="brush: js">var obj = { + set foo(value) { + this.bar = value; + } +}; + + +// 非标准，并且不推荐使用。 +obj.__lookupSetter__('foo') +// (function(value) { this.bar = value; }) + + +// 标准且推荐使用的方式。 +Object.getOwnPropertyDescriptor(obj, 'foo').set; +// (function(value) { this.bar = value; }) +</pre> + +<h2 id="规范">规范</h2> + +<table class="spectable standard-table"> + <tbody> + <tr> + <th scope="col">规范</th> + <th scope="col">状态</th> + <th scope="col">备注</th> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-object.prototype.__lookupSetter__', 'Object.prototype.__lookupSetter__()')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td>包含在（规范性）附件中，用于Web浏览器的附加ECMAScript遗留功能（请注意，这份规范编撰的内容已经是准备实现的了）。</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>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatIE("11")}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</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>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Object.prototype.__lookupGetter__()")}}</li> + <li>{{jsxref("Functions/set", "set")}} operator</li> + <li>{{jsxref("Object.getOwnPropertyDescriptor()")}} and {{jsxref("Object.getPrototypeOf()")}}</li> + <li>{{jsxref("Object.prototype.__defineGetter__()")}}</li> + <li>{{jsxref("Object.prototype.__defineSetter__()")}}</li> + <li><a href="/en-US/docs/Web/JavaScript/Guide/Working_with_Objects#Defining_getters_and_setters">JS Guide: Defining Getters and Setters</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/object/assign/index.html b/files/zh-cn/web/javascript/reference/global_objects/object/assign/index.html new file mode 100644 index 0000000000..13cc1854d6 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/object/assign/index.html @@ -0,0 +1,321 @@ +--- +title: Object.assign() +slug: Web/JavaScript/Reference/Global_Objects/Object/assign +tags: + - ECMAScript 2015 + - JavaScript + - Method + - Object + - Object.assign + - polyfill +translation_of: Web/JavaScript/Reference/Global_Objects/Object/assign +--- +<div>{{JSRef}}</div> + +<p><code><strong>Object.assign()</strong></code> 方法用于将所有可枚举属性的值从一个或多个源对象分配到目标对象。它将返回目标对象。</p> + +<div>{{EmbedInteractiveExample("pages/js/object-assign.html")}}</div> + + + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox notranslate"><code>Object.assign(<var>target</var>, ...<var>sources</var>)</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>target</code></dt> + <dd>目标对象。</dd> + <dt><code>sources</code></dt> + <dd>源对象。</dd> +</dl> + +<h3 id="Return_value" name="Return_value">返回值</h3> + +<p>目标对象。</p> + +<h2 id="描述">描述</h2> + +<p>如果目标对象中的属性具有相同的键，则属性将被源对象中的属性覆盖。后面的源对象的属性将类似地覆盖前面的源对象的属性。</p> + +<p><code>Object.assign</code> 方法只会拷贝源对象自身的并且可枚举的属性到目标对象。该方法使用源对象的<code>[[Get]]</code>和目标对象的<code>[[Set]]</code>，所以它会调用相关 getter 和 setter。因此，它分配属性，而不仅仅是复制或定义新的属性。如果合并源包含getter，这可能使其不适合将新属性合并到原型中。为了将属性定义（包括其可枚举性）复制到原型，应使用{{jsxref("Object.getOwnPropertyDescriptor()")}}和{{jsxref("Object.defineProperty()")}} 。</p> + +<p>{{jsxref("String")}}类型和 {{jsxref("Symbol")}} 类型的属性都会被拷贝。</p> + +<p>在出现错误的情况下，例如，如果属性不可写，会引发{{jsxref("TypeError")}}，如果在引发错误之前添加了任何属性，则可以更改<code>target</code>对象。</p> + +<div class="blockIndicator note"> +<p>注意，<code>Object.assign</code> 不会在那些<code>source</code>对象值为 {{jsxref("null")}} 或 {{jsxref("undefined")}} 的时候抛出错误。</p> +</div> + +<h2 id="Polyfill_2">Polyfill</h2> + +<p>这个 <a href="https://wiki.developer.mozilla.org/en-US/docs/Glossary/Polyfill">polyfill</a> 不支持 symbol 属性, 由于 ES5 中本来就不存在 symbols :</p> + +<pre class="notranslate">if (typeof Object.assign !== 'function') { + // Must be writable: true, enumerable: false, configurable: true + Object.defineProperty(Object, "assign", { + value: function assign(target, varArgs) { // .length of function is 2 + 'use strict'; + if (target === null || target === undefined) { + throw new TypeError('Cannot convert undefined or null to object'); + } + + var to = Object(target); + + for (var index = 1; index < arguments.length; index++) { + var nextSource = arguments[index]; + + if (nextSource !== null && nextSource !== undefined) { + for (var nextKey in nextSource) { + // Avoid bugs when hasOwnProperty is shadowed + if (Object.prototype.hasOwnProperty.call(nextSource, nextKey)) { + to[nextKey] = nextSource[nextKey]; + } + } + } + } + return to; + }, + writable: true, + configurable: true + }); +}</pre> + +<h2 id="Examples" name="Examples">示例</h2> + +<h3 id="Example_Cloning_an_object" name="Example:_Cloning_an_object">复制一个对象</h3> + +<pre class="brush: js notranslate">const obj = { a: 1 }; +const copy = Object.assign({}, obj); +console.log(copy); // { a: 1 } +</pre> + +<h3 id="Deep_Clone" name="Deep_Clone">深拷贝问题</h3> + +<p>针对深拷贝，需要使用其他办法，因为 <code>Object.assign()</code>拷贝的是（可枚举）属性值。</p> + +<p>假如源值是一个对象的引用，它仅仅会复制其引用值。</p> + +<pre class="brush: js notranslate">const log = console.log; + +function test() { + 'use strict'; + let obj1 = { a: 0 , b: { c: 0}}; + let obj2 = Object.assign({}, obj1); + log(JSON.stringify(obj2)); + // { a: 0, b: { c: 0}} + + obj1.a = 1; + log(JSON.stringify(obj1)); + // { a: 1, b: { c: 0}} + log(JSON.stringify(obj2)); + // { a: 0, b: { c: 0}} + + obj2.a = 2; + log(JSON.stringify(obj1)); + // { a: 1, b: { c: 0}} + log(JSON.stringify(obj2)); + // { a: 2, b: { c: 0}} + + obj2.b.c = 3; + log(JSON.stringify(obj1)); + // { a: 1, b: { c: 3}} + log(JSON.stringify(obj2)); + // { a: 2, b: { c: 3}} + + // Deep Clone + obj1 = { a: 0 , b: { c: 0}}; + let obj3 = JSON.parse(JSON.stringify(obj1)); + obj1.a = 4; + obj1.b.c = 4; + log(JSON.stringify(obj3)); + // { a: 0, b: { c: 0}} +} + +test(); +</pre> + +<h3 id="Example_Merging_objects" name="Example:_Merging_objects">合并对象</h3> + +<pre class="brush: js notranslate">const o1 = { a: 1 }; +const o2 = { b: 2 }; +const o3 = { c: 3 }; + +const obj = Object.assign(o1, o2, o3); +console.log(obj); // { a: 1, b: 2, c: 3 } +console.log(o1); // { a: 1, b: 2, c: 3 }, 注意目标对象自身也会改变。 +</pre> + +<h3 id="合并具有相同属性的对象">合并具有相同属性的对象</h3> + +<pre class="brush: js notranslate">const o1 = { a: 1, b: 1, c: 1 }; +const o2 = { b: 2, c: 2 }; +const o3 = { c: 3 }; + +const obj = Object.assign({}, o1, o2, o3); +console.log(obj); // { a: 1, b: 2, c: 3 }</pre> + +<p>属性被后续参数中具有相同属性的其他对象覆盖。</p> + +<h3 id="Example_Symbol_properties" name="Example:_Symbol_properties">拷贝 symbol 类型的属性</h3> + +<pre class="brush: js notranslate">const o1 = { a: 1 }; +const o2 = { [Symbol('foo')]: 2 }; + +const obj = Object.assign({}, o1, o2); +console.log(obj); // { a : 1, [Symbol("foo")]: 2 } (cf. bug 1207182 on Firefox) +Object.getOwnPropertySymbols(obj); // [Symbol(foo)]</pre> + +<h3 id="Example_Only_own_enumerable_properties" name="Example:_Only_own_enumerable_properties">继承属性和不可枚举属性是不能拷贝的</h3> + +<pre class="brush: js notranslate">const obj = Object.create({foo: 1}, { // foo 是个继承属性。 + bar: { + value: 2 // bar 是个不可枚举属性。 + }, + baz: { + value: 3, + enumerable: true // baz 是个自身可枚举属性。 + } +}); + +const copy = Object.assign({}, obj); +console.log(copy); // { baz: 3 } +</pre> + +<h3 id="Example_Primitives" name="Example:_Primitives">原始类型会被包装为对象</h3> + +<pre class="brush: js notranslate">const v1 = "abc"; +const v2 = true; +const v3 = 10; +const v4 = Symbol("foo") + +const obj = Object.assign({}, v1, null, v2, undefined, v3, v4); +// 原始类型会被包装，null 和 undefined 会被忽略。 +// 注意，只有字符串的包装对象才可能有自身可枚举属性。 +console.log(obj); // { "0": "a", "1": "b", "2": "c" }</pre> + +<h3 id="Example_Exceptions" name="Example:_Exceptions">异常会打断后续拷贝任务</h3> + +<pre class="brush: js notranslate">const target = Object.defineProperty({}, "foo", { + value: 1, + writable: false +}); // target 的 foo 属性是个只读属性。 + +Object.assign(target, {bar: 2}, {foo2: 3, foo: 3, foo3: 3}, {baz: 4}); +// TypeError: "foo" is read-only +// 注意这个异常是在拷贝第二个源对象的第二个属性时发生的。 + +console.log(target.bar); // 2，说明第一个源对象拷贝成功了。 +console.log(target.foo2); // 3，说明第二个源对象的第一个属性也拷贝成功了。 +console.log(target.foo); // 1，只读属性不能被覆盖，所以第二个源对象的第二个属性拷贝失败了。 +console.log(target.foo3); // undefined，异常之后 assign 方法就退出了，第三个属性是不会被拷贝到的。 +console.log(target.baz); // undefined，第三个源对象更是不会被拷贝到的。 +</pre> + +<h3 id="Example_Copy_accessors" name="Example:_Copy_accessors">拷贝访问器</h3> + +<pre class="brush: js notranslate">const obj = { + foo: 1, + get bar() { + return 2; + } +}; + +let copy = Object.assign({}, obj); +console.log(copy); // { foo: 1, bar: 2 } copy.bar的值来自obj.bar的getter函数的返回值 + +// 下面这个函数会拷贝所有自有属性的属性描述符 +function completeAssign(target, ...sources) { + sources.forEach(source => { + let descriptors = Object.keys(source).reduce((descriptors, key) => { + descriptors[key] = Object.getOwnPropertyDescriptor(source, key); + return descriptors; + }, {}); + + // Object.assign 默认也会拷贝可枚举的Symbols + Object.getOwnPropertySymbols(source).forEach(sym => { + let descriptor = Object.getOwnPropertyDescriptor(source, sym); + if (descriptor.enumerable) { + descriptors[sym] = descriptor; + } + }); + Object.defineProperties(target, descriptors); + }); + return target; +} + +copy = completeAssign({}, obj); +console.log(copy); +// { foo:1, get bar() { return 2 } } +</pre> + +<h2 id="Polyfill" name="Polyfill">Polyfill</h2> + +<p>此{{Glossary("Polyfill","polyfill")}}不支持 symbol 属性，因为ES5 中根本没有 symbol ：</p> + +<pre class="brush: js notranslate">if (typeof Object.assign != 'function') { + // Must be writable: true, enumerable: false, configurable: true + Object.defineProperty(Object, "assign", { + value: function assign(target, varArgs) { // .length of function is 2 + 'use strict'; + if (target == null) { // TypeError if undefined or null + throw new TypeError('Cannot convert undefined or null to object'); + } + + let to = Object(target); + + for (var index = 1; index < arguments.length; index++) { + var nextSource = arguments[index]; + + if (nextSource != null) { // Skip over if undefined or null + for (let nextKey in nextSource) { + // Avoid bugs when hasOwnProperty is shadowed + if (Object.prototype.hasOwnProperty.call(nextSource, nextKey)) { + to[nextKey] = nextSource[nextKey]; + } + } + } + } + return to; + }, + writable: true, + configurable: true + }); +}</pre> + +<h2 id="Specifications" name="Specifications">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范名称</th> + <th scope="col">规范状态</th> + <th scope="col">备注</th> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-object.assign', 'Object.assign')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-object.assign', 'Object.assign')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">浏览器兼容</h2> + +<div class="hidden">The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</div> + +<p>{{Compat("javascript.builtins.Object.assign")}}</p> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("Object.defineProperties()")}}</li> + <li><a href="/zh-CN/docs/Web/JavaScript/Enumerability_and_ownership_of_properties">属性的可枚举性和所有权</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/object/constructor/index.html b/files/zh-cn/web/javascript/reference/global_objects/object/constructor/index.html new file mode 100644 index 0000000000..470072ebe7 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/object/constructor/index.html @@ -0,0 +1,235 @@ +--- +title: Object.prototype.constructor +slug: Web/JavaScript/Reference/Global_Objects/Object/constructor +tags: + - JavaScript + - Object + - Property + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Object/constructor +--- +<p>{{JSRef}}</p> + +<p>返回创建实例对象的 {{jsxref("Object")}} 构造函数的引用。注意，此属性的值是对函数本身的引用，而不是一个包含函数名称的字符串。对原始类型来说，如<code>1</code>，<code>true</code>和<code>"test"</code>，该值只可读。</p> + +<h2 id="Description" name="Description">描述</h2> + +<p>所有对象都会从它的原型上继承一个 <code>constructor</code> 属性：</p> + +<pre class="brush: js">var o = {}; +o.constructor === Object; // true + +var o = new Object; +o.constructor === Object; // true + +var a = []; +a.constructor === Array; // true + +var a = new Array; +a.constructor === Array // true + +var n = new Number(3); +n.constructor === Number; // true</pre> + +<h2 id="Examples" name="Examples">示例</h2> + +<h3 id="Example_Displaying_the_constructor_of_an_object" name="Example:_Displaying_the_constructor_of_an_object">打印一个对象的构造函数</h3> + +<p>以下示例创建一个原型，<code>Tree</code>，以及该类型的对象，即<code>theTree</code>。 然后打印<code>theTree</code>对象的<code>constructor</code>属性。</p> + +<pre class="brush:js">function Tree(name) { + this.name = name; +} + +var theTree = new Tree("Redwood"); +console.log( "theTree.constructor is " + theTree.constructor );</pre> + +<p>打印输出：</p> + +<pre class="brush:js">theTree.constructor is function Tree(name) { + this.name = name; +}</pre> + +<h3 id="Example_Changing_the_constructor_of_an_object" name="Example:_Changing_the_constructor_of_an_object">改变对象的 constructor</h3> + +<p>下面的例子展示了如何修改基本类型对象的 <code>constructor</code> 属性的值。只有 <code>true</code>, <code>1</code> 和 <code>"test"</code> 的不受影响，因为创建他们的是只读的原生构造函数（native constructors）。这个例子也说明了依赖一个对象的 <code>constructor</code> 属性并不安全。</p> + +<pre class="brush:js">function Type() { }; + +var types = [ + new Array, + [], + new Boolean, + true, // remains unchanged + new Date, + new Error, + new Function, + function(){}, + Math, + new Number, + 1, // remains unchanged + new Object, + {}, + new RegExp, + /(?:)/, + new String, + "test" // remains unchanged +]; + +for(var i = 0; i < types.length; i++) { + types[i].constructor = Type; + types[i] = [ types[i].constructor, types[i] instanceof Type, types[i].toString() ]; +}; + +console.log( types.join("\n") ); +</pre> + +<p>此示例显示以下输出：</p> + +<pre class="brush: js">function Type() {},false, +function Type() {},false, +function Type() {},false,false +function Boolean() { + [native code] +},false,true +function Type() {},false,Mon Sep 01 2014 16:03:49 GMT+0600 +function Type() {},false,Error +function Type() {},false,function anonymous() { + +} +function Type() {},false,function () {} +function Type() {},false,[object Math] +function Type() {},false,0 +function Number() { + [native code] +},false,1 +function Type() {},false,[object Object] +function Type() {},false,[object Object] +function Type() {},false,/(?:)/ +function Type() {},false,/(?:)/ +function Type() {},false, +function String() { + [native code] +},false,test +</pre> + + + +<h3 id="改变函数的_constructor">改变函数的 constructor</h3> + +<p>大多数情况下，此属性用于定义一个构造函数，并使用<strong>new</strong>和继承原型链进一步调用它。</p> + +<pre class="brush: js">function Parent() {} +Parent.prototype.parentMethod = function parentMethod() {}; + +function Child() {} +Child.prototype = Object.create(Parent.prototype); // re-define child prototype to Parent prototype + +Child.prototype.constructor = Child; // return original constructor to Child</pre> + +<p>但为什么我们需要在这里执行最后一行？很不幸正确答案是 - 看情况而定。</p> + +<p>让我们来尝试定义在哪些情况下，重新分配原始构造函数会发挥重要作用，以及在什么时候它就是额外的未使用的（无效的）代码行。</p> + +<p>试想下一种情况：该对象具有创建自身的<strong>create</strong>方法。</p> + +<pre class="brush: js">function Parent() {}; +function CreatedConstructor() {} + +CreatedConstructor.prototype = Object.create(Parent.prototype); + +CreatedConstructor.prototype.create = function create() { + return new this.constructor(); +} + +new CreatedConstructor().create().create(); // error undefined is not a function since constructor === Parent +</pre> + +<p>在上面的示例中，将显示异常，因为构造函数链接到Parent。</p> + +<p>为了避免它，只需分配您将要使用的必要构造函数。</p> + +<pre class="brush: js">function Parent() {}; +function CreatedConstructor() {} + +CreatedConstructor.prototype = Object.create(Parent.prototype); +CreatedConstructor.prototype.constructor = CreatedConstructor; // set right constructor for further using + +CreatedConstructor.prototype.create = function create() { + return new this.constructor(); +} + +new CreatedConstructor().create().create(); // it's pretty fine</pre> + +<p>好的，现在很清楚为什么更改构造函数会很有用。</p> + +<p>让我们再考虑一个案例。</p> + +<pre class="brush: js">function ParentWithStatic() {} + +ParentWithStatic.startPosition = { x: 0, y:0 }; +ParentWithStatic.getStartPosition = function getStartPosition() { + return this.startPosition; +} + +function Child(x, y) { + this.position = { + x: x, + y: y + }; +} + +Child.prototype = Object.create(ParentWithStatic.prototype); +Child.prototype.constructor = Child; + +Child.prototype.getOffsetByInitialPosition = function getOffsetByInitialPosition() { + var position = this.position; + var startPosition = this.constructor.getStartPosition(); // error undefined is not a function, since the constructor is Child + + return { + offsetX: startPosition.x - position.x, + offsetY: startPosition.y - position.y + } +};</pre> + +<p>对于此示例，我们需要保持父构造函数继续正常工作。</p> + +<p><strong>总结</strong>：手动设置或更新构造函数可能会导致不同且有时令人困惑的后果。为了防止它，只需在每个特定情况下定义构造函数的角色。在大多数情况下，不使用构造函数，并且不需要重新分配构造函数。</p> + +<h2 id="规范" style="margin-bottom: 20px; line-height: 30px;">规范</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('ES1')}}</td> + <td>{{Spec2('ES1')}}</td> + <td>Initial definition. Implemented in JavaScript 1.1.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.2.4.1', 'Object.prototype.constructor')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-object.prototype.constructor', 'Object.prototype.constructor')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-object.prototype.constructor', 'Object.prototype.constructor')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容">浏览器兼容</h2> + +<div class="hidden">The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</div> + +<p>{{Compat("javascript.builtins.Object.constructor")}}</p> diff --git a/files/zh-cn/web/javascript/reference/global_objects/object/count/index.html b/files/zh-cn/web/javascript/reference/global_objects/object/count/index.html new file mode 100644 index 0000000000..c7dfb12f2b --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/object/count/index.html @@ -0,0 +1,88 @@ +--- +title: Object.prototype.__count__ +slug: Web/JavaScript/Reference/Global_Objects/Object/count +tags: + - JavaScript + - Object + - Obsolete + - Property + - Prototype +translation_of: Archive/Web/JavaScript/Object.count +--- +<div>{{JSRef}} {{obsolete_header("2")}}</div> + +<p> <strong><code>__count__</code></strong> 属性曾经用来存放对象的可枚举的属性的个数，但是已经被废除。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><var>obj</var>.__count__</code></pre> + +<h2 id="示例">示例</h2> + +<pre class="brush: js">{ 1: 1 }.__count__ // 1 +[].__count__ // 0 +[1].__count__ // 1 +[1, /* hole */, 2, 3].__count__ // 3 +</pre> + +<h2 id="详细说明">详细说明</h2> + +<p>无需详细说明</p> + +<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>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</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>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="更多请参看">更多请参看</h2> + +<ul> + <li><a class="external" href="http://whereswalden.com/2010/04/06/more-changes-coming-to-spidermonkey-the-magical-__count__-property-of-objects-is-being-removed/">[Blog post] More changes coming to SpiderMonkey: the magical __count__ property is being removed</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/object/create/index.html b/files/zh-cn/web/javascript/reference/global_objects/object/create/index.html new file mode 100644 index 0000000000..4cc48defc5 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/object/create/index.html @@ -0,0 +1,227 @@ +--- +title: Object.create() +slug: Web/JavaScript/Reference/Global_Objects/Object/create +tags: + - ECMAScript5 + - JavaScript + - Method + - Object + - Reference + - polyfill +translation_of: Web/JavaScript/Reference/Global_Objects/Object/create +--- +<div>{{JSRef}}</div> + +<p><strong><code>Object.create()</code></strong>方法创建一个新对象，使用现有的对象来提供新创建的对象的__proto__。 （请打开浏览器控制台以查看运行结果。）</p> + +<div>{{EmbedInteractiveExample("pages/js/object-create.html", "taller")}}</div> + +<div class="hidden">The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> and send us a pull request.</div> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="notranslate">Object.create(<var>proto，[</var><var>propertiesObject</var>])</pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>proto</code></dt> + <dd>新创建对象的原型对象。</dd> + <dt><code>propertiesObject</code></dt> + <dd>可选。需要传入一个对象，该对象的属性类型参照{{jsxref("Object.defineProperties()")}}的第二个参数。如果该参数被指定且不为 {{jsxref("undefined")}}，该传入对象的自有可枚举属性(即其自身定义的属性，而不是其原型链上的枚举属性)将为新创建的对象添加指定的属性值和对应的属性描述符。</dd> +</dl> + +<h3 id="Parameters" name="Parameters">返回值</h3> + +<p>一个新对象，带着指定的原型对象和属性。</p> + +<h3 id="Description" name="Description">例外</h3> + +<p>如果<code>propertiesObject</code>参数是 {{jsxref("null")}} 或非原始包装对象，则抛出一个 {{jsxref("TypeError")}} 异常。</p> + +<h2 id="Examples" name="Examples">例子</h2> + +<h3 id="用_Object.create实现类式继承">用 <code>Object.create</code>实现类式继承</h3> + +<p>下面的例子演示了如何使用<code>Object.create()</code>来实现类式继承。这是一个所有版本JavaScript都支持的单继承。</p> + +<pre class="brush: js notranslate">// Shape - 父类(superclass) +function Shape() { + this.x = 0; + this.y = 0; +} + +// 父类的方法 +Shape.prototype.move = function(x, y) { + this.x += x; + this.y += y; + console.info('Shape moved.'); +}; + +// Rectangle - 子类(subclass) +function Rectangle() { + Shape.call(this); // call super constructor. +} + +// 子类续承父类 +Rectangle.prototype = Object.create(Shape.prototype); +Rectangle.prototype.constructor = Rectangle; + +var rect = new Rectangle(); + +console.log('Is rect an instance of Rectangle?', + rect instanceof Rectangle); // true +console.log('Is rect an instance of Shape?', + rect instanceof Shape); // true +rect.move(1, 1); // Outputs, 'Shape moved.'</pre> + +<p>如果你希望能继承到多个对象，则可以使用<span class="short_text" id="result_box" lang="zh-CN"><span>混入的方式。</span></span></p> + +<pre class="brush: js notranslate">function MyClass() { + SuperClass.call(this); + OtherSuperClass.call(this); +} + +// 继承一个类 +MyClass.prototype = Object.create(SuperClass.prototype); +// 混合其它 +Object.assign(MyClass.prototype, OtherSuperClass.prototype); +// 重新指定constructor +MyClass.prototype.constructor = MyClass; + +MyClass.prototype.myMethod = function() { + // do a thing +}; +</pre> + +<p><a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Object/assign">Object.assign</a> 会把 <code>OtherSuperClass</code>原型上的函数拷贝到 <code>MyClass</code>原型上，使 MyClass 的所有实例都可用 OtherSuperClass 的方法。Object.assign 是在 ES2015 引入的，且可用<a href="/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Object/assign#Polyfill"> polyfilled</a>。要支持旧浏览器的话，可用使用 <a href="https://api.jquery.com/jQuery.extend/">jQuery.extend()</a> 或者 <a href="https://lodash.com/docs/#assign">_.assign()</a>。</p> + +<h3 id="使用_Object.create_的_propertyObject参数">使用 <code>Object.create</code> 的 <code>propertyObject</code>参数</h3> + +<pre class="brush: js notranslate">var o; + +// 创建一个原型为null的空对象 +o = Object.create(null); + + +o = {}; +// 以字面量方式创建的空对象就相当于: +o = Object.create(Object.prototype); + + +o = Object.create(Object.prototype, { + // foo会成为所创建对象的数据属性 + foo: { + writable:true, + configurable:true, + value: "hello" + }, + // bar会成为所创建对象的访问器属性 + bar: { + configurable: false, + get: function() { return 10 }, + set: function(value) { + console.log("Setting `o.bar` to", value); + } + } +}); + + +function Constructor(){} +o = new Constructor(); +// 上面的一句就相当于: +o = Object.create(Constructor.prototype); +// 当然,如果在Constructor函数中有一些初始化代码,Object.create不能执行那些代码 + + +// 创建一个以另一个空对象为原型,且拥有一个属性p的对象 +o = Object.create({}, { p: { value: 42 } }) + +// 省略了的属性特性默认为false,所以属性p是不可写,不可枚举,不可配置的: +o.p = 24 +o.p +//42 + +o.q = 12 +for (var prop in o) { + console.log(prop) +} +//"q" + +delete o.p +//false + +//创建一个可写的,可枚举的,可配置的属性p +o2 = Object.create({}, { + p: { + value: 42, + writable: true, + enumerable: true, + configurable: true + } +});</pre> + +<h2 id="Polyfill" style="line-height: 24px;">Polyfill</h2> + +<p>这个 polyfill 涵盖了主要的应用场景，它创建一个已经选择了原型的新对象，但没有把第二个参数考虑在内。</p> + +<p>请注意，尽管在 ES5 中 <code>Object.create</code>支持设置为<code>[[Prototype]]</code>为<code>null</code>，但因为那些ECMAScript5以前版本限制，此 polyfill 无法支持该特性。</p> + +<pre class="brush: js notranslate">if (typeof Object.create !== "function") { + Object.create = function (proto, propertiesObject) { + if (typeof proto !== 'object' && typeof proto !== 'function') { + throw new TypeError('Object prototype may only be an Object: ' + proto); + } else if (proto === null) { + throw new Error("This browser's implementation of Object.create is a shim and doesn't support 'null' as the first argument."); + } + + if (typeof propertiesObject !== 'undefined') throw new Error("This browser's implementation of Object.create is a shim and doesn't support a second argument."); + + function F() {} + F.prototype = proto; + + return new F(); + }; +}</pre> + +<h2 id="规范" style="margin-bottom: 20px; line-height: 30px;">规范</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('ES5.1', '#sec-15.2.3.5', 'Object.create')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td>Initial definition. Implemented in JavaScript 1.8.5.</td> + </tr> + <tr> + <td>{{SpecName('ES2015', '#sec-object.create', 'Object.create')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-object.create', 'Object.create')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容">浏览器兼容</h2> + +<div class="hidden">The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</div> + +<p>{{Compat("javascript.builtins.Object.create")}}</p> + +<h2 id="See_also" name="See_also" style="margin-bottom: 20px; line-height: 30px;">相关链接</h2> + +<ul> + <li>{{jsxref("Object.defineProperty")}}</li> + <li>{{jsxref("Object.defineProperties")}}</li> + <li>{{jsxref("Object.prototype.isPrototypeOf")}}</li> + <li>John Resig's post on <a class="external external-icon" href="http://ejohn.org/blog/objectgetprototypeof/" style="white-space: pre-line;" title="http://ejohn.org/blog/objectgetprototypeof/">getPrototypeOf</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/object/defineproperties/index.html b/files/zh-cn/web/javascript/reference/global_objects/object/defineproperties/index.html new file mode 100644 index 0000000000..c36b799695 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/object/defineproperties/index.html @@ -0,0 +1,183 @@ +--- +title: Object.defineProperties() +slug: Web/JavaScript/Reference/Global_Objects/Object/defineProperties +tags: + - ECMAScript 5 + - JavaScript + - Method + - Object +translation_of: Web/JavaScript/Reference/Global_Objects/Object/defineProperties +--- +<p>{{JSRef}}</p> + +<p><strong><code>Object.defineProperties()</code> </strong>方法直接在一个对象上定义新的属性或修改现有属性，并返回该对象。</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre><code>Object.defineProperties(<var>obj</var>, <var>props</var>)</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>obj</code></dt> + <dd>在其上定义或修改属性的对象。</dd> + <dt><code>props</code></dt> + <dd>要定义其可枚举属性或修改的属性描述符的对象。对象中存在的属性描述符主要有两种：数据描述符和访问器描述符（更多详情，请参阅{{jsxref("Object.defineProperty()")}}）。描述符具有以下键：</dd> + <dd> + <dl> + <dt><code>configurable</code></dt> + <dd><code>true</code> 当且仅当该属性描述符的类型可以被改变并且该属性可以从对应对象中删除。<br> + <strong>默认为 <code>false</code></strong></dd> + <dt><code>enumerable</code></dt> + <dd><code>true</code> 当且仅当在枚举相应对象上的属性时该属性显现。<br> + <strong>默认为 <code>false</code></strong></dd> + </dl> + + <dl> + <dt><code>value</code></dt> + <dd>与属性关联的值。可以是任何有效的JavaScript值（数字，对象，函数等）。<br> + <strong>默认为 {{jsxref("undefined")}}.</strong></dd> + <dt><code>writable</code></dt> + <dd><code>true</code>当且仅当与该属性相关联的值可以用{{jsxref("Operators/Assignment_Operators", "assignment operator", "", 1)}}改变时。<br> + <strong>默认为 <code>false</code></strong></dd> + </dl> + + <dl> + <dt><code>get</code></dt> + <dd>作为该属性的 getter 函数，如果没有 getter 则为{{jsxref("undefined")}}。函数返回值将被用作属性的值。<br> + <strong>默认为 {{jsxref("undefined")}}</strong></dd> + <dt><code>set</code></dt> + <dd>作为属性的 setter 函数，如果没有 setter 则为{{jsxref("undefined")}}。函数将仅接受参数赋值给该属性的新值。<br> + <strong>默认为 {{jsxref("undefined")}}</strong></dd> + </dl> + </dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>传递给函数的对象。</p> + +<h2 id="描述">描述</h2> + +<p><code>Object.defineProperties</code>本质上定义了<code>obj</code> 对象上<code>props</code>的可枚举属性相对应的所有属性。</p> + +<h2 id="例子">例子</h2> + +<pre class="brush: js">var obj = {}; +Object.defineProperties(obj, { + 'property1': { + value: true, + writable: true + }, + 'property2': { + value: 'Hello', + writable: false + } + // etc. etc. +});</pre> + +<h2 id="Polyfill">Polyfill</h2> + +<p>假设一个原始的执行环境，所有的名称和属性都引用它们的初始值，<code>Object.defineProperties</code>几乎完全等同于（注意<code>isCallable</code>中的注释）以下JavaScript中的重新实现：</p> + +<pre class="brush: js">function defineProperties(obj, properties) { + function convertToDescriptor(desc) { + function hasProperty(obj, prop) { + return Object.prototype.hasOwnProperty.call(obj, prop); + } + + function isCallable(v) { + // NB: modify as necessary if other values than functions are callable. + return typeof v === 'function'; + } + + if (typeof desc !== 'object' || desc === null) + throw new TypeError('bad desc'); + + var d = {}; + + if (hasProperty(desc, 'enumerable')) + d.enumerable = !!desc.enumerable; + if (hasProperty(desc, 'configurable')) + d.configurable = !!desc.configurable; + if (hasProperty(desc, 'value')) + d.value = desc.value; + if (hasProperty(desc, 'writable')) + d.writable = !!desc.writable; + if (hasProperty(desc, 'get')) { + var g = desc.get; + + if (!isCallable(g) && typeof g !== 'undefined') + throw new TypeError('bad get'); + d.get = g; + } + if (hasProperty(desc, 'set')) { + var s = desc.set; + if (!isCallable(s) && typeof s !== 'undefined') + throw new TypeError('bad set'); + d.set = s; + } + + if (('get' in d || 'set' in d) && ('value' in d || 'writable' in d)) + throw new TypeError('identity-confused descriptor'); + + return d; + } + + if (typeof obj !== 'object' || obj === null) + throw new TypeError('bad obj'); + + properties = Object(properties); + + var keys = Object.keys(properties); + var descs = []; + + for (var i = 0; i < keys.length; i++) + descs.push([keys[i], convertToDescriptor(properties[keys[i]])]); + + for (var i = 0; i < descs.length; i++) + Object.defineProperty(obj, descs[i][0], descs[i][1]); + + return obj; +}</pre> + +<h2 id="规范" style="margin-bottom: 20px; line-height: 30px;">规范</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('ES5.1', '#sec-15.2.3.7', 'Object.defineProperties')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td>Initial definition. Implemented in JavaScript 1.8.5</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-object.defineproperties', 'Object.defineProperties')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-object.defineproperties', 'Object.defineProperties')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div class="hidden">The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</div> + +<p>{{Compat("javascript.builtins.Object.defineProperties")}}</p> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("Object.defineProperty()")}}</li> + <li>{{jsxref("Object.keys()")}}</li> + <li><a href="/zh-CN/docs/Web/JavaScript/Enumerability_and_ownership_of_properties">属性的可枚举性和所有权</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/object/defineproperty/index.html b/files/zh-cn/web/javascript/reference/global_objects/object/defineproperty/index.html new file mode 100644 index 0000000000..beaca31a6a --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/object/defineproperty/index.html @@ -0,0 +1,545 @@ +--- +title: Object.defineProperty() +slug: Web/JavaScript/Reference/Global_Objects/Object/defineProperty +tags: + - ECMAScript 5 + - JavaScript + - JavaScript 1.8.5 + - Method + - Object + - 对象 + - 方法 +translation_of: Web/JavaScript/Reference/Global_Objects/Object/defineProperty +--- +<div>{{JSRef}}</div> + +<p><code><strong>Object.defineProperty()</strong></code> 方法会直接在一个对象上定义一个新属性，或者修改一个对象的现有属性，并返回此对象。</p> + +<div class="note"> +<p><strong>备注：</strong>应当直接在 {{jsxref("Object")}} 构造器对象上调用此方法，而不是在任意一个 <code>Object</code> 类型的实例上调用。</p> +</div> + +<div>{{EmbedInteractiveExample("pages/js/object-defineproperty.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox notranslate">Object.defineProperty(<var>obj</var>, <var>prop</var>, <var>descriptor</var>)</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code><var>obj</var></code></dt> + <dd>要定义属性的对象。</dd> + <dt><code><var>prop</var></code></dt> + <dd>要定义或修改的属性的名称或 {{jsxref("Symbol")}} 。</dd> + <dt><code><var>descriptor</var></code></dt> + <dd>要定义或修改的属性描述符。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>被传递给函数的对象。</p> + +<div class="note"> +<p>在ES6中，由于 Symbol类型的特殊性，用Symbol类型的值来做对象的key与常规的定义或修改不同，而<code>Object.defineProperty</code> 是定义key为Symbol的属性的方法之一。</p> +</div> + +<h2 id="描述">描述</h2> + +<p>该方法允许精确地添加或修改对象的属性。通过赋值操作添加的普通属性是可枚举的，在枚举对象属性时会被枚举到（{{jsxref("Statements/for...in", "for...in")}} 或 {{jsxref("Object.keys")}}<a href="/en-US/docs/JavaScript/Reference/Global_Objects/Object/keys"> </a>方法），可以改变这些属性的值，也可以{{jsxref("Operators/delete", "删除")}}这些属性。这个方法允许修改默认的额外选项（或配置）。默认情况下，使用 <code>Object.defineProperty()</code> 添加的属性值是不可修改（immutable）的。</p> + +<p>对象里目前存在的属性描述符有两种主要形式：<em>数据描述符</em>和<em>存取描述符</em>。<em>数据描述符</em>是一个具有值的属性，该值可以是可写的，也可以是不可写的。<em>存取描述符</em>是由 getter 函数和 setter 函数所描述的属性。一个描述符只能是这两者其中之一；不能同时是两者。</p> + +<p>这两种描述符都是对象。它们共享以下可选键值（默认值是指在使用 <code>Object.defineProperty()</code> 定义属性时的默认值）：</p> + +<dl> + <dt><code>configurable</code></dt> + <dd>当且仅当该属性的 <code>configurable</code> 键值为 <code>true</code> 时，该属性的描述符才能够被改变，同时该属性也能从对应的对象上被删除。<br> + <strong>默认为 </strong> <strong><code>false</code></strong>。</dd> + <dt><code>enumerable</code></dt> + <dd>当且仅当该属性的 <code>enumerable</code> 键值为 <code>true</code> 时，该属性才会出现在对象的枚举属性中。<br> + <strong>默认为 <code>false</code></strong>。</dd> +</dl> + +<p>数据描述符还具有以下可选键值：</p> + +<dl> + <dt><code>value</code></dt> + <dd>该属性对应的值。可以是任何有效的 JavaScript 值（数值，对象，函数等）。<br> + <strong>默认为 {{jsxref("undefined")}}</strong>。</dd> + <dt><code>writable</code></dt> + <dd>当且仅当该属性的 <code>writable</code> 键值为 <code>true</code> 时，属性的值，也就是上面的 <code>value</code>，才能被{{jsxref("Operators/Assignment_Operators", "赋值运算符")}}改变。<br> + <strong>默认为 <code>false</code>。</strong></dd> +</dl> + +<p>存取描述符还具有以下可选键值：</p> + +<dl> + <dt><code>get</code></dt> + <dd>属性的 getter 函数，如果没有 getter，则为 <code>undefined</code>。当访问该属性时，会调用此函数。执行时不传入任何参数，但是会传入 <code>this</code> 对象（由于继承关系，这里的<code>this</code>并不一定是定义该属性的对象）。该函数的返回值会被用作属性的值。<br> + <strong>默认为 {{jsxref("undefined")}}</strong>。</dd> + <dt><code>set</code></dt> + <dd>属性的 setter 函数，如果没有 setter，则为 <code>undefined</code>。当属性值被修改时，会调用此函数。该方法接受一个参数（也就是被赋予的新值），会传入赋值时的 <code>this</code> 对象。<br> + <strong>默认为 {{jsxref("undefined")}}</strong>。</dd> +</dl> + +<h4 id="描述符默认值汇总">描述符默认值汇总</h4> + +<ul> + <li>拥有布尔值的键 <code>configurable</code>、<code>enumerable</code> 和 <code>writable</code> 的默认值都是 <span style="font-family: courier new,andale mono,monospace; line-height: 1.5;"><code>false</code></span>。</li> + <li>属性值和函数的键 <code>value</code>、<code>get</code> 和 <code>set</code> 字段的默认值为 <code>undefined</code>。</li> +</ul> + +<h4 id="描述符可拥有的键值">描述符可拥有的键值</h4> + +<dl> + <dt> + <table class="standard-table"> + <caption></caption> + <tbody> + <tr> + <td></td> + <td><code>configurable</code></td> + <td><code>enumerable</code></td> + <td><code>value</code></td> + <td><code>writable</code></td> + <td><code>get</code></td> + <td><code>set</code></td> + </tr> + <tr> + <td>数据描述符</td> + <td>可以</td> + <td>可以</td> + <td>可以</td> + <td>可以</td> + <td>不可以</td> + <td>不可以</td> + </tr> + <tr> + <td>存取描述符</td> + <td>可以</td> + <td>可以</td> + <td>不可以</td> + <td>不可以</td> + <td>可以</td> + <td>可以</td> + </tr> + </tbody> + </table> + </dt> +</dl> + +<p>如果一个描述符不具有 <code>value</code>、<code>writable</code>、<code>get</code> 和 <code>set</code> 中的任意一个键，那么它将被认为是一个数据描述符。如果一个描述符同时拥有 <code>value</code> 或 <code>writable</code> 和 <code>get</code> 或 <code>set</code> 键，则会产生一个异常。</p> + +<p>记住，这些选项不一定是自身属性，也要考虑继承来的属性。为了确认保留这些默认值，在设置之前，可能要冻结 {{jsxref("Object.prototype")}}，明确指定所有的选项，或者通过 {{jsxref("Object.create", "Object.create(null)")}} 将 {{jsxref("Object.prototype.__proto__", "__proto__")}} 属性指向 {{jsxref("null")}}。</p> + +<pre class="brush: js notranslate">// 使用 __proto__ +var obj = {}; +var descriptor = Object.create(null); // 没有继承的属性 +// 默认没有 enumerable，没有 configurable，没有 writable +descriptor.value = 'static'; +Object.defineProperty(obj, 'key', descriptor); + +// 显式 +Object.defineProperty(obj, "key", { + enumerable: false, + configurable: false, + writable: false, + value: "static" +}); + +// 循环使用同一对象 +function withValue(value) { + var d = withValue.d || ( + withValue.d = { + enumerable: false, + writable: false, + configurable: false, + value: null + } + ); + d.value = value; + return d; +} +// ... 并且 ... +Object.defineProperty(obj, "key", withValue("static")); + +// 如果 freeze 可用, 防止后续代码添加或删除对象原型的属性 +// （value, get, set, enumerable, writable, configurable） +(Object.freeze||Object)(Object.prototype);</pre> + +<h2 id="示例">示例</h2> + +<p>如果你想了解如何使用 <code>Object.defineProperty</code> 方法和<em>类二进制标记</em>语法<span style="line-height: 1.5;">，可以看看</span>这些<a href="/en-US/docs/JavaScript/Reference/Global_Objects/Object/defineProperty/Additional_examples" style="line-height: 1.5;">额外示例</a><span style="line-height: 1.5;">。</span></p> + +<h3 id="创建属性">创建属性</h3> + +<p>如果对象中不存在指定的属性，<span style="font-family: courier new,andale mono,monospace; line-height: 1.5;"><code>Object.defineProperty()</code></span> 会创建这个属性。当描述符中省略某些字段时，这些字段将使用它们的默认值。</p> + +<pre class="brush: js notranslate">var o = {}; // 创建一个新对象 + +// 在对象中添加一个属性与数据描述符的示例 +Object.defineProperty(o, "a", { + value : 37, + writable : true, + enumerable : true, + configurable : true +}); + +// 对象 o 拥有了属性 a，值为 37 + +// 在对象中添加一个设置了存取描述符属性的示例 +var bValue = 38; +Object.defineProperty(o, "b", { + // 使用了方法名称缩写（ES2015 特性） + // 下面两个缩写等价于： + // get : function() { return bValue; }, + // set : function(newValue) { bValue = newValue; }, + get() { return bValue; }, + set(newValue) { bValue = newValue; }, + enumerable : true, + configurable : true +}); + +o.b; // 38 +// 对象 o 拥有了属性 b，值为 38 +// 现在，除非重新定义 o.b，o.b 的值总是与 bValue 相同 + +// 数据描述符和存取描述符不能混合使用 +Object.defineProperty(o, "conflict", { + value: 0x9f91102, + get() { return 0xdeadbeef; } +}); +// 抛出错误 TypeError: value appears only in data descriptors, get appears only in accessor descriptors +</pre> + +<h3 id="修改属性">修改属性</h3> + +<p>如果属性已经存在，<code>Object.defineProperty()</code>将尝试根据描述符中的值以及对象当前的配置来修改这个属性。如果旧描述符将其<code>configurable</code> 属性设置为<code>false</code>，则该属性被认为是“不可配置的”，并且没有属性可以被改变（除了单向改变 writable 为 false）。当属性不可配置时，不能在数据和访问器属性类型之间切换。</p> + +<p>当试图改变不可配置属性（除了 <code>value</code> 和 <code>writable</code> 属性之外）的值时，会抛出{{jsxref("TypeError")}}，除非当前值和新值相同。</p> + +<h4 id="Writable_属性">Writable 属性</h4> + +<p>当 <code>writable</code> 属性设置为 <code>false</code> 时，该属性被称为“不可写的”。它不能被重新赋值。</p> + +<pre class="brush: js notranslate">var o = {}; // 创建一个新对象 + +Object.defineProperty(o, 'a', { + value: 37, + writable: false +}); + +console.log(o.a); // logs 37 +o.a = 25; // No error thrown +// (it would throw in strict mode, +// even if the value had been the same) +console.log(o.a); // logs 37. The assignment didn't work. + +// strict mode +(function() { + 'use strict'; + var o = {}; + Object.defineProperty(o, 'b', { + value: 2, + writable: false + }); + o.b = 3; // throws TypeError: "b" is read-only + return o.b; // returns 2 without the line above +}());</pre> + +<p>如示例所示，试图写入非可写属性不会改变它，也不会引发错误。</p> + +<h4 id="Enumerable_属性">Enumerable 属性</h4> + +<p><code>enumerable</code> 定义了对象的属性是否可以在 {{jsxref("Statements/for...in", "for...in")}} 循环和 {{jsxref("Object.keys()")}} 中被枚举。</p> + +<pre class="brush: js notranslate">var o = {}; +Object.defineProperty(o, "a", { value : 1, enumerable: true }); +Object.defineProperty(o, "b", { value : 2, enumerable: false }); +Object.defineProperty(o, "c", { value : 3 }); // enumerable 默认为 false +o.d = 4; // 如果使用直接赋值的方式创建对象的属性，则 enumerable 为 true +Object.defineProperty(o, Symbol.for('e'), { + value: 5, + enumerable: true +}); +Object.defineProperty(o, Symbol.for('f'), { + value: 6, + enumerable: false +}); + +for (var i in o) { + console.log(i); +} +// logs 'a' and 'd' (in undefined order) + +Object.keys(o); // ['a', 'd'] + +o.propertyIsEnumerable('a'); // true +o.propertyIsEnumerable('b'); // false +o.propertyIsEnumerable('c'); // false +o.propertyIsEnumerable('d'); // true +o.propertyIsEnumerable(Symbol.for('e')); // true +o.propertyIsEnumerable(Symbol.for('f')); // false + +var p = { ...o } +p.a // 1 +p.b // undefined +p.c // undefined +p.d // 4 +p[Symbol.for('e')] // 5 +p[Symbol.for('f')] // undefined</pre> + +<h4 id="Configurable_属性">Configurable 属性</h4> + +<p><code>configurable</code> 特性表示对象的属性是否可以被删除，以及除 <code>value</code> 和 <code>writable</code> 特性外的其他特性是否可以被修改。</p> + +<pre class="brush: js notranslate">var o = {}; +Object.defineProperty(o, 'a', { + get() { return 1; }, + configurable: false +}); + +Object.defineProperty(o, 'a', { + configurable: true +}); // throws a TypeError +Object.defineProperty(o, 'a', { + enumerable: true +}); // throws a TypeError +Object.defineProperty(o, 'a', { + set() {} +}); // throws a TypeError (set was undefined previously) +Object.defineProperty(o, 'a', { + get() { return 1; } +}); // throws a TypeError +// (even though the new get does exactly the same thing) +Object.defineProperty(o, 'a', { + value: 12 +}); // throws a TypeError // ('value' can be changed when 'configurable' is false but not in this case due to 'get' accessor) + +console.log(o.a); // logs 1 +delete o.a; // Nothing happens +console.log(o.a); // logs 1</pre> + +<p>如果 <code>o.a</code> 的 <code>configurable</code> 属性为 <code>true</code>，则不会抛出任何错误，并且，最后，该属性会被删除。</p> + +<h3 id="添加多个属性和默认值">添加多个属性和默认值</h3> + +<p>考虑特性被赋予的默认特性值非常重要，通常，使用点运算符和 <code>Object.defineProperty()</code> 为对象的属性赋值时，数据描述符中的属性默认值是不同的，如下例所示。</p> + +<pre class="brush: js notranslate">var o = {}; + +o.a = 1; +// 等同于： +Object.defineProperty(o, "a", { + value: 1, + writable: true, + configurable: true, + enumerable: true +}); + + +// 另一方面， +Object.defineProperty(o, "a", { value : 1 }); +// 等同于： +Object.defineProperty(o, "a", { + value: 1, + writable: false, + configurable: false, + enumerable: false +}); +</pre> + +<h3 id="自定义_Setters_和_Getters">自定义 Setters 和 Getters</h3> + +<p>下面的例子展示了如何实现一个自存档对象。当设置<code>temperature</code> 属性时，<code>archive</code> 数组会收到日志条目。</p> + +<pre class="brush: js notranslate">function Archiver() { + var temperature = null; + var archive = []; + + Object.defineProperty(this, 'temperature', { + get: function() { + console.log('get!'); + return temperature; + }, + set: function(value) { + temperature = value; + archive.push({ val: temperature }); + } + }); + + this.getArchive = function() { return archive; }; +} + +var arc = new Archiver(); +arc.temperature; // 'get!' +arc.temperature = 11; +arc.temperature = 13; +arc.getArchive(); // [{ val: 11 }, { val: 13 }]</pre> + +<p>下面这个例子中，getter 总是会返回一个相同的值。</p> + +<pre class="brush: js notranslate">var pattern = { + get: function () { + return 'I alway return this string,whatever you have assigned'; + }, + set: function () { + this.myname = 'this is my name string'; + } +}; + + +function TestDefineSetAndGet() { + Object.defineProperty(this, 'myproperty', pattern); +} + + +var instance = new TestDefineSetAndGet(); +instance.myproperty = 'test'; + +// 'I alway return this string,whatever you have assigned' +console.log(instance.myproperty); +// 'this is my name string' +console.log(instance.myname);</pre> + +<h3 id="继承属性">继承属性</h3> + +<p>如果访问者的属性是被继承的，它的 <code>get</code> 和 <code>set</code> 方法会在子对象的属性被访问或者修改时被调用。如果这些方法用一个变量存值，该值会被所有对象共享。</p> + +<pre class="brush: js notranslate">function myclass() { +} + +var value; +Object.defineProperty(myclass.prototype, "x", { + get() { + return value; + }, + set(x) { + value = x; + } +}); + +var a = new myclass(); +var b = new myclass(); +a.x = 1; +console.log(b.x); // 1 +</pre> + +<p>这可以通过将值存储在另一个属性中解决。在 <code>get</code> 和 <code>set</code> 方法中，<code>this</code> 指向某个被访问和修改属性的对象。</p> + +<pre class="brush: js notranslate">function myclass() { +} + +Object.defineProperty(myclass.prototype, "x", { + get() { + return this.stored_x; + }, + set(x) { + this.stored_x = x; + } +}); + +var a = new myclass(); +var b = new myclass(); +a.x = 1; +console.log(b.x); // undefined</pre> + +<p>不像访问者属性，值属性始终在对象自身上设置，而不是一个原型。然而，如果一个不可写的属性被继承，它仍然可以防止修改对象的属性。</p> + +<pre class="brush: js notranslate">function myclass() { +} + +myclass.prototype.x = 1; +Object.defineProperty(myclass.prototype, "y", { + writable: false, + value: 1 +}); + +var a = new myclass(); +a.x = 2; +console.log(a.x); // 2 +console.log(myclass.prototype.x); // 1 +a.y = 2; // Ignored, throws in strict mode +console.log(a.y); // 1 +console.log(myclass.prototype.y); // 1 +</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>{{SpecName('ES5.1', '#sec-15.2.3.6', 'Object.defineProperty')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td>Initial definition. Implemented in JavaScript 1.8.5.</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-object.defineproperty', 'Object.defineProperty')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-object.defineproperty', 'Object.defineProperty')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.Object.defineProperty")}}</p> + +<h2 id="兼容性问题">兼容性问题</h2> + +<h3 id="重定义数组_Array_对象的_length_属性">重定义数组 <code>Array</code> 对象的 <code>length</code> 属性</h3> + +<p>重定义数组的 {{jsxref("Array.length", "length")}} 属性是可能的，但是会受到一般的重定义限制。（{{jsxref("Array.length", "length")}} 属性初始为 non-configurable，non-enumerable 以及 writable。对于一个内容不变的数组，改变其 {{jsxref("Array.length", "length")}} 属性的值或者使它变为 non-writable 是可能的。但是改变其可枚举性和可配置性或者当它是 non-writable 时尝试改变它的值或是可写性，这两者都是不允许的。）然而，并不是所有的浏览器都允许 <code>Array.length</code> 的重定义。</p> + +<p>在 Firefox 4 至 22 版本中，尝试重定义数组的 length 属性都会抛出 {{jsxref("TypeError")}} 异常。</p> + +<p>一些版本的 Chrome 中，<code>Object.defineProperty()</code> 在某些情况下会忽略不同于数组当前{{jsxref("Array.length", "length")}}属性的length值。有些情况下改变可写性并不起作用（也不抛出异常）。同时，比如{{jsxref("Array.prototype.push")}}的一些数组操作方法也不会考虑不可读的length属性。</p> + +<p>一些版本的 Safari 中，<code>Object.defineProperty()</code> 在某些情况下会忽略不同于数组当前{{jsxref("Array.length", "length")}}属性的length值。尝试改变可写性的操作会正常执行而不抛出错误，但事实上并未改变属性的可写性。</p> + +<p>只在Internet Explorer 9及以后版本和Firefox 23及以后版本中，才完整地正确地支持数组 {{jsxref("Array.length", "length")}} 属性的重新定义。目前不要依赖于重定义数组 {{jsxref("Array.length", "length")}} 属性能够起作用，或在特定情形下起作用。与此同时，即使你能够依赖于它，你也<a href="http://whereswalden.com/2013/08/05/new-in-firefox-23-the-length-property-of-an-array-can-be-made-non-writable-but-you-shouldnt-do-it/">没有合适的理由这样做</a>。</p> + +<h3 id="Internet_Explorer_8_特别备注">Internet Explorer 8 特别备注</h3> + +<p>Internet Explorer 8 实现了 <code>Object.defineProperty()</code> 方法，但<a class="external" href="http://msdn.microsoft.com/en-us/library/dd229916%28VS.85%29.aspx">只能在 DOM 对象上使用</a>。 需要注意的一些事情：</p> + +<ul> + <li>尝试在原生对象上使用 <code>Object.defineProperty()</code> 会报错。</li> + <li>属性特性必须设置一些特定的值。对于数据属性描述符，<code>configurable</code>, <code>enumerable</code> 和 <code>writable</code> 属性必须全部设置为 <code>true</code>；对于访问器属性描述符，<code>configurable</code> 必须设置为 <code>true</code>，<code>enumerable</code> 必须设置为 <code>false</code>。(?) 任何试图提供其他值(?)将导致一个错误抛出。</li> + <li>重新配置一个属性首先需要删除该属性。如果属性没有删除，就如同重新配置前的尝试。</li> +</ul> + +<h3 id="Chrome_37（及以下）特别备注">Chrome 37（及以下）特别备注</h3> + +<p>Chrome 37（及以下）有一个 <a href="https://bugs.chromium.org/p/v8/issues/detail?id=3448">bug</a>，使用 <code>writable: false</code> 定义原型 prototype 属性，或者函数时，不会像预期的那样工作。</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li><a href="/zh-CN/docs/Enumerability_and_ownership_of_properties">属性的可枚举性和所有权</a></li> + <li>{{jsxref("Object.defineProperties()")}}</li> + <li>{{jsxref("Object.propertyIsEnumerable()")}}</li> + <li>{{jsxref("Object.getOwnPropertyDescriptor()")}}</li> + <li>{{jsxref("Object.prototype.watch()")}}</li> + <li>{{jsxref("Object.prototype.unwatch()")}}</li> + <li>{{jsxref("Operators/get", "get")}}</li> + <li>{{jsxref("Operators/set", "set")}}</li> + <li>{{jsxref("Object.create()")}}</li> + <li><a href="/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperty/Additional_examples">Additional <code>Object.defineProperty</code> examples</a></li> + <li>{{jsxref("Reflect.defineProperty()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/object/entries/index.html b/files/zh-cn/web/javascript/reference/global_objects/object/entries/index.html new file mode 100644 index 0000000000..6e704940a5 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/object/entries/index.html @@ -0,0 +1,134 @@ +--- +title: Object.entries() +slug: Web/JavaScript/Reference/Global_Objects/Object/entries +tags: + - JavaScript + - Method + - Object + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Object/entries +--- +<div>{{JSRef}}</div> + +<p><code><strong>Object.entries()</strong></code>方法返回一个给定对象自身可枚举属性的键值对数组，其排列与使用 {{jsxref("Statements/for...in", "for...in")}} 循环遍历该对象时返回的顺序一致（区别在于 for-in 循环还会枚举原型链中的属性）。</p> + +<div>{{EmbedInteractiveExample("pages/js/object-entries.html", "taller")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">Object.entries(<var>obj</var>)</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>obj</code></dt> + <dd>可以返回其可枚举属性的键值对的对象。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<dl> + <dd>给定对象自身可枚举属性的键值对数组。</dd> +</dl> + +<h2 id="描述">描述</h2> + +<p><code>Object.entries()</code>返回一个数组，其元素是与直接在<code>object</code>上找到的可枚举属性键值对相对应的数组。属性的顺序与通过手动循环对象的属性值所给出的顺序相同。</p> + +<h2 id="示例">示例</h2> + +<pre class="brush: js">const obj = { foo: 'bar', baz: 42 }; +console.log(Object.entries(obj)); // [ ['foo', 'bar'], ['baz', 42] ] + +// array like object +const obj = { 0: 'a', 1: 'b', 2: 'c' }; +console.log(Object.entries(obj)); // [ ['0', 'a'], ['1', 'b'], ['2', 'c'] ] + +// array like object with random key ordering +const anObj = { 100: 'a', 2: 'b', 7: 'c' }; +console.log(Object.entries(anObj)); // [ ['2', 'b'], ['7', 'c'], ['100', 'a'] ] + +// getFoo is property which isn't enumerable +const myObj = Object.create({}, { getFoo: { value() { return this.foo; } } }); +myObj.foo = 'bar'; +console.log(Object.entries(myObj)); // [ ['foo', 'bar'] ] + +// non-object argument will be coerced to an object +console.log(Object.entries('foo')); // [ ['0', 'f'], ['1', 'o'], ['2', 'o'] ] + +// iterate through key-value gracefully +const obj = { a: 5, b: 7, c: 9 }; +for (const [key, value] of Object.entries(obj)) { + console.log(`${key} ${value}`); // "a 5", "b 7", "c 9" +} + +// Or, using array extras +Object.entries(obj).forEach(([key, value]) => { +console.log(`${key} ${value}`); // "a 5", "b 7", "c 9" +});</pre> + +<h3 id="将Object转换为Map">将<code>Object</code>转换为<code>Map</code></h3> + +<p>{{jsxref("Map", "new Map()")}} 构造函数接受一个可迭代的<code>entries</code>。借助<code>Object.entries</code>方法你可以很容易的将{{jsxref("Object")}}转换为{{jsxref("Map")}}:</p> + +<pre class="brush: js">var obj = { foo: "bar", baz: 42 }; +var map = new Map(Object.entries(obj)); +console.log(map); // Map { foo: "bar", baz: 42 }</pre> + +<h2 id="Polyfill">Polyfill</h2> + +<p>要在较旧环境中添加兼容的<code>Object.entries</code>支持，你可以在 <a href="https://github.com/tc39/proposal-object-values-entries">tc39/proposal-object-values-entries</a> 中找到Object.entries的示例（如果你不需要任何对IE的支持），在 <a href="https://github.com/es-shims/Object.entries">es-shims/Object.entries</a> 资料库中的一个polyfill，或者你可以使用下面列出的简易 polyfill。</p> + +<pre class="brush: js">if (!Object.entries) + Object.entries = function( obj ){ + var ownProps = Object.keys( obj ), + i = ownProps.length, + resArray = new Array(i); // preallocate the Array + while (i--) + resArray[i] = [ownProps[i], obj[ownProps[i]]]; + + return resArray; + };</pre> + +<p>对于上述 polyfill 代码片段，如果你需要 IE9 以下的支持，那么你还需要一个 Object.keys polyfill（如 {{jsxref("Object.keys")}}页面上的）。</p> + +<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('ESDraft', '#sec-object.entries', 'Object.entries')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES8', '#sec-object.entries', 'Object.entries')}}</td> + <td>{{Spec2('ES8')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容">浏览器兼容</h2> + +<div class="hidden">The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</div> + +<p>{{Compat("javascript.builtins.Object.entries")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li><a href="/zh-CN/docs/Web/JavaScript/Enumerability_and_ownership_of_properties">属性的可枚举性和所有权</a></li> + <li>{{jsxref("Object.keys()")}}</li> + <li>{{jsxref("Object.values()")}} {{experimental_inline}}</li> + <li>{{jsxref("Object.prototype.propertyIsEnumerable()")}}</li> + <li>{{jsxref("Object.create()")}}</li> + <li>{{jsxref("Object.getOwnPropertyNames()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/object/eval/index.html b/files/zh-cn/web/javascript/reference/global_objects/object/eval/index.html new file mode 100644 index 0000000000..e823c314a8 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/object/eval/index.html @@ -0,0 +1,85 @@ +--- +title: Object.prototype.eval() +slug: Web/JavaScript/Reference/Global_Objects/Object/eval +translation_of: Archive/Web/JavaScript/Object.eval +--- +<div>{{JSRef}} {{obsolete_header}}</div> + +<p><code><strong>Object.eval()</strong></code> 方法用于在对象的上下文中对 JavaScript 代码字符串求值，但该方法已被移除。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><var>obj</var>.eval(<var>string</var>)</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>string</code></dt> + <dd>包含任意 JavaScript 表达式、语句或一组语句的字符串。表达式中可包含已有对象的变量与属性。</dd> +</dl> + +<h2 id="描述">描述</h2> + +<p><code>eval</code> 方法已从对象方法中移除。可使用全局 {{jsxref("Global_Objects/eval", "eval()")}} 函数替代该方法。</p> + +<h2 id="规范">规范</h2> + +<p>暂无规范</p> + +<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>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</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>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Global_Objects/eval", "eval()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/object/freeze/index.html b/files/zh-cn/web/javascript/reference/global_objects/object/freeze/index.html new file mode 100644 index 0000000000..b72dbbf9c0 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/object/freeze/index.html @@ -0,0 +1,206 @@ +--- +title: Object.freeze() +slug: Web/JavaScript/Reference/Global_Objects/Object/freeze +tags: + - ECMAScript 5 + - JavaScript + - Method + - Object +translation_of: Web/JavaScript/Reference/Global_Objects/Object/freeze +--- +<div>{{JSRef}}</div> + +<p><strong><code>Object.freeze()</code></strong> 方法可以<strong>冻结</strong>一个对象。一个被冻结的对象再也不能被修改；冻结了一个对象则不能向这个对象添加新的属性，不能删除已有属性，不能修改该对象已有属性的可枚举性、可配置性、可写性，以及不能修改已有属性的值。此外，冻结一个对象后该对象的原型也不能被修改。<code>freeze()</code> 返回和传入的参数相同的对象。</p> + +<div>{{EmbedInteractiveExample("pages/js/object-freeze.html")}}</div> + + + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code>Object.freeze(<em>obj</em>)</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>obj</code></dt> + <dd>要被冻结的对象。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>被冻结的对象。</p> + +<h2 id="Description" name="Description">描述</h2> + +<p>被冻结对象自身的所有属性都不可能以任何方式被修改。任何修改尝试都会失败，无论是静默地还是通过抛出{{jsxref("TypeError")}}异常（最常见但不仅限于{{jsxref("Strict_mode", "strict mode", "", 1)}}）。</p> + +<p>数据属性的值不可更改，访问器属性（有getter和setter）也同样（但由于是函数调用，给人的错觉是还是可以修改这个属性）。如果一个属性的值是个对象，则这个对象中的属性是可以修改的，除非它也是个冻结对象。数组作为一种对象，被冻结，其元素不能被修改。没有数组元素可以被添加或移除。</p> + +<p>这个方法返回传递的对象，而不是创建一个被冻结的副本。</p> + +<h2 id="Examples" name="Examples">例子</h2> + +<h3 id="冻结对象">冻结对象</h3> + +<pre class="brush: js">var obj = { + prop: function() {}, + foo: 'bar' +}; + +// 新的属性会被添加, 已存在的属性可能 +// 会被修改或移除 +obj.foo = 'baz'; +obj.lumpy = 'woof'; +delete obj.prop; + +// 作为参数传递的对象与返回的对象都被冻结 +// 所以不必保存返回的对象（因为两个对象全等） +var o = Object.freeze(obj); + +o === obj; // true +Object.isFrozen(obj); // === true + +// 现在任何改变都会失效 +obj.foo = 'quux'; // 静默地不做任何事 +// 静默地不添加此属性 +obj.quaxxor = 'the friendly duck'; + +// 在严格模式，如此行为将抛出 TypeErrors +function fail(){ + 'use strict'; + obj.foo = 'sparky'; // throws a TypeError + delete obj.quaxxor; // 返回true，因为quaxxor属性从来未被添加 + obj.sparky = 'arf'; // throws a TypeError +} + +fail(); + +// 试图通过 Object.defineProperty 更改属性 +// 下面两个语句都会抛出 TypeError. +Object.defineProperty(obj, 'ohai', { value: 17 }); +Object.defineProperty(obj, 'foo', { value: 'eit' }); + +// 也不能更改原型 +// 下面两个语句都会抛出 TypeError. +Object.setPrototypeOf(obj, { x: 20 }) +obj.__proto__ = { x: 20 }</pre> + +<h3 class="brush: js" id="冻结数组">冻结数组</h3> + +<pre class="brush: js">let a = [0]; +Object.freeze(a); // 现在数组不能被修改了. + +a[0]=1; // fails silently +a.push(2); // fails silently + +// In strict mode such attempts will throw TypeErrors +function fail() { + "use strict" + a[0] = 1; + a.push(2); +} + +fail();</pre> + +<p>被冻结的对象是不可变的。但也不总是这样。下例展示了冻结对象不是常量对象（浅冻结）。</p> + +<pre class="brush: js">obj1 = { + internal: {} +}; + +Object.freeze(obj1); +obj1.internal.a = 'aValue'; + +obj1.internal.a // 'aValue' +</pre> + +<p>对于一个常量对象，整个引用图（直接和间接引用其他对象）只能引用不可变的冻结对象。冻结的对象被认为是不可变的，因为整个对象中的整个对象状态（对其他对象的值和引用）是固定的。注意，字符串，数字和布尔总是不可变的，而函数和数组是对象。</p> + +<p>要使对象不可变，需要递归冻结每个类型为对象的属性（深冻结）。当你知道对象在引用图中不包含任何 <em><a href="https://en.wikipedia.org/wiki/Cycle_(graph_theory)">环</a> </em>(循环引用)时，将根据你的设计逐个使用该模式，否则将触发无限循环。对 deepFreeze() 的增强将是具有接收路径（例如Array）参数的内部函数，以便当对象进入不变时，可以递归地调用 deepFreeze() 。你仍然有冻结不应冻结的对象的风险，例如[window]。</p> + +<pre class="brush: js">// 深冻结函数. +function deepFreeze(obj) { + + // 取回定义在obj上的属性名 + var propNames = Object.getOwnPropertyNames(obj); + + // 在冻结自身之前冻结属性 + propNames.forEach(function(name) { + var prop = obj[name]; + + // 如果prop是个对象，冻结它 + if (typeof prop == 'object' && prop !== null) + deepFreeze(prop); + }); + + // 冻结自身(no-op if already frozen) + return Object.freeze(obj); +} + +obj2 = { + internal: {} +}; + +deepFreeze(obj2); +obj2.internal.a = 'anotherValue'; +obj2.internal.a; // undefined +</pre> + +<h2 id="Notes">Notes</h2> + +<p>在ES5中，如果这个方法的参数不是一个对象（一个原始值），那么它会导致 {{jsxref("TypeError")}}。在ES2015中，非对象参数将被视为要被冻结的普通对象，并被简单地返回。</p> + +<pre class="brush: js">> Object.freeze(1) +TypeError: 1 is not an object // ES5 code + +> Object.freeze(1) +1 // ES2015 code</pre> + +<h3 id="对比_Object.seal()">对比 <code>Object.seal()</code></h3> + +<p>用<code>Object.seal()</code>密封的对象可以改变它们现有的属性。使用<code>Object.freeze()</code> 冻结的对象中现有属性是不可变的。</p> + +<h2 id="规范" style="margin-bottom: 20px; line-height: 30px;">规范</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('ES5.1', '#sec-15.2.3.9', 'Object.freeze')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td>Initial definition.<br> + Implemented in JavaScript 1.8.5</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-object.freeze', 'Object.freeze')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-object.freeze', 'Object.freeze')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div class="hidden">The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</div> + +<p>{{Compat("javascript.builtins.Object.freeze")}}</p> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("Object.isFrozen")}}</li> + <li>{{jsxref("Object.preventExtensions")}}</li> + <li>{{jsxref("Object.isExtensible")}}</li> + <li>{{jsxref("Object.seal")}}</li> + <li>{{jsxref("Object.isSealed")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/object/fromentries/index.html b/files/zh-cn/web/javascript/reference/global_objects/object/fromentries/index.html new file mode 100644 index 0000000000..80cb1de95a --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/object/fromentries/index.html @@ -0,0 +1,105 @@ +--- +title: Object.fromEntries() +slug: Web/JavaScript/Reference/Global_Objects/Object/fromEntries +translation_of: Web/JavaScript/Reference/Global_Objects/Object/fromEntries +--- +<div>{{JSRef}}</div> + +<p> <code><strong>Object.fromEntries()</strong></code> 方法把键值对列表转换为一个对象。</p> + +<div>{{EmbedInteractiveExample("pages/js/object-fromentries.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox notranslate">Object.fromEntries(<var>iterable</var>);</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>iterable</code></dt> + <dd>类似 {{jsxref("Array")}} 、 {{jsxref("Map")}} 或者其它实现了<a href="/en-US/docs/Web/JavaScript/Reference/Iteration_protocols#The_iterable_protocol">可迭代协议</a>的可迭代对象。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>一个由该迭代对象条目提供对应属性的新对象。</p> + +<h2 id="描述">描述</h2> + +<p><code>Object.fromEntries()</code> 方法接收一个键值对的列表参数，并返回一个带有这些键值对的新对象。这个迭代参数应该是一个能够实现<code>@@iterator</code>方法的的对象，返回一个迭代器对象。它生成一个具有两个元素的类数组的对象，第一个元素是将用作属性键的值，第二个元素是与该属性键关联的值。</p> + +<p><code>Object.fromEntries()</code> 执行与 {{jsxref("Object.entries")}} 互逆的操作。</p> + +<h2 id="示例">示例</h2> + +<h3 id="Map_转化为_Object"> <code>Map</code> 转化为 <code>Object</code></h3> + +<p>通过 <code>Object.fromEntries</code>， 可以将 {{jsxref("Map")}} 转换为 {{jsxref("Object")}}:</p> + +<pre class="brush: js notranslate">const map = new Map([ ['foo', 'bar'], ['baz', 42] ]); +const obj = Object.fromEntries(map); +console.log(obj); // { foo: "bar", baz: 42 } +</pre> + +<h3 id="Array_转化为_Object"><code>Array</code> 转化为 <code>Object</code></h3> + +<p>通过 <code>Object.fromEntries</code>， 可以将 {{jsxref("Array")}} 转换为 {{jsxref("Object")}}:</p> + +<pre class="brush: js notranslate">const arr = [ ['0', 'a'], ['1', 'b'], ['2', 'c'] ]; +const obj = Object.fromEntries(arr); +console.log(obj); // { 0: "a", 1: "b", 2: "c" } +</pre> + +<h3 id="对象转换">对象转换</h3> + +<p><code>Object.fromEntries</code> 是与 {{jsxref("Object.entries()")}} 相反的方法，用 <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array#Methods_2">数组处理函数</a> 可以像下面这样转换对象：</p> + +<pre class="brush: js notranslate">const object1 = { a: 1, b: 2, c: 3 }; + +const object2 = Object.fromEntries( + Object.entries(object1) + .map(([ key, val ]) => [ key, val * 2 ]) +); + +console.log(object2); +// { a: 2, b: 4, c: 6 }</pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">规范</th> + <th scope="col">状态</th> + <th scope="col">备注</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-object.fromentries', 'Object.fromEntries')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td>在 ECMAScript 2019 中首次被定义。</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容">浏览器兼容</h2> + +<div> + + +<p>{{Compat("javascript.builtins.Object.fromEntries")}}</p> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Object.entries()")}}</li> + <li>{{jsxref("Object.keys()")}}</li> + <li>{{jsxref("Object.values()")}}</li> + <li>{{jsxref("Map.prototype.entries()")}}</li> + <li>{{jsxref("Map.prototype.keys()")}}</li> + <li>{{jsxref("Map.prototype.values()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/object/getnotifier/index.html b/files/zh-cn/web/javascript/reference/global_objects/object/getnotifier/index.html new file mode 100644 index 0000000000..fac0573de3 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/object/getnotifier/index.html @@ -0,0 +1,93 @@ +--- +title: Object.getNotifier() +slug: Web/JavaScript/Reference/Global_Objects/Object/getNotifier +translation_of: Archive/Web/JavaScript/Object.getNotifier +--- +<div>{{JSRef}} {{obsolete_header}}</div> + +<p><strong><code>Object.getNotifer()</code></strong> 方法用于创建可人工触发 change 事件的对象，但该方法在浏览器中已被废弃。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">Object.getNotifier(<em>obj</em>)</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>obj</code></dt> + <dd>获取通知的对象。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>与传入对象相关联的通知对象。</p> + +<h2 id="描述">描述</h2> + +<p><code><font face="Open Sans, Arial, sans-serif">通知对象可触发 </font>Object.observe() 所观察到的人工变动。</code></p> + +<h2 id="规范">规范</h2> + +<p><a href="https://github.com/arv/ecmascript-object-observe">Strawman proposal specification.</a></p> + +<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>{{CompatChrome("36")}} [1]</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatOpera("23")}}</td> + <td>{{CompatNo}}</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>{{CompatNo}}</td> + <td>{{CompatChrome("36")}} [1]</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatOpera("23")}}</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<p>[1] Deprecated in Chrome 49.</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Object.observe()")}} {{obsolete_inline}}</li> + <li>{{jsxref("Object.unobserve()")}} {{obsolete_inline}}</li> + <li>{{jsxref("Array.observe()")}} {{obsolete_inline}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/object/getownpropertydescriptor/index.html b/files/zh-cn/web/javascript/reference/global_objects/object/getownpropertydescriptor/index.html new file mode 100644 index 0000000000..a5b4088128 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/object/getownpropertydescriptor/index.html @@ -0,0 +1,147 @@ +--- +title: Object.getOwnPropertyDescriptor() +slug: Web/JavaScript/Reference/Global_Objects/Object/getOwnPropertyDescriptor +tags: + - JavaScript + - Object + - 对象 + - 方法 +translation_of: Web/JavaScript/Reference/Global_Objects/Object/getOwnPropertyDescriptor +--- +<div>{{JSRef}}</div> + +<p><strong><code>Object.getOwnPropertyDescriptor()</code></strong> 方法返回指定对象上一个自有属性对应的属性描述符。（自有属性指的是直接赋予该对象的属性，不需要从原型链上进行查找的属性）</p> + +<p>{{EmbedInteractiveExample("pages/js/object-getownpropertydescriptor.html")}}</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox notranslate">Object.getOwnPropertyDescriptor(<em>obj</em>, <em>prop</em>)</pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>obj</code></dt> + <dd>需要查找的目标对象</dd> + <dt><code>prop</code></dt> + <dd>目标对象内属性名称</dd> +</dl> + +<h3 id="返回值" style="line-height: 24px;">返回值</h3> + +<p>如果指定的属性存在于对象上，则返回其属性描述符对象（property descriptor），否则返回 {{jsxref("undefined")}}。</p> + +<h2 id="Description" name="Description">描述</h2> + +<p>该方法允许对一个属性的描述进行检索。在 Javascript 中， <dfn>属性</dfn> 由一个字符串类型的“名字”（name）和一个“属性描述符”（property descriptor）对象构成。更多关于属性描述符类型以及他们属性的信息可以查看：{{jsxref("Object.defineProperty")}}.</p> + +<p>一个属性描述符是一个记录，由下面属性当中的某些组成的：</p> + +<dl> + <dt><code><strong>value</strong></code></dt> + <dd>该属性的值(仅针对数据属性描述符有效)</dd> + <dt><code><strong>writable</strong></code></dt> + <dd><code>当且仅当属性的值可以被改变时为true。(仅针对数据属性描述有效)</code></dd> + <dt><code><strong>get</strong></code></dt> + <dd>获取该属性的访问器函数（getter）。如果没有访问器， 该值为undefined。(仅针对包含访问器或设置器的属性描述有效)</dd> + <dt><code><strong>set</strong></code></dt> + <dd>获取该属性的设置器函数（setter）。 如果没有设置器， 该值为undefined。(仅针对包含访问器或设置器的属性描述有效)</dd> + <dt><code><strong>configurable</strong></code></dt> + <dd><code>当且仅当指定对象的属性描述可以被改变或者属性可被删除时，为true。</code></dd> + <dt><code><strong>enumerable</strong></code></dt> + <dd>当且仅当指定对象的属性可以被枚举出时，为 <code>true</code>。</dd> +</dl> + +<h2 id="Examples" name="Examples">示例</h2> + +<pre class="brush: js notranslate">var o, d; + +o = { get foo() { return 17; } }; +d = Object.getOwnPropertyDescriptor(o, "foo"); +// d { +// configurable: true, +// enumerable: true, +// get: /*the getter function*/, +// set: undefined +// } + +o = { bar: 42 }; +d = Object.getOwnPropertyDescriptor(o, "bar"); +// d { +// configurable: true, +// enumerable: true, +// value: 42, +// writable: true +// } + +o = {}; +Object.defineProperty(o, "baz", { + value: 8675309, + writable: false, + enumerable: false +}); +d = Object.getOwnPropertyDescriptor(o, "baz"); +// d { +// value: 8675309, +// writable: false, +// enumerable: false, +// configurable: false +// }</pre> + +<h2 id="注意事项">注意事项</h2> + +<p>在 ES5 中，如果该方法的第一个参数不是对象（而是原始类型），那么就会产生出现 {{jsxref("TypeError")}}。而在 ES2015，第一个的参数不是对象的话就会被强制转换为对象。</p> + +<pre class="brush: js notranslate">Object.getOwnPropertyDescriptor('foo', 0); +// 类型错误: "foo" 不是一个对象 // ES5 code + +Object.getOwnPropertyDescriptor('foo', 0); +// Object returned by ES2015 code: { +// configurable: false, +// enumerable: true, +// value: "f", +// writable: false +// }</pre> + +<h2 id="规范" style="margin-bottom: 20px; line-height: 30px;">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范</th> + <th scope="col">状态</th> + <th scope="col">批注</th> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.2.3.3', 'Object.getOwnPropertyDescriptor')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td>Initial definition.<br> + Implemented in JavaScript 1.8.5</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-object.getownpropertydescriptor', 'Object.getOwnPropertyDescriptor')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-object.getownpropertydescriptor', 'Object.getOwnPropertyDescriptor')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div>{{Compat("javascript.builtins.Object.getOwnPropertyDescriptor")}}</div> + +<div></div> + +<div id="compat-mobile"></div> + +<div id="compat-desktop"><strong style="">相关链接</strong> </div> + +<ul> + <li>{{jsxref("Object.defineProperty()")}}</li> + <li>{{jsxref("Reflect.getOwnPropertyDescriptor()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/object/getownpropertydescriptors/index.html b/files/zh-cn/web/javascript/reference/global_objects/object/getownpropertydescriptors/index.html new file mode 100644 index 0000000000..f07f3bfa33 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/object/getownpropertydescriptors/index.html @@ -0,0 +1,87 @@ +--- +title: Object.getOwnPropertyDescriptors() +slug: Web/JavaScript/Reference/Global_Objects/Object/getOwnPropertyDescriptors +translation_of: Web/JavaScript/Reference/Global_Objects/Object/getOwnPropertyDescriptors +--- +<div>{{JSRef}}</div> + +<p><code><strong>Object.getOwnPropertyDescriptors()</strong></code> 方法用来获取一个对象的所有自身属性的描述符。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">Object.getOwnPropertyDescriptors(<var>obj</var>)</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>obj</code></dt> + <dd>任意对象</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>所指定对象的所有自身属性的描述符，如果没有任何自身属性，则返回空对象。</p> + +<dl> +</dl> + +<h2 id="示例">示例</h2> + +<h3 id="浅拷贝一个对象">浅拷贝一个对象</h3> + +<p>{{jsxref("Object.assign()")}} 方法只能拷贝源对象的可枚举的自身属性，同时拷贝时无法拷贝属性的特性们，而且访问器属性会被转换成数据属性，也无法拷贝源对象的原型，该方法配合 {{jsxref("Object.create()")}} 方法可以实现上面说的这些。</p> + +<pre class="brush: js">Object.create( + Object.getPrototypeOf(obj), + Object.getOwnPropertyDescriptors(obj) +); +</pre> + +<h3 id="创建子类">创建子类</h3> + +<p>创建子类的典型方法是定义子类，将其原型设置为超类的实例，然后在该实例上定义属性。这么写很不优雅，特别是对于 getters 和 setter 而言。 相反，您可以使用此代码设置原型：</p> + +<pre class="brush: js line-numbers language-js"><code class="language-js"><span class="keyword token">function</span> <span class="function token">superclass</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span><span class="punctuation token">}</span> +superclass<span class="punctuation token">.</span>prototype <span class="operator token">=</span> <span class="punctuation token">{</span> + <span class="comment token">// 在这里定义方法和属性</span> +<span class="punctuation token">}</span><span class="punctuation token">;</span> +<span class="keyword token">function</span> <span class="function token">subclass</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span><span class="punctuation token">}</span> +subclass<span class="punctuation token">.</span>prototype <span class="operator token">=</span> Object<span class="punctuation token">.</span><span class="function token">create</span><span class="punctuation token">(</span>superclass<span class="punctuation token">.</span>prototype<span class="punctuation token">,</span> Object<span class="punctuation token">.</span><span class="function token">getOwnPropertyDescriptors</span><span class="punctuation token">(</span><span class="punctuation token">{</span> + <span class="comment token">// 在这里定义方法和属性</span> +<span class="punctuation token">}</span><span class="punctuation token">)</span><span class="punctuation token">)</span><span class="punctuation token">;</span></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>{{SpecName('ESDraft', '#sec-object.getownpropertydescriptors', 'Object.getOwnPropertyDescriptors')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td>Initial definition in ECMAScript 2017.</td> + </tr> + <tr> + <td>{{SpecName('ES2017', '#sec-object.getownpropertydescriptors', 'Object.getOwnPropertyDescriptors')}}</td> + <td>{{Spec2('ES2017')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div>{{Compat("javascript.builtins.Object.getOwnPropertyDescriptors")}}</div> + +<div id="compat-desktop"> </div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Object.getOwnPropertyDescriptor()")}}</li> + <li>{{jsxref("Object.defineProperty()")}}</li> + <li><a href="https://github.com/tc39/proposal-object-getownpropertydescriptors">Polyfill</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/object/getownpropertynames/index.html b/files/zh-cn/web/javascript/reference/global_objects/object/getownpropertynames/index.html new file mode 100644 index 0000000000..996a67689e --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/object/getownpropertynames/index.html @@ -0,0 +1,169 @@ +--- +title: Object.getOwnPropertyNames() +slug: Web/JavaScript/Reference/Global_Objects/Object/getOwnPropertyNames +tags: + - ECMAScript 5 + - JavaScript + - JavaScript 1.8.5 + - Method + - Object + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Object/getOwnPropertyNames +--- +<div>{{JSRef}}</div> + +<p><strong><code>Object.getOwnPropertyNames()</code></strong>方法返回一个由指定对象的所有自身属性的属性名（包括不可枚举属性但不包括Symbol值作为名称的属性）组成的数组。</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox">Object.getOwnPropertyNames(<em>obj</em>)</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>obj</code></dt> + <dd>一个对象，其自身的可枚举和不可枚举属性的名称被返回。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>在给定对象上找到的自身属性对应的字符串数组。</p> + +<h2 id="Description" name="Description" style="margin-bottom: 20px; line-height: 30px;">描述</h2> + +<p><code>Object.getOwnPropertyNames()</code> 返回一个数组，该数组对元素是 <code>obj</code>自身拥有的枚举或不可枚举属性名称字符串。 数组中枚举属性的顺序与通过 {{jsxref("Statements/for...in", "for...in")}} 循环（或 {{jsxref("Object.keys")}}）迭代该对象属性时一致。数组中不可枚举属性的顺序未定义。</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用_Object.getOwnPropertyNames()">使用 <code>Object.getOwnPropertyNames()</code></h3> + +<pre class="brush: js">var arr = ["a", "b", "c"]; +console.log(Object.getOwnPropertyNames(arr).sort()); // ["0", "1", "2", "length"] + +// 类数组对象 +var obj = { 0: "a", 1: "b", 2: "c"}; +console.log(Object.getOwnPropertyNames(obj).sort()); // ["0", "1", "2"] + +// 使用Array.forEach输出属性名和属性值 +Object.getOwnPropertyNames(obj).forEach(function(val, idx, array) { + console.log(val + " -> " + obj[val]); +}); +// 输出 +// 0 -> a +// 1 -> b +// 2 -> c + +//不可枚举属性 +var my_obj = Object.create({}, { + getFoo: { + value: function() { return this.foo; }, + enumerable: false + } +}); +my_obj.foo = 1; + +console.log(Object.getOwnPropertyNames(my_obj).sort()); // ["foo", "getFoo"] +</pre> + +<p>如果你只要获取到可枚举属性，查看{{jsxref("Object.keys")}}或用{{jsxref("Statements/for...in", "for...in")}}循环（还会获取到原型链上的可枚举属性，不过可以使用{{jsxref("Object.prototype.hasOwnProperty()", "hasOwnProperty()")}}方法过滤掉）。</p> + +<p>下面的例子演示了该方法不会获取到原型链上的属性：</p> + +<pre class="brush: js">function ParentClass() {} +ParentClass.prototype.inheritedMethod = function() {}; + +function ChildClass() { + this.prop = 5; + this.method = function() {}; +} + +ChildClass.prototype = new ParentClass; +ChildClass.prototype.prototypeMethod = function() {}; + +console.log( + Object.getOwnPropertyNames( + new ChildClass() // ["prop", "method"] + ) +); +</pre> + +<h3 id="只获取不可枚举的属性">只获取不可枚举的属性</h3> + +<p>下面的例子使用了 {{jsxref("Array.prototype.filter()")}} 方法，从所有的属性名数组（使用<code>Object.getOwnPropertyNames()</code>方法获得）中去除可枚举的属性（使用{{jsxref("Object.keys()")}}方法获得），剩余的属性便是不可枚举的属性了：</p> + +<pre class="brush: js">var target = myObject; +var enum_and_nonenum = Object.getOwnPropertyNames(target); +var enum_only = Object.keys(target); +var nonenum_only = enum_and_nonenum.filter(function(key) { + var indexInEnum = enum_only.indexOf(key); + if (indexInEnum == -1) { + // 没有发现在enum_only健集中意味着这个健是不可枚举的, + // 因此返回true 以便让它保持在过滤结果中 + return true; + } else { + return false; + } +}); + +console.log(nonenum_only);</pre> + +<pre>注：<a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array/filter">Array.filter(filt_func)方法</a>创建一个新数组, 其包含通过所提供函数实现的测试的所有元素。</pre> + +<h2 id="Notes" name="Notes">提示</h2> + +<p>在 ES5 中，如果参数不是一个原始对象类型，将抛出一个 {{jsxref("TypeError")}} 异常。在 ES2015 中，非对象参数被强制转换为对象 <strong>。</strong></p> + +<pre class="brush: js">Object.getOwnPropertyNames('foo'); +// TypeError: "foo" is not an object (ES5 code) + +Object.getOwnPropertyNames('foo'); +// ['length', '0', '1', '2'] (ES2015 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>{{SpecName('ES5.1', '#sec-15.2.3.4', 'Object.getOwnPropertyNames')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td>Initial definition. Implemented in JavaScript 1.8.5.</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-object.getownpropertynames', 'Object.getOwnPropertyNames')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-object.getownpropertynames', 'Object.getOwnPropertyNames')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容">浏览器兼容</h2> + +<div class="hidden">The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</div> + +<p>{{Compat("javascript.builtins.Object.getOwnPropertyNames")}}</p> + +<h2 id="Firefox-specific_notes">Firefox-specific notes</h2> + +<p>Firefox 28 {{geckoRelease("28")}}之前，<code>Object.getOwnPropertyNames</code> 不会获取到 {{jsxref("Error")}} 对象的属性。该 bug 在后面的版本修复了 ({{bug("724768")}})。</p> + +<h2 id="See_also" name="See_also" style="margin-bottom: 20px; line-height: 30px;">相关链接</h2> + +<ul> + <li><a href="https://developer.mozilla.org/en-US/docs/Enumerability_and_ownership_of_properties" title="Enumerability_and_ownership_of_properties">Enumerability and ownership of properties</a></li> + <li>{{jsxref("Object.prototype.hasOwnProperty")}}</li> + <li>{{jsxref("Object.prototype.propertyIsEnumerable")}}</li> + <li>{{jsxref("Object.create")}}</li> + <li>{{jsxref("Object.keys")}}</li> + <li>{{jsxref("Array.forEach()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/object/getownpropertysymbols/index.html b/files/zh-cn/web/javascript/reference/global_objects/object/getownpropertysymbols/index.html new file mode 100644 index 0000000000..3ef6f41842 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/object/getownpropertysymbols/index.html @@ -0,0 +1,85 @@ +--- +title: Object.getOwnPropertySymbols() +slug: Web/JavaScript/Reference/Global_Objects/Object/getOwnPropertySymbols +tags: + - ECMAScript 2015 + - JavaScript + - Method + - Object +translation_of: Web/JavaScript/Reference/Global_Objects/Object/getOwnPropertySymbols +--- +<div>{{JSRef}}</div> + +<p><code><strong>Object.getOwnPropertySymbols()</strong></code> 方法返回一个给定对象自身的所有 Symbol 属性的数组。</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code>Object.getOwnPropertySymbols(<em>obj</em>)</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>obj</code></dt> + <dd>要返回 Symbol 属性的对象。</dd> + <dt> + <h3 id="返回值">返回值</h3> + </dt> + <dd>在给定对象自身上找到的所有 Symbol 属性的数组。</dd> +</dl> + +<h2 id="Description" name="Description">描述</h2> + +<p>与{{jsxref("Object.getOwnPropertyNames()")}}类似，您可以将给定对象的所有符号属性作为 Symbol 数组获取。 请注意，{{jsxref("Object.getOwnPropertyNames()")}}本身不包含对象的 Symbol 属性，只包含字符串属性。</p> + +<p>因为所有的对象在初始化的时候不会包含任何的 Symbol，除非你在对象上赋值了 Symbol 否则<code>Object.getOwnPropertySymbols()</code>只会返回一个空的数组。</p> + +<h2 id="示例">示例</h2> + +<pre class="brush: js">var obj = {}; +var a = Symbol("a"); +var b = Symbol.for("b"); + +obj[a] = "localSymbol"; +obj[b] = "globalSymbol"; + +var objectSymbols = Object.getOwnPropertySymbols(obj); + +console.log(objectSymbols.length); // 2 +console.log(objectSymbols) // [Symbol(a), Symbol(b)] +console.log(objectSymbols[0]) // Symbol(a) +</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-object.getownpropertysymbols', 'Object.getOwnPropertySymbols')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-object.getownpropertysymbols', 'Object.getOwnPropertySymbols')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容">浏览器兼容</h2> + +<div class="hidden">The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</div> + +<p>{{Compat("javascript.builtins.Object.getOwnPropertySymbols")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Object.getOwnPropertyNames()")}}</li> + <li>{{jsxref("Symbol")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/object/getprototypeof/index.html b/files/zh-cn/web/javascript/reference/global_objects/object/getprototypeof/index.html new file mode 100644 index 0000000000..e81cee9d3f --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/object/getprototypeof/index.html @@ -0,0 +1,137 @@ +--- +title: Object.getPrototypeOf() +slug: Web/JavaScript/Reference/Global_Objects/Object/GetPrototypeOf +tags: + - ECMAScript 5 + - JavaScript + - Method + - Object +translation_of: Web/JavaScript/Reference/Global_Objects/Object/getPrototypeOf +--- +<div>{{JSRef}}</div> + +<p><code><strong>Object.getPrototypeOf()</strong></code> 方法返回指定对象的原型（内部<code>[[Prototype]]</code>属性的值）。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code>Object.getPrototypeOf(<em>object</em>)</code> +</pre> + +<dl> + <dt> + <h3 id="参数">参数</h3> + </dt> + <dt><code>obj</code></dt> + <dd>要返回其原型的对象。</dd> + <dt> + <h3 id="返回值">返回值</h3> + </dt> + <dd>给定对象的原型。如果没有继承属性，则返回 {{jsxref("null")}} 。</dd> +</dl> + +<p>{{EmbedInteractiveExample("pages/js/object-getprototypeof.html")}}</p> + +<h2 id="Examples" name="Examples">示例</h2> + +<pre class="brush: js">var proto = {}; +var obj = Object.create(proto); +Object.getPrototypeOf(obj) === proto; // true + +var reg = /a/; +Object.getPrototypeOf(reg) === RegExp.prototype; // true</pre> + +<h3 id="说明">说明</h3> + +<div class="note"> +<p><strong>Object.getPrototypeOf(Object) 不是 Object.prototype</strong></p> +</div> + +<pre class="brush: js">JavaScript中的 <strong><a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Object">Object</a></strong> 是构造函数（创建对象的包装器）。 +一般用法是： +var obj = new Object(); + +所以： +Object.getPrototypeOf( Object ); // ƒ () { [native code] } +Object.getPrototypeOf( Function ); // ƒ () { [native code] } + +Object.getPrototypeOf( Object ) === Function.prototype; // true + +Object.getPrototypeOf( Object )是把Object这一构造函数看作对象， +返回的当然是函数对象的原型，也就是 Function.prototype。 + +正确的方法是，Object.prototype是<strong>构造出来的对象的原型</strong>。 +var obj = new Object(); +Object.prototype === Object.getPrototypeOf( obj ); // true + +Object.prototype === Object.getPrototypeOf( {} ); // true</pre> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 0px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 19px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 38px; background: 0px 0px;"> </div> + +<h2 id="Notes" name="Notes">Notes</h2> + +<p>在 ES5 中，如果参数不是一个对象类型，将抛出一个{{jsxref("TypeError")}}异常。在 ES2015 中，参数会被强制转换为一个 {{jsxref("Object")}}<strong style="font-weight: bold;">。</strong></p> + +<pre class="brush: js">Object.getPrototypeOf('foo'); +// TypeError: "foo" is not an object (ES5 code) +Object.getPrototypeOf('foo'); +// String.prototype (ES2015 code)</pre> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 0px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 19px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 38px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 57px; background: 0px 0px;"> </div> + +<h2 id="规范" style="margin-bottom: 20px; line-height: 30px;">规范</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('ES5.1', '#sec-15.2.3.2', 'Object.getPrototypeOf')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-object.getprototypeof', 'Object.getPrototypeOf')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-object.getprototypeof', 'Object.getPrototypeOf')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容">浏览器兼容</h2> + +<div class="hidden">The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</div> + +<p>{{Compat("javascript.builtins.Object.getPrototypeOf")}}</p> + +<h2 id="Opera_特别提示">Opera 特别提示</h2> + +<p>即使旧版本Opera不支持<code>Object.getPrototypeOf()</code>，Opera 10.50之后还支持非标准的 {{jsxref("Object.proto", "__proto__")}}属性。</p> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("Object.prototype.isPrototypeOf")}}</li> + <li>{{jsxref("Object.setPrototypeOf()")}}</li> + <li>{{jsxref("Object.prototype.__proto__")}}</li> + <li>John Resig's post on <a class="external external-icon" href="http://ejohn.org/blog/objectgetprototypeof/" style="white-space: pre-line;" title="http://ejohn.org/blog/objectgetprototypeof/">getPrototypeOf</a></li> + <li>{{jsxref("Reflect.getPrototypeOf()")}}</li> + <li>{{jsxref("AsyncFunction")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/object/hasownproperty/index.html b/files/zh-cn/web/javascript/reference/global_objects/object/hasownproperty/index.html new file mode 100644 index 0000000000..70f5f307d6 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/object/hasownproperty/index.html @@ -0,0 +1,168 @@ +--- +title: Object.prototype.hasOwnProperty() +slug: Web/JavaScript/Reference/Global_Objects/Object/hasOwnProperty +tags: + - JavaScript + - Method + - Object + - Prototype + - 原型 + - 对象 + - 属性 + - 方法 +translation_of: Web/JavaScript/Reference/Global_Objects/Object/hasOwnProperty +--- +<div>{{JSRef}}</div> + +<p><code><strong>hasOwnProperty()</strong></code> 方法会返回一个布尔值，指示对象自身属性中是否具有指定的属性（也就是，是否有指定的键）。</p> + +<div>{{EmbedInteractiveExample("pages/js/object-prototype-hasownproperty.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox notranslate"><var>obj</var>.hasOwnProperty(<var>prop</var>)</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><var>prop</var></dt> + <dd>要检测的属性的 {{jsxref("String")}} 字符串形式表示的名称，或者 {{jsxref("Symbol")}}。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>用来判断某个对象是否含有指定的属性的布尔值 {{jsxref("Boolean")}}。</p> + +<h2 id="描述">描述</h2> + +<p>所有继承了 {{jsxref("Object")}} 的对象都会继承到 <code>hasOwnProperty</code> 方法。这个方法可以用来检测一个对象是否含有特定的自身属性；和 {{jsxref("Operators/in", "in")}} 运算符不同，该方法会忽略掉那些从原型链上继承到的属性。</p> + +<h2 id="备注">备注</h2> + +<p>即使属性的值是 <code>null</code> 或 <code>undefined</code>，只要属性存在，<code>hasOwnProperty</code> 依旧会返回 <code>true</code>。</p> + +<pre class="brush: js notranslate">o = new Object(); +o.propOne = null; +o.hasOwnProperty('propOne'); // 返回 true +o.propTwo = undefined; +o.hasOwnProperty('propTwo'); // 返回 true +</pre> + +<h2 id="示例">示例</h2> + +<h3 id="使用_hasOwnProperty_方法判断属性是否存在">使用 <code>hasOwnProperty</code> 方法判断属性是否存在</h3> + +<p>下面的例子检测了对象 <code>o</code> 是否含有自身属性 <code>prop</code>：</p> + +<pre class="brush: js notranslate">o = new Object(); +o.hasOwnProperty('prop'); // 返回 false +o.prop = 'exists'; +o.hasOwnProperty('prop'); // 返回 true +delete o.prop; +o.hasOwnProperty('prop'); // 返回 false +</pre> + +<h3 id="自身属性与继承属性">自身属性与继承属性</h3> + +<p>下面的例子演示了 <code>hasOwnProperty</code> 方法对待自身属性和继承属性的区别：</p> + +<pre class="brush: js notranslate">o = new Object(); +o.prop = 'exists'; +o.hasOwnProperty('prop'); // 返回 true +o.hasOwnProperty('toString'); // 返回 false +o.hasOwnProperty('hasOwnProperty'); // 返回 false +</pre> + +<h3 id="遍历一个对象的所有自身属性">遍历一个对象的所有自身属性</h3> + +<p>下面的例子演示了如何在遍历一个对象的所有属性时忽略掉继承属性，注意这里 {{jsxref("Statements/for...in", "for...in")}} 循环只会遍历可枚举属性，所以不应该基于这个循环中没有不可枚举的属性而得出 <code>hasOwnProperty</code> 是严格限制于可枚举项目的（如同 {{jsxref("Object.getOwnPropertyNames()")}}）。</p> + +<pre class="brush: js notranslate">var buz = { + fog: 'stack' +}; + +for (var name in buz) { + if (buz.hasOwnProperty(name)) { + console.log('this is fog (' + + name + ') for sure. Value: ' + buz[name]); + } + else { + console.log(name); // toString or something else + } +} +</pre> + +<h3 id="使用_hasOwnProperty_作为属性名">使用 <code>hasOwnProperty</code> 作为属性名</h3> + +<p>JavaScript 并没有保护 <code>hasOwnProperty</code> 这个属性名，因此，当某个对象可能自有一个占用该属性名的属性时，就需要使用外部的 <code>hasOwnProperty</code> 获得正确的结果：</p> + +<pre class="brush: js notranslate">var foo = { + hasOwnProperty: function() { + return false; + }, + bar: 'Here be dragons' +}; + +foo.hasOwnProperty('bar'); // 始终返回 false + +// 如果担心这种情况， +// 可以直接使用原型链上真正的 hasOwnProperty 方法 +({}).hasOwnProperty.call(foo, 'bar'); // true + +// 也可以使用 Object 原型上的 hasOwnProperty 属性 +Object.prototype.hasOwnProperty.call(foo, 'bar'); // true +</pre> + +<p>注意，只有在最后一种情况下，才不会新建任何对象。</p> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">规范</th> + <th scope="col">状态</th> + <th scope="col">备注</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-object.prototype.hasownproperty', 'Object.prototype.hasOwnProperty')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-object.prototype.hasownproperty', 'Object.prototype.hasOwnProperty')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.2.4.5', 'Object.prototype.hasOwnProperty')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES3')}}</td> + <td>{{Spec2('ES3')}}</td> + <td>最开始在JavaScript 1.5实现。</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.Object.hasOwnProperty")}}</p> + +<h2 id="参见">参见</h2> + +<ul> + <li><a href="/zh-CN/docs/Enumerability_and_ownership_of_properties">属性的可枚举性和所有权</a></li> + <li>{{jsxref("Object.getOwnPropertyNames()")}}</li> + <li>{{jsxref("Statements/for...in", "for...in")}}</li> + <li>{{jsxref("Operators/in", "in")}}</li> + <li><a href="/zh-CN/docs/Web/JavaScript/Inheritance_and_the_prototype_chain">继承与原型链</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/object/index.html b/files/zh-cn/web/javascript/reference/global_objects/object/index.html new file mode 100644 index 0000000000..1cfeb4d57c --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/object/index.html @@ -0,0 +1,183 @@ +--- +title: Object +slug: Web/JavaScript/Reference/Global_Objects/Object +tags: + - Constructor + - JavaScript + - Object + - 对象 + - 构造器 +translation_of: Web/JavaScript/Reference/Global_Objects/Object +--- +<div>{{JSRef}}</div> + +<p><code><strong>Object</strong></code> 构造函数创建一个对象包装器。</p> + +<h2 id="语法">语法</h2> + +<pre class="notranslate">// 对象初始化器（Object initialiser）或对象字面量（literal） +{ [ <var>nameValuePair1</var>[, <var>nameValuePair2</var>[, ...<var>nameValuePairN</var>] ] ] } + +// 以构造函数形式来调用 +new Object([<var>value</var>])</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>nameValuePair1, nameValuePair2, ... nameValuePair<em>N</em></code></dt> + <dd>成对的名称（字符串）与值（任何值），其中名称通过冒号与值分隔。</dd> + <dt><code>value</code></dt> + <dd>任何值。</dd> +</dl> + +<h2 id="描述">描述</h2> + +<p>在JavaScript中，几乎所有的对象都是<code>Object</code>类型的实例，它们都会从<code>Object.prototype</code>继承属性和方法。<code>Object</code> 构造函数为给定值创建一个对象包装器。<code>Object</code>构造函数，会根据给定的参数创建对象，具体有以下情况：</p> + +<ul> + <li>如果给定值是 {{jsxref("null")}} 或 {{jsxref("undefined")}}，将会创建并返回一个空对象</li> + <li>如果传进去的是一个基本类型的值，则会构造其包装类型的对象</li> + <li>如果传进去的是引用类型的值，仍然会返回这个值，经他们复制的变量保有和源对象相同的引用地址</li> +</ul> + +<p>当以非构造函数形式被调用时，<code>Object</code> 的行为等同于 <code>new Object()</code>。</p> + +<p>可查看 <a href="/zh-CN/docs/Web/JavaScript/Reference/Operators/Object_initializer">对象初始化/字面量语法</a>。</p> + +<h2 id="Properties" name="Properties"><code>Object</code> 构造函数的属性</h2> + +<dl> + <dt><code>Object.length</code></dt> + <dd>值为 1。</dd> +</dl> + +<dl> + <dt>{{jsxref("Object.prototype")}}</dt> + <dd>可以为所有 Object 类型的对象添加属性。</dd> +</dl> + +<h2 id="Object_构造函数的方法"><code>Object</code> 构造函数的方法</h2> + +<dl> + <dt>{{jsxref("Object.assign()")}}</dt> + <dd>通过复制一个或多个对象来创建一个新的对象。</dd> + <dt>{{jsxref("Object.create()")}}</dt> + <dd>使用指定的原型对象和属性创建一个新对象。</dd> + <dt>{{jsxref("Object.defineProperty()")}}</dt> + <dd>给对象添加一个属性并指定该属性的配置。</dd> + <dt>{{jsxref("Object.defineProperties()")}}</dt> + <dd>给对象添加多个属性并分别指定它们的配置。</dd> + <dt>{{jsxref("Object.entries()")}}</dt> + <dd>返回给定对象自身可枚举属性的 <code>[key, value]</code> 数组。</dd> + <dt>{{jsxref("Object.freeze()")}}</dt> + <dd>冻结对象：其他代码不能删除或更改任何属性。</dd> + <dt>{{jsxref("Object.getOwnPropertyDescriptor()")}}</dt> + <dd>返回对象指定的属性配置。</dd> + <dt>{{jsxref("Object.getOwnPropertyNames()")}}</dt> + <dd>返回一个数组，它包含了指定对象所有的可枚举或不可枚举的属性名。</dd> + <dt>{{jsxref("Object.getOwnPropertySymbols()")}}</dt> + <dd>返回一个数组，它包含了指定对象自身所有的符号属性。</dd> + <dt>{{jsxref("Object.getPrototypeOf()")}}</dt> + <dd>返回指定对象的原型对象。</dd> + <dt>{{jsxref("Object.is()")}}</dt> + <dd>比较两个值是否相同。所有 NaN 值都相等（这与==和===不同）。</dd> + <dt>{{jsxref("Object.isExtensible()")}}</dt> + <dd>判断对象是否可扩展。</dd> + <dt>{{jsxref("Object.isFrozen()")}}</dt> + <dd>判断对象是否已经冻结。</dd> + <dt>{{jsxref("Object.isSealed()")}}</dt> + <dd>判断对象是否已经密封。</dd> + <dt>{{jsxref("Object.keys()")}}</dt> + <dd>返回一个包含所有给定对象<strong>自身</strong>可枚举属性名称的数组。</dd> + <dt>{{jsxref("Object.preventExtensions()")}}</dt> + <dd>防止对象的任何扩展。</dd> + <dt>{{jsxref("Object.seal()")}}</dt> + <dd>防止其他代码删除对象的属性。</dd> + <dt>{{jsxref("Object.setPrototypeOf()")}}</dt> + <dd>设置对象的原型（即内部 <code>[[Prototype]]</code> 属性）。</dd> + <dt>{{jsxref("Object.values()")}}</dt> + <dd>返回给定对象自身可枚举值的数组。</dd> +</dl> + +<h2 id="Object_实例和_Object_原型对象"><code>Object</code> 实例和 <code>Object</code> 原型对象</h2> + +<p>JavaScript中的所有对象都来自 <code>Object</code>；所有对象从{{jsxref("Object.prototype")}}继承方法和属性，尽管它们可能被覆盖。例如，其他构造函数的原型将覆盖 <code>constructor</code> 属性并提供自己的 <code>toString()</code> 方法。<code>Object</code> 原型对象的更改将传播到所有对象，除非受到这些更改的属性和方法将沿原型链进一步覆盖。</p> + +<h3 id="属性">属性</h3> + +<div>{{ page('zh-CN/docs/JavaScript/Reference/Global_Objects/Object/prototype', 'Properties') }}</div> + +<h3 id="Methods_of_Object_instances" name="Methods_of_Object_instances">方法</h3> + +<div>{{ page('zh-CN/docs/JavaScript/Reference/Global_Objects/Object/prototype', 'Methods') }}</div> + +<h2 id="Examples" name="Examples">示例</h2> + +<h3 id="Example.3A_Using_Object_given_undefined_and_null_types" name="Example.3A_Using_Object_given_undefined_and_null_types">给定 <code>undefined</code> 和 <code>null</code> 类型使用 <code>Object</code></h3> + +<p>下面的例子将一个空的 <code>Object</code> 对象存到 <code>o</code> 中：</p> + +<pre class="brush: js notranslate">var o = new Object(); +</pre> + +<pre class="brush: js notranslate">var o = new Object(undefined); +</pre> + +<pre class="brush: js notranslate">var o = new Object(null); +</pre> + +<h3 id="使用_Object_生成布尔对象">使用 <code>Object</code> 生成布尔对象</h3> + +<p>下面的例子将{{jsxref("Boolean")}} 对象存到 <code>o</code> 中：</p> + +<pre class="brush: js notranslate">// 等价于 o = new Boolean(true); +var o = new Object(true); +</pre> + +<pre class="brush: js notranslate">// 等价于 o = new Boolean(false); +var o = new Object(Boolean()); +</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('ES1')}}</td> + <td>{{Spec2('ES1')}}</td> + <td>Initial definition. Implemented in JavaScript 1.0.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.2', 'Object')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-object-objects', 'Object')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Added Object.assign, Object.getOwnPropertySymbols, Object.setPrototypeOf, Object.is</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-object-objects', 'Object')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td>Added Object.entries and Object.values.</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容">浏览器兼容</h2> + +<div class="hidden">The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</div> + +<p>{{Compat("javascript.builtins.Object")}}</p> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li><a href="/zh-CN/docs/Web/JavaScript/Reference/Operators/Object_initializer">初始化对象</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/object/is/index.html b/files/zh-cn/web/javascript/reference/global_objects/object/is/index.html new file mode 100644 index 0000000000..ed905858d9 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/object/is/index.html @@ -0,0 +1,150 @@ +--- +title: Object.is() +slug: Web/JavaScript/Reference/Global_Objects/Object/is +tags: + - ECMAScript 2015 + - JavaScript + - 判断 + - 对象 + - 方法 + - 相等 +translation_of: Web/JavaScript/Reference/Global_Objects/Object/is +--- +<div>{{JSRef}}</div> + +<p><code><strong>Object.is()</strong></code> 方法判断两个值是否为<a href="/zh-CN/docs/Web/JavaScript/Equality_comparisons_and_sameness">同一个值</a>。</p> + +<p><font face="x-locale-heading-primary, zillaslab, Palatino, Palatino Linotype, x-locale-heading-secondary, serif"><span style="font-size: 37.33327865600586px;"><strong>语法</strong></span></font></p> + +<p> + </p><pre class="syntaxbox notranslate"><code>Object.is(<var>value1</var>, <var>value2</var>);</code></pre> + + +<h3 id="参数">参数</h3> + +<dl> + <dt><code><var>value1</var></code></dt> + <dd>被比较的第一个值。</dd> + <dt><code><var>value2</var></code></dt> + <dd>被比较的第二个值。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>一个 {{jsxref("Boolean")}} 类型标示两个参数是否是同一个值。</p> + +<h2 id="描述">描述</h2> + +<p><code>Object.is()</code> 方法判断两个值是否为<a href="/zh-CN/docs/Web/JavaScript/Equality_comparisons_and_sameness">同一个值</a>。如果满足以下条件则两个值相等:</p> + +<ul> + <li>都是 {{jsxref("undefined")}}</li> + <li>都是 {{jsxref("null")}}</li> + <li>都是 <code>true</code> 或 <code>false</code></li> + <li>都是相同长度的字符串且相同字符按相同顺序排列</li> + <li>都是相同对象（意味着每个对象有同一个引用）</li> + <li>都是数字且 + <ul> + <li>都是 <code>+0</code></li> + <li>都是 <code>-0</code></li> + <li>都是 {{jsxref("NaN")}}</li> + <li>或都是非零而且非 {{jsxref("NaN")}} 且为同一个值</li> + </ul> + </li> +</ul> + +<p>与{{jsxref("Operators/Comparison_Operators", "==", "#Equality")}} 运算<em>不同。</em> <code>==</code> 运算符在判断相等前对两边的变量(如果它们不是同一类型) 进行强制转换 (这种行为的结果会将 <code>"" == false</code> 判断为 <code>true</code>), 而 <code>Object.is</code>不会强制转换两边的值。</p> + +<p>与{{jsxref("Operators/Comparison_Operators", "===", "#Identity")}} 运算也不相同。 <code>===</code> 运算符 (也包括 <code>==</code> 运算符) 将数字 <code>-0</code> 和 <code>+0</code> 视为相等 ，而将{{jsxref("Number.NaN")}} 与{{jsxref("NaN")}}视为不相等.</p> + +<h2 id="Polyfill">Polyfill</h2> + +<pre class="brush: js notranslate">if (!Object.is) { + Object.is = function(x, y) { + // SameValue algorithm + if (x === y) { // Steps 1-5, 7-10 + // Steps 6.b-6.e: +0 != -0 + return x !== 0 || 1 / x === 1 / y; + } else { + // Step 6.a: NaN == NaN + return x !== x && y !== y; + } + }; +} +</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>{{SpecName('ES2015', '#sec-object.is', 'Object.is')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-object.is', 'Object.is')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="例子">例子</h2> + +<h3 id="使用_Object.is">使用 Object.is</h3> + +<pre class="brush: js notranslate">Object.is('foo', 'foo'); // true +Object.is(window, window); // true + +Object.is('foo', 'bar'); // false +Object.is([], []); // false + +var foo = { a: 1 }; +var bar = { a: 1 }; +Object.is(foo, foo); // true +Object.is(foo, bar); // false + +Object.is(null, null); // true + +// 特例 +Object.is(0, -0); // false +Object.is(0, +0); // true +Object.is(-0, -0); // true +Object.is(NaN, 0/0); // true +</pre> + +<p><font face="x-locale-heading-primary, zillaslab, Palatino, Palatino Linotype, x-locale-heading-secondary, serif"><span style="font-size: 37.33327865600586px;"><strong>规范</strong></span></font></p> + +<p> + </p><table> + <thead> + <tr> + <th scope="col">Specification</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-object.is', 'Object.is')}}<br> + </td> + </tr> + </tbody> + </table> + + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div class="hidden">The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</div> + +<p>{{Compat("javascript.builtins.Object.is")}}</p> + +<h2 id="参见">参见</h2> + +<ul> + <li><a href="/zh-CN/docs/Web/JavaScript/Equality_comparisons_and_sameness">JavaScript 中的相等性判断</a> — JavaScript 中的三种相等性判断方法的比较</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/object/isextensible/index.html b/files/zh-cn/web/javascript/reference/global_objects/object/isextensible/index.html new file mode 100644 index 0000000000..c168d98bfd --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/object/isextensible/index.html @@ -0,0 +1,144 @@ +--- +title: Object.isExtensible() +slug: Web/JavaScript/Reference/Global_Objects/Object/isExtensible +translation_of: Web/JavaScript/Reference/Global_Objects/Object/isExtensible +--- +<div>{{JSRef("Global_Objects", "Object")}}</div> + +<h2 id="Summary" name="Summary">概述</h2> + +<p><code><strong>Object.isExtensible()</strong></code> 方法判断一个对象是否是可扩展的（是否可以在它上面添加新的属性）。</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code>Object.isExtensible(<em>obj</em>)</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt>obj</dt> + <dd>需要检测的对象</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p> 表示给定对象是否可扩展的一个<a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Boolean" title="此页面仍未被本地化, 期待您的翻译!"><code>Boolean</code></a> 。</p> + +<h2 id="Description" name="Description">描述</h2> + +<p>默认情况下，对象是可扩展的：即可以为他们添加新的属性。以及它们的 {{jsxref("Object.proto", "__proto__")}}{{deprecated_inline}} 属性可以被更改。{{jsxref("Object.preventExtensions")}}，{{jsxref("Object.seal")}} 或 {{jsxref("Object.freeze")}} 方法都可以标记一个对象为不可扩展（non-extensible）。</p> + +<h2 id="Examples" name="Examples">例子</h2> + +<pre class="brush: js">// 新对象默认是可扩展的. +var empty = {}; +Object.isExtensible(empty); // === true + +// ...可以变的不可扩展. +Object.preventExtensions(empty); +Object.isExtensible(empty); // === false + +// 密封对象是不可扩展的. +var sealed = Object.seal({}); +Object.isExtensible(sealed); // === false + +// 冻结对象也是不可扩展. +var frozen = Object.freeze({}); +Object.isExtensible(frozen); // === false +</pre> + +<p> </p> + +<h2 id="注意" style="margin-bottom: 20px; line-height: 30px;">注意</h2> + +<p>在 ES5 中，如果参数不是一个对象类型，将抛出一个 {{jsxref("TypeError")}} 异常。在 ES6 中， non-object 参数将被视为一个不可扩展的普通对象，因此会返回 false 。</p> + +<pre>Object.isExtensible(1); +// TypeError: 1 is not an object (ES5 code) + +Object.isExtensible(1); +// false (ES6 code) +</pre> + +<h2 id="规范" style="margin-bottom: 20px; line-height: 30px;">规范</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('ES5.1', '#sec-15.2.3.13', 'Object.isExtensible')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td>Initial definition.<br> + Implemented in JavaScript 1.8.5</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-object.isextensible', 'Object.isExtensible')}}</td> + <td>{{Spec2('ES6')}}</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>Firefox (Gecko)</th> + <th>Chrome</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Basic support</td> + <td>4 (2.0)</td> + <td>6</td> + <td>9</td> + <td>12</td> + <td>5.1</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Firefox Mobile (Gecko)</th> + <th>Android</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>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="See_also" name="See_also" style="margin-bottom: 20px; line-height: 30px;">相关链接</h2> + +<ul> + <li><strong>{{jsxref("Object.preventExtensions")}}</strong></li> + <li>{{jsxref("Object.seal")}}</li> + <li>{{jsxref("Object.isSealed")}}</li> + <li>{{jsxref("Object.freeze")}}</li> + <li>{{jsxref("Object.isFrozen")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/object/isfrozen/index.html b/files/zh-cn/web/javascript/reference/global_objects/object/isfrozen/index.html new file mode 100644 index 0000000000..5ab6d88862 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/object/isfrozen/index.html @@ -0,0 +1,153 @@ +--- +title: Object.isFrozen() +slug: Web/JavaScript/Reference/Global_Objects/Object/isFrozen +tags: + - ECMAScript 5 + - JavaScript + - JavaScript 1.8.5 + - Method + - Object +translation_of: Web/JavaScript/Reference/Global_Objects/Object/isFrozen +--- +<div>{{JSRef}}</div> + +<p><code><strong>Object.isFrozen()</strong></code>方法判断一个对象是否被{{jsxref("Object.freeze()", "冻结", "", 1)}}。</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code>Object.isFrozen(<var>obj</var>)</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>obj</code></dt> + <dd>被检测的对象。</dd> + <dt> + <h3 id="返回值">返回值</h3> + </dt> + <dd>表示给定对象是否被冻结的{{jsxref("Boolean")}}。</dd> +</dl> + +<h2 id="Description" name="Description">描述</h2> + +<p>一个对象是冻结的是指它不可{{jsxref("Object.isExtensible", "扩展")}}，所有属性都是不可配置的，且所有数据属性（即没有getter或setter组件的访问器的属性）都是不可写的。</p> + +<h2 id="Examples" name="Examples">例子</h2> + +<pre class="brush: js">// 一个对象默认是可扩展的,所以它也是非冻结的. +Object.isFrozen({}); // === false + +// 一个不可扩展的空对象同时也是一个冻结对象. +var vacuouslyFrozen = Object.preventExtensions({}); +Object.isFrozen(vacuouslyFrozen) //=== true; + +// 一个非空对象默认也是非冻结的. +var oneProp = { p: 42 }; +Object.isFrozen(oneProp) //=== false + +// 让这个对象变的不可扩展,并不意味着这个对象变成了冻结对象, +// 因为p属性仍然是可以配置的(而且可写的). +Object.preventExtensions(oneProp); +Object.isFrozen(oneProp) //=== false + +// 此时,如果删除了这个属性,则它会成为一个冻结对象. +delete oneProp.p; +Object.isFrozen(oneProp) //=== true + +// 一个不可扩展的对象,拥有一个不可写但可配置的属性,则它仍然是非冻结的. +var nonWritable = { e: "plep" }; +Object.preventExtensions(nonWritable); +Object.defineProperty(nonWritable, "e", { writable: false }); // 变得不可写 +Object.isFrozen(nonWritable) //=== false + +// 把这个属性改为不可配置,会让这个对象成为冻结对象. +Object.defineProperty(nonWritable, "e", { configurable: false }); // 变得不可配置 +Object.isFrozen(nonWritable) //=== true + +// 一个不可扩展的对象,拥有一个不可配置但可写的属性,则它仍然是非冻结的. +var nonConfigurable = { release: "the kraken!" }; +Object.preventExtensions(nonConfigurable); +Object.defineProperty(nonConfigurable, "release", { configurable: false }); +Object.isFrozen(nonConfigurable) //=== false + +// 把这个属性改为不可写,会让这个对象成为冻结对象. +Object.defineProperty(nonConfigurable, "release", { writable: false }); +Object.isFrozen(nonConfigurable) //=== true + +// 一个不可扩展的对象,值拥有一个访问器属性,则它仍然是非冻结的. +var accessor = { get food() { return "yum"; } }; +Object.preventExtensions(accessor); +Object.isFrozen(accessor) //=== false + +// ...但把这个属性改为不可配置,会让这个对象成为冻结对象. +Object.defineProperty(accessor, "food", { configurable: false }); +Object.isFrozen(accessor) //=== true + +// 使用Object.freeze是冻结一个对象最方便的方法. +var frozen = { 1: 81 }; +Object.isFrozen(frozen) //=== false +Object.freeze(frozen); +Object.isFrozen(frozen) //=== true + +// 一个冻结对象也是一个密封对象. +Object.isSealed(frozen) //=== true + +// 当然,更是一个不可扩展的对象. +Object.isExtensible(frozen) //=== false + +</pre> + +<h2 id="注意">注意</h2> + +<p>在 ES5 中，如果参数不是一个对象类型，将抛出一个{{jsxref("TypeError")}}异常。在 ES2015 中，非对象参数将被视为一个冻结的普通对象，因此会返回<code>true</code>。</p> + +<pre class="brush: js">Object.isFrozen(1); +// TypeError: 1 is not an object (ES5 code) + +Object.isFrozen(1); +// true (ES2015 code) +</pre> + +<h2 id="规范" style="margin-bottom: 20px; line-height: 30px;">规范</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('ES5.1', '#sec-15.2.3.12', 'Object.isFrozen')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td>Initial definition.<br> + Implemented in JavaScript 1.8.5</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-object.isfrozen', 'Object.isFrozen')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-object.isfrozen', 'Object.isFrozen')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容">浏览器兼容</h2> + +<div class="hidden">The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</div> + +<p>{{Compat("javascript.builtins.Object.isFrozen")}}</p> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("Object.freeze()")}}</li> + <li>{{jsxref("Object.preventExtensions()")}}</li> + <li>{{jsxref("Object.isExtensible()")}}</li> + <li>{{jsxref("Object.seal()")}}</li> + <li>{{jsxref("Object.isSealed()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/object/isprototypeof/index.html b/files/zh-cn/web/javascript/reference/global_objects/object/isprototypeof/index.html new file mode 100644 index 0000000000..84ce38e934 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/object/isprototypeof/index.html @@ -0,0 +1,171 @@ +--- +title: Object.prototype.isPrototypeOf() +slug: Web/JavaScript/Reference/Global_Objects/Object/isPrototypeOf +tags: + - JavaScript + - Object + - Prototype + - isPrototypeOf() + - 原型 + - 对象 + - 方法 +translation_of: Web/JavaScript/Reference/Global_Objects/Object/isPrototypeOf +--- +<div>{{JSRef}}</div> + +<p><code><strong>isPrototypeOf()</strong></code> 方法用于测试一个对象是否存在于另一个对象的原型链上。</p> + +<div class="note"> +<p><code>isPrototypeOf()</code> 与 {{jsxref("Operators/instanceof", "instanceof")}} 运算符不同。在表达式 "<code>object instanceof AFunction</code>"中，<code>object</code> 的原型链是针对 <code>AFunction.prototype</code> 进行检查的，而不是针对 <code>AFunction</code> 本身。</p> +</div> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><var>prototypeObj</var>.isPrototypeOf(<var>object</var>)</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>object</code></dt> + <dd>在该对象的原型链上搜寻</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>{{jsxref("Boolean")}}，表示调用对象是否在另一个对象的原型链上。</p> + +<h3 id="报错">报错</h3> + +<dl> + <dt>{{jsxref("TypeError")}}</dt> + <dd>如果 <code><var>prototypeObj</var></code> 为 undefined 或 null，会抛出 {{jsxref("TypeError")}}。</dd> +</dl> + +<h2 id="描述">描述</h2> + +<p><code>isPrototypeOf()</code> 方法允许你检查一个对象是否存在于另一个对象的原型链上。</p> + +<h2 id="示例">示例</h2> + +<p>本示例展示了 <code>Baz.prototype</code>, <code>Bar.prototype</code>, <code>Foo.prototype</code> 和 <code>Object.prototype</code> 在 <code>baz</code> 对象的原型链上：</p> + +<pre class="brush: js">function Foo() {} +function Bar() {} +function Baz() {} + +Bar.prototype = Object.create(Foo.prototype); +Baz.prototype = Object.create(Bar.prototype); + +var baz = new Baz(); + +console.log(Baz.prototype.isPrototypeOf(baz)); // true +console.log(Bar.prototype.isPrototypeOf(baz)); // true +console.log(Foo.prototype.isPrototypeOf(baz)); // true +console.log(Object.prototype.isPrototypeOf(baz)); // true +</pre> + +<p>如果你有段代码只在需要操作继承自一个特定的原型链的对象的情况下执行，同 {{jsxref("Operators/instanceof", "instanceof")}} 操作符一样 <code>isPrototypeOf()</code> 方法就会派上用场，例如，为了确保某些方法或属性将位于对象上。</p> + +<p>例如，检查 <code>baz</code> 对象是否继承自 <code>Foo.prototype</code>：</p> + +<pre class="brush: js">if (Foo.prototype.isPrototypeOf(baz)) { + // do something safe +} +</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>{{SpecName('ES3')}}</td> + <td>{{Spec2('ES3')}}</td> + <td>初始定义</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.2.4.5', 'Object.prototype.hasOwnProperty')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-object.prototype.hasownproperty', 'Object.prototype.hasOwnProperty')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-object.prototype.hasownproperty', 'Object.prototype.hasOwnProperty')}}</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>特性</th> + <th>Chrome</th> + <th>Edge</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>基础支持</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>特性</th> + <th>Android</th> + <th>Chrome for Android</th> + <th>Edge</th> + <th>Firefox Mobile (Gecko)</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>基础支持</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Operators/instanceof", "instanceof")}}</li> + <li>{{jsxref("Object.getPrototypeOf()")}}</li> + <li> + <div>{{jsxref("Object.setPrototypeOf()")}}</div> + </li> + <li>{{jsxref("Object.prototype.__proto__")}} </li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/object/issealed/index.html b/files/zh-cn/web/javascript/reference/global_objects/object/issealed/index.html new file mode 100644 index 0000000000..df91848da8 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/object/issealed/index.html @@ -0,0 +1,124 @@ +--- +title: Object.isSealed() +slug: Web/JavaScript/Reference/Global_Objects/Object/isSealed +tags: + - ECMAScript5 + - JavaScript + - Method + - Object +translation_of: Web/JavaScript/Reference/Global_Objects/Object/isSealed +--- +<div>{{JSRef}}</div> + +<p><strong><code>Object.isSealed()</code></strong> 方法判断一个对象是否被密封。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox notranslate"><code>Object.isSealed(<em>obj</em>)</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>obj</code></dt> + <dd>要被检查的对象。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>表示给定对象是否被密封的一个{{jsxref("Boolean")}} 。</p> + +<h2 id="描述">描述</h2> + +<p>如果这个对象是密封的，则返回 <code>true</code>，否则返回 <code>false</code>。密封对象是指那些不可 {{jsxref("Object.isExtensible", "扩展")}} 的，且所有自身属性都不可配置且因此不可删除（但不一定是不可写）的对象。</p> + +<h2 id="Examples" name="Examples">例子</h2> + +<pre class="brush: js notranslate">// 新建的对象默认不是密封的. +var empty = {}; +Object.isSealed(empty); // === false + +// 如果你把一个空对象变的不可扩展,则它同时也会变成个密封对象. +Object.preventExtensions(empty); +Object.isSealed(empty); // === true + +// 但如果这个对象不是空对象,则它不会变成密封对象,因为密封对象的所有自身属性必须是不可配置的. +var hasProp = { fee: "fie foe fum" }; +Object.preventExtensions(hasProp); +Object.isSealed(hasProp); // === false + +// 如果把这个属性变的不可配置,则这个属性也就成了密封对象. +Object.defineProperty(hasProp, "fee", { configurable: false }); +Object.isSealed(hasProp); // === false +Object.isSealed(hasProp.fee); // === true + +// 最简单的方法来生成一个密封对象,当然是使用Object.seal. +var sealed = {}; +Object.seal(sealed); +Object.isSealed(sealed); // === true + +// 一个密封对象同时也是不可扩展的. +Object.isExtensible(sealed); // === false + +// 一个密封对象也可以是一个冻结对象,但不是必须的. +Object.isFrozen(sealed); // === true ，所有的属性都是不可写的 +var s2 = Object.seal({ p: 3 }); +Object.isFrozen(s2); // === false， 属性"p"可写 + +var s3 = Object.seal({ get p() { return 0; } }); +Object.isFrozen(s3); // === true ，访问器属性不考虑可写不可写,只考虑是否可配置</pre> + +<h2 id="注意" style="margin-bottom: 20px; line-height: 30px;">注意</h2> + +<p>在ES5中，如果这个方法的参数不是一个对象（一个原始类型），那么它会导致{{jsxref("TypeError")}}。在ES2015中，非对象参数将被视为是一个密封的普通对象，只返回<code>true</code>。</p> + +<pre class="brush: js notranslate">Object.isSealed(1); +// TypeError: 1 is not an object (ES5 code) + +Object.isSealed(1); +// true (ES2015 code)</pre> + +<h2 id="规范" style="margin-bottom: 20px; line-height: 30px;">规范</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('ES5.1', '#sec-15.2.3.11', 'Object.isSealed')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td>Initial definition.<br> + Implemented in JavaScript 1.8.5</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-object.issealed', 'Object.isSealed')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-object.issealed', 'Object.isSealed')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容">浏览器兼容</h2> + +<div class="hidden"> +<p>The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> +</div> + +<p>{{Compat("javascript.builtins.Object.isSealed")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Object.seal()")}}</li> + <li>{{jsxref("Object.preventExtensions()")}}</li> + <li>{{jsxref("Object.isExtensible()")}}</li> + <li>{{jsxref("Object.freeze()")}}</li> + <li>{{jsxref("Object.isFrozen()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/object/keys/index.html b/files/zh-cn/web/javascript/reference/global_objects/object/keys/index.html new file mode 100644 index 0000000000..b477b88320 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/object/keys/index.html @@ -0,0 +1,158 @@ +--- +title: Object.keys() +slug: Web/JavaScript/Reference/Global_Objects/Object/keys +tags: + - 'CCAC: Chrome Console Auto Copy' + - ECMAScript 5 + - JavaScript + - Method + - Object +translation_of: Web/JavaScript/Reference/Global_Objects/Object/keys +--- +<p>{{JSRef}}</p> + +<p><code><strong>Object.keys()</strong></code> 方法会返回一个由一个给定对象的自身可枚举属性组成的数组，数组中属性名的排列顺序和正常循环遍历该对象时返回的顺序一致 。</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code>Object.keys(<var>obj</var>)</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt>obj</dt> + <dd>要返回其枚举自身属性的对象。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>一个表示给定对象的所有可枚举属性的字符串数组。</p> + +<h2 id="Description" name="Description" style="margin-bottom: 20px; line-height: 30px;">描述</h2> + +<p><code>Object.keys</code> 返回一个所有元素为字符串的数组，其元素来自于从给定的<code>object</code>上面可直接枚举的属性。这些属性的顺序与手动遍历该对象属性时的一致。</p> + +<h2 id="例子">例子</h2> + +<pre class="brush: js">// simple array +var arr = ['a', 'b', 'c']; +console.log(Object.keys(arr)); // console: ['0', '1', '2'] + +// array like object +var obj = { 0: 'a', 1: 'b', 2: 'c' }; +console.log(Object.keys(obj)); // console: ['0', '1', '2'] + +// array like object with random key ordering +var anObj = { 100: 'a', 2: 'b', 7: 'c' }; +console.log(Object.keys(anObj)); // console: ['2', '7', '100'] + +// getFoo is a property which isn't enumerable +var myObj = Object.create({}, { + getFoo: { + value: function () { return this.foo; } + } +}); +myObj.foo = 1; +console.log(Object.keys(myObj)); // console: ['foo']</pre> + +<p>如果你想获取一个对象的所有属性,，甚至包括不可枚举的，请查看{{jsxref("Object.getOwnPropertyNames")}}。</p> + +<h2 id="注意">注意</h2> + +<p>在ES5里，如果此方法的参数不是对象（而是一个原始值），那么它会抛出 TypeError。在ES2015中，非对象的参数将被强制转换为一个对象。</p> + +<pre class="brush: js">Object.keys("foo"); +// TypeError: "foo" is not an object (ES5 code) + +Object.keys("foo"); +// ["0", "1", "2"] (ES2015 code)</pre> + +<h2 id="Polyfill">Polyfill</h2> + +<p>要在原生不支持的旧环境中添加兼容的<code>Object.keys</code>，请复制以下代码段：</p> + +<pre class="brush: js">if (!Object.keys) { + Object.keys = (function () { + var hasOwnProperty = Object.prototype.hasOwnProperty, + hasDontEnumBug = !({toString: null}).propertyIsEnumerable('toString'), + dontEnums = [ + 'toString', + 'toLocaleString', + 'valueOf', + 'hasOwnProperty', + 'isPrototypeOf', + 'propertyIsEnumerable', + 'constructor' + ], + dontEnumsLength = dontEnums.length; + + return function (obj) { + if (typeof obj !== 'object' && typeof obj !== 'function' || obj === null) throw new TypeError('Object.keys called on non-object'); + + var result = []; + + for (var prop in obj) { + if (hasOwnProperty.call(obj, prop)) result.push(prop); + } + + if (hasDontEnumBug) { + for (var i=0; i < dontEnumsLength; i++) { + if (hasOwnProperty.call(obj, dontEnums[i])) result.push(dontEnums[i]); + } + } + return result; + } + })() +}; +</pre> + +<p>上面的代码在IE7（也许IE8也是）下有个问题，就是如果传入一个来自其他 window 对象下的对象时，不可枚举的属性也会获取到。</p> + +<p>另一个简单的实现，参见<a class="external" href="http://tokenposts.blogspot.com.au/2012/04/javascript-objectkeys-browser.html">Javascript - Object.keys Browser Compatibility</a>。</p> + +<h2 id="规范" style="margin-bottom: 20px; line-height: 30px;">规范</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('ES5.1', '#sec-15.2.3.14', 'Object.keys')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td>Initial definition.<br> + Implemented in JavaScript 1.8.5</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-object.keys', 'Object.keys')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-object.keys', 'Object.keys')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容">浏览器兼容</h2> + +<div> + + +<p>{{Compat("javascript.builtins.Object.keys")}}</p> +</div> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li><a href="https://developer.mozilla.org/en-US/docs/Enumerability_and_ownership_of_properties">Enumerability and ownership of properties</a></li> + <li>{{jsxref("Object.prototype.propertyIsEnumerable()")}}</li> + <li>{{jsxref("Object.create()")}}</li> + <li>{{jsxref("Object.getOwnPropertyNames()")}}</li> + <li>{{jsxref("Object.values()")}}</li> + <li>{{jsxref("Object.entries()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/object/nosuchmethod/index.html b/files/zh-cn/web/javascript/reference/global_objects/object/nosuchmethod/index.html new file mode 100644 index 0000000000..7b54198c19 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/object/nosuchmethod/index.html @@ -0,0 +1,208 @@ +--- +title: Object.prototype.__noSuchMethod__ +slug: Web/JavaScript/Reference/Global_Objects/Object/noSuchMethod +translation_of: Archive/Web/JavaScript/Object.noSuchMethod +--- +<div>{{JSRef}} {{obsolete_header}}</div> + +<p><strong><code>__noSuchMethod__</code></strong> 属性曾经是指当调用某个对象里不存在的方法时即将被执行的函数，但是现在这个函数已经不可用。</p> + +<p><code><font face="Open Sans, Arial, sans-serif">在</font><strong>__noSuchMethod__</strong></code> 属性被移除之后，ECMAScript 2015 (ES6) 规范转而采用 {{jsxref("Proxy")}} 对象， 可以实现下面的效果（以及更多）。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><var>obj</var>.__noSuchMethod__ = <var>fun</var></code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>fun</code></dt> + <dd>函数形式如下：</dd> + <dd> + <pre class="brush: js"><code>function (<var>id</var>, <var>args</var>) { . . . }</code></pre> + + <dl> + <dt><code>id</code></dt> + <dd>调用的不存在的方法名</dd> + <dt><code>args</code></dt> + <dd>传递给该方法的参数数组</dd> + </dl> + </dd> +</dl> + +<h2 id="描述">描述</h2> + +<p>默认情况喜爱，试图调用对象上不存在的方法其结果是在{{jsxref("TypeError")}}上抛出异常，这种行为可以在</p> + +<p>By default, an attempt to call a method that doesn't exist on an object results in a {{jsxref("TypeError")}} being thrown. This behavior can be circumvented by defining a function at that object's <code>__noSuchMethod__</code> member. The function takes two arguments, the first is the name of the method attempted and the second is an array of the arguments that were passed in the method call. The second argument is an actual array (that is, it inherits through the {{jsxref("Array.prototype")}} chain) and not the array-like <a href="/en-US/docs/Web/JavaScript/Reference/Functions_and_function_scope/arguments" title="JavaScript/Reference/Functions/arguments">arguments object</a>.</p> + +<p>If this method cannot be called, either as if <code>undefined</code> by default, if deleted, or if manually set to a non-function, the JavaScript engine will revert to throwing <code>TypeError</code>s.</p> + +<h2 id="Examples">Examples</h2> + +<h3 id="Simple_test_of___noSuchMethod__">Simple test of <code>__noSuchMethod__</code></h3> + +<pre class="brush: js">var o = { + __noSuchMethod__: function(id, args) { + console.log(id, '(' + args.join(', ') + ')'); + } +}; + +o.foo(1, 2, 3); +o.bar(4, 5); +o.baz(); + +// Output +// foo (1, 2, 3) +// bar (4, 5) +// baz () +</pre> + +<h3 id="Using___noSuchMethod___to_simulate_multiple_inheritance">Using <code>__noSuchMethod__</code> to simulate multiple inheritance</h3> + +<p>An example of code that implements a primitive form of multiple inheritance is shown below.</p> + +<pre class="brush: js">// Doesn't work with multiple inheritance objects as parents +function noMethod(name, args) { + var parents = this.__parents_; + + // Go through all parents + for (var i = 0; i < parents.length; i++) { + // If we find a function on the parent, we call it + if (typeof parents[i][name] == "function") { + return parents[i][name].apply(this, args); + } + } + + // If we get here, the method hasn't been found + throw new TypeError; +} + +// Used to add a parent for multiple inheritance +function addParent(obj, parent) { + // If the object isn't initialized, initialize it + if (!obj.__parents_) { + obj.__parents_ = []; + obj.__noSuchMethod__ = noMethod; + } + + // Add the parent + obj.__parents_.push(parent); +} +</pre> + +<p>An example of using this idea is shown below.</p> + +<pre class="brush: js">// Example base class 1 +function NamedThing(name){ + this.name=name; +} + +NamedThing.prototype = { + getName: function() { return this.name; }, + setName: function(newName) { this.name = newName; } +} + +// Example base class 2 +function AgedThing(age) { + this.age = age; +} + +AgedThing.prototype = { + getAge: function() { return this.age; }, + setAge: function(age) { this.age = age; } +} + +// Child class. inherits from NamedThing and AgedThing +// as well as defining address +function Person(name, age, address){ + addParent(this, NamedThing.prototype); + NamedThing.call(this, name); + addParent(this, AgedThing.prototype); + AgedThing.call(this, age); + this.address = address; +} + +Person.prototype = { + getAddr: function() { return this.address; }, + setAddr: function(addr) { this.address = addr; } +} + +var bob = new Person("bob", 25, "New York"); + +console.log("getAge is " + (("getAge" in bob) ? "in" : "not in") + " bob"); +// getAge is not in bob + +console.log("bob's age is: " + bob.getAge()); +// bob's age is: 25 + +console.log("getName is " + (("getName" in bob) ? "in" : "not in") + " bob"); +// getName is not in bob + +console.log("bob's name is: " + bob.getName()); +// bob's name is: bob + +console.log("getAddr is " + (("getAddr" in bob) ? "in" : "not in") + " bob"); +// getAddr is in bob + +console.log("bob's address is: " + bob.getAddr()); +// bob's address is: New York +</pre> + +<h2 id="Specifications">Specifications</h2> + +<p>Not part of any specifications. This feature has been removed, see {{bug(683218)}}.</p> + +<h2 id="Browser_compatibility">Browser compatibility</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>{{CompatNo}}</td> + <td>{{CompatNo}} [1]</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</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>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}} [1]</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<p>[1] This feature was implemented until version 43.</p> diff --git a/files/zh-cn/web/javascript/reference/global_objects/object/object/index.html b/files/zh-cn/web/javascript/reference/global_objects/object/object/index.html new file mode 100644 index 0000000000..ded4dfae16 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/object/object/index.html @@ -0,0 +1,80 @@ +--- +title: Object() 构造函数 +slug: Web/JavaScript/Reference/Global_Objects/Object/Object +translation_of: Web/JavaScript/Reference/Global_Objects/Object/Object +--- +<div>{{JSRef}}</div> + +<p><strong><code>Object</code> 构造函数将给定的值包装为一个新对象。</strong></p> + +<ul> + <li>如果给定的值是 {{jsxref("null")}} 或 {{jsxref("undefined")}}, 它会创建并返回一个空对象。</li> + <li>否则，它将返回一个和给定的值相对应的类型的对象。</li> + <li>如果给定值是一个已经存在的对象，则会返回这个已经存在的值（相同地址）。</li> +</ul> + +<p>在非构造函数上下文中调用时， <code>Object</code> 和 <code>new Object()</code>表现一致。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">new Object() +new Object(<var>value</var>)</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>value</code></dt> + <dd>任意值</dd> +</dl> + +<h2 id="例子">例子</h2> + +<h3 id="创建一个新对象">创建一个新对象</h3> + +<pre>let o = new Object() +o.foo = 42 + +console.log(o) +// Object { foo: 42 } +</pre> + +<h3 id="使用_Object_创建_undefined_和_null_类型">使用 <code>Object</code> 创建 <code>undefined</code> 和 <code>null</code> 类型</h3> + +<p>下面的例子保存了一个空 <code>Object</code> 对象在 <code>o</code>:</p> + +<pre class="brush: js">let o = new Object() +</pre> + +<pre class="brush: js">let o = new Object(undefined) +</pre> + +<pre class="brush: js">let o = new Object(null)</pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Specification</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-object-constructor', 'Object constructor')}}</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> +<div class="hidden">The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</div> + +<p>{{Compat("javascript.builtins.Object.Object")}}</p> +</div> + +<h2 id="See_also">See also</h2> + +<ul> + <li><a href="/en-US/docs/Web/JavaScript/Reference/Operators/Object_initializer">Object initializer</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/object/observe/index.html b/files/zh-cn/web/javascript/reference/global_objects/object/observe/index.html new file mode 100644 index 0000000000..e37cc6ab6f --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/object/observe/index.html @@ -0,0 +1,160 @@ +--- +title: Object.observe() +slug: Web/JavaScript/Reference/Global_Objects/Object/observe +tags: + - ECMAScript7 + - Experimental + - JavaScript + - Method + - Object + - observe +translation_of: Archive/Web/JavaScript/Object.observe +--- +<div>{{JSRef}} {{obsolete_header}}</div> + +<h2 id="概述">概述</h2> + +<p><strong><code>Object.observe()</code></strong> 方法用于异步地监视一个对象的修改。当对象属性被修改时，方法的回调函数会提供一个有序的修改流。然而，这个接口已经被废弃并从各浏览器中移除。你可以使用更通用的 {{jsxref("Proxy")}} 对象替代。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code>Object.observe(<var>obj</var>, <var>callback</var></code>[, <var>acceptList</var>])</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>obj</code></dt> + <dd>被监控的对象.</dd> + <dt><code>callback</code></dt> + <dd>当对象被修改时触发的回调函数，其参数为: + <dl> + <dt><code>changes</code></dt> + <dd>一个数组，其中包含的每一个对象代表一个修改行为。每个修改行为的对象包含: + <ul> + <li><strong><code>name</code></strong>: 被修改的属性名称<span style="font-family: consolas,monaco,andale mono,monospace;">。</span></li> + <li><strong><code>object</code></strong>: 修改后该对象的值<span style="font-family: consolas,monaco,andale mono,monospace;">。</span></li> + <li><strong><code>type</code></strong>: 表示对该对象做了何种类型的修改，可能的值为<code>"add"</code>, <code>"update"</code>, or <code>"delete"</code><span style="font-family: consolas,monaco,andale mono,monospace;">。</span></li> + <li><strong><code>oldValue</code></strong>: 对象修改前的值。该值只在<code>"update"<font face="Open Sans, sans-serif">与</font></code><code>"delete"有效。</code></li> + <li> </li> + </ul> + </dd> + <dt><font face="Consolas">acceptList</font></dt> + <dd>在给定对象上给定回调中要监视的变化类型列表。如果省略， <code><font face="Courier New">["add", "update", "delete", "reconfigure", "setPrototype", "preventExtensions"]</font></code> 将会被使用。</dd> + </dl> + </dd> +</dl> + +<h2 id="描述">描述</h2> + +<p><code style="font-style: normal;">callback</code> 函数会在<code>对象被改变时被调用，其参数为一个包含所有修改信息的有序的数组对象。</code></p> + +<h2 id="例子">例子</h2> + +<h3 id="例子_打印出三种不同操作类型的日志">例子: 打印出三种不同操作类型的日志</h3> + +<pre class="brush: js">var obj = { + foo: 0, + bar: 1 +}; + +Object.observe(obj, function(changes) { + console.log(changes); +}); + +obj.baz = 2; +// [{name: 'baz', object: <obj>, type: 'add'}] + +obj.foo = 'hello'; +// [{name: 'foo', object: <obj>, type: 'update', oldValue: 0}] + +delete obj.baz; +// [{name: 'baz', object: <obj>, type: 'delete', oldValue: 2}] +</pre> + +<h3 id="例子_数据绑定">例子: 数据绑定</h3> + +<pre class="brush: js">// 一个数据模型 +var user = { + id: 0, + name: 'Brendan Eich', + title: 'Mr.' +}; + +// 创建用户的greeting +function updateGreeting() { + user.greeting = 'Hello, ' + user.title + ' ' + user.name + '!'; +} +updateGreeting(); + +Object.observe(user, function(changes) { + changes.forEach(function(change) { + // 当name或title属性改变时, 更新greeting + if (change.name === 'name' || change.name === 'title') { + updateGreeting(); + } + }); +}); +</pre> + +<h2 id="Specifications" name="Specifications">规范</h2> + +<p><a href="https://github.com/arv/ecmascript-object-observe">Strawman proposal for ECMAScript 7</a>.</p> + +<h2 id="Browser_compatibility" name="Browser_compatibility">浏览器兼容性</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>{{CompatChrome("36")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatOpera("23")}}</td> + <td>{{CompatNo}}</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>{{CompatNo}}</td> + <td>{{CompatChrome("36")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatOpera("23")}}</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("Object.unobserve()")}} {{experimental_inline}}</li> + <li>{{jsxref("Array.observe()")}} {{experimental_inline}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/object/parent/index.html b/files/zh-cn/web/javascript/reference/global_objects/object/parent/index.html new file mode 100644 index 0000000000..8597b6c4a3 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/object/parent/index.html @@ -0,0 +1,43 @@ +--- +title: Object.prototype.__parent__ +slug: Web/JavaScript/Reference/Global_Objects/Object/Parent +tags: + - JavaScript + - 原型 + - 对象 + - 属性 + - 已废弃 + - 非标准 +translation_of: Archive/Web/JavaScript/Object.parent +--- +<div>{{JSRef}}{{Non-standard_Header}}{{Obsolete_Header("gecko2")}}</div> + +<p>The <strong><code>__parent__</code></strong> property used to point to an object's context, but it has been removed.</p> + +<p>指向一个对象的上下文.</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>obj</var>.__parent__</pre> + +<h2 id="描述">描述</h2> + +<p>对于最顶层对象来说，这个属性的值就是全局对象 window。</p> + +<h2 id="规范">规范</h2> + +<p>不属于任何规范。</p> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.Object.parent")}}</p> + +<h2 id="参见">参见</h2> + +<ul> + <li><a class="external" href="http://whereswalden.com/2010/05/07/spidermonkey-change-du-jour-the-special-__parent__-property-has-been-removed/">SpiderMonkey change du jour: the special __parent__ property has been removed</a></li> + <li><a href="/zh-CN/docs/Components.utils.getGlobalForObject">Components.utils.getGlobalForObject</a></li> + <li><a href="/en-US/docs/JavaScript/Reference/Global_Objects/Object/Proto">__proto__</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/object/preventextensions/index.html b/files/zh-cn/web/javascript/reference/global_objects/object/preventextensions/index.html new file mode 100644 index 0000000000..81c8a451a2 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/object/preventextensions/index.html @@ -0,0 +1,131 @@ +--- +title: Object.preventExtensions() +slug: Web/JavaScript/Reference/Global_Objects/Object/preventExtensions +tags: + - ECMAScript 5 + - JavaScript + - Method + - Object +translation_of: Web/JavaScript/Reference/Global_Objects/Object/preventExtensions +--- +<div>{{JSRef("Global_Objects", "Object")}}</div> + +<p><code><strong>Object.preventExtensions()</strong></code>方法让一个对象变的不可扩展，也就是永远不能再添加新的属性。</p> + +<p>{{EmbedInteractiveExample("pages/js/object-preventextensions.html")}}</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code>Object.preventExtensions(<em>obj</em>)</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>obj</code></dt> + <dd>将要变得不可扩展的对象。</dd> + <dt> + <h3 id="返回值">返回值</h3> + </dt> + <dd>已经不可扩展的对象。</dd> +</dl> + +<h2 id="Description" name="Description">描述</h2> + +<p>如果一个对象可以添加新的属性，则这个对象是可扩展的。<code>Object.preventExtensions()</code>将对象标记为不再可扩展，这样它将永远不会具有它被标记为不可扩展时持有的属性之外的属性。注意，一般来说，不可扩展对象的属性可能仍然可被<em>删除</em>。尝试将新属性添加到不可扩展对象将静默失败或抛出{{jsxref("TypeError")}}（最常见的情况是{{jsxref("Functions_and_function_scope/Strict_mode", "strict mode", "", 1)}}中，但不排除其他情况）。</p> + +<p><code>Object.preventExtensions()</code>仅阻止添加自身的属性。但其对象类型的原型依然可以添加新的属性。</p> + +<p>该方法使得目标对象的 <code>[[prototype]]</code> 不可变；任何重新赋值 <code>[[prototype]]</code> 操作都会抛出 <code>TypeError</code> 。这种行为只针对内部的 <code>[[prototype]]</code> 属性， 目标对象的其它属性将保持可变。</p> + +<p>一旦将对象变为不可扩展的对象，就再也不能使其可扩展。</p> + +<h2 id="Examples" name="Examples">例子</h2> + +<pre class="brush: js">// Object.preventExtensions将原对象变的不可扩展,并且返回原对象. +var obj = {}; +var obj2 = Object.preventExtensions(obj); +obj === obj2; // true + +// 字面量方式定义的对象默认是可扩展的. +var empty = {}; +Object.isExtensible(empty) //=== true + +// ...但可以改变. +Object.preventExtensions(empty); +Object.isExtensible(empty) //=== false + +// 使用Object.defineProperty方法为一个不可扩展的对象添加新属性会抛出异常. +var nonExtensible = { removable: true }; +Object.preventExtensions(nonExtensible); +Object.defineProperty(nonExtensible, "new", { value: 8675309 }); // 抛出TypeError异常 + +// 在严格模式中,为一个不可扩展对象的新属性赋值会抛出TypeError异常. +function fail() +{ + "use strict"; + nonExtensible.newProperty = "FAIL"; // throws a TypeError +} +fail(); +</pre> + +<p></p> + +<p>不可扩展对象的原型是不可变的：</p> + +<pre>var fixed = Object.preventExtensions({}); +// throws a 'TypeError'. +fixed.__proto__ = { oh: 'hai' };</pre> + +<h2 id="Notes">Notes</h2> + +<p>在 ES5 中，如果参数不是一个对象类型（而是原始类型），将抛出一个{{jsxref("TypeError")}}异常。在 ES2015 中，非对象参数将被视为一个不可扩展的普通对象，因此会被直接返回。</p> + +<pre class="brush: js">Object.preventExtensions(1); +// TypeError: 1 is not an object (ES5 code) + +Object.preventExtensions(1); +// 1 (ES2015 code)</pre> + +<h2 id="规范" style="margin-bottom: 20px; line-height: 30px;">规范</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('ES5.1', '#sec-15.2.3.10', 'Object.preventExtensions')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td>Initial definition. Implemented in JavaScript 1.8.5.</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-object.preventextensions', 'Object.preventExtensions')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-object.preventextensions', 'Object.preventExtensions')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容">浏览器兼容</h2> + +<div class="hidden">The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</div> + +<p>{{Compat("javascript.builtins.Object.preventExtensions")}}</p> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("Object.isExtensible()")}}</li> + <li>{{jsxref("Object.seal()")}}</li> + <li>{{jsxref("Object.isSealed()")}}</li> + <li>{{jsxref("Object.freeze()")}}</li> + <li>{{jsxref("Object.isFrozen()")}}</li> + <li>{{jsxref("Reflect.preventExtensions()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/object/propertyisenumerable/index.html b/files/zh-cn/web/javascript/reference/global_objects/object/propertyisenumerable/index.html new file mode 100644 index 0000000000..b74e6bc26b --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/object/propertyisenumerable/index.html @@ -0,0 +1,146 @@ +--- +title: Object.prototype.propertyIsEnumerable() +slug: Web/JavaScript/Reference/Global_Objects/Object/propertyIsEnumerable +tags: + - JavaScript + - Method + - Object + - Prototype + - 对象 + - 方法 +translation_of: Web/JavaScript/Reference/Global_Objects/Object/propertyIsEnumerable +--- +<div>{{JSRef}}</div> + +<p><code><strong>propertyIsEnumerable()</strong></code> 方法返回一个布尔值，表示指定的属性是否可枚举。</p> + +<div>{{EmbedInteractiveExample("pages/js/object-prototype-propertyisenumerable.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><var>obj</var>.propertyIsEnumerable(<var>prop</var>)</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>prop</code></dt> + <dd>需要测试的属性名。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>用来表示指定的属性名是否可枚举的{{jsxref("Boolean", "布尔值")}}。</p> + +<h2 id="描述">描述</h2> + +<p>每个对象都有一个 <code>propertyIsEnumerable</code> 方法。此方法可以确定对象中指定的属性是否可以被 {{jsxref("Statements/for...in", "for...in")}} 循环枚举，但是通过原型链继承的属性除外。如果对象没有指定的属性，则此方法返回 <code>false</code>。</p> + +<h2 id="例子">例子</h2> + +<h3 id="propertyIsEnumerable_方法的基本用法"><code>propertyIsEnumerable</code> 方法的基本用法</h3> + +<p>下面的例子演示了 <code>propertyIsEnumerable</code> 方法在普通对象和数组上的基本用法：</p> + +<pre class="brush: js">var o = {}; +var a = []; +o.prop = 'is enumerable'; +a[0] = 'is enumerable'; + +o.propertyIsEnumerable('prop'); // 返回 true +a.propertyIsEnumerable(0); // 返回 true</pre> + +<h3 id="用户自定义对象和内置对象">用户自定义对象和内置对象</h3> + +<p>下面的例子演示了用户自定义对象和内置对象上属性可枚举性的区别.</p> + +<pre class="brush: js">var a = ['is enumerable']; + +a.propertyIsEnumerable(0); // 返回 true +a.propertyIsEnumerable('length'); // 返回 false + +Math.propertyIsEnumerable('random'); // 返回 false +this.propertyIsEnumerable('Math'); // 返回 false</pre> + +<h3 id="自身属性和继承属性">自身属性和继承属性</h3> + +<pre class="brush: js">var a = []; +a.propertyIsEnumerable('constructor'); // 返回 false + +function firstConstructor() { + this.property = 'is not enumerable'; +} + +firstConstructor.prototype.firstMethod = function() {}; + +function secondConstructor() { + this.method = function method() { return 'is enumerable'; }; +} + +secondConstructor.prototype = new firstConstructor; +secondConstructor.prototype.constructor = secondConstructor; + +var o = new secondConstructor(); +o.arbitraryProperty = 'is enumerable'; + +o.propertyIsEnumerable('arbitraryProperty'); // 返回 true +o.propertyIsEnumerable('method'); // 返回 true +o.propertyIsEnumerable('property'); // 返回 false + +o.property = 'is enumerable'; + +o.propertyIsEnumerable('property'); // 返回 true + +// 之所以这些会返回 false，是因为，在原型链上 propertyIsEnumerable 不被考虑 +// (尽管最后两个在 for-in 循环中可以被循环出来)。 +o.propertyIsEnumerable('prototype'); // 返回 false (根据 JS 1.8.1/FF3.6) +o.propertyIsEnumerable('constructor'); // 返回 false +o.propertyIsEnumerable('firstMethod'); // 返回 false</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('ES3')}}</td> + <td>{{Spec2('ES3')}}</td> + <td>Initial definition</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.2.4.7', 'Object.prototype.propertyIsEnumerable')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-object.prototype.propertyisenumerable', 'Object.prototype.propertyIsEnumerable')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-object.prototype.propertyisenumerable', 'Object.prototype.propertyIsEnumerable')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div class="hidden">The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</div> + +<p>{{Compat("javascript.builtins.Object.propertyIsEnumerable")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li><a href="/zh-CN/docs/Enumerability_and_ownership_of_properties">属性的可枚举性和所有权</a></li> + <li>{{jsxref("Statements/for...in", "for...in")}}</li> + <li>{{jsxref("Object.keys()")}}</li> + <li>{{jsxref("Object.defineProperty()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/object/proto/index.html b/files/zh-cn/web/javascript/reference/global_objects/object/proto/index.html new file mode 100644 index 0000000000..7a9d4dfefd --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/object/proto/index.html @@ -0,0 +1,142 @@ +--- +title: Object.prototype.__proto__ +slug: Web/JavaScript/Reference/Global_Objects/Object/proto +tags: + - ECMAScript 2015 + - JavaScript + - Object + - Property + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Object/proto +--- +<div>{{JSRef}}{{Deprecated_header}}</div> + +<div class="warning"> +<p><strong>警告:</strong> 通过现代浏览器的操作属性的便利性，可以改变一个对象的 <code>[[Prototype]]</code> 属性, 这种行为在每一个JavaScript引擎和浏览器中都是一个非常慢且影响性能的操作，使用这种方式来改变和继承属性是对性能影响非常严重的，并且性能消耗的时间也不是简单的花费在 <code>obj.__proto__ = ...</code> 语句上, 它还会影响到所有继承来自该 <code>[[Prototype]]</code> 的对象，如果你关心性能，你就不应该在一个对象中修改它的 [[Prototype]]。相反, 创建一个新的且可以继承 <code>[[Prototype]]</code> 的对象，推荐使用 {{jsxref("Object.create()")}}。</p> +</div> + +<div class="warning"> +<p><strong>警告:</strong> 当<code>Object.prototype.__proto__</code> 已被大多数浏览器厂商所支持的今天，其存在和确切行为仅在ECMAScript 2015规范中被标准化为传统功能，以确保Web浏览器的兼容性。为了更好的支持，建议只使用 {{jsxref("Object.getPrototypeOf()")}}。</p> +</div> + +<div>{{jsxref("Object.prototype")}} 的 <code>__proto__</code> 属性是一个访问器属性（一个getter函数和一个setter函数）, 暴露了通过它访问的对象的内部<code>[[Prototype]]</code> (一个对象或 {{jsxref("Global_Objects/null", "null")}})。</div> + +<div></div> + +<p>使用<code>__proto__</code>是有争议的，也不鼓励使用它。因为它从来没有被包括在EcmaScript语言规范中，但是现代浏览器都实现了它。<code>__proto__</code>属性已在ECMAScript 6语言规范中标准化，用于确保Web浏览器的兼容性，因此它未来将被支持。它已被不推荐使用, 现在更推荐使用{{jsxref("Object.getPrototypeOf")}}/{{jsxref("Reflect.getPrototypeOf")}} 和{{jsxref("Object.setPrototypeOf")}}/{{jsxref("Reflect.setPrototypeOf")}}（尽管如此，设置对象的[[Prototype]]是一个缓慢的操作，如果性能是一个问题，应该避免）。</p> + +<p>__proto__ 属性也可以在对象文字定义中使用对象[[Prototype]]来创建，作为{{jsxref("Object.create()")}} 的一个替代。 请参阅： <a href="/en-US/docs/Web/JavaScript/Reference/Operators/Object_initializer">object initializer / literal syntax</a>.</p> + +<h2 id="语法">语法</h2> + +<pre class="brush: js">let Circle = function () {}; +let shape = {}; +let circle = new Circle(); + +// 设置该对象的原型链引用 +// 过时且不推荐使用的。这里只是举个例子，尽量不要在生产环境中这样做。 +shape.__proto__ = circle; + +// 判断该对象的原型链引用是否属于circle +console.log(shape.__proto__ === circle); // true +</pre> + +<pre class="brush: js">let shape = function () {}; +let p = { + a: function () { + console.log('aaa'); + } +}; +shape.prototype.__proto__ = p; + +let circle = new shape(); +circle.a();//aaa +console.log(shape.prototype === circle.__proto__);//true + +//或者 +let shape = function () {}; +var p = { + a: function () { + console.log('a'); + } +}; + +let circle = new shape(); +circle.__proto__ = p; +circle.a(); // a +console.log(shape.prototype === circle.__proto__);//false + +//或者 +function test() {} +test.prototype.myname = function () { + console.log('myname'); +} +let a = new test() +console.log(a.__proto__ === test.prototype);//true +a.myname();//myname + +//或者 +let fn = function () {}; +fn.prototype.myname = function () { + console.log('myname'); +} + +let obj = { + __proto__: fn.prototype +}; + +obj.myname();//myname +</pre> + +<p>注意：这是两个下划线，后面是五个字符的 “proto” ，后面再跟两个下划线。</p> + +<h2 id="描述">描述</h2> + +<p>__proto__的读取器(getter)暴露了一个对象的内部 <code>[[Prototype]]</code> 。对于使用对象字面量创建的对象，这个值是 {{jsxref("Object.prototype")}}。对于使用数组字面量创建的对象，这个值是 {{jsxref("Array.prototype")}}。对于functions，这个值是{{jsxref("Function.prototype")}}。对于使用 new fun 创建的对象，其中fun是由js提供的内建构造器函数之一({{jsxref("Array")}}, {{jsxref("Boolean")}}, {{jsxref("Date")}}, {{jsxref("Number")}}, {{jsxref("Object")}}, {{jsxref("String")}} 等等），这个值总是fun.prototype。对于用js定义的其他js构造器函数创建的对象，这个值就是该构造器函数的prototype属性。</p> + +<p>__proto__ 的设置器(setter)允许对象的 <code>[[Prototype]]被变更。前提是这个对象必须通过</code> {{jsxref("Object.isExtensible()")}} 判断为是可扩展的，如果不可扩展，则会抛出一个 {{jsxref("Global_Objects/TypeError", "TypeError")}} 错误。要变更的值必须是一个object或{{jsxref("Global_Objects/null", "null")}}，提供其它值将不起任何作用。</p> + +<p>要理解原型如何被使用，请查看相关文章：<a href="/en-US/docs/Web/JavaScript/Guide/Inheritance_and_the_prototype_chain">Inheritance and the prototype chain</a>。</p> + +<p>.__proto__属性是{{jsxref("Object.prototype")}} 一个简单的访问器属性，其中包含了get（获取）和set（设置）的方法，任何一个__proto__的存取属性都继承于{{jsxref("Object.prototype")}}，但一个访问属性如果不是来源于{{jsxref("Object.prototype")}}就不拥有.__proto__属性，譬如一个元素设置了其他的.__proto__属性在{{jsxref("Object.prototype")}}之前，将会覆盖原有的{{jsxref("Object.prototype")}}。</p> + +<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('ES6', '#sec-additional-properties-of-the-object.prototype-object', 'Object.prototype.__proto__')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Included in the (normative) annex for additional ECMAScript legacy features for Web browsers (note that the specification codifies what is already in implementations).</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-additional-properties-of-the-object.prototype-object', 'Object.prototype.__proto__')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容情况">浏览器兼容情况</h2> + +<div class="hidden">The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</div> + +<p>{{Compat("javascript.builtins.Object.proto")}}</p> + +<h2 id="兼容性注意事项">兼容性注意事项</h2> + +<p>在 ECMAScript 2015（ES6）的规范要求中，支持<code>__proto__</code> 是各大Web浏览器厂商的要求（虽然符合规范），但其他环境下因为历史遗留的问题，也有可能被使用和支持。 </p> + +<h2 id="更多请参考">更多请参考</h2> + +<ul> + <li>{{jsxref("Object.prototype.isPrototypeOf()")}}</li> + <li>{{jsxref("Object.getPrototypeOf()")}}</li> + <li>{{jsxref("Object.setPrototypeOf()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/object/prototype/index.html b/files/zh-cn/web/javascript/reference/global_objects/object/prototype/index.html new file mode 100644 index 0000000000..c3a7d022f7 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/object/prototype/index.html @@ -0,0 +1,194 @@ +--- +title: Object.prototype +slug: Web/JavaScript/Reference/Global_Objects/Object/prototype +tags: + - JavaScript + - Object + - Property +translation_of: Web/JavaScript/Reference/Global_Objects/Object +--- +<div>{{JSRef}}</div> + +<p><code><strong>Object.prototype</strong></code> 属性表示 {{jsxref("Object")}} 的原型对象。</p> + +<p>{{js_property_attributes(0, 0, 0)}}</p> + +<h2 id="Description" name="Description">描述</h2> + +<p>几乎所有的 JavaScript 对象都是 {{jsxref("Object")}} 的实例；一个典型的对象继承了<code>Object.prototype</code>的属性（包括方法），尽管这些属性可能被遮蔽（亦称为覆盖）。但是有时候可能故意创建不具有典型原型链继承的对象，比如通过{{jsxref("Object.create", "Object.create(null)")}}创建的对象，或者通过{{jsxref("Object.setPrototypeOf")}}方法改变原型链。</p> + +<p>改变<code>Object</code>原型，会通过原型链改变<strong>所有</strong>对象；除非在原型链中进一步覆盖受这些变化影响的属性和方法。这提供了一个非常强大的、但有潜在危险的机制来覆盖或扩展对象行为。</p> + +<h2 id="Properties" name="Properties">属性</h2> + +<dl> + <dt>{{jsxref("Object.prototype.constructor")}}</dt> + <dd>特定的函数，用于创建一个对象的原型。</dd> + <dt>{{jsxref("Object.prototype.__proto__")}} {{non-standard_inline}}</dt> + <dd>指向当对象被实例化的时候，用作原型的对象。</dd> + <dt>{{jsxref("Object.prototype.__noSuchMethod__")}} {{non-standard_inline}}</dt> + <dd>当未定义的对象成员被调用作方法的时候，允许定义并执行的函数。</dd> + <dt><s class="obsoleteElement">{{jsxref("Object.prototype.__count__")}} {{obsolete_inline}}</s></dt> + <dd><s class="obsoleteElement">用于直接返回用户定义的对象中可数的属性的数量。已被废除。</s></dd> + <dt><s class="obsoleteElement">{{jsxref("Object.prototype.__parent__")}} {{obsolete_inline}}</s></dt> + <dd><s class="obsoleteElement">用于指向对象的内容。已被废除。</s></dd> +</dl> + +<h2 id="Methods" name="Methods">方法</h2> + +<dl> + <dt>{{jsxref("Object.prototype.__defineGetter__()")}} {{non-standard_inline}} {{deprecated_inline}}</dt> + <dd>关联一个函数到一个属性。访问该函数时，执行该函数并返回其返回值。</dd> + <dt>{{jsxref("Object.prototype.__defineSetter__()")}} {{non-standard_inline}} {{deprecated_inline}}</dt> + <dd>关联一个函数到一个属性。设置该函数时，执行该修改属性的函数。</dd> + <dt>{{jsxref("Object.prototype.__lookupGetter__()")}} {{non-standard_inline}} {{deprecated_inline}}</dt> + <dd>返回使用 {{jsxref("Object.defineGetter", "__defineGetter__")}} 定义的方法函数 。</dd> + <dt>{{jsxref("Object.prototype.__lookupSetter__()")}} {{non-standard_inline}} {{deprecated_inline}}</dt> + <dd>返回使用 {{jsxref("Object.defineSetter", "__defineSetter__")}} 定义的方法函数。</dd> + <dt>{{jsxref("Object.prototype.hasOwnProperty()")}}</dt> + <dd>返回一个布尔值 ，表示某个对象是否含有指定的属性，而且此属性非原型链继承的。</dd> + <dt>{{jsxref("Object.prototype.isPrototypeOf()")}}</dt> + <dd>返回一个布尔值，表示指定的对象是否在本对象的原型链中。</dd> + <dt>{{jsxref("Object.prototype.propertyIsEnumerable()")}}</dt> + <dd>判断指定属性是否可枚举，内部属性设置参见 <a href="/zh-CN/docs/Web/JavaScript/Data_structures#Properties">ECMAScript [[Enumerable]] attribute</a> 。</dd> + <dt>{{jsxref("Object.prototype.toSource()")}} {{non-standard_inline}}</dt> + <dd>返回字符串表示此对象的源代码形式，可以使用此字符串生成一个新的相同的对象。</dd> + <dt>{{jsxref("Object.prototype.toLocaleString()")}}</dt> + <dd>直接调用 {{jsxref("Object.toString", "toString()")}}方法。</dd> + <dt>{{jsxref("Object.prototype.toString()")}}</dt> + <dd>返回对象的字符串表示。</dd> + <dt>{{jsxref("Object.prototype.unwatch()")}} {{non-standard_inline}}</dt> + <dd>移除对象某个属性的监听。</dd> + <dt>{{jsxref("Object.prototype.valueOf()")}}</dt> + <dd>返回指定对象的原始值。</dd> + <dt>{{jsxref("Object.prototype.watch()")}} {{non-standard_inline}}</dt> + <dd>给对象的某个属性增加监听。</dd> + <dt><s class="obsoleteElement">{{jsxref("Object.prototype.eval()")}} {{obsolete_inline}}</s></dt> + <dd><s class="obsoleteElement">在指定对象为上下文情况下执行javascript字符串代码，已经废弃。</s></dd> +</dl> + +<h2 id="Examples" name="Examples">示例</h2> + +<p>当改变现有的 Object.prototype method(方法)的行为时，考虑在现有逻辑之前或之后通过封装你的扩展来注入代码。例如,此(未测试的)代码将在内置逻辑或其他人的扩展执行之前 pre-conditionally（预条件地）执行自定义逻辑。</p> + +<p>当一个函数被调用时,调用的参数被保留在类似数组 "变量" 的<a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/arguments">参数</a>中。例如, 在调用 "myFn (a、b、c)"时, 在myFn 的主体内的参数将包含 3个类似数组的元素对应于 (a、b、c)。 使用钩子修改原型时,只需通过调用该函数的 apply ()，将 this 与参数 (调用状态) 传递给当前行为。这种模式可以用于任何原型，如 Node.prototype、 Function.prototype 等.</p> + +<pre class="brush: js">var current = Object.prototype.valueOf; + +// 由于我的属性 "-prop-value"是交叉性的, 并不总是 +// 在同一个原型链上，我想要修改 Object.prototype: +Object.prototype.valueOf = function() { + if (this.hasOwnProperty('-prop-value')) { + return this['-prop-value']; + } else { + // <code>它看起来不像我的对象之一，因此，让我们退回到</code> + // <code>默认行为，通过尽可能地复制当前行为来实现.</code> + // <code>此apply的行为类似于其他语言中的"super"</code>. + // <code>即使 valueOf() 不带参数, 其他的钩子可能会带有.</code> + return current.apply(this, arguments); + } +}</pre> + +<p>由于 JavaScript 并不完全具有子类对象, 所以原型是一种有用的变通方法, 可以使用某些函数的 "基类" 对象来充当对象。例如:</p> + +<pre class="brush: js">var Person = function(name) { + this.name = name; + this.canTalk = true; +}; + +Person.prototype.greet = function() { + if (this.canTalk) { + console.log('Hi, I am ' + this.name); + } +}; + +var Employee = function(name, title) { + Person.call(this, name); + this.title = title; +}; + +Employee.prototype = Object.create(Person.prototype); + +Employee.prototype.greet = function() { + if (this.canTalk) { + console.log('Hi, I am ' + this.name + ', the ' + this.title); + } +}; + +var Customer = function(name) { + Person.call(this, name); +}; + +Customer.prototype = Object.create(Person.prototype); + +var Mime = function(name) { + Person.call(this, name); + this.canTalk = false; +}; + +Mime.prototype = Object.create(Person.prototype); + +var bob = new Employee('Bob', 'Builder'); +var joe = new Customer('Joe'); +var rg = new Employee('Red Green', 'Handyman'); +var mike = new Customer('Mike'); +var mime = new Mime('Mime'); + +bob.greet(); +// Hi, I am Bob, the Builder + +joe.greet(); +// Hi, I am Joe + +rg.greet(); +// Hi, I am Red Green, the Handyman + +mike.greet(); +// Hi, I am Mike + +mime.greet(); +</pre> + +<h2 id="Specifications" name="Specifications">规范</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('ES1')}}</td> + <td>{{Spec2('ES1')}}</td> + <td>Initial definition. Implemented in JavaScript 1.0.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.2.3.1', 'Object.prototype')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-object.prototype', 'Object.prototype')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-object.prototype', 'Object.prototype')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">浏览器兼容</h2> + +<div class="hidden">The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</div> + +<p>{{Compat("javascript.builtins.Object.prototype")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li><a href="/zh-CN/docs/Web/JavaScript/Introduction_to_Object-Oriented_JavaScript">Introduction to Object-Oriented JavaScript</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/object/seal/index.html b/files/zh-cn/web/javascript/reference/global_objects/object/seal/index.html new file mode 100644 index 0000000000..7a18ee2e91 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/object/seal/index.html @@ -0,0 +1,151 @@ +--- +title: Object.seal() +slug: Web/JavaScript/Reference/Global_Objects/Object/seal +tags: + - ECMAScript 5 + - JavaScript + - Method + - Object +translation_of: Web/JavaScript/Reference/Global_Objects/Object/seal +--- +<div>{{JSRef}}</div> + +<div><code><strong>Object.seal()</strong></code>方法封闭一个对象，阻止添加新属性并将所有现有属性标记为不可配置。当前属性的值只要原来是可写的就可以改变。</div> + +<div></div> + +<div>{{EmbedInteractiveExample("pages/js/object-prototype-seal.html")}}</div> + + + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code>Object.seal(<em>obj</em>)</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>obj</code></dt> + <dd>将要被密封的对象。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>被密封的对象。</p> + +<h2 id="Description" name="Description">描述</h2> + +<p>通常，一个对象是{{jsxref("Object.isExtensible()", "可扩展的", "", 1)}}（可以添加新的属性）。密封一个对象会让这个对象变的不能添加新属性，且所有已有属性会变的不可配置。属性不可配置的效果就是属性变的不可删除，以及一个数据属性不能被重新定义成为访问器属性，或者反之。但属性的值仍然可以修改。尝试删除一个密封对象的属性或者将某个密封对象的属性从数据属性转换成访问器属性，结果会静默失败或抛出{{jsxref("TypeError")}}（在{{jsxref("Strict_mode", "严格模式", "", 1)}} 中最常见的，但不唯一）。</p> + +<p>不会影响从原型链上继承的属性。但 {{jsxref("Object.proto", "__proto__")}} ( {{deprecated_inline}} ) 属性的值也会不能修改。</p> + +<p>返回被密封对象的引用。</p> + +<h2 id="Examples" name="Examples">例子</h2> + +<pre class="brush: js">var obj = { + prop: function() {}, + foo: 'bar' +}; + +// 可以添加新的属性 +// 可以更改或删除现有的属性 +obj.foo = 'baz'; +obj.lumpy = 'woof'; +delete obj.prop; + +var o = Object.seal(obj); + +o === obj; // true +Object.isSealed(obj); // === true + +// 仍然可以修改密封对象的属性值 +obj.foo = 'quux'; + + +// 但是你不能将属性重新定义成为访问器属性 +// 反之亦然 +Object.defineProperty(obj, 'foo', { + get: function() { return 'g'; } +}); // throws a TypeError + +// 除了属性值以外的任何变化，都会失败. +obj.quaxxor = 'the friendly duck'; +// 添加属性将会失败 +delete obj.foo; +// 删除属性将会失败 + +// 在严格模式下，这样的尝试将会抛出错误 +function fail() { + 'use strict'; + delete obj.foo; // throws a TypeError + obj.sparky = 'arf'; // throws a TypeError +} +fail(); + +// 通过Object.defineProperty添加属性将会报错 +Object.defineProperty(obj, 'ohai', { + value: 17 +}); // throws a TypeError +Object.defineProperty(obj, 'foo', { + value: 'eit' +}); // 通过Object.defineProperty修改属性值</pre> + +<h2 id="注意">注意</h2> + +<p>在ES5中，如果这个方法的参数不是一个（原始）对象，那么它将导致{{jsxref("TypeError")}}。在ES2015中，非对象参数将被视为已被密封的普通对象，会直接返回它。</p> + +<pre class="brush: js">Object.seal(1); +// TypeError: 1 is not an object (ES5 code) + +Object.seal(1); +// 1 (ES2015 code)</pre> + +<h3 id="对比_Object.freeze">对比 <code>Object.freeze()</code></h3> + +<p>使用<code>Object.freeze()</code>冻结的对象中的现有属性值是不可变的。用<code>Object.seal()</code>密封的对象可以改变其现有属性值。</p> + +<h2 id="规范" style="margin-bottom: 20px; line-height: 30px;">规范</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('ES5.1', '#sec-15.2.3.8', 'Object.seal')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td>Initial definition. Implemented in JavaScript 1.8.5.</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-object.seal', 'Object.seal')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-object.seal', 'Object.seal')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">浏览器兼容</h2> + +<div> + + +<p>{{Compat("javascript.builtins.Object.seal")}}</p> +</div> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("Object.isSealed()")}}</li> + <li>{{jsxref("Object.preventExtensions()")}}</li> + <li>{{jsxref("Object.isExtensible()")}}</li> + <li>{{jsxref("Object.freeze()")}}</li> + <li>{{jsxref("Object.isFrozen()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/object/setprototypeof/index.html b/files/zh-cn/web/javascript/reference/global_objects/object/setprototypeof/index.html new file mode 100644 index 0000000000..20d34f2b92 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/object/setprototypeof/index.html @@ -0,0 +1,233 @@ +--- +title: Object.setPrototypeOf() +slug: Web/JavaScript/Reference/Global_Objects/Object/setPrototypeOf +tags: + - Array + - Class + - ECMAScript6 + - ES6 + - JavaScript + - Object.setPrototypeOf() + - Typescript + - setPrototypeOf() + - 对象 + - 方法 +translation_of: Web/JavaScript/Reference/Global_Objects/Object/setPrototypeOf +--- +<div>{{JSRef}}</div> + +<div><strong>Object.setPrototypeOf() </strong>方法设置一个指定的对象的原型 ( 即, 内部[[Prototype]]属性）到另一个对象或 {{jsxref("null")}}。</div> + +<div></div> + +<div class="warning"> +<p><strong>警告:</strong> 由于现代 JavaScript 引擎优化属性访问所带来的特性的关系，更改对象的 <code>[[Prototype]]</code>在<em><strong>各个</strong></em>浏览器和 JavaScript 引擎上都是一个很慢的操作。其在更改继承的性能上的影响是微妙而又广泛的，这不仅仅限于 <code>obj.__proto__ = ...</code> 语句上的时间花费，而且可能会延伸到<em><strong>任何</strong></em>代码，那些可以访问<em><strong>任何</strong></em><code>[[Prototype]]</code>已被更改的对象的代码。如果你关心性能，你应该避免设置一个对象的 <code>[[Prototype]]</code>。相反，你应该使用 {{jsxref("Object.create()")}}来创建带有你想要的<code>[[Prototype]]</code>的新对象。</p> +</div> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code>Object.setPrototypeOf(<em>obj, prototype</em>)</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt>obj</dt> + <dd>要设置其原型的对象。.</dd> + <dt>prototype</dt> + <dd>该对象的新原型(一个对象 或 {{jsxref("null")}}).</dd> +</dl> + +<h2 id="Description" name="Description">描述</h2> + +<p>如果对象的[[Prototype]]被修改成不可扩展(通过 {{jsxref("Object.isExtensible()")}}查看)，就会抛出 {{jsxref("TypeError")}}异常。如果<code>prototype</code>参数不是一个对象或者{{jsxref("null")}}(例如，数字，字符串，boolean，或者 {{jsxref("undefined")}})，则什么都不做。否则，该方法将<code>obj</code>的<code>[[Prototype]]</code>修改为新的值。</p> + +<p><code>Object.setPrototypeOf()是</code>ECMAScript 6最新草案中的方法，相对于 {{jsxref("Object.prototype.__proto__")}} ，它被认为是修改对象原型更合适的方法</p> + +<h2 id="示例">示例</h2> + +<pre><code>var dict = Object.setPrototypeOf({}, null);</code></pre> + +<h2 id="Notes" name="Notes">Polyfill</h2> + +<p><span class="short_text" id="result_box" lang="en"><span>我们必须借助非标准的</span> </span> </p> + +<p>使用较旧的 {{jsxref("Object.prototype.__proto__")}} 属性，我们可以很容易地定义Object.setPrototypeOf 如果它不可用：</p> + +<pre>if (!Object.setPrototypeOf) { + // 仅适用于Chrome和FireFox，在IE中不工作： + Object.prototype.setPrototypeOf = function(obj, proto) { + if(obj.__proto__) { + obj.__proto__ = proto; + return obj; + } else { + // 如果你想返回 prototype of Object.create(null): + var Fn = function() { + for (var key in obj) { + Object.defineProperty(this, key, { + value: obj[key], + }); + } + }; + Fn.prototype = proto; + return new Fn(); + } + } +} +</pre> + + + +<h2 id="附加原型链">附加原型链</h2> + +<p>通过 <code>Object.getPrototypeOf() 和</code> {{jsxref("Object.proto", "Object.prototype.__proto__")}} 的组合允许将一个原型链完整的附加到一个新的原型对象上：</p> + +<pre class="brush: js">/** +*** Object.appendChain(@object, @prototype) +* +* Appends the first non-native prototype of a chain to a new prototype. +* Returns @object (if it was a primitive value it will transformed into an object). +* +*** Object.appendChain(@object [, "@arg_name_1", "@arg_name_2", "@arg_name_3", "..."], "@function_body") +*** Object.appendChain(@object [, "@arg_name_1, @arg_name_2, @arg_name_3, ..."], "@function_body") +* +* Appends the first non-native prototype of a chain to the native Function.prototype object, then appends a +* new Function(["@arg"(s)], "@function_body") to that chain. +* Returns the function. +* +**/ + +Object.appendChain = function(oChain, oProto) { + if (arguments.length < 2) { + throw new TypeError('Object.appendChain - Not enough arguments'); + } + if (typeof oProto === 'number' || typeof oProto === 'boolean') { + throw new TypeError('second argument to Object.appendChain must be an object or a string'); + } + + var oNewProto = oProto, + oReturn, + o2nd, + oLast; + + oReturn = o2nd = oLast = oChain instanceof this ? oChain : new oChain.constructor(oChain); + + for (var o1st = this.getPrototypeOf(o2nd); + o1st !== Object.prototype && o1st !== Function.prototype; + o1st = this.getPrototypeOf(o2nd) + ) { + o2nd = o1st; + } + + if (oProto.constructor === String) { + oNewProto = Function.prototype; + oReturn = Function.apply(null, Array.prototype.slice.call(arguments, 1)); + this.setPrototypeOf(oReturn, oLast); + } + + this.setPrototypeOf(o2nd, oNewProto); + return oReturn; +}</pre> + +<h2 id="使用">使用</h2> + +<p>例子一：向一个原型附加一个链</p> + +<pre class="brush: js">function Mammal() { + this.isMammal = 'yes'; +} + +function MammalSpecies(sMammalSpecies) { + this.species = sMammalSpecies; +} + +MammalSpecies.prototype = new Mammal(); +MammalSpecies.prototype.constructor = MammalSpecies; + +var oCat = new MammalSpecies('Felis'); + +console.log(oCat.isMammal); +// 'yes' + +function Animal() { + this.breathing = 'yes'; +} + +Object.appendChain(oCat, new Animal()); + +console.log(oCat.breathing); +// 'yes'</pre> + +<p>例子二：将一个基本类型转化为对应的对象类型并添加到原型链上</p> + +<pre class="brush: js">function Symbol() { + this.isSymbol = 'yes'; +} + +var nPrime = 17; + +console.log(typeof nPrime); // 'number' + +var oPrime = Object.appendChain(nPrime, new Symbol()); + +console.log(oPrime); // '17' +console.log(oPrime.isSymbol); // 'yes' +console.log(typeof oPrime); // 'object'</pre> + +<p>例子三：给函数类型的对象添加一个链，并添加一个新的方法到那个链上</p> + +<pre class="brush: js">function Person(sName) { + this.identity = sName; +} + +var george = Object.appendChain(new Person('George'), 'console.log("Hello guys!!");'); + +console.log(george.identity); // 'George' +george(); // 'Hello guys!!'</pre> + +<h2 id="说明书">说明书</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">说明</th> + <th scope="col">状态</th> + <th scope="col">备注</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ES6', '#sec-object.setprototypeof', 'Object.setProtoypeOf')}}</td> + <td> + <table> + <tbody> + <tr> + <td>{{Spec2('ES6')}}</td> + </tr> + </tbody> + </table> + </td> + <td>Initial definition.</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div class="hidden"> +<p>本页面上的兼容性表是由结构化数据生成的。如果你想贡献数据，请查看<a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> ，并向我们发送拉取请求。</p> +</div> + + + +<p>{{Compat("javascript.builtins.Object.setPrototypeOf")}}</p> + +<div id="compat-desktop"></div> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("Reflect.setPrototypeOf()")}}</li> + <li>{{jsxref("Object.prototype.isPrototypeOf()")}}</li> + <li>{{jsxref("Object.getPrototypeOf()")}}</li> + <li>{{jsxref("Object.prototype.__proto__")}} </li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/object/tolocalestring/index.html b/files/zh-cn/web/javascript/reference/global_objects/object/tolocalestring/index.html new file mode 100644 index 0000000000..611bfc560f --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/object/tolocalestring/index.html @@ -0,0 +1,80 @@ +--- +title: Object.prototype.toLocaleString() +slug: Web/JavaScript/Reference/Global_Objects/Object/toLocaleString +tags: + - JavaScript + - Method + - Object + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Object/toLocaleString +--- +<div>{{JSRef("Global_Objects", "Object")}}</div> + +<p><code><strong>toLocaleString()</strong></code> 方法返回一个该对象的字符串表示。此方法被用于派生对象为了特定语言环境的目的（locale-specific purposes）而重载使用。</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code><var>obj</var>.toLocaleString();</code> +</pre> + +<h3 id="返回值">返回值</h3> + +<p>表示对象的字符串。</p> + +<h2 id="Description" name="Description">描述</h2> + +<p>{{jsxref("Object")}} <code>toLocaleString</code> 返回调用 {{jsxref("Object.toString", "toString()")}} 的结果。</p> + +<p>该函数提供给对象一个通用的<code>toLocaleString</code> 方法，即使不是全部都可以使用它。 见下面的列表。</p> + +<h3 id="覆盖_toLocaleString_的对象">覆盖 <code>toLocaleString</code> 的对象</h3> + +<ul> + <li>{{jsxref("Array")}}：{{jsxref("Array.prototype.toLocaleString()")}}</li> + <li>{{jsxref("Number")}}：{{jsxref("Number.prototype.toLocaleString()")}}</li> + <li>{{jsxref("Date")}}：{{jsxref("Date.prototype.toLocaleString()")}}</li> +</ul> + +<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('ES3')}}</td> + <td>{{Spec2('ES3')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.2.4.3', 'Object.prototype.toLocaleString')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-object.prototype.tolocalestring', 'Object.prototype.toLocaleString')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-object.prototype.tolocalestring', 'Object.prototype.toLocaleString')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div class="hidden">The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</div> + +<p>{{Compat("javascript.builtins.Object.toLocaleString")}}</p> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("Object.prototype.toString()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/object/tosource/index.html b/files/zh-cn/web/javascript/reference/global_objects/object/tosource/index.html new file mode 100644 index 0000000000..a47cd4dbc2 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/object/tosource/index.html @@ -0,0 +1,128 @@ +--- +title: Object.prototype.toSource() +slug: Web/JavaScript/Reference/Global_Objects/Object/toSource +tags: + - JavaScript + - Method + - Object + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Object/toSource +--- +<div> +<div>{{JSRef}} {{non-standard_header}}</div> +</div> + +<p><strong><code>toSource()</code></strong>方法返回一个表示对象源代码的字符串。</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code><em>Object.toSource(); obj</em>.toSource()</code></pre> + +<h3 id="Parameters" name="Parameters">返回值</h3> + +<p>一个表示对象的源代码的字符串。</p> + +<h2 id="Description" name="Description">描述</h2> + +<p><code>toSource()</code>方法返回以下值:</p> + +<ul> + <li>对于内置的{{jsxref("Object")}} 对象, <code>toSource</code>返回了下面的字符串，表示源码没法获取：</li> +</ul> + +<pre class="brush: js">function Object() { + [native code] +}</pre> + +<ul> + <li>对于{{jsxref("Object")}}的实例，<code>toSource()</code> 会返回该实例源代码的字符串表示。</li> +</ul> + +<p>在调试时,你可以通过<code>toSource()</code>来查看一个对象的内容。</p> + +<h3 id="重写toSource()方法">重写toSource()方法</h3> + +<p>允许对象重写<code>toSource()</code>方法。例如：</p> + +<pre class="brush: js">function Person(name) { + this.name = name; +} + +Person.prototype.toSource = function Person_toSource() { + return "new Person(" + uneval(this.name) + ")"; +}; + +alert(new Person("Joe").toSource()); // ---> new Person("Joe")</pre> + +<h3 id="Built-in_toString_methods" name="Built-in_toString_methods">内置<code>的toSource方法</code></h3> + +<p>每个JavaScript核心类型都有它自己的<code>toSource()</code>方法.这些对象是：</p> + +<ul> + <li>{{jsxref("Array.prototype.toSource()")}} {{non-standard_inline}} — {{jsxref("Array")}} object.</li> + <li>{{jsxref("Boolean.prototype.toSource()")}} {{non-standard_inline}} — {{jsxref("Boolean")}} object.</li> + <li>{{jsxref("Date.prototype.toSource()")}} {{non-standard_inline}} — {{jsxref("Date")}} object.</li> + <li>{{jsxref("Function.prototype.toSource()")}} {{non-standard_inline}} — {{jsxref("Function")}} object.</li> + <li>{{jsxref("Number.prototype.toSource()")}} {{non-standard_inline}} — {{jsxref("Number")}} object.</li> + <li>{{jsxref("RegExp.prototype.toSource()")}} {{non-standard_inline}} — {{jsxref("RegExp")}} object.</li> + <li>{{jsxref("SIMD.toSource()", "SIMD.%type%.prototype.toSource()")}} {{non-standard_inline}} — {{jsxref("SIMD")}} objects.</li> + <li>{{jsxref("String.prototype.toSource()")}} {{non-standard_inline}} — {{jsxref("String")}} object.</li> + <li>{{jsxref("Symbol.prototype.toSource()")}} {{non-standard_inline}} — {{jsxref("Symbol")}} object.</li> + <li><code>Math.toSource()</code> — Returns the String "Math".</li> +</ul> + +<h3 id="循环引用限制">循环引用限制</h3> + +<p><span id="noHighlight_0.3266603437527873">对于包含对自身的引用的对象 (例如, 循环链表或可以遍历两种方式的树), </span><code>toSource()</code><span>不会重新创建自引用, 如火狐24。例如:</span></p> + +<pre class="brush: js">var obj1 = {}; +var obj2 = { a: obj1 }; +obj1.b = obj2; + +console.log('Cyclical: ' + (obj1.b.a == obj1)); + +var objSource = obj1.toSource(); // returns "({b:{a:{}}})" + +obj1 = eval(objSource); + +console.log('Cyclical: ' + (obj1.b.a == obj1));</pre> + +<p><span id="noHighlight_0.30716570898096807">如果使用循环结构, 并且需要 </span><code>toSource()</code><span>, 则对象必须提供对 </span><code>toSource()</code><span> 的重写, 无论是对构造函数的引用还是提供匿名函数。</span></p> + +<h2 id="Examples" name="Examples">示例</h2> + +<h3 id="Example:_Using_toSource" name="Example:_Using_toSource">使用<code>toSource()</code></h3> + +<p>下面的代码定义了一个<code>Dog</code>对象类型还创建了一个<code>Dog</code>类型的对象实例<code>theDog</code>：</p> + +<pre class="brush:js">function Dog(name, breed, color, sex) { + this.name = name; + this.breed = breed; + this.color = color; + this.sex = sex; +} + +theDog = new Dog("Gabby", "Lab", "chocolate", "girl");</pre> + +<p>在<code>theDog</code>上调用<code>toSource</code>方法会显示出能定义该对象的源码：</p> + +<pre class="brush: js">theDog.toSource(); +// returns ({name:"Gabby", breed:"Lab", color:"chocolate", sex:"female"})</pre> + +<h2 id="特性">特性</h2> + +<p>不属于任何标准的一部分。在JavaScript1.3中实现。</p> + +<h2 id="浏览器兼容">浏览器兼容</h2> + +<div class="hidden">The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</div> + +<p>{{Compat("javascript.builtins.Object.toSource")}}</p> + +<h2 id="See_Also" name="See_Also">相关链接</h2> + +<ul> + <li>{{jsxref("Object.prototype.toString()")}}</li> +</ul> + +<p></p> diff --git a/files/zh-cn/web/javascript/reference/global_objects/object/tostring/index.html b/files/zh-cn/web/javascript/reference/global_objects/object/tostring/index.html new file mode 100644 index 0000000000..a38a5d8913 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/object/tostring/index.html @@ -0,0 +1,139 @@ +--- +title: Object.prototype.toString() +slug: Web/JavaScript/Reference/Global_Objects/Object/toString +tags: + - JavaScript + - Method + - Object + - Prototype + - 原型 + - 对象 + - 方法 +translation_of: Web/JavaScript/Reference/Global_Objects/Object/toString +--- +<p>{{JSRef}}</p> + +<p><code><strong>toString()</strong></code> 方法返回一个表示该对象的字符串。</p> + +<div>{{EmbedInteractiveExample("pages/js/object-prototype-tostring.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><var>obj</var>.toString()</code></pre> + +<h3 id="返回值">返回值</h3> + +<p>一个表示该对象的字符串。</p> + +<h2 id="描述">描述</h2> + +<p>每个对象都有一个 <code>toString()</code> 方法，当该对象被表示为一个文本值时，或者一个对象以预期的字符串方式引用时自动调用。默认情况下，<code>toString()</code> 方法被每个 <code>Object</code> 对象继承。如果此方法在自定义对象中未被覆盖，<code>toString()</code> 返回 "[object <em>type</em>]"，其中 <code>type</code> 是对象的类型。以下代码说明了这一点：</p> + +<pre class="brush: js">var o = new Object(); +o.toString(); // returns [object Object] +</pre> + +<div class="note"><strong>注意：</strong>如的ECMAScript 5 和随后的 Errata 中所定义，从 JavaScript 1.8.5 开始，<code>toString()</code> 调用 {{jsxref("null")}} 返回<code>[object <em>Null</em>]</code>，{{jsxref("undefined")}} 返回 <code>[object Undefined]</code>。请参阅下面的{{anch("Using_toString()_to_detect_object_class", "使用 <code>toString()</code> 检测对象类型")}}。</div> + +<h2 id="示例">示例</h2> + +<h3 id="覆盖默认的_toString_方法">覆盖默认的 <code>toString</code> 方法</h3> + +<p>可以自定义一个方法，来取代默认的 <code>toString()</code> 方法。该 <code>toString()</code> 方法不能传入参数，并且必须返回一个字符串。自定义的 <code>toString()</code><span> 方法可以是任何我们需要的值，但如果它附带有关对象的信息，它将变得非常有用。</span></p> + +<p>以下代码定义了 <code>Dog</code> 对象类型，并创建了一个 <code>Dog</code> 类型的 <code>theDog</code> 对象：</p> + +<pre class="brush: js">function Dog(name,breed,color,sex) { + this.name = name; + this.breed = breed; + this.color = color; + this.sex = sex; +} + +var theDog = new Dog("Gabby", "Lab", "chocolate", "female");</pre> + +<p>如果当前的对象调用了 <code>toString()</code> 方法，它将会返回从 {{jsxref("Object")}}继承而来的 <code>toString()</code> 方法的返回默认值：</p> + +<pre class="brush: js"><code>theDog.toString(); // 返回 [object Object]</code></pre> + +<p>下面的代码中定义了一个叫做 <code>dogToString()</code> 的方法来覆盖默认的 <code>toString()</code> 方法。这个方法生成一个 "<code>property = value;</code>" 形式的字符串，该字符串包含了当前对象的 name、breed、color 和 sex 的值。</p> + +<pre class="brush: js">Dog.prototype.toString = function dogToString() { + var ret = "Dog " + this.name + " is a " + this.sex + " " + this.color + " " + this.breed; + return ret; +}</pre> + +<p>也可以这样写</p> + +<pre class="brush: js">Dog.prototype.toString = function dogToString() { + return `Dog ${this.name} is a ${this.sex} ${this.color} ${this.breed}`; +} +</pre> + +<p>使用上述代码，任何时候在字符串上下文中使用 <code>theDog.toString()</code> 时，JavaScript 都会自动调用 <code>dogToString()</code> 方法（<code>dogToString()</code> 可以是一个匿名函数），并且返回以下字符串：</p> + +<pre class="brush: js"><code>"Dog Gabby is a female chocolate Lab"</code></pre> + +<h3 id="使用_toString()_检测对象类型">使用 <code>toString()</code> 检测对象类型</h3> + +<p>可以通过 <code>toString()</code> 来获取每个对象的类型。为了每个对象都能通过 <code>Object.prototype.toString()</code> 来检测，需要以 <code>Function.prototype.call()</code> 或者 <code>Function.prototype.apply()</code> 的形式来调用，传递要检查的对象作为第一个参数，称为 <code>thisArg</code>。</p> + +<pre class="brush: js">var toString = Object.prototype.toString; + +toString.call(new Date); // [object Date] +toString.call(new String); // [object String] +toString.call(Math); // [object Math] + +//Since JavaScript 1.8.5 +toString.call(undefined); // [object Undefined] +toString.call(null); // [object Null] +</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>{{SpecName('ES1')}}</td> + <td>{{Spec2('ES1')}}</td> + <td>Initial definition. Implemented in JavaScript 1.0.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.2.4.2', 'Object.prototype.toString')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td>Call on {{jsxref("null")}} returns <code>[object <em>Null</em>]</code>, and {{jsxref("undefined")}} returns <code>[object <em>Undefined</em>]</code></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-object.prototype.tostring', 'Object.prototype.toString')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-object.prototype.tostring', 'Object.prototype.toString')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div class="hidden">The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</div> + +<p>{{Compat("javascript.builtins.Object.toString")}}</p> + +<h2 id="参见">参见</h2> + +<ul> + <li>{{jsxref("Object.prototype.toSource()")}}</li> + <li>{{jsxref("Object.prototype.valueOf()")}}</li> + <li>{{jsxref("Number.prototype.toString()")}}</li> + <li>{{jsxref("Symbol.toPrimitive")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/object/unobserve/index.html b/files/zh-cn/web/javascript/reference/global_objects/object/unobserve/index.html new file mode 100644 index 0000000000..bcae6ae8e7 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/object/unobserve/index.html @@ -0,0 +1,133 @@ +--- +title: Object.unobserve() +slug: Web/JavaScript/Reference/Global_Objects/Object/unobserve +translation_of: Archive/Web/JavaScript/Object.unobserve +--- +<div>{{JSRef}} {{non-standard_header}}</div> + +<p><strong>Object.unobserve()</strong> 是用来移除通过 {{jsxref("Object.observe()")}}设置的观察者的方法。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code>Object.unobserve(<var>obj</var>, <var>callback</var>)</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> 用来在 {{jsxref("Object.observe()")}} 被调用以后，从对象上移除一个观察者。</p> + +<p>这个回调函数必须是一个函数的引用，而不能是一个匿名函数。因为这个引用将被用来移除之前设置的观察者方法。 给 <strong>Object.unobserve() </strong>传入匿名函数作为回调是不起作用的， 它不能移除任何观察者方法。</p> + +<h2 id="例子">例子</h2> + +<h3 id="观察一个对象">观察一个对象</h3> + +<pre class="brush: js">var obj = { + foo: 0, + bar: 1 +}; + +var observer = function(changes) { + console.log(changes); +} + +Object.observe(obj, observer); + +obj.newProperty = 2; +// [{name: 'newProperty', object: <obj>, type: 'add'}] + +Object.unobserve(obj, observer); + +obj.foo = 1; +// 回调函数不会被调用</pre> + +<h3 id="使用匿名函数">使用匿名函数</h3> + +<pre class="brush: js">var person = { + name : 'Ahmed', + age : 25 +}; + +Object.observe(person, function (changes) { + console.log(changes); +}); + +person.age = 40; +// [{name: 'age', object: <obj>, oldValue: 25, type: 'update'}] + +Object.unobserve(person, function (changes) { + console.log(changes); +}); + +person.age = 63; +// [{name: 'age', object: <obj>, oldValue: 40, type: 'update'}] +// 回调函数将会被调用 +</pre> + +<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>{{CompatChrome("36")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatOpera("23")}}</td> + <td>{{CompatNo}}</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>{{CompatNo}}</td> + <td>{{CompatChrome("36")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatOpera("23")}}</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Object.observe()")}} {{non-standard_inline}}</li> + <li>{{jsxref("Array.observe()")}} {{non-standard_inline}}</li> + <li>{{jsxref("Array.unobserve()")}} {{non-standard_inline}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/object/unwatch/index.html b/files/zh-cn/web/javascript/reference/global_objects/object/unwatch/index.html new file mode 100644 index 0000000000..986154992d --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/object/unwatch/index.html @@ -0,0 +1,105 @@ +--- +title: Object.prototype.unwatch() +slug: Web/JavaScript/Reference/Global_Objects/Object/unwatch +translation_of: Archive/Web/JavaScript/Object.unwatch +--- +<div>{{JSRef}}</div> + +<div class="warning"> +<p><strong>警告 :</strong> 请尽量避免使用 unwatch() 和 {{jsxref("Object.prototype.watch", "watch()")}} . 这两个方法仅在 Gecko 中实现 , 并且他们过去主要作调试用. 另外, 使用 watchpoints 对性能有一系列的副面影响 ，特别是当使用全局对象，如 <code>window</code>. 你应该使用 <a href="/en-US/docs/Web/JavaScript/Guide/Working_with_Objects#Defining_getters_and_setters">setters and getters</a> 或 proxies 来替代. 查阅 {{anch("Browser compatibility")}} 以获取更多信息.</p> +</div> + +<p><code><strong>unwatch()</strong></code> 删除一个 {{jsxref("Object.prototype.watch", "watch()")}} 设置的 watchpoint.</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><var>obj</var>.unwatch(<var>prop</var>)</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>prop</code></dt> + <dd>想要停止监视的对象的属性名</dd> +</dl> + +<h2 id="描述">描述</h2> + +<p>JavaScript调试器具有类似的功能，以及其他调试选项。有关调试器的信息 <a href="/en-US/docs/Venkman">Venkman</a>.</p> + +<p>默认地, 这个方法 被每一个 {{jsxref("Object")}} 的子类继承 </p> + +<div class="note"> +<p><strong>Note:</strong> The reason for <code>unwatch()</code> to take the property name <em>prop</em> as its only parameter is due to the "single handler allowing" behavior of the {{jsxref("Object.watch", "watch()")}} method.</p> +</div> + +<h2 id="例子">例子</h2> + +<p>See {{jsxref("Object.watch", "watch()")}}.</p> + +<h2 id="说明">说明</h2> + +<p>Not part of any specifications. Implemented in JavaScript 1.2.</p> + +<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>{{CompatNo}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</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>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="Compatibility_notes">Compatibility notes</h2> + +<ul> + <li>从 Firefox 23 ({{bug(903332)}}) 开始, 在 {{domxref("Document")}} 对象上调用 <code>unwatch()</code> 抛出 {{jsxref("TypeError")}} . This regression has been fixed with Firefox 27.</li> +</ul> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Object.watch()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/object/valueof/index.html b/files/zh-cn/web/javascript/reference/global_objects/object/valueof/index.html new file mode 100644 index 0000000000..4601b3c4c7 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/object/valueof/index.html @@ -0,0 +1,208 @@ +--- +title: Object.prototype.valueOf() +slug: Web/JavaScript/Reference/Global_Objects/Object/valueOf +tags: + - JavaScript + - Method + - Object +translation_of: Web/JavaScript/Reference/Global_Objects/Object/valueOf +--- +<div style="margin: 0px; padding: 0px; border: 0px; color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; line-height: 21px; background-color: rgb(255, 255, 255);">{{JSRef}}</div> + +<p><code><strong>valueOf()</strong></code> 方法返回指定对象的原始值。</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre>object.valueOf()</pre> + +<h3 id="返回值">返回值</h3> + +<p>返回值为该对象的原始值。</p> + +<h2 id="Description" name="Description">描述</h2> + +<p>JavaScript调用<code>valueOf</code>方法将对象转换为原始值。你很少需要自己调用<code>valueOf</code>方法；当遇到要预期的原始值的对象时，JavaScript会自动调用它。</p> + +<p>默认情况下，<code>valueOf</code>方法由{{jsxref("Object")}}后面的每个对象继承。 每个内置的核心对象都会覆盖此方法以返回适当的值。如果对象没有原始值，则<code>valueOf</code>将返回对象本身。</p> + +<p>JavaScript的许多内置对象都重写了该函数，以实现更适合自身的功能需要。因此，不同类型对象的valueOf()方法的返回值和返回值类型均可能不同。</p> + +<table class="standard-table"> + <caption>不同类型对象的valueOf()方法的返回值</caption> + <thead> + <tr> + <th scope="col"><strong>对象</strong></th> + <th scope="col"><strong>返回值</strong></th> + </tr> + </thead> + <tbody> + <tr> + <td>Array</td> + <td>返回数组对象本身。</td> + </tr> + <tr> + <td>Boolean</td> + <td>布尔值。</td> + </tr> + <tr> + <td>Date</td> + <td>存储的时间是从 1970 年 1 月 1 日午夜开始计的毫秒数 UTC。</td> + </tr> + <tr> + <td>Function</td> + <td>函数本身。</td> + </tr> + <tr> + <td>Number</td> + <td>数字值。</td> + </tr> + <tr> + <td>Object</td> + <td>对象本身。这是默认情况。</td> + </tr> + <tr> + <td>String</td> + <td>字符串值。</td> + </tr> + <tr> + <td> </td> + <td>Math 和 Error 对象没有 valueOf 方法。</td> + </tr> + </tbody> +</table> + +<p>你可以在自己的代码中使用<code>valueOf</code>将内置对象转换为原始值。 创建自定义对象时，可以覆盖<code>Object.prototype.valueOf()</code>来调用自定义方法，而不是默认{{jsxref("Object")}}方法。</p> + +<h3 id="覆盖自定义对象的_valueOf方法">覆盖自定义对象的 <code>valueOf</code>方法</h3> + +<p>你可以创建一个取代 <code>valueOf</code>方法的函数，你的方法必须不能传入参数。</p> + +<p>假设你有个对象叫 <code>MyNumberType</code>而你想为它创建一个<code>valueOf</code>方法。下面的代码为<code>valueOf</code>方法赋予了一个自定义函数：</p> + +<pre class="brush: js">MyNumberType.prototype.valueOf = function() { return customPrimitiveValue; };</pre> + +<div class="line-number" style="margin: 1em 0px 0px; border: 0px; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 0px; background: 0px 0px;"> </div> + +<p>有了这样的一个方法，下一次每当<code>MyNumberType</code>要被转换为原始类型值时，JavaScript 在此之前会自动调用自定义的<code>valueOf</code>方法。</p> + +<p><code>valueOf</code>方法一般都会被 JavaScript 自动调用，但你也可以像下面代码那样自己调用：</p> + +<pre class="brush: js">myNumberType.valueOf()</pre> + +<div class="note"> +<p dir="ltr"><strong style="border: 0px; margin: 0px; padding: 0px;">注意：</strong>字符串上下文中的对象通过 {{jsxref("Object.toString", "toString()")}}方法转换，这与使用<code>valueOf</code>转换为原始字符串的{{jsxref("String")}}对象不同。所有对象都能转换成一个“<code>[object <em>类型</em>]</code>”这种格式的字符串。但是很多对象不能转换为数字，布尔或函数。</p> +</div> + +<h2 id="示例">示例</h2> + +<h3 id="使用_valueOf">使用 <code>valueOf</code></h3> + +<pre class="brush: js">// Array：返回数组对象本身 +var array = ["ABC", true, 12, -5]; +console.log(array.valueOf() === array); // true + +// Date：当前时间距1970年1月1日午夜的毫秒数 +var date = new Date(2013, 7, 18, 23, 11, 59, 230); +console.log(date.valueOf()); // 1376838719230 + +// Number：返回数字值 +var num = 15.26540; +console.log(num.valueOf()); // 15.2654 + +// 布尔：返回布尔值true或false +var bool = true; +console.log(bool.valueOf() === bool); // true + +// new一个Boolean对象 +var newBool = new Boolean(true); +// valueOf()返回的是true，两者的值相等 +console.log(newBool.valueOf() == newBool); // true +// 但是不全等，两者类型不相等，前者是boolean类型，后者是object类型 +console.log(newBool.valueOf() === newBool); // false + +// Function：返回函数本身 +function foo(){} +console.log( foo.valueOf() === foo ); // true +var foo2 = new Function("x", "y", "return x + y;"); +console.log( foo2.valueOf() ); +/* +ƒ anonymous(x,y +) { +return x + y; +} +*/ + +// Object：返回对象本身 +var obj = {name: "张三", age: 18}; +console.log( obj.valueOf() === obj ); // true + +// String：返回字符串值 +var str = "http://www.xyz.com"; +console.log( str.valueOf() === str ); // true + +// new一个字符串对象 +var str2 = new String("http://www.xyz.com"); +// 两者的值相等，但不全等，因为类型不同，前者为string类型，后者为object类型 +console.log( str2.valueOf() === str2 ); // false</pre> + +<p> </p> + +<h3 id="改写_.prototype.valueof">改写 .prototype.valueof</h3> + +<pre class="brush: js line-numbers language-js"><code class="language-js"><span class="keyword token">function</span> <span class="function token">MyNumberType</span><span class="punctuation token">(</span>n<span class="punctuation token">)</span> <span class="punctuation token">{</span> + <span class="keyword token">this</span><span class="punctuation token">.</span>number <span class="operator token">=</span> n<span class="punctuation token">;</span> +<span class="punctuation token">}</span> + +MyNumberType<span class="punctuation token">.</span>prototype<span class="punctuation token">.</span>valueOf <span class="operator token">=</span> <span class="keyword token">function</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span> + <span class="keyword token">return</span> <span class="keyword token">this</span><span class="punctuation token">.</span>number<span class="punctuation token">;</span> +<span class="punctuation token">}</span><span class="punctuation token">;</span> + +<span class="keyword token">var</span> myObj <span class="operator token">=</span> <span class="keyword token">new</span> <span class="class-name token">MyNumberType</span><span class="punctuation token">(</span><span class="number token">4</span><span class="punctuation token">)</span><span class="punctuation token">;</span> +myObj <span class="operator token">+</span> <span class="number token">3</span><span class="punctuation token">;</span> <span class="comment token">// 7</span></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>{{SpecName('ES1')}}</td> + <td>{{Spec2('ES1')}}</td> + <td>Initial definition. Implemented in JavaScript 1.1.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.2.4.4', 'Object.prototype.valueOf')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-object.prototype.valueof', 'Object.prototype.valueOf')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-object.prototype.valueof', 'Object.prototype.valueOf')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容">浏览器兼容</h2> + +<div class="hidden"> +<p>The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> +</div> + +<p>{{Compat("javascript.builtins.Object.valueOf")}}</p> + +<h2 id="参考">参考</h2> + +<ul> + <li>{{jsxref("Object.prototype.toString()")}}</li> + <li>{{jsxref("parseInt", "parseInt()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/object/values/index.html b/files/zh-cn/web/javascript/reference/global_objects/object/values/index.html new file mode 100644 index 0000000000..42d9cced00 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/object/values/index.html @@ -0,0 +1,113 @@ +--- +title: Object.values() +slug: Web/JavaScript/Reference/Global_Objects/Object/values +tags: + - JavaScript + - Method + - Object + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Object/values +--- +<div>{{JSRef}}</div> + +<p><code><strong>Object.values()</strong></code>方法返回一个给定对象自身的所有可枚举属性值的数组，值的顺序与使用{{jsxref("Statements/for...in", "for...in")}}循环的顺序相同 ( 区别在于 for-in 循环枚举原型链中的属性 )。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code>Object.values(<var>obj</var>)</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>obj</code></dt> + <dd>被返回可枚举属性值的对象。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>一个包含对象自身的所有可枚举属性值的数组。</p> + +<h2 id="描述">描述</h2> + +<p><code>Object.values()</code>返回一个数组，其元素是在对象上找到的可枚举属性值。属性的顺序与通过手动循环对象的属性值所给出的顺序相同。</p> + +<h2 id="示例">示例</h2> + +<pre class="brush: js">var obj = { foo: 'bar', baz: 42 }; +console.log(Object.values(obj)); // ['bar', 42] + +// array like object +var obj = { 0: 'a', 1: 'b', 2: 'c' }; +console.log(Object.values(obj)); // ['a', 'b', 'c'] + +// array like object with random key ordering +// when we use numeric keys, the value returned in a numerical order according to the keys +var an_obj = { 100: 'a', 2: 'b', 7: 'c' }; +console.log(Object.values(an_obj)); // ['b', 'c', 'a'] + +// getFoo is property which isn't enumerable +var my_obj = Object.create({}, { getFoo: { value: function() { return this.foo; } } }); +my_obj.foo = 'bar'; +console.log(Object.values(my_obj)); // ['bar'] + +// non-object argument will be coerced to an object +console.log(Object.values('foo')); // ['f', 'o', 'o']</pre> + +<p class="brush: js"> </p> + +<h2 id="Polyfill">Polyfill </h2> + +<p><code><font face="Open Sans, arial, x-locale-body, sans-serif"><span style="background-color: #ffffff;">如果要 </span></font>Object.values</code>兼容不支持它的旧环境，可在<font face="consolas, Liberation Mono, courier, monospace"><span style="background-color: #eeeeee;"> </span></font><a href="https://github.com/tc39/proposal-object-values-entries">tc39/proposal-object-values-entries</a> 或 <a href="https://github.com/es-shims/Object.values">es-shims/Object.values</a> 中找到 Polyfill 。</p> + +<p>根据<strong>Object.keys()</strong>的Polyfill仿写一个：</p> + +<pre class="brush: js">if (!Object.values) Object.values = function(obj) { + if (obj !== Object(obj)) + throw new TypeError('Object.values called on a non-object'); + var val=[],key; + for (key in obj) { + if (Object.prototype.hasOwnProperty.call(obj,key)) { + val.push(obj[key]); + } + } + return val; +}</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('ESDraft', '#sec-object.values', 'Object.values')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES8', '#sec-object.values', 'Object.values')}}</td> + <td>{{Spec2('ES8')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容">浏览器兼容</h2> + +<div class="hidden">The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</div> + +<p>{{Compat("javascript.builtins.Object.values")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Enumerability_and_ownership_of_properties">Enumerability and ownership of properties</a></li> + <li>{{jsxref("Object.keys()")}}</li> + <li>{{jsxref("Object.entries()")}} {{experimental_inline}}</li> + <li>{{jsxref("Object.prototype.propertyIsEnumerable()")}}</li> + <li>{{jsxref("Object.create()")}}</li> + <li>{{jsxref("Object.getOwnPropertyNames()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/object/watch/index.html b/files/zh-cn/web/javascript/reference/global_objects/object/watch/index.html new file mode 100644 index 0000000000..540967eee3 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/object/watch/index.html @@ -0,0 +1,201 @@ +--- +title: Object.prototype.watch() +slug: Web/JavaScript/Reference/Global_Objects/Object/watch +tags: + - Debugging + - Deprecated + - JavaScript + - Method + - Object + - Obsolete + - Prototype +translation_of: Archive/Web/JavaScript/Object.watch +--- +<p>{{JSRef}}</p> + +<div class="warning"> +<p><strong>警告:</strong> 通常来讲,你应该尽量避免使用 <code>watch()</code>和 {{jsxref("Object.prototype.unwatch", "unwatch()")}} 这两个方法。因为只有 Gecko 实现了这两个方法，并且它们主要是为了在调试方便。另外，使用 watchpoint 对性能有严重的负面影响，在全局对象（如 window）上使用时尤其如此。你可以使用 <a href="/zh-cn/JavaScript/Guide/Working_with_Objects#Defining_getters_and_setters" title="https://developer.mozilla.org/zh-cn/Core_JavaScript_1.5_Guide/Working_with_Objects#Defining_getters_and_setters">setters and getters</a> 或者 proxy 代替。参见 {{ anch("Compatibility") }} 了解详情。</p> +</div> + +<p><code><strong>watch() </strong></code>方法会监视属性是否被赋值并在赋值时运行相关函数。</p> + +<h2 id="Summary" name="Summary">语法</h2> + +<pre class="syntaxbox"><em>obj</em>.watch(<em>prop</em>, <em>handler</em>)</pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>prop</code></dt> + <dd>想要监视值是否发生变化的指定对象的某个属性的属性名称</dd> +</dl> + +<dl> + <dt><code>handler</code></dt> + <dd>当指定的属性发生变化时执行的回调函数</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>{{jsxref("undefined")}}.</p> + +<h2 id="Description" name="Description">描述</h2> + +<p>监视对指定对象的名为 <code>prop</code> 属性的赋值操作，只要 <code>prop</code> 属性被赋值，便调用 <code>handler(prop, oldval, newval)</code> 回调函数，并将函数返回值保存到该属性。 通过返回修改的新值（或者返回旧值），一个监视点可以过滤（或使之为 null ）赋值。</p> + +<p>如果你删除某个设置监视点的属性，该监视点并不会消失。如果你之后重新创建这个属性，监视点仍然有效。</p> + +<p>要移除某个监视点，使用 <code><a href="/zh-cn/JavaScript/Reference/Global_Objects/Object/unwatch" title="zh-cn/JavaScript/Reference/Global_Objects/Object/unwatch">unwatch()</a></code> 方法。默认所有 <code>Object</code> 的后代都将继承 <code>watch</code> 方法。</p> + +<p>JavaScript 调试器有与之相似的机制以及其它调试选项。需要更多有关调试器的信息，请查阅 <a href="/zh-cn/Venkman" title="zh-cn/Venkman">Venkman</a>。</p> + +<p>对于 Firefox，<code>handler</code> 只会被脚本内的赋值操作激活，并不包括本地代码。举个例子，如果用户点击一个指向当前文档内的某个锚点， <code>window.watch('location', myHandler)</code> 不会回调 <code>myHandler</code> ，但 <code>window.location += '#myAnchor'</code> 将触发回调 <code>myHandler</code>。</p> + +<div class="note"><strong>注意:</strong> 对一个对象的指定属性调用 <code>watch()</code> 将覆盖先前关联的 handler。</div> + +<h2 id="Examples" name="Examples">例子</h2> + +<h3 id="Example_Using_watch_and_unwatch" name="Example:_Using_watch_and_unwatch">使用 <code>watch</code> 和 <code>unwatch</code></h3> + +<pre class="brush: js">var o = {p:1}; +o.watch("p", + function (id, oldval, newval) { + console.log("o." + id + "由" + oldval + " 变为 " + newval); + return newval; + }); + +o.p = 2; +o.p = 3; +delete o.p; +o.p = 4; + +o.unwatch('p'); +o.p = 5; +</pre> + +<p>上面的代码显示结果如下:</p> + +<pre class="eval">o.p 由 1 变为 2 +o.p 由 2 变为 3 +o.p 由 undefined 变为 4 +</pre> + +<h3 id="Example_Using_watch_to_validate_an_object.27s_properties" name="Example:_Using_watch_to_validate_an_object.27s_properties">使用 <code>watch</code> 来验证一个对象的属性</h3> + +<p>你可以使用 <code>watch</code> 来检测一个对象的属性赋值是否是合法的.下例演示了如何确保每个人始终具有一个合法的名字和0 到 200之间的年龄.</p> + +<pre class="brush: js">Person = function(name,age) { + this.watch("age", Person.prototype._isValidAssignment); + this.watch("name", Person.prototype._isValidAssignment); + this.name = name; + this.age = age; +} + +Person.prototype.toString = function() { + return this.name + ", " + this.age; +}; + +Person.prototype._isValidAssignment = function(id, oldval, newval) { + if (id === "name" && (!newval || newval.length > 30)) { + throw new RangeError("不合法的名字 " + this); + } + if (id === "age" && (newval < 0 || newval > 200)) { + throw new RangeError("不合法的年龄 " + this); + } + return newval; +} + +will = new Person("Will", 29); +print(will); // Will, 29 + +try { + will.name = ""; +} catch (e) { + //print(e); + console.log(e); +} + +try { + will.age = -4; +} catch (e) { + console.log(e); +} +</pre> + +<p>上面的代码显示结果如下:</p> + +<pre class="eval">Will, 29 +RangeError: 不合法的名字 Will, 29 +RangeError: 不合法的年龄 Will, 29 +</pre> + +<h2 id="Specifications">Specifications</h2> + +<p>不是任何规范的一部分。从 JavaScript 1.2 开始实现。</p> + +<h2 id="Browser_compatibility">Browser compatibility</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>{{CompatNo}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</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>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="兼容性提示">兼容性提示</h2> + +<ul> + <li>此 <a href="https://gist.github.com/384583">Polyfill</a> 为所有 ES5 兼容浏览器提供 <code>watch</code> 支持。</li> + <li>使用 {{jsxref("Proxy")}} 允许你更加深度地调整属性服务机制</li> + <li>从 Firefox 23 开始，在 {{domxref("Document")}} 对象上调用 <code>watch()</code> 将抛出 {{jsxref("TypeError")}} 错误。这个回归问题已经在 Firefox 27 修复。</li> +</ul> + +<h2 id="See_Also" name="See_Also">相关链接</h2> + +<ul> + <li>{{jsxref("Object.unwatch()")}}</li> + <li>{{jsxref("Object.observe()")}} {{obsolete_inline}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/parallelarray/index.html b/files/zh-cn/web/javascript/reference/global_objects/parallelarray/index.html new file mode 100644 index 0000000000..739d25c173 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/parallelarray/index.html @@ -0,0 +1,53 @@ +--- +title: ParallelArray +slug: Web/JavaScript/Reference/Global_Objects/ParallelArray +tags: + - JavaScript + - ParallelArray + - 过时 +translation_of: Archive/Web/ParallelArray +--- +<p>The goal of <strong><code>ParallelArray</code></strong> was to enable data-parallelism in web applications. The higher-order functions available on <code>ParallelArray</code> attempted to execute in parallel, though they may fall back to sequential execution if necessary. To ensure that your code executes in parallel, it is suggested that the functions should be limited to the <a href="http://smallcultfollowing.com/babysteps/blog/2013/04/30/parallelizable-javascript-subset/">parallelizable subset of JS that Firefox supports</a>.</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">new ParallelArray() +new ParallelArray([element0, element1, ...]) +new ParallelArray(arrayLength, elementalFunction)</pre> + +<h2 id="ParallelArray_instances"><code>ParallelArray</code> instances</h2> + +<h3 id="属性">属性</h3> + +<dl> + <dt>length</dt> + <dd>Reflects the number of elements in the <code>ParallelArray</code>.</dd> +</dl> + +<h3 id="方法">方法</h3> + +<dl> + <dt>map</dt> + <dt>reduce</dt> + <dt>scan</dt> + <dt>scatter</dt> + <dt>filter</dt> + <dt>flatten</dt> + <dt>partition</dt> + <dt>get</dt> +</dl> + +<h2 id="示例">示例</h2> + +<h3 id="Using_map_in_parallel">Using <code>map</code> in parallel</h3> + +<pre class="brush: js">var p = new ParallelArray([0, 1, 2, 3, 4]); +var m = p.map(function (v) { + return v + 1; +});</pre> + +<h2 id="参见">参见</h2> + +<ul> + <li><a href="http://wiki.ecmascript.org/doku.php?id=strawman:data_parallelism">Ecmascript ParallelArray strawman</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/parsefloat/index.html b/files/zh-cn/web/javascript/reference/global_objects/parsefloat/index.html new file mode 100644 index 0000000000..6469340da8 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/parsefloat/index.html @@ -0,0 +1,123 @@ +--- +title: parseFloat +slug: Web/JavaScript/Reference/Global_Objects/parseFloat +tags: + - parseFloat() +translation_of: Web/JavaScript/Reference/Global_Objects/parseFloat +--- +<div> +<div> +<div>{{jsSidebar("Objects")}}</div> +</div> +</div> + +<p><strong><code>parseFloat()</code> </strong>函数解析一个参数（必要时先转换为字符串）并返回一个浮点数。</p> + +<div>{{EmbedInteractiveExample("pages/js/globalprops-parsefloat.html")}}</div> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">parseFloat(<em>string)</em></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>string</code></dt> + <dd>需要被解析成为浮点数的值。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<dl> + <dd>给定值被解析成浮点数。如果给定值不能被转换成数值，则会返回 {{jsxref("NaN")}}。</dd> +</dl> + +<h2 id="描述">描述</h2> + +<p><code>parseFloat</code>是个全局函数,不属于任何对象。</p> + +<ul> + <li>如果 <code>parseFloat</code> 在解析过程中遇到了正号（<code>+</code>）、负号（<code>-</code> U+002D HYPHEN-MINUS）、数字（<code>0</code>-<code>9</code>）、小数点（<code>.</code>）、或者科学记数法中的指数（e 或 E）以外的字符，则它会忽略该字符以及之后的所有字符，返回当前已经解析到的浮点数。</li> + <li>第二个小数点的出现也会使解析停止（在这之前的字符都会被解析）。</li> + <li>参数首位和末位的空白符会被忽略。</li> + <li>如果参数字符串的第一个字符不能被解析成为数字,<code>则</code> <code>parseFloat</code> 返回 <code>NaN</code>。</li> + <li><code>parseFloat</code> 也可以解析并返回 {{jsxref("Infinity")}}。</li> + <li><code>parseFloat</code>解析 {{jsxref("BigInt")}} 为 {{jsxref("Number", "Numbers")}}, 丢失精度。因为末位 <code>n</code> 字符被丢弃。</li> +</ul> + +<p>考虑使用 {{jsxref("Number", "Number(<em>value</em>)")}} 进行更严谨的解析，只要参数带有无效字符就会被转换为 {{jsxref("NaN")}} 。</p> + +<p><code>parseFloat</code> 也可以转换一个已经定义了 <code>toString</code> 或者 <code>valueOf</code> 方法的对象，它返回的值和在调用该方法的结果上调用 <code>parseFloat</code> 值相同。</p> + +<h2 id="例子">例子</h2> + +<h3 id="例子_parseFloat返回正常数字">例子: <code>parseFloat</code>返回正常数字</h3> + +<p>下面的例子都返回<strong>3.14</strong></p> + +<pre class="brush: js line-numbers language-js"><code class="language-js"><span class="function token">parseFloat</span><span class="punctuation token">(</span><span class="number token">3.14</span><span class="punctuation token">)</span><span class="punctuation token">;</span> +<span class="function token">parseFloat</span><span class="punctuation token">(</span><span class="string token">'3.14'</span><span class="punctuation token">)</span><span class="punctuation token">;</span> +<span class="function token">parseFloat</span><span class="punctuation token">(</span><span class="string token">' 3.14 '</span><span class="punctuation token">)</span><span class="punctuation token">;</span> +<span class="function token">parseFloat</span><span class="punctuation token">(</span><span class="string token">'314e-2'</span><span class="punctuation token">)</span><span class="punctuation token">;</span> +<span class="function token">parseFloat</span><span class="punctuation token">(</span><span class="string token">'0.0314E+2'</span><span class="punctuation token">)</span><span class="punctuation token">;</span> +<span class="function token">parseFloat</span><span class="punctuation token">(</span><span class="string token">'3.14some non-digit characters'</span><span class="punctuation token">)</span><span class="punctuation token">;</span> +<span class="function token">parseFloat</span><span class="punctuation token">(</span><span class="punctuation token">{</span> <span class="function function-variable token">toString</span><span class="punctuation token">:</span> <span class="keyword token">function</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span> <span class="keyword token">return</span> <span class="string token">"3.14"</span> <span class="punctuation token">}</span> <span class="punctuation token">}</span><span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre> + +<h3 id="parseFloat返回NaN"><code>parseFloat</code>返回NaN</h3> + +<p>下面的例子将返回<code>NaN</code></p> + +<pre class="brush: js">parseFloat("FF2"); +</pre> + +<h3 id="parseFloat_和_BigInt">parseFloat 和 BigInt</h3> + +<p>以下例子均返回 <code>900719925474099300</code>，当整数太大以至于不能被转换时将失去精度。</p> + +<pre class="brush: js line-numbers language-js"><code class="language-js"><span class="function token">parseFloat</span><span class="punctuation token">(</span><span class="number token">900719925474099267n</span><span class="punctuation token">)</span><span class="punctuation token">;</span> +<span class="function token">parseFloat</span><span class="punctuation token">(</span><span class="string token">'900719925474099267n'</span><span class="punctuation token">)</span><span class="punctuation token">;</span></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>ECMAScript 1st Edition.</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.1.2.3', 'parseFloat')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-parsefloat-string', 'parseFloat')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-parsefloat-string', 'parseFloat')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{Compat("javascript.builtins.parseFloat")}}</p> + +<h2 id="See_Also" name="See_Also">相关链接</h2> + +<ul> + <li>{{jsxref("Global_Objects/parseInt", "parseInt()")}}</li> + <li>{{jsxref("Number.parseFloat()")}}</li> + <li>{{jsxref("Number.parseInt()")}}</li> + <li>{{jsxref("Global_Objects/isNaN", "isNaN()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/parseint/index.html b/files/zh-cn/web/javascript/reference/global_objects/parseint/index.html new file mode 100644 index 0000000000..a3bfd18199 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/parseint/index.html @@ -0,0 +1,227 @@ +--- +title: parseInt +slug: Web/JavaScript/Reference/Global_Objects/parseInt +tags: + - JavaScript + - parseInt() +translation_of: Web/JavaScript/Reference/Global_Objects/parseInt +--- +<div> +<div> +<div>{{jsSidebar("Objects")}}</div> +</div> +</div> + +<p><strong>parseInt(<em>string</em>, <em>radix</em>) </strong> 解析一个字符串并返回指定基数的十进制整数， <code>radix</code> 是2-36之间的整数，表示被解析字符串的基数。</p> + +<p>{{EmbedInteractiveExample("pages/js/globalprops-parseint.html")}}</p> + +<div class="hidden"> +<p>此交互式示例的代码存储在GitHub仓库中。如果你想参与交互式示例项目, 请克隆 <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> 之后给我们发一个pull请求。</p> +</div> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox notranslate">parseInt(<em>string</em>, <em>radix</em>);</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>string</code></dt> + <dd>要被解析的值。如果参数不是一个字符串，则将其转换为字符串(使用 <code><a href="http://www.ecma-international.org/ecma-262/6.0/#sec-tostring">ToString</a> </code>抽象操作)。字符串开头的空白符将会被忽略。</dd> +</dl> + +<dl> + <dt><code><var>radix</var></code><var> {{optional_inline}}</var></dt> + <dd>从 <code>2</code> 到 <code>36</code>，表示字符串的基数。例如指定 <font face="consolas, Liberation Mono, courier, monospace"><span style="background-color: rgba(220, 220, 220, 0.5);">16</span></font> 表示被解析值是十六进制数。请注意，10不是默认值！</dd> + <dd class="blockIndicator warning">文章后面的<a href="#描述">描述</a>解释了当参数 <code>radix</code> 不传时该函数的具体行为。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>从给定的字符串中解析出的一个整数。</p> + +<p>或者 {{jsxref("NaN")}}，当</p> + +<ul> + <li><code>radix</code> 小于 <code>2</code> 或大于 <code>36</code> ，或</li> + <li>第一个非空格字符不能转换为数字。</li> +</ul> + +<pre class="notranslate">parseInt('123', 5) // 将'123'看作5进制数，返回十进制数38 => 1*5^2 + 2*5^1 + 3*5^0 = 38</pre> + +<h2 id="描述_2"><a id="描述" name="描述">描述</a></h2> + +<p><code>parseInt</code>函数将其第一个参数转换为一个字符串，对该字符串进行解析，然后返回一个整数或 <code>NaN</code>。</p> + +<p>如果不是<code>NaN</code>，返回值将是以第一个参数作为指定基数 radix 的转换后的十进制整数。(例如，<code>radix</code>为<code>10</code>，就是可以转换十进制数，为<code>8</code>可以转换八进制数"07"，<code>16</code>可以转换十六进制数"0xff"，以此类推)。</p> + +<p>对于 <code>radix </code>为<code>10</code>以上的，英文字母表示大于<code>9</code>的数字。例如，对于十六进制数（基数<code>16</code>），则使用 <code>A</code> 到 <code>F</code> 。</p> + +<p>如果 <code>parseInt </code>遇到的字符不是指定 <code>radix </code>参数中的数字，它将忽略该字符以及所有后续字符，并返回到该点为止已解析的整数值。 <code>parseInt</code> 将数字截断为整数值。 允许前导和尾随空格。</p> + +<p>由于某些数字在其字符串表示形式中使用e字符（例如 <code>6.022×23</code> 表示<code> 6.022e23</code> ），因此当对非常大或非常小的数字使用数字时，使用 <code>parseInt</code> 截断数字将产生意外结果。 <code>parseInt</code>不应替代{{jsxref("Math.floor()")}}。</p> + +<p><br> + <code>parseInt</code> 可以理解两个符号。<code>+</code> 表示正数，<code>-</code> 表示负数（从ECMAScript 1开始）。它是在去掉空格后作为解析的初始步骤进行的。如果没有找到符号，算法将进入下一步；否则，它将删除符号，并对字符串的其余部分进行数字解析。</p> + +<p>如果 <code>radix</code> 是 <code>undefined</code>、<code>0</code>或未指定的，JavaScript会假定以下情况：</p> + +<ol> + <li>如果输入的 <code>string</code>以 "<code>0x</code>"或 "<code>0x</code>"（一个0，后面是小写或大写的X）开头，那么radix被假定为16，字符串的其余部分被当做十六进制数去解析。</li> + <li>如果输入的 <code>string</code>以 "<code>0</code>"（0）开头， <code>radix</code>被假定为<code>8</code>（八进制）或<code>10</code>（十进制）。具体选择哪一个radix取决于实现。ECMAScript 5 澄清了应该使用 10 (十进制)，但不是所有的浏览器都支持。<strong>因此，在使用 <code>parseInt</code> 时，一定要指定一个 radix</strong>。</li> + <li>如果输入的 <code>string</code> 以任何其他值开头， <code>radix</code> 是 <code>10</code> (十进制)。</li> +</ol> + +<p>如果第一个字符不能转换为数字，<code>parseInt</code>会返回 <code>NaN</code>。</p> + +<p>为了算术的目的，<code>NaN</code> 值不能作为任何 <code>radix</code> 的数字。你可以调用{{jsxref("isNaN")}}函数来确定<code>parseInt</code>的结果是否为 <code>NaN</code>。如果将NaN传递给算术运算，则运算结果也将是 <code>NaN</code>。</p> + +<p>要将一个数字转换为特定的 <code>radix</code> 中的字符串字段，请使用 <code>thatNumber.toString(radix)</code>函数。</p> + +<div class="blockIndicator warning"> +<p>{{jsxref("BigInt")}}。警告: <code>parseInt</code>将 {{jsxref("BigInt")}}转换为{{jsxref("Number")}}，并在这个过程中失去了精度。这是因为拖尾的非数字值，包括 "n"，会被丢弃。</p> +</div> + +<h2 id="示例">示例</h2> + +<h3 id="例子：使用_parseInt">例子：使用 <code>parseInt</code></h3> + +<p>以下例子均返回<code>15</code>:</p> + +<pre class="brush: js notranslate">parseInt("0xF", 16); +parseInt("F", 16); +parseInt("17", 8); +parseInt(021, 8); +parseInt("015", 10); // parseInt(015, 8); 返回 13 +parseInt(15.99, 10); +parseInt("15,123", 10); +parseInt("FXX123", 16); +parseInt("1111", 2); +parseInt("15 * 3", 10); +parseInt("15e2", 10); +parseInt("15px", 10); +parseInt("12", 13);</pre> + +<p>以下例子均返回 <code>NaN</code>:</p> + +<pre class="brush: js notranslate">parseInt("Hello", 8); // 根本就不是数值 +parseInt("546", 2); // 除了“0、1”外，其它数字都不是有效二进制数字 +</pre> + +<p>以下例子均返回 <code>-15</code>：</p> + +<pre class="brush: js notranslate">parseInt("-F", 16); +parseInt("-0F", 16); +parseInt("-0XF", 16); +parseInt(-15.1, 10); +parseInt(" -17", 8); +parseInt(" -15", 10); +parseInt("-1111", 2); +parseInt("-15e1", 10); +parseInt("-12", 13); +</pre> + +<p>下例中全部返回 <code>4</code>:</p> + +<pre class="brush: js notranslate">parseInt(4.7, 10); +parseInt(4.7 * 1e22, 10); // 非常大的数值变成 4 +parseInt(0.00000000000434, 10); // 非常小的数值变成 4</pre> + +<p>下面的例子返回 <code>224</code></p> + +<pre class="brush: js notranslate">parseInt("0e0",16);</pre> + +<h2 id="没有指定_radix_参数时的八进制解析" style="margin-bottom: 20px; line-height: 30px;">没有指定 <code>radix</code> 参数时的八进制解析</h2> + +<p>尽管 ECMAScript 3 已经不赞成这种做法，且 ECMAScript 5 已经禁止了这种做法，但是仍然有很多实现环境仍然把以 0 开头的数值字符串（numeric string）解释为一个八进制数。下面的例子可能返回八进制的结果，也可能返回十进制的结果。<strong>总是指定一个基数（radix）可以避免这种不可靠的行为。</strong></p> + +<pre class="brush: js notranslate">parseInt("0e0"); +// 0 + +parseInt("08"); +// 0, '8' 不是八进制数字. +</pre> + +<h3 id="ECMAScript_5_移除了八进制解析" style="line-height: 24px;">ECMAScript 5 移除了八进制解析</h3> + +<p>ECMAScript 5 规范不再允许<code>parseInt</code>函数的<span style="line-height: 19.0909080505371px;">实现环境把以<code>0</code>字符开始的字符串作为八进制数值</span>。ECMAScript 5 陈述如下：</p> + +<p>根据给定radix，<code>parseInt</code>函数产生一个由字符串参数内容解析过来的整数值。字符串中开头的空白会被忽略。如果radix没有指定或者为0，参数会被假定以10为基数来解析，如果数值以字符对0x或0X开头，会假定以16为基数来解析。</p> + +<p>这与<span style="line-height: 19.0909080505371px;">ECMAScript 3有所不同，ECMAScript 3仅仅是不提倡这种做法但并没有禁止这种做法。</span></p> + +<p>直至2013年，很多实现环境并没有采取新的规范所规定的做法, 而且由于必须兼容旧版的浏览器，所以<strong>永远都要明确给出radix参数的值.</strong></p> + +<h2 id="一个更严格的解析函数" style="margin-bottom: 20px; line-height: 30px;">一个更严格的解析函数</h2> + +<p>有时采用一个更严格的方法来解析整型值很有用。此时可以使用正则表达式：</p> + +<pre class="brush: js notranslate">filterInt = function (value) { + if(/^(\-|\+)?([0-9]+|Infinity)$/.test(value)) + return Number(value); + return NaN; +} + +console.log(filterInt('421')); // 421 +console.log(filterInt('-421')); // -421 +console.log(filterInt('+421')); // 421 +console.log(filterInt('Infinity')); // Infinity +console.log(filterInt('421e+0')); // NaN +console.log(filterInt('421hop')); // NaN +console.log(filterInt('hop1.61803398875')); // NaN +console.log(filterInt('1.61803398875')); // NaN +</pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th>规范版本</th> + <th>规范状态</th> + <th>注解</th> + </tr> + <tr> + <td>{{SpecName('ES1')}}</td> + <td>{{Spec2('ES1')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.1.2.2', 'parseInt')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-parseint-string-radix', 'parseInt')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-parseint-string-radix', 'parseInt')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div class="hidden"> +<p>The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> +</div> + +<p>{{Compat("javascript.builtins.parseInt")}}</p> + +<div id="compat-mobile"></div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Global_Objects/parseFloat", "parseFloat()")}}</li> + <li>{{jsxref("Number.parseFloat()")}}</li> + <li>{{jsxref("Number.parseInt()")}}</li> + <li>{{jsxref("Global_Objects/isNaN", "isNaN()")}}</li> + <li>{{jsxref("Number.toString()")}}</li> + <li>{{jsxref("Object.valueOf")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/promise/all/index.html b/files/zh-cn/web/javascript/reference/global_objects/promise/all/index.html new file mode 100644 index 0000000000..84264ce68b --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/promise/all/index.html @@ -0,0 +1,224 @@ +--- +title: Promise.all() +slug: Web/JavaScript/Reference/Global_Objects/Promise/all +tags: + - AJAX + - Async-Await + - Fetch + - Promise + - Promise.all() + - Promise.race() + - promise.all +translation_of: Web/JavaScript/Reference/Global_Objects/Promise/all +--- +<div>{{JSRef}}</div> + +<p><code><strong>Promise.all(iterable)</strong></code> 方法返回一个 {{jsxref("Promise")}} 实例，此实例在 <code>iterable</code> 参数内所有的 <code>promise</code> 都“完成（resolved）”或参数中不包含 <code>promise</code> 时回调完成（resolve）；如果参数中 <code>promise</code> 有一个失败（rejected），此实例回调失败（reject），失败的原因是第一个失败 <code>promise</code> 的结果。</p> + +<p>它通常在启动多个异步任务并发运行并为其结果创建承诺之后使用，以便人们可以等待所有任务完成。</p> + +<div>{{EmbedInteractiveExample("pages/js/promise-all.html")}}</div> + +<p class="hidden">The source for this interactive demo is stored in a GitHub repository. If you'd like to contribute to the interactive demo project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> and send us a pull request.</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>Promise.all(iterable)</var>;</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt>iterable</dt> + <dd>一个<a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Iteration_protocols#The_iterable_protocol">可迭代</a>对象，如 {{jsxref("Array")}} 或 {{jsxref("String")}}。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<ul> + <li>如果传入的参数是一个空的可迭代对象，则返回一个<strong>已完成（already resolved）</strong>状态的 {{jsxref("Promise")}}。</li> + <li>如果传入的参数不包含任何 <code>promise</code>，则返回一个<strong>异步完成（asynchronously resolved）</strong> {{jsxref("Promise")}}。注意：Google Chrome 58 在这种情况下返回一个<strong>已完成（already resolved）</strong>状态的 {{jsxref("Promise")}}。</li> + <li>其它情况下返回一个<strong>处理中（pending）</strong>的{{jsxref("Promise")}}。这个返回的 <code>promise</code> 之后会在所有的 <code>promise</code> 都完成或有一个 <code>promise</code> 失败时<strong>异步</strong>地变为完成或失败。 见下方关于“Promise.all 的异步或同步”示例。返回值将会按照参数内的 <code>promise</code> 顺序排列，而不是由调用 <code>promise</code> 的完成顺序决定。</li> +</ul> + +<h2 id="说明">说明</h2> + +<p>此方法在集合多个 <code>promise</code> 的返回结果时很有用。</p> + +<p>完成（Fulfillment）：<br> + 如果传入的可迭代对象为空，<code>Promise.all</code> 会同步地返回一个已完成（resolved）状态的<code>promise</code>。<br> + 如果所有传入的 <code>promise</code> 都变为完成状态，或者传入的可迭代对象内没有 <code>promise</code>，<code>Promise.all</code> 返回的 <code>promise</code> 异步地变为完成。<br> + 在任何情况下，<code>Promise.all</code> 返回的 <code>promise</code> 的完成状态的结果都是一个数组，它包含所有的传入迭代参数对象的值（也包括非 <code>promise</code> 值）。</p> + +<p>失败/拒绝（Rejection）：<br> + 如果传入的 <code>promise</code> 中有一个失败（rejected），<code>Promise.all</code> 异步地将失败的那个结果给失败状态的回调函数，而不管其它 <code>promise</code> 是否完成。</p> + +<h2 id="示例">示例</h2> + +<h3 id="Promise.all_的使用"><code>Promise.all</code> 的使用</h3> + +<p><code>Promise.all</code> 等待所有都完成（或第一个失败）。</p> + +<pre class="brush: js">var p1 = Promise.resolve(3); +var p2 = 1337; +var p3 = new Promise((resolve, reject) => { + setTimeout(resolve, 100, 'foo'); +}); + +Promise.all([p1, p2, p3]).then(values => { + console.log(values); // [3, 1337, "foo"] +});</pre> + +<p>如果参数中包含非 <code>promise</code> 值，这些值将被忽略，但仍然会被放在返回数组中（如果 <code>promise</code> 完成的话）：</p> + +<pre class="brush: js">// this will be counted as if the iterable passed is empty, so it gets fulfilled +var p = Promise.all([1,2,3]); +// this will be counted as if the iterable passed contains only the resolved promise with value "444", so it gets fulfilled +var p2 = Promise.all([1,2,3, Promise.resolve(444)]); +// this will be counted as if the iterable passed contains only the rejected promise with value "555", so it gets rejected +var p3 = Promise.all([1,2,3, Promise.reject(555)]); + +// using setTimeout we can execute code after the stack is empty +setTimeout(function(){ + console.log(p); + console.log(p2); + console.log(p3); +}); + +// logs +// Promise { <state>: "fulfilled", <value>: Array[3] } +// Promise { <state>: "fulfilled", <value>: Array[4] } +// Promise { <state>: "rejected", <reason>: 555 }</pre> + +<h3 id="Promise.all_的异步和同步"><code>Promise.all</code> 的异步和同步</h3> + +<p>下面的例子中演示了 <code>Promise.all</code> 的异步性（如果传入的可迭代对象是空的，就是同步）：</p> + +<pre class="brush: js">// we are passing as argument an array of promises that are already resolved, +// to trigger Promise.all as soon as possible +var resolvedPromisesArray = [Promise.resolve(33), Promise.resolve(44)]; + +var p = Promise.all(resolvedPromisesArray); +// immediately logging the value of p +console.log(p); + +// using setTimeout we can execute code after the stack is empty +setTimeout(function(){ + console.log('the stack is now empty'); + console.log(p); +}); + +// logs, in order: +// Promise { <state>: "pending" } +// the stack is now empty +// Promise { <state>: "fulfilled", <value>: Array[2] } +</pre> + +<p>如果 <code>Promise.all</code> 失败，也是一样的：</p> + +<pre class="brush: js">var mixedPromisesArray = [Promise.resolve(33), Promise.reject(44)]; +var p = Promise.all(mixedPromisesArray); +console.log(p); +setTimeout(function(){ + console.log('the stack is now empty'); + console.log(p); +}); + +// logs +// Promise { <state>: "pending" } +// the stack is now empty +// Promise { <state>: "rejected", <reason>: 44 } +</pre> + +<p>但是，<code>Promise.all</code> <strong>当且仅当</strong>传入的可迭代对象为空时为同步：</p> + +<pre class="brush: js">var p = Promise.all([]); // will be immediately resolved +var p2 = Promise.all([1337, "hi"]); // non-promise values will be ignored, but the evaluation will be done asynchronously +console.log(p); +console.log(p2) +setTimeout(function(){ + console.log('the stack is now empty'); + console.log(p2); +}); + +// logs +// Promise { <state>: "fulfilled", <value>: Array[0] } +// Promise { <state>: "pending" } +// the stack is now empty +// Promise { <state>: "fulfilled", <value>: Array[2] } +</pre> + +<h3 id="Promise.all_的快速返回失败行为"><code>Promise.all</code> 的快速返回失败行为</h3> + +<p><code>Promise.all</code> 在任意一个传入的 <code>promise</code> 失败时返回失败。例如，如果你传入的 <code>promise</code>中，有四个 <code>promise</code> 在一定的时间之后调用成功函数，有一个立即调用失败函数，那么 <code>Promise.all</code> 将立即变为失败。</p> + +<pre class="brush: js">var p1 = new Promise((resolve, reject) => { + setTimeout(resolve, 1000, 'one'); +}); +var p2 = new Promise((resolve, reject) => { + setTimeout(resolve, 2000, 'two'); +}); +var p3 = new Promise((resolve, reject) => { + setTimeout(resolve, 3000, 'three'); +}); +var p4 = new Promise((resolve, reject) => { + setTimeout(resolve, 4000, 'four'); +}); +var p5 = new Promise((resolve, reject) => { + reject('reject'); +}); + +Promise.all([p1, p2, p3, p4, p5]).then(values => { + console.log(values); +}, reason => { + console.log(reason) +}); + +//From console: +//"reject" + +//You can also use .catch +Promise.all([p1, p2, p3, p4, p5]).then(values => { + console.log(values); +}).catch(reason => { + console.log(reason) +}); + +//From console: +//"reject" + +</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-promise.all', 'Promise.all')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>Initial definition in an ECMA standard.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-promise.all', 'Promise.all')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p class="hidden">To contribute to this compatibility data, please write a pull request against this repository: <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>.</p> + +<p>{{Compat("javascript.builtins.Promise.all")}}</p> + +<h2 id="参见">参见</h2> + +<ul> + <li>{{jsxref("Promise")}}</li> + <li>{{jsxref("Promise.race()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/promise/allsettled/index.html b/files/zh-cn/web/javascript/reference/global_objects/promise/allsettled/index.html new file mode 100644 index 0000000000..de674edc7f --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/promise/allsettled/index.html @@ -0,0 +1,73 @@ +--- +title: Promise.allSettled() +slug: Web/JavaScript/Reference/Global_Objects/Promise/allSettled +tags: + - Promise + - Promise.allSettled + - promise.all +translation_of: Web/JavaScript/Reference/Global_Objects/Promise/allSettled +--- +<p>{{JSRef}}</p> + +<p>该<code><strong>Promise.allSettled()</strong></code>方法返回一个在所有给定的promise都已经<code>fulfilled</code>或<code>rejected</code>后的promise，并带有一个对象数组，每个对象表示对应的promise结果。</p> + +<p>当您有多个彼此不依赖的异步任务成功完成时，或者您总是想知道每个<code>promise</code>的结果时，通常使用它。</p> + +<p><font><font>相比之下，</font></font><code><a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Promise/all">Promise.all()</a></code><font><font> 更适合彼此相互依赖或者在其中任何一个<code>reject</code>时立即结束。</font></font></p> + +<div>{{EmbedInteractiveExample("pages/js/promise-allsettled.html")}}</div> + +<h2 id="句法">句法</h2> + +<pre class="notranslate"><em>Promise</em>.allSettled(<em>iterable</em>);</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>iterable</code></dt> + <dd>一个<a href="/zh-CN/docs/Web/JavaScript/Guide/iterable">可迭代的</a>对象，例如{{jsxref("Array")}}，其中每个成员都是<code>Promise</code>。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>一旦所指定的 promises 集合中每一个 promise 已经完成，无论是成功的达成或被拒绝，<strong>未决议的</strong> {{jsxref("Promise")}}将被<strong>异步</strong>完成。那时，所返回的 promise 的处理器将传入一个数组作为输入，该数组包含原始 promises 集中每个 promise 的结果。</p> + +<p>对于每个结果对象，都有一个 <code>status</code> 字符串。如果它的值为 <code>fulfilled</code>，则结果对象上存在一个 <code>value</code> 。如果值为 <code>rejected</code>，则存在一个 <code>reason</code> 。value（或 reason ）反映了每个 promise 决议（或拒绝）的值。</p> + +<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 href="https://tc39.es/proposal-promise-allSettled/"><code>Promise.allSettled()</code> （TC39第4阶段草案）</a></td> + <td>{{SPEC2("ESDraft")}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容">浏览器兼容</h2> + +<p>{{Compat("javascript.builtins.Promise.allSettled")}}</p> + +<h3 id="实现进度">实现进度</h3> + +<p>{{EmbedTest262ReportResultsTable("Promise.allSettled")}}</p> + +<h2 id="参见">参见</h2> + +<ul> + <li> +<a href="https://wiki.developer.mozilla.org/zh-CN/docs/Archive/Add-ons/Techniques/Promises">Promises</a></li> + <li> +<a href="https://wiki.developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Using_promises">Using promises</a></li> + <li> +<a href="https://wiki.developer.mozilla.org/zh-CN/docs/Learn/JavaScript/Asynchronous/Promises">Graceful asynchronous programming with promises</a></li> + <li>{{jsxref("Promise")}}</li> + <li>{{jsxref("Promise.all()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/promise/any/index.html b/files/zh-cn/web/javascript/reference/global_objects/promise/any/index.html new file mode 100644 index 0000000000..25e87a91af --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/promise/any/index.html @@ -0,0 +1,153 @@ +--- +title: Promise.any() +slug: Web/JavaScript/Reference/Global_Objects/Promise/any +tags: + - Experimental + - JavaScript + - Method + - Promise + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Promise/any +--- +<p>{{JSRef}}</p> + +<p><code>Promise.any()</code> 接收一个{{JSxRef("Promise")}}可迭代对象，只要其中的一个 <code>promise</code> 成功，就返回那个已经成功的 <code>promise</code> 。如果可迭代对象中没有一个 <code>promise</code> 成功（即所有的 <code>promises</code> 都失败/拒绝），就返回一个失败的 <code>promise </code>和{{JSxRef("Global_Objects/AggregateError", "AggregateError")}}类型的实例，它是 {{JSxRef("Error")}} 的一个子类，用于把单一的错误集合在一起。本质上，这个方法和{{JSxRef("Promise.all()")}}是相反的。</p> + +<div class="blockIndicator warning"> +<p><strong>注意！</strong> <code>Promise.any()</code> 方法依然是实验性的，尚未被所有的浏览器完全支持。它当前处于 <a href="https://github.com/tc39/proposal-promise-any">TC39 第四阶段草案（Stage 4）</a></p> +</div> + +<h2 id="语法">语法</h2> + +<pre class="notranslate">Promise.any(<var>iterable</var>);</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>iterable</code></dt> + <dd>一个<a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Iteration_protocols#The_iterable_protocol">可迭代</a>的对象, 例如 <a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array">Array</a>。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<ul> + <li>如果传入的参数是一个空的可迭代对象，则返回一个 <strong>已失败（already rejected）</strong> 状态的 <a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Promise">Promise</a>。</li> + <li>如果传入的参数不包含任何 <code>promise</code><var>，则返回</var>一个 <strong>异步完成</strong> （<strong>asynchronously resolved</strong>）的 <a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Promise">Promise</a>。</li> + <li>其他情况下都会返回一个<strong>处理中（pending）</strong> 的 <a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Promise">Promise</a>。 只要传入的迭代对象中的任何一个 <code>promise</code> 变成成功（resolve）状态，或者其中的所有的 <code>promises</code> 都失败，那么返回的 <code>promise</code> 就会 <strong>异步地</strong>（当调用栈为空时）<strong> </strong>变成成功/失败（resolved/reject）状态。</li> +</ul> + +<h2 id="说明">说明</h2> + +<p>这个方法用于返回第一个成功的 <code>promise</code> 。只要有一个 <code>promise</code> 成功此方法就会终止，它不会等待其他的 <code>promise</code> 全部完成。</p> + +<p>不像 <a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Promise/all">Promise.all()</a> 会返回一组完成值那样（resolved values），我们只能得到一个成功值（假设至少有一个 <code>promise</code> 完成）。当我们只需要一个 <code>promise</code> 成功，而不关心是哪一个成功时此方法很有用的。</p> + +<p>同时, 也不像 <a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Promise/race">Promise.race()</a> 总是返回第一个结果值（resolved/reject）那样，这个方法返回的是第一个<em> 成功的</em> 值。这个方法将会忽略掉所有被拒绝的 <code>promise</code>，直到第一个 <code>promise</code> 成功。</p> + +<h3 id="成功（Fulfillment）：">成功（Fulfillment）：</h3> + +<p>当任何一个被传入的 <code>promise</code> 成功的时候, 无论其他的 <code>promises</code> 成功还是失败，此函数会将那个成功的 <code>promise</code> 作为返回值 。</p> + +<ul> + <li>如果传入的参数是一个空的可迭代对象, 这个方法将会同步返回一个已经完成的 <code>promise</code>。</li> + <li>如果传入的任何一个 <code>promise</code> 已成功, 或者传入的参数不包括任何 <code>promise</code>, 那么 <code>Promise.any</code> 返回一个异步成功的 <code>promise</code>。</li> +</ul> + +<h3 id="失败拒绝（Rejection）：">失败/拒绝（Rejection）：</h3> + +<p>如果所有传入的 <code>promises</code> 都失败, <code>Promise.any</code> 将返回异步失败，和一个 <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/AggregateError">AggregateError</a> 对象，它继承自 <a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Error">Error</a>，有一个 <code>error</code> 属性，属性值是由所有失败值填充的数组。</p> + +<h2 id="示例">示例</h2> + +<h3 id="First_to_fulfil">First to fulfil</h3> + +<p>即使第一个返回的 promise 是失败的，<code>Promise.any()</code> 依然使用第一个成功状态的 promise 来返回。这与使用首个（无论 rejected 还是 fullfiled）promise 来返回的 {{jsxref("Promise.race()")}} 相反。</p> + +<pre class="brush: js notranslate">const pErr = new Promise((resolve, reject) => { + reject("总是失败"); +}); + +const pSlow = new Promise((resolve, reject) => { + setTimeout(resolve, 500, "最终完成"); +}); + +const pFast = new Promise((resolve, reject) => { + setTimeout(resolve, 100, "很快完成"); +}); + +Promise.any([pErr, pSlow, pFast]).then((value) => { + console.log(value); + // pFast fulfils first +}) +// 期望输出: "很快完成" +</pre> + +<h3 id="Rejections_with_AggregateError">Rejections with AggregateError</h3> + +<p>如果没有 fulfilled (成功的) promise，<code>Promise.any()</code> 返回 {{jsxref("AggregateError")}} 错误。</p> + +<pre class="brush: js notranslate">const pErr = new Promise((resolve, reject) => { + reject('总是失败'); +}); + +Promise.any([pErr]).catch((err) => { + console.log(err); +}) +// 期望输出: "AggregateError: No Promise in Promise.any was resolved" +</pre> + +<h3 id="显示第一张已加载的图片">显示第一张已加载的图片</h3> + +<p>在这个例子，我们有一个获取图片并返回 blob 的函数，我们使用 <code>Promise.any()</code> 来获取一些图片并显示第一张有效的图片（即最先 resolved 的那个 promise）。</p> + +<pre class="brush: js notranslate">function fetchAndDecode(url) { + return fetch(url).then(response => { + if(!response.ok) { + throw new Error(`HTTP error! status: ${response.status}`); + } else { + return response.blob(); + } + }) +} + +let coffee = fetchAndDecode('coffee.jpg'); +let tea = fetchAndDecode('tea.jpg'); + +Promise.any([coffee, tea]).then(value => { + let objectURL = URL.createObjectURL(value); + let image = document.createElement('img'); + image.src = objectURL; + document.body.appendChild(image); +}) +.catch(e => { + console.log(e.message); +});</pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">规范</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('Promise.any')}}</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.Promise.any")}}</p> + +<h2 id="参见">参见</h2> + +<ul> + <li>{{JSxRef("Promise")}}</li> + <li>{{JSxRef("Promise.all()")}}</li> + <li>{{JSxRef("Promise.race()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/promise/catch/index.html b/files/zh-cn/web/javascript/reference/global_objects/promise/catch/index.html new file mode 100644 index 0000000000..3bd0a41fd4 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/promise/catch/index.html @@ -0,0 +1,156 @@ +--- +title: Promise.prototype.catch() +slug: Web/JavaScript/Reference/Global_Objects/Promise/catch +tags: + - Promise + - Promise.prototype.catch() +translation_of: Web/JavaScript/Reference/Global_Objects/Promise/catch +--- +<div>{{JSRef}}</div> + +<p><strong>catch()</strong> 方法返回一个<a href="/zh-CN/docs/Web/API/Promise">Promise</a>，并且处理拒绝的情况。它的行为与调用{{jsxref("Promise.then", "Promise.prototype.then(undefined, onRejected)")}} 相同。 (事实上, calling <code>obj.catch(onRejected)</code> 内部calls <code>obj.then(undefined, onRejected)</code>).</p> + +<h2 id="Syntax" name="Syntax" style="line-height: 30px;">语法</h2> + +<pre class="syntaxbox" style="font-size: 14px;"><var>p.catch(onRejected)</var>; + +p.catch(function(reason) { + // 拒绝 +}); +</pre> + +<h3 id="参数" style="line-height: 24px;">参数</h3> + +<dl> + <dt><strong>onRejected</strong></dt> + <dd>当Promise 被rejected时,被调用的一个{{jsxref("Function")}}。 该函数拥有一个参数：</dd> + <dd><code>reason</code> rejection 的原因。</dd> + <dd> + <p> 如果 <code>onRejected</code> 抛出一个错误或返回一个本身失败的 Promise ， 通过 <code>catch()</code> 返回的Promise 被rejected；否则，它将显示为成功（resolved）。 </p> + + <h3 id="返回值">返回值</h3> + + <p>一个{{jsxref("Promise")}}.</p> + </dd> +</dl> + +<h2 id="Description" name="Description" style="line-height: 30px;">描述</h2> + +<p><code>catch </code>方法可以用于您的promise组合中的错误处理。</p> + +<p>Internally calls <code>Promise.prototype.then</code> on the object upon which is called, passing the parameters <code>undefined</code> and the <code>onRejected</code> handler received; then returns the value of that call (which is a {{jsxref("Promise")}}).</p> + +<h2 id="示例" style="line-height: 30px;">示例</h2> + +<h3 id="使用链式语句的_catch方法" style="line-height: 24px;">使用链式语句的 <code>catch</code>方法</h3> + +<pre class="brush: js"><code>var p1 = new Promise(function(resolve, reject) { + resolve('Success'); +});</code> + +p1.then(function(value) { + console.log(value); // "Success!" + throw 'oh, no!'; +}).catch(function(e) { + console.log(e); // "oh, no!" +}).then(function(){ + console.log('after a catch the chain is restored'); +}, function () { + console.log('Not fired due to the catch'); +}); + +// 以下行为与上述相同 +p1.then(function(value) { + console.log(value); // "Success!" + return Promise.reject('oh, no!'); +}).catch(function(e) { + console.log(e); // "oh, no!" +}).then(function(){ + console.log('after a catch the chain is restored'); +}, function () { + console.log('Not fired due to the catch'); +});</pre> + +<h3 id="捕获抛出的错误" style="line-height: 30px;">捕获抛出的错误</h3> + +<pre class="brush: js"><code>// 抛出一个错误，大多数时候将调用catch方法 +var p1 = new Promise(function(resolve, reject) { + throw 'Uh-oh!'; +}); + +p1.catch(function(e) { + console.log(e); // "Uh-oh!" +}); + +// 在异步函数中抛出的错误不会被catch捕获到 +var p2 = new Promise(function(resolve, reject) { + setTimeout(function() { + throw 'Uncaught Exception!'; + }, 1000); +}); + +p2.catch(function(e) { + console.log(e); // 不会执行 +}); + +// 在resolve()后面抛出的错误会被忽略 +var p3 = new Promise(function(resolve, reject) { + resolve(); + throw 'Silenced Exception!'; +}); + +p3.catch(function(e) { + console.log(e); // 不会执行 +});</code></pre> + +<h3 id="如果已决议" style="line-height: 30px;">如果已决议</h3> + +<pre><code>//创建一个新的 Promise ，且已决议 +var p1 = Promise.resolve("calling next"); + +var p2 = p1.catch(function (reason) { + //这个方法永远不会调用 + console.log("catch p1!"); + console.log(reason); +}); + +p2.then(function (value) { + console.log("next promise's onFulfilled"); /* next promise's onFulfilled */ + console.log(value); /* calling next */ +}, function (reason) { + console.log("next promise's onRejected"); + console.log(reason); +});</code></pre> + +<h2 id="规范" style="line-height: 30px;">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范</th> + <th scope="col">状态</th> + <th scope="col">备注</th> + </tr> + <tr> + <td><a href="https://github.com/domenic/promises-unwrapping">domenic/promises-unwrapping</a></td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition in an ECMA standard.</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-promise.prototype.catch', 'Promise.prototype.catch')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性" style="line-height: 30px;">浏览器兼容性</h2> + +<p>{{Compat("javascript/promise","Promise.prototype.catch")}}</p> + +<h2 id="相关链接" style="line-height: 30px;">相关链接</h2> + +<ul> + <li>{{jsxref("Promise")}}</li> + <li>{{jsxref("Promise.prototype.then()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/promise/finally/index.html b/files/zh-cn/web/javascript/reference/global_objects/promise/finally/index.html new file mode 100644 index 0000000000..6f0711e765 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/promise/finally/index.html @@ -0,0 +1,101 @@ +--- +title: Promise.prototype.finally() +slug: Web/JavaScript/Reference/Global_Objects/Promise/finally +tags: + - JavaScript + - Promises + - Reference + - finally +translation_of: Web/JavaScript/Reference/Global_Objects/Promise/finally +--- +<div>{{JSRef}}</div> + +<div></div> + +<div><code><strong>finally()</strong></code> 方法返回一个{{jsxref("Promise")}}。在promise结束时，无论结果是fulfilled或者是rejected，都会执行指定的回调函数。这为在<code>Promise</code>是否成功完成后都需要执行的代码提供了一种方式。</div> + +<div>这避免了同样的语句需要在{{jsxref("Promise.then", "then()")}}和{{jsxref("Promise.catch", "catch()")}}中各写一次的情况。</div> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>p.finally(onFinally)</var>; + +p.finally(function() { + // 返回状态为(resolved 或 rejected) +});</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>onFinally</code></dt> + <dd><code>Promise</code> 结束后调用的{{jsxref("Function")}}。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>返回一个设置了 <code>finally</code> 回调函数的{{jsxref("Promise")}}对象。 </p> + +<h2 id="描述">描述</h2> + +<p>如果你想在 promise 执行完毕后无论其结果怎样都做一些处理或清理时，<code>finally()</code> 方法可能是有用的。</p> + +<p><code>finally()</code> 虽然与 <code>.then(onFinally, onFinally)</code> 类似，它们不同的是：</p> + +<ul> + <li>调用内联函数时，不需要多次声明该函数或为该函数创建一个变量保存它。</li> + <li>由于无法知道<code>promise</code>的最终状态，所以<code>finally</code>的回调函数中不接收任何参数，它仅用于无论最终结果如何都要执行的情况。</li> + <li>与<code>Promise.resolve(2).then(() => {}, () => {})</code> （resolved的结果为<code>undefined</code>）不同，<code>Promise.resolve(2).finally(() => {})</code> resolved的结果为 <code>2</code>。</li> + <li>同样，<code>Promise.reject(3).then(() => {}, () => {})</code> (resolved 的结果为<code>undefined</code>), <code>Promise.reject(3).finally(() => {})</code> rejected 的结果为 <code>3</code>。</li> +</ul> + +<div class="note"> +<p><strong>注意:</strong> 在<code>finally</code>回调中 <code>throw</code>（或返回被拒绝的promise）将以 <code>throw()</code> 指定的原因拒绝新的promise.</p> +</div> + +<h2 id="示例">示例</h2> + +<pre class="brush: js">let isLoading = true; + +fetch(myRequest).then(function(response) { + var contentType = response.headers.get("content-type"); + if(contentType && contentType.includes("application/json")) { + return response.json(); + } + throw new TypeError("Oops, we haven't got JSON!"); + }) + .then(function(json) { /* process your JSON further */ }) + .catch(function(error) { console.log(error); }) + .finally(function() { isLoading = false; }); + +</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('ESDraft', '#sec-promise.prototype.finally', 'Promise.prototype.finally')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p class="hidden">To contribute to this compatibility data, please write a pull request against this repository: <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>.</p> + +<p>{{Compat("javascript.builtins.Promise.finally")}}</p> + +<h2 id="参见">参见</h2> + +<ul> + <li>{{jsxref("Promise")}}</li> + <li>{{jsxref("Promise.prototype.then()")}}</li> + <li>{{jsxref("Promise.prototype.catch()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/promise/index.html b/files/zh-cn/web/javascript/reference/global_objects/promise/index.html new file mode 100644 index 0000000000..5378fe3aeb --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/promise/index.html @@ -0,0 +1,311 @@ +--- +title: Promise +slug: Web/JavaScript/Reference/Global_Objects/Promise +tags: + - ECMAScript 2015 + - ES6 + - JavaScript + - Promise + - Promise A+ + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Promise +--- +<p>{{JSRef}}</p> + +<p id="概述"><strong>Promise </strong>对象用于表示一个异步操作的最终完成 (或失败)及其结果值。</p> + +<p>若想了解 promises 的工作方式以及如何使用它们，我们建议您先阅读<a href="/zh-CN/docs/Web/JavaScript/Guide/Using_promises">使用 promises</a></p> + +<h2 id="描述">描述</h2> + +<p>一个 <code>Promise</code> 对象代表一个在这个 promise 被创建出来时不一定已知的值。它让您能够把异步操作最终的成功返回值或者失败原因和相应的处理程序关联起来。 这样使得异步方法可以像同步方法那样返回值：异步方法并不会立即返回最终的值，而是会返回一个 <em>promise</em>，以便在未来某个时候把值交给使用者。</p> + +<p>一个 <code>Promise</code> 必然处于以下几种状态之一：</p> + +<ul> + <li><em>待定（pending）</em>: 初始状态，既没有被兑现，也没有被拒绝。</li> + <li><em>已兑现（fulfilled）</em>: 意味着操作成功完成。</li> + <li><em>已拒绝（rejected）</em>: 意味着操作失败。</li> +</ul> + +<p>待定状态的 Promise 对象要么会通过一个值<em>被兑现（fulfilled）</em>，要么会通过一个原因（错误）<em>被拒绝（rejected）</em>。当这些情况之一发生时，我们用 promise 的 then 方法排列起来的相关处理程序就会被调用。如果 promise 在一个相应的处理程序被绑定时就已经被兑现或被拒绝了，那么这个处理程序就会被调用，因此<span style="line-height: 1.5;">在完成异步操作和绑定处理方法之间不会存在竞争状态。</span></p> + +<p>因为 <span style="font-family: consolas,monaco,andale mono,monospace;"><code>{{jsxref("Promise.then", "Promise.prototype.then")}}</code> </span>和 <code style="font-style: normal;">{{jsxref("Promise.catch", "Promise.prototype.catch")}}</code> 方法返回的是 promise， 所以它们可以被链式调用。</p> + +<p><img alt="" src="https://mdn.mozillademos.org/files/8633/promises.png" style="height: 297px; width: 801px;"></p> + +<div class="note"> +<p><strong>不要和惰性求值混淆：</strong> 有一些语言中有惰性求值和延时计算的特性，它们也被称为“promises”，例如 Scheme。JavaScript 中的 promise 代表的是已经正在发生的进程， 而且可以通过回调函数实现链式调用。 如果您想对一个表达式进行惰性求值，就考虑一下使用无参数的"<a href="/zh-CN/docs/Web/JavaScript/Reference/Functions/Arrow_functions">箭头函数</a>": <code>f = () =></code><em><code>表达式</code> </em>来创建惰性求值的表达式<em>，</em>使用 <code>f()</code><strong> </strong>求值。</p> +</div> + +<div class="note"> +<p><strong>注意：</strong> 如果一个 promise 已经被兑现（fulfilled）或被拒绝（rejected），那么我们也可以说它处于<em>已敲定（settled）</em>状态。您还会听到一个经常跟 promise 一起使用的术语：<em>已决议（resolved）</em>，它表示 promise 已经处于已敲定(settled)状态，或者为了匹配另一个 promise 的状态被"锁定"了。Domenic Denicola 的 <a href="https://github.com/domenic/promises-unwrapping/blob/master/docs/states-and-fates.md">States and fates</a> 中有更多关于 promise 术语的细节可以供您参考。</p> +</div> + +<h3 id="Promise的链式调用">Promise的链式调用</h3> + +<p>我们可以用 <code>promise.then()</code>，<code>promise.catch()</code> 和 <code>promise.finally()</code> 这些方法将进一步的操作与一个变为已敲定状态的 promise 关联起来。这些方法还会返回一个新生成的 promise 对象，这个对象可以被非强制性的用来做链式调用，就像这样：</p> + +<pre class="notranslate">const myPromise = + (new Promise(myExecutorFunc)) + .then(handleFulfilledA,handleRejectedA) + .then(handleFulfilledB,handleRejectedB) + .then(handleFulfilledC,handleRejectedC); + +// 或者，这样可能会更好... + +const myPromise = + (new Promise(myExecutorFunc)) + .then(handleFulfilledA) + .then(handleFulfilledB) + .then(handleFulfilledC) + .catch(handleRejectedAny);</pre> + +<p>过早地处理被拒绝的 promise 会对之后 promise 的链式调用造成影响。不过有时候我们因为需要马上处理一个错误也只能这样做。（有关应对影响的技巧，请参见下面示例中的 <code>throw -999</code> ）另一方面，在没有迫切需要的情况下，可以在最后一个.catch() 语句时再进行错误处理，这种做法更加简单。</p> + +<p>这两个函数的签名很简单，它们只接受一个任意类型的参数。这些函数由您（编程者）编写。这些函数的终止状态决定着链式调用中下一个promise的"已敲定 （settled）"状态是什么。任何不是 <code>throw</code> 的终止都会创建一个"已决议（resolved）"状态，而以 <code>throw</code> 终止则会创建一个"已拒绝"状态。</p> + +<pre class="notranslate">handleFulfilled(value) { /*...*/; return nextValue; } +handleRejection(reason) { /*...*/; throw nextReason; } +handleRejection(reason) { /*...*/; return nextValue; }</pre> + +<p>被返回的 <code>nextValue</code> 可能是另一个promise对象，这种情况下这个promise会被动态地插入链式调用。 </p> + +<p>当 <code>.then()</code> 中缺少能够返回 promise 对象的函数时，链式调用就直接继续进行下一环操作。因此，链式调用可以在最后一个 <code>.catch()</code> 之前把所有的 <code>handleRejection</code> 都省略掉。类似地， <code>.catch()</code> 其实只是没有给 <code>handleFulfilled</code> 预留参数位置的 <code>.then()</code> 而已。</p> + +<p>链式调用中的 promise 们就像俄罗斯套娃一样，是嵌套起来的，但又像是一个栈，每个都必须从顶端被弹出。链式调用中的第一个 promise 是嵌套最深的一个，也将是第一个被弹出的。</p> + +<pre class="notranslate">(promise D, (promise C, (promise B, (promise A) ) ) )</pre> + +<p>当存在一个 <code>nextValue</code> 是 promise 时，就会出现一种动态的替换效果。<code>return</code> 会导致一个 promise 被弹出，但这个 <code>nextValue</code> promise 则会被推入被弹出 promise 原来的位置。对于上面所示的嵌套场景，假设与 "promise B" 相关的 <code>.then()</code> 返回了一个值为 "promise X" 的 <code>nextValue</code> 。那么嵌套的结果看起来就会是这样：</p> + +<pre class="notranslate">(promise D, (promise C, (promise X) ) )</pre> + +<p>一个 promise 可能会参与不止一次的嵌套。对于下面的代码，<code>promiseA</code> 向"已敲定"（"settled"）状态的过渡会导致两个实例的 <code>.then</code> 都被调用。</p> + +<pre class="notranslate">const promiseA = new Promise(myExecutorFunc); +const promiseB = promiseA.then(handleFulfilled1, handleRejected1); +const promiseC = promiseA.then(handleFulfilled2, handleRejected2); </pre> + +<p>一个已经处于"已敲定"（"settled"）状态的 promise 也可以接收操作。在那种情况下，（如果没有问题的话，）这个操作会被作为第一个异步操作被执行。注意，所有的 promise 都一定是异步的。因此，一个已经处于"已敲定"（"settled"）状态的 promise 中的操作只有 promise 链式调用的栈被清空了和一个事件循环过去了之后才会被执行。这种效果跟 <code>setTimeout(action, 10)</code> 特别相似。</p> + +<pre class="notranslate">const promiseA = new Promise( (resolutionFunc,rejectionFunc) => { + resolutionFunc(777); +}); +// 这时，"promiseA" 已经被敲定了。 +promiseA.then( (val) => console.log("asynchronous logging has val:",val) ); +console.log("immediate logging"); + +// produces output in this order: +// immediate logging +// asynchronous logging has val: 777 +</pre> + +<h2 id="构造函数">构造函数</h2> + +<dl> + <dt>{{jsxref("Promise/Promise", "Promise()")}}</dt> + <dd>创建一个新的 <code>Promise</code> 对象。该构造函数主要用于包装还没有添加 promise 支持的函数。</dd> +</dl> + +<h2 id="静态方法">静态方法</h2> + +<dl> + <dt>{{jsxref("Promise.all", "Promise.all(iterable)")}}</dt> + <dd>这个方法返回一个新的promise对象，该promise对象在iterable参数对象里所有的promise对象都成功的时候才会触发成功，一旦有任何一个iterable里面的promise对象失败则立即触发该promise对象的失败。这个新的promise对象在触发成功状态以后，会把一个包含iterable里所有promise返回值的数组作为成功回调的返回值，顺序跟iterable的顺序保持一致；如果这个新的promise对象触发了失败状态，它会把iterable里第一个触发失败的promise对象的错误信息作为它的失败错误信息。Promise.all方法常被用于处理多个promise对象的状态集合。（可以参考jQuery.when方法---译者注）</dd> +</dl> + +<dl> + <dt>{{jsxref("Promise.allSettled", "Promise.allSettled(iterable)")}}</dt> + <dd>等到所有promises都已敲定（settled）（每个promise都已兑现（fulfilled）或已拒绝（rejected））。<br> + 返回一个promise，该promise在所有promise完成后完成。并带有一个对象数组，每个对象对应每个promise的结果。</dd> +</dl> + +<dl> + <dt>{{jsxref("Promise.any", "Promise.any(iterable)")}}</dt> + <dd>接收一个Promise对象的集合，当其中的一个 promise 成功，就返回那个成功的promise的值。</dd> +</dl> + +<dl> + <dt>{{jsxref("Promise.race", "Promise.race(iterable)")}}</dt> + <dd>当iterable参数里的任意一个子promise被成功或失败后，父promise马上也会用子promise的成功返回值或失败详情作为参数调用父promise绑定的相应句柄，并返回该promise对象。</dd> +</dl> + +<dl> + <dt>{{jsxref("Promise.reject", "Promise.reject(reason)")}}</dt> + <dd>返回一个状态为失败的Promise对象，并将给定的失败信息传递给对应的处理方法</dd> +</dl> + +<dl> + <dt>{{jsxref("Promise.resolve", "Promise.resolve(value)")}}</dt> + <dd>返回一个状态由给定value决定的Promise对象。如果该值是thenable(即，带有then方法的对象)，返回的Promise对象的最终状态由then方法执行决定；否则的话(该value为空，基本类型或者不带then方法的对象),返回的Promise对象状态为fulfilled，并且将该value传递给对应的then方法。通常而言，如果您不知道一个值是否是Promise对象，使用Promise.resolve(value) 来返回一个Promise对象,这样就能将该value以Promise对象形式使用。</dd> +</dl> + +<h2 id="Promise_原型">Promise 原型</h2> + +<h3 id="属性">属性</h3> + +<p>{{page('zh-CN/Web/JavaScript/Reference/Global_Objects/Promise/prototype','属性')}}</p> + +<h3 id="方法">方法</h3> + +<p>{{page('zh-CN/Web/JavaScript/Reference/Global_Objects/Promise/prototype','方法')}}</p> + +<h2 id="创建Promise">创建Promise</h2> + +<p><code>Promise</code> 对象是由关键字 <code>new</code> 及其构造函数来创建的。该构造函数会把一个叫做“处理器函数”（executor function）的函数作为它的参数。这个“处理器函数”接受两个函数——<code>resolve</code> 和 <code>reject</code> ——作为其参数。当异步任务顺利完成且返回结果值时，会调用 <code>resolve</code> 函数；而当异步任务失败且返回失败原因（通常是一个错误对象）时，会调用<code>reject</code> 函数。</p> + +<pre class="brush: js notranslate">const myFirstPromise = new Promise((resolve, reject) => { + // ?做一些异步操作，最终会调用下面两者之一: + // + // resolve(someValue); // fulfilled + // ?或 + // reject("failure reason"); // rejected +});</pre> + +<p>想要某个函数拥有promise功能，只需让其返回一个promise即可。</p> + +<pre class="brush: js notranslate">function myAsyncFunction(url) { + return new Promise((resolve, reject) => { + const xhr = new XMLHttpRequest(); + xhr.open("GET", url); + xhr.onload = () => resolve(xhr.responseText); + xhr.onerror = () => reject(xhr.statusText); + xhr.send(); + }); +};</pre> + +<h2 id="示例">示例</h2> + +<h3 id="基础示例">基础示例</h3> + +<pre class="brush: js notranslate">let myFirstPromise = new Promise(function(resolve, reject){ + //当异步代码执行成功时，我们才会调用resolve(...), 当异步代码失败时就会调用reject(...) + //在本例中，我们使用setTimeout(...)来模拟异步代码，实际编码时可能是XHR请求或是HTML5的一些API方法. + setTimeout(function(){ + resolve("成功!"); //代码正常执行！ + }, 250); +}); + +myFirstPromise.then(function(successMessage){ + //successMessage的值是上面调用resolve(...)方法传入的值. + //successMessage参数不一定非要是字符串类型，这里只是举个例子 + console.log("Yay! " + successMessage); +}); +</pre> + +<h3 id="高级示例">高级示例</h3> + +<pre class="brush: html hidden notranslate"><button id="btn">Make a promise!</button> +<div id="log"></div> +</pre> + +<p>本例展示了 <code>Promise</code> 的一些机制。 <code>testPromise()</code> 方法在每次点击 {{HTMLElement("button")}} 按钮时被调用，该方法会创建一个promise 对象，使用 {{domxref("window.setTimeout()")}} 让Promise等待 1-3 秒不等的时间来填充数据（通过Math.random()方法）。</p> + +<p>Promise 的值的填充过程都被日志记录（logged）下来，这些日志信息展示了方法中的同步代码和异步代码是如何通过Promise完成解耦的。</p> + +<pre class="brush: js notranslate">'use strict'; +var promiseCount = 0; + +function testPromise() { + let thisPromiseCount = ++promiseCount; + + let log = document.getElementById('log'); + log.insertAdjacentHTML('beforeend', thisPromiseCount + + ') 开始 (<small>同步代码开始</small>)<br/>'); + + // 新构建一个 Promise 实例：使用Promise实现每过一段时间给计数器加一的过程，每段时间间隔为1~3秒不等 + let p1 = new Promise( + // resolver 函数在 Promise 成功或失败时都可能被调用 + (resolve, reject) => { + log.insertAdjacentHTML('beforeend', thisPromiseCount + + ') Promise 开始 (<small>异步代码开始</small>)<br/>'); + // 创建一个异步调用 + window.setTimeout( + function() { + // 填充 Promise + resolve(thisPromiseCount); + }, Math.random() * 2000 + 1000); + } + ); + + // Promise 不论成功或失败都会调用 then + // catch() 只有当 promise 失败时才会调用 + p1.then( + // 记录填充值 + function(val) { + log.insertAdjacentHTML('beforeend', val + + ') Promise 已填充完毕 (<small>异步代码结束</small>)<br/>'); + }) + .catch( + // 记录失败原因 + (reason) => { + console.log('处理失败的 promise ('+reason+')'); + }); + + log.insertAdjacentHTML('beforeend', thisPromiseCount + + ') Promise made (<small>同步代码结束</small>)<br/>'); +}</pre> + +<pre class="brush:js hidden notranslate">if ("Promise" in window) { + let btn = document.getElementById("btn"); + btn.addEventListener("click",testPromise); +} else { + log = document.getElementById('log'); + log.innerHTML = "Live example not available as your browser doesn't support the <code>Promise<code> interface."; +} +</pre> + +<p>点击下面的按钮可以看到示例代码运行的效果，前提是您的浏览器支持 <code>Promise</code>。快速点击按钮多次您会观察到Promises填充值的过程。</p> + +<p>{{EmbedLiveSample("高级一点的例子", "500", "200")}}</p> + +<h2 id="使用_XHR_加载图像">使用 XHR 加载图像</h2> + +<p><font face="Open Sans, sans-serif">另一个用了 </font>Promise <font face="Open Sans, sans-serif">和</font><a href="/en-US/docs/Web/API/XMLHttpRequest"> XMLHttpRequest</a> 加载一个图像的例子可在MDN GitHub<a href="https://github.com/mdn/js-examples/tree/master/promises-test"> promise-test</a> 中找到。 您也可以<a href="https://mdn.github.io/js-examples/promises-test/">看这个实例</a>。每一步都有注释可以让您详细的了解Promise和XHR架构。</p> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范</th> + <th scope="col">状态</th> + <th scope="col">备注</th> + </tr> + <tr> + <td>{{SpecName('ES2015', '#sec-promise-objects', 'Promise')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>ECMA标准中的首次定义</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-promise-objects', 'Promise')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p class="hidden">To contribute to this compatibility data, please write a pull request against this repository: <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>.</p> + +<p>{{Compat("javascript.builtins.Promise")}}</p> + +<h2 id="参见">参见</h2> + +<ul> + <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Using_promises">Using promises</a></li> + <li><a href="http://promisesaplus.com/">Promises/A+ specification</a></li> + <li><a href="https://medium.com/@ramsunvtech/promises-of-promise-part-1-53f769245a53">Venkatraman.R - JS Promise (Part 1, Basics)</a></li> + <li><a href="https://medium.com/@ramsunvtech/js-promise-part-2-q-js-when-js-and-rsvp-js-af596232525c#.dzlqh6ski">Venkatraman.R - JS Promise (Part 2 - Using Q.js, When.js and RSVP.js)</a></li> + <li><a href="https://tech.io/playgrounds/11107/tools-for-promises-unittesting/introduction">Venkatraman.R - Tools for Promises Unit Testing</a></li> + <li><a href="http://www.html5rocks.com/en/tutorials/es6/promises/">Jake Archibald: JavaScript Promises: There and Back Again</a></li> + <li><a href="http://de.slideshare.net/domenicdenicola/callbacks-promises-and-coroutines-oh-my-the-evolution-of-asynchronicity-in-javascript">Domenic Denicola: Callbacks, Promises, and Coroutines – Asynchronous Programming Patter in JavaScript</a></li> + <li><a href="http://www.mattgreer.org/articles/promises-in-wicked-detail/">Matt Greer: JavaScript Promises ... In Wicked Detail</a></li> + <li><a href="https://www.promisejs.org/">Forbes Lindesay: promisejs.org</a></li> + <li><a href="https://github.com/anonyco/SPromiseMeSpeedJS/blob/master/README.md">Speed-polyfill to polyfill both promise availability and promise performance.</a></li> + <li><a href="http://pouchdb.com/2015/05/18/we-have-a-problem-with-promises.html">Nolan Lawson: We have a problem with promises — Common mistakes with promises</a></li> + <li><a href="https://github.com/jakearchibald/es6-promise/">Promise polyfill</a></li> + <li><a href="https://www.udacity.com/course/javascript-promises--ud898">Udacity: JavaScript Promises</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/promise/promise/index.html b/files/zh-cn/web/javascript/reference/global_objects/promise/promise/index.html new file mode 100644 index 0000000000..c871b52513 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/promise/promise/index.html @@ -0,0 +1,73 @@ +--- +title: Promise() 构造器 +slug: Web/JavaScript/Reference/Global_Objects/Promise/Promise +translation_of: Web/JavaScript/Reference/Global_Objects/Promise/Promise +--- +<div>{{JSRef}}</div> + +<p><strong><code>Promise</code></strong> 构造器主要用于包装不支持promise（返回值不是<code>Promise</code>）的函数。</p> + +<div>{{EmbedInteractiveExample("pages/js/promise-constructor.html")}}</div> + +<p class="hidden">交互式的demo的源码在GitHub仓库，如果你乐于为交互式的demo做贡献，请克隆<a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a>并提交pull request .</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">new Promise(<var>executor</var>)</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>executor</code></dt> + <dd>这是一个双参函数，参数为<code>resolve<font face="Arial, x-locale-body, sans-serif"><span style="background-color: #ffffff;">和</span></font>reject</code>。<code>Promise</code>的实现会立即执行<code>executor</code>，并传入<code>resolve<font face="Arial, x-locale-body, sans-serif"><span style="background-color: #ffffff;">和</span></font>reject</code>函数（<code>Promise</code>构造器将会在返回新对象之前<code>executor</code>）。当<code>resolve</code>和<code>reject</code>函数被调用时，它们分别对promise执行<code>resolve</code>和<code>reject</code>。<code>executor</code>通常会触发一些异步运算，一旦运算成功完成，则<code>resolve</code>掉这个promise，如果出错则<code>reject</code>掉。如果<code>executor</code>函数执行时抛出异常，promise状态会变为<code>rejected</code>。<code>executor</code>的返回值也会被忽略。</dd> +</dl> + +<h2 id="例子">例子</h2> + +<p>我们通过<code>new</code>关键字和<code>Promise</code>构造器创建它的对象。这个构造器接受一个名为"executor function"的函数。这个函数应当接受两个函数参数。当异步任务成功时，第一个函数（<code>resolve</code>）将被调用，并返回一个值代表成功。当其失败时，第二个函数（<code>reject</code>）将被调用，并返回失败原因（失败原因通常是一个error对象）。</p> + +<pre class="brush: js;">const myFirstPromise = new Promise((resolve, reject) => { + // do something asynchronous which eventually calls either: + // + // resolve(someValue) // fulfilled + // or + // reject("failure reason") // rejected +}); +</pre> + +<p>为了提供一个拥有promise功能的函数，简单的返回一个promise即可:</p> + +<pre class="brush: js;">function myAsyncFunction(url) { + return new Promise((resolve, reject) => { + const xhr = new XMLHttpRequest() + xhr.open("GET", url) + xhr.onload = () => resolve(xhr.responseText) + xhr.onerror = () => reject(xhr.statusText) + xhr.send() + }); +}</pre> + +<h2 id="说明">说明</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Specification</th> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-promise-constructor', 'Promise constructor')}}</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div class="hidden">To contribute to this compatibility data, please write a pull request against this repository: <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>.</div> + +<p>{{Compat("javascript.builtins.Promise.Promise")}}</p> + +<h2 id="See_also">See also</h2> + +<ul> + <li><a href="/en-US/docs/Web/JavaScript/Guide/Using_promises">Using Promises</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/promise/prototype/index.html b/files/zh-cn/web/javascript/reference/global_objects/promise/prototype/index.html new file mode 100644 index 0000000000..3b26852c87 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/promise/prototype/index.html @@ -0,0 +1,115 @@ +--- +title: Promise.prototype +slug: Web/JavaScript/Reference/Global_Objects/Promise/prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Promise +--- +<div>{{JSRef("Global_Objects", "Promise")}}</div> + +<h2 id="Summary" name="Summary">总结</h2> + +<p><code><strong>Promise</strong></code><strong><code>.prototype</code></strong> 属性表示 {{jsxref("Promise")}} 构造器的原型.</p> + +<div>{{js_property_attributes(0,0,0)}}</div> + +<h2 id="Description" name="Description">描述</h2> + +<p>{{jsxref("Promise")}} 实例继承自 {{jsxref("Promise.prototype")}}. 你可以在构造器的原型对象添加属性或方法到所有 <code>Promise</code> 实例上.</p> + +<h2 id="属性">属性</h2> + +<dl> + <dt><code>Promise.prototype.constructor</code></dt> + <dd>返回被创建的实例函数. 默认为 {{jsxref("Promise")}} 函数.</dd> +</dl> + +<h2 id="方法">方法</h2> + +<dl> + <dt>{{jsxref("Promise.catch", "Promise.prototype.catch(onRejected)")}}</dt> + <dd>添加一个拒绝(rejection) 回调到当前 promise, 返回一个新的promise。当这个回调函数被调用，新 promise 将以它的返回值来resolve，否则如果当前promise 进入fulfilled状态，则以当前promise的完成结果作为新promise的完成结果.</dd> + <dt>{{jsxref("Promise.then", "Promise.prototype.then(onFulfilled, onRejected)")}}</dt> + <dd>添加解决(fulfillment)和拒绝(rejection)回调到当前 promise, 返回一个新的 promise, 将以回调的返回值来resolve.</dd> + <dt>{{jsxref("Promise.finally", "Promise.prototype.finally(onFinally)")}}</dt> + <dd>添加一个事件处理回调于当前promise对象，并且在原promise对象解析完毕后，返回一个新的promise对象。回调会在当前promise运行完毕后被调用，无论当前promise的状态是完成(fulfilled)还是失败(rejected)</dd> +</dl> + +<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('ES6', '#sec-promise.prototype', 'Promise.prototype')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容">浏览器兼容</h2> + +<p>{{CompatibilityTable}}</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>32</td> + <td>{{CompatGeckoDesktop(24.0)}} as <code>Future</code><br> + {{CompatGeckoDesktop(25.0)}} as <code>Promise</code> behind a flag[1]<br> + {{CompatGeckoDesktop(29.0)}} by default</td> + <td>{{CompatNo}}</td> + <td>19</td> + <td>7.1</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Android</th> + <th>Firefox Mobile (Gecko)</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + <th>Chrome for Android</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{CompatNo}}</td> + <td>{{CompatGeckoMobile(24.0)}} as <code>Future</code><br> + {{CompatGeckoMobile(25.0)}} as <code>Promise</code> behind a flag[1]<br> + {{CompatGeckoMobile(29.0)}} by default</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>iOS 8</td> + <td>32</td> + </tr> + </tbody> +</table> +</div> + +<p>[1] Gecko 24 has an experimental implementation of <code>Promise</code>, under the initial name of <code>Future</code>. It got renamed to its final name in Gecko 25, but disabled by default behind the flag <code>dom.promise.enabled</code>. <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=918806">Bug 918806</a> enabled Promises by default in Gecko 29.</p> + +<h2 id="另见">另见</h2> + +<ul> + <li>{{jsxref("Promise")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/promise/race/index.html b/files/zh-cn/web/javascript/reference/global_objects/promise/race/index.html new file mode 100644 index 0000000000..1220002fe1 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/promise/race/index.html @@ -0,0 +1,138 @@ +--- +title: Promise.race() +slug: Web/JavaScript/Reference/Global_Objects/Promise/race +tags: + - Promise +translation_of: Web/JavaScript/Reference/Global_Objects/Promise/race +--- +<div>{{JSRef}}</div> + +<p><strong><code>Promise.race(iterable)</code> </strong>方法返回一个 promise，一旦迭代器中的某个promise解决或拒绝，返回的 promise就会解决或拒绝。</p> + +<div>{{EmbedInteractiveExample("pages/js/promise-race.html")}}</div> + +<p class="hidden">The source for this interactive demo is stored in a GitHub repository. If you'd like to contribute to the interactive demo project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> and send us a pull request.</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox notranslate"><var>Promise.race(iterable)</var>;</pre> + +<h3 id="参数"><strong>参数</strong></h3> + +<dl> + <dt>iterable</dt> + <dd>可迭代对象，类似{{jsxref("Array")}}。详见 <a href="/en-US/docs/Web/JavaScript/Guide/iterable">iterable</a>。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>一个<strong>待定的</strong> {{jsxref("Promise")}} 只要给定的迭代中的一个promise解决或拒绝，就采用第一个promise的值作为它的值，从而<strong>异步</strong>地解析或拒绝（一旦堆栈为空）。</p> + +<h2 id="Description" name="Description">描述</h2> + +<p><code>race</code> 函数返回一个 <code>Promise</code>，它将与第一个传递的 promise 相同的完成方式被完成。它可以是完成（ resolves），也可以是失败（rejects），这要取决于第一个完成的方式是两个中的哪个。</p> + +<p>如果传的迭代是空的，则返回的 promise 将永远等待。</p> + +<p>如果迭代包含一个或多个非承诺值和/或已解决/拒绝的承诺，则<code> Promise.race</code> 将解析为迭代中找到的第一个值。</p> + +<h2 id="示例">示例</h2> + +<h3 id="Promise.race的异步性">Promise.race的异步性</h3> + +<pre class="brush: js notranslate">// we are passing as argument an array of promises that are already resolved, +// to trigger Promise.race as soon as possible +var resolvedPromisesArray = [Promise.resolve(33), Promise.resolve(44)]; + +var p = Promise.race(resolvedPromisesArray); +// immediately logging the value of p +console.log(p); + +// using setTimeout we can execute code after the stack is empty +setTimeout(function(){ + console.log('the stack is now empty'); + console.log(p); +}); + +// logs, in order: +// Promise { <state>: "pending" } +// the stack is now empty +// Promise { <state>: "fulfilled", <value>: 33 }</pre> + +<h3 id="使用_Promise.race_–_setTimeout_的示例"><font face="Open Sans, sans-serif">使用 </font>Promise.race – setTimeout 的示例</h3> + +<pre class="brush: js notranslate">var p1 = new Promise(function(resolve, reject) { + setTimeout(resolve, 500, "one"); +}); +var p2 = new Promise(function(resolve, reject) { + setTimeout(resolve, 100, "two"); +}); + +Promise.race([p1, p2]).then(function(value) { + console.log(value); // "two" + // 两个都完成，但 p2 更快 +}); + +var p3 = new Promise(function(resolve, reject) { + setTimeout(resolve, 100, "three"); +}); +var p4 = new Promise(function(resolve, reject) { + setTimeout(reject, 500, "four"); +}); + +Promise.race([p3, p4]).then(function(value) { + console.log(value); // "three" + // p3 更快，所以它完成了 +}, function(reason) { + // 未被调用 +}); + +var p5 = new Promise(function(resolve, reject) { + setTimeout(resolve, 500, "five"); +}); +var p6 = new Promise(function(resolve, reject) { + setTimeout(reject, 100, "six"); +}); + +Promise.race([p5, p6]).then(function(value) { + // 未被调用 +}, function(reason) { + console.log(reason); // "six" + // p6 更快，所以它失败了 +}); +</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-promise.race', 'Promise.race')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>Initial definition in an ECMA standard.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-promise.race', 'Promise.race')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容">浏览器兼容</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Promise.race")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Promise")}}</li> + <li>{{jsxref("Promise.all()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/promise/reject/index.html b/files/zh-cn/web/javascript/reference/global_objects/promise/reject/index.html new file mode 100644 index 0000000000..f5a8f82156 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/promise/reject/index.html @@ -0,0 +1,78 @@ +--- +title: Promise.reject() +slug: Web/JavaScript/Reference/Global_Objects/Promise/reject +tags: + - ECAMScript 2015 + - JavaScript + - Method + - Promise +translation_of: Web/JavaScript/Reference/Global_Objects/Promise/reject +--- +<div>{{JSRef}}</div> + +<p><code><strong>Promise.reject()</strong></code>方法返回一个带有拒绝原因的<code>Promise</code>对象。</p> + +<p>{{EmbedInteractiveExample("pages/js/promise-reject.html")}}</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><var>Promise.reject(reason)</var>;</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt>reason</dt> + <dd>表示<code>Promise</code>被拒绝的原因。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<dl> + <dd>一个给定原因了的被拒绝的 {{jsxref("Promise")}}。</dd> +</dl> + +<h2 id="Description" name="Description">描述</h2> + +<p><font face="Open Sans, sans-serif">静态函数</font><code>Promise.reject</code>返回一个被拒绝的<code>Promise对象</code>。通过使用{{jsxref("Error")}}的实例获取错误原因<code>reason</code>对调试和选择性错误捕捉很有帮助。</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用静态Promise.reject方法">使用静态<code>Promise.reject()</code>方法</h3> + +<pre><code>Promise.reject(new Error('fail')).then(function() { + // not called +}, function(error) { + console.error(error); // Stacktrace +});</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>{{SpecName('ES2015', '#sec-promise.reject', 'Promise.reject')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>ECMA规范的首次定义</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-promise.reject', 'Promise.reject')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{Compat("javascript.builtins.Promise.reject")}}</p> + +<h2 id="参见">参见</h2> + +<ul> + <li>{{jsxref("Promise")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/promise/resolve/index.html b/files/zh-cn/web/javascript/reference/global_objects/promise/resolve/index.html new file mode 100644 index 0000000000..607fa09f36 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/promise/resolve/index.html @@ -0,0 +1,158 @@ +--- +title: Promise.resolve() +slug: Web/JavaScript/Reference/Global_Objects/Promise/resolve +tags: + - ECMAScript 2015 + - JavaScript + - Promise +translation_of: Web/JavaScript/Reference/Global_Objects/Promise/resolve +--- +<div>{{JSRef}}</div> + +<div><code><strong>Promise.resolve(value)</strong></code>方法返回一个以给定值解析后的{{jsxref("Promise")}} 对象。如果这个值是一个 promise ，那么将返回这个 promise ；如果这个值是thenable（即带有{{jsxref("Promise.then", "\"then\" ")}}方法），返回的promise会“跟随”这个thenable的对象，采用它的最终状态；否则返回的promise将以此值完成。<span style="font-size: 1rem; letter-spacing: -0.00278rem;">此函数将类promise对象的多层嵌套展平。</span></div> + +<div></div> + +<div></div> + +<div class="blockIndicator warning"> +<p>警告：不要在解析为自身的thenable 上调用<code>Promise.resolve</code>。这将导致无限递归，因为它试图展平无限嵌套的promise。一个例子是将它与Angular中的异步管道一起使用。在<a href="https://angular.io/guide/template-syntax#avoid-side-effects">此处</a>了解更多信息。</p> +</div> + +<div>{{EmbedInteractiveExample("pages/js/promise-resolve.html")}}</div> + +<p class="hidden">The source for this interactive demo is stored in a GitHub repository. If you'd like to contribute to the interactive demo project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> and send us a pull request.</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><var>Promise.resolve(value)</var>; +</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt>value</dt> +</dl> + +<p>将被<code>Promise</code>对象解析的参数，也可以是一个<code>Promise</code>对象，或者是一个thenable。</p> + +<h3 id="返回值">返回值</h3> + +<p>返回一个带着给定值解析过的<code>Promise</code>对象，如果参数本身就是一个<code>Promise</code>对象，则直接返回这个<code>Promise</code>对象。</p> + +<h2 id="Description" name="Description">描述</h2> + +<p>静态方法 <code>Promise.resolve</code>返回一个解析过的<code>Promise</code>对象。</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用静态Promise.resolve方法">使用静态<code>Promise.resolve</code>方法</h3> + +<pre class="brush: js">Promise.resolve("Success").then(function(value) { + console.log(value); // "Success" +}, function(value) { + // 不会被调用 +}); +</pre> + +<h3 id="resolve一个数组">resolve一个数组</h3> + +<pre class="brush: js">var p = Promise.resolve([1,2,3]); +p.then(function(v) { + console.log(v[0]); // 1 +}); +</pre> + +<h3 id="resolve另一个promise">resolve另一个promise</h3> + +<pre class="brush: js">var original = Promise.resolve(33); +var cast = Promise.resolve(original); +cast.then(function(value) { + console.log('value: ' + value); +}); +console.log('original === cast ? ' + (original === cast)); + +/* +* 打印顺序如下，这里有一个同步异步先后执行的区别 +* original === cast ? true +* value: 33 +*/</pre> + +<p>日志顺序颠倒其实是由于异步地调用<code>then</code> 方法。在<a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise/then#Return_value">这里</a>查看<code>then</code> 是如何工作的。</p> + +<h3 id="resolve_thenable_并抛出错误">resolve thenable 并抛出错误</h3> + +<pre class="brush: js">// Resolve一个thenable对象 +var p1 = Promise.resolve({ + then: function(onFulfill, onReject) { onFulfill("fulfilled!"); } +}); +console.log(p1 instanceof Promise) // true, 这是一个Promise对象 + +p1.then(function(v) { + console.log(v); // 输出"fulfilled!" + }, function(e) { + // 不会被调用 +}); + +// Thenable在callback之前抛出异常 +// Promise rejects +var thenable = { then: function(resolve) { + throw new TypeError("Throwing"); + resolve("Resolving"); +}}; + +var p2 = Promise.resolve(thenable); +p2.then(function(v) { + // 不会被调用 +}, function(e) { + console.log(e); // TypeError: Throwing +}); + +// Thenable在callback之后抛出异常 +// Promise resolves +var thenable = { then: function(resolve) { + resolve("Resolving"); + throw new TypeError("Throwing"); +}}; + +var p3 = Promise.resolve(thenable); +p3.then(function(v) { + console.log(v); // 输出"Resolving" +}, function(e) { + // 不会被调用 +}); +</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('ES6', '#sec-promise.resolve', 'Promise.resolve')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>ECMA标准中的首次定义</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-promise.resolve', 'Promise.resolve')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.Promise.resolve")}}</p> + +<h2 id="参见">参见</h2> + +<ul> + <li>{{jsxref("Promise")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/promise/then/index.html b/files/zh-cn/web/javascript/reference/global_objects/promise/then/index.html new file mode 100644 index 0000000000..c41a74f379 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/promise/then/index.html @@ -0,0 +1,304 @@ +--- +title: Promise.prototype.then() +slug: Web/JavaScript/Reference/Global_Objects/Promise/then +tags: + - ECMAScript 2015 + - JavaScript + - Promise + - Prototype + - 方法 +translation_of: Web/JavaScript/Reference/Global_Objects/Promise/then +--- +<div>{{JSRef}}</div> + +<p><code><strong>then()</strong></code> 方法返回一个 {{domxref("Promise")}}。它最多需要有两个参数：Promise 的成功和失败情况的回调函数。</p> + +<div>{{EmbedInteractiveExample("pages/js/promise-then.html")}}</div> + +<p class="hidden">The source for this interactive demo is stored in a GitHub repository. If you'd like to contribute to the interactive demo project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> and send us a pull request.</p> + +<div class="note"> +<p>注意：如果忽略针对某个状态的回调函数参数，或者提供非函数 (nonfunction) 参数，那么 <code>then</code> 方法将会丢失关于该状态的回调函数信息，但是并不会产生错误。如果调用 <code>then</code> 的 <code>Promise</code> 的状态（fulfillment 或 rejection）发生改变，但是 <code>then</code> 中并没有关于这种状态的回调函数，那么 <code>then</code> 将创建一个没有经过回调函数处理的新 <code>Promise</code> 对象，这个新 <code>Promise</code> 只是简单地接受调用这个 <code>then</code> 的原 <code>Promise</code> 的终态作为它的终态。</p> +</div> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>p.then(onFulfilled[, onRejected])</var>; + +p.then(value => { + // fulfillment +}, reason => { + // rejection +}); +</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>onFulfilled</code> {{optional_inline}}</dt> + <dd>当 Promise 变成接受状态（fulfilled）时调用的{{jsxref("Function", "函数")}}。该函数有一个参数，即接受的最终结果（the fulfillment value）。如果该参数不是函数，则会在内部被替换为 <code>(x) => x</code>，即原样返回 promise 最终结果的函数</dd> + <dt><code>onRejected</code> {{optional_inline}}</dt> + <dd>当 Promise 变成拒绝状态（rejected）时调用的{{jsxref("Function", "函数")}}。该函数有一个参数，即拒绝的原因（<code>rejection reason</code>）。 如果该参数不是函数，则会在内部被替换为一个 "Thrower" 函数 (it throws an error it received as argument)。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>当一个 {{jsxref("Promise")}} 完成（fulfilled）或者失败（rejected）时，返回函数将被异步调用（由当前的线程循环来调度完成）。具体的返回值依据以下规则返回。如果 <code>then</code> 中的回调函数：</p> + +<ul> + <li>返回了一个值，那么 <code>then</code> 返回的 Promise 将会成为接受状态，并且将返回的值作为接受状态的回调函数的参数值。</li> + <li>没有返回任何值，那么 <code>then</code> 返回的 Promise 将会成为接受状态，并且该接受状态的回调函数的参数值为 <code>undefined</code>。</li> + <li>抛出一个错误，那么 <code>then</code> 返回的 Promise 将会成为拒绝状态，并且将抛出的错误作为拒绝状态的回调函数的参数值。</li> + <li>返回一个已经是接受状态的 Promise，那么 <code>then</code> 返回的 Promise 也会成为接受状态，并且将那个 Promise 的接受状态的回调函数的参数值作为该被返回的Promise的接受状态回调函数的参数值。</li> + <li>返回一个已经是拒绝状态的 Promise，那么 <code>then</code> 返回的 Promise 也会成为拒绝状态，并且将那个 Promise 的拒绝状态的回调函数的参数值作为该被返回的Promise的拒绝状态回调函数的参数值。</li> + <li>返回一个未定状态（<code>pending</code>）的 Promise，那么 <code>then</code> 返回 Promise 的状态也是未定的，并且它的终态与那个 Promise 的终态相同；同时，它变为终态时调用的回调函数参数与那个 Promise 变为终态时的回调函数的参数是相同的。</li> +</ul> + +<p>下面是一个演示<code> then</code> 方法的同步性的例子。</p> + +<pre class="brush: js">// using a resolved promise, the 'then' block will be triggered instantly, +// but its handlers will be triggered asynchronously as demonstrated by the console.logs +const resolvedProm = Promise.resolve(33); + +let thenProm = resolvedProm.then(value => { + console.log("this gets called after the end of the main stack. the value received and returned is: " + value); + return value; +}); +// instantly logging the value of thenProm +console.log(thenProm); + +// using setTimeout we can postpone the execution of a function to the moment the stack is empty +setTimeout(() => { + console.log(thenProm); +}); + + +// 上面的代码会依次返回： +// Promise {[[PromiseStatus]]: "pending", [[PromiseValue]]: undefined} +// "this gets called after the end of the main stack. the value received and returned is: 33" +// Promise {[[PromiseStatus]]: "resolved", [[PromiseValue]]: 33}</pre> + +<h2 id="描述">描述</h2> + +<p>由于 <code>then</code> 和 {{jsxref("Promise.prototype.catch()")}} 方法都会返回 promise，它们可以被<a href="/zh-CN/docs/Web/JavaScript/Guide/Using_promises#Chaining">链式调用</a>——这同时也是一种被称为<strong>复合</strong>（ <em>composition） </em>的操作。</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用_then_方法">使用 <code>then</code> 方法</h3> + +<pre class="brush: js">var p1 = new Promise((resolve, reject) => { + resolve('成功！'); + // or + // reject(new Error("出错了！")); +}); + +p1.then(value => { + console.log(value); // 成功！ +}, reason => { + console.error(reason); // 出错了！ +}); +</pre> + +<h3 id="链式调用">链式调用</h3> + +<p><font face="Open Sans, sans-serif"><code>then</code> 方法返回</font>一个 <code>Promise</code> 对象，其允许方法链。</p> + +<p>你可以传递一个匿名函数给 <code>then</code>，并且，如果它返回一个 <code>Promise</code>，一个等价的 <code>Promise</code> 将暴露给后续的方法链。下面的代码片段使用 <code>setTimout</code> 函数来模拟异步代码操作。</p> + +<pre class="brush: js">Promise.resolve("foo") + // 1. 接收 "foo" 并与 "bar" 拼接，并将其结果做为下一个 resolve 返回。 + .then(function(string) { + return new Promise(function(resolve, reject) { + setTimeout(function() { + string += 'bar'; + resolve(string); + }, 1); + }); + }) + // 2. 接收 "foobar", 放入一个异步函数中处理该字符串 + // 并将其打印到控制台中, 但是不将处理后的字符串返回到下一个。 + .then(function(string) { + setTimeout(function() { + string += 'baz'; + console.log(string); + }, 1) + return string; + }) + // 3. 打印本节中代码将如何运行的帮助消息， + // 字符串实际上是由上一个回调函数之前的那块异步代码处理的。 + .then(function(string) { + console.log("Last Then: oops... didn't bother to instantiate and return " + + "a promise in the prior then so the sequence may be a bit " + + "surprising"); + + // 注意 `string` 这时不会存在 'baz'。 + // 因为这是发生在我们通过setTimeout模拟的异步函数中。 + console.log(string); + }); + +// logs, in order: +// Last Then: oops... didn't bother to instantiate and return a promise in the prior then so the sequence may be a bit surprising +// foobar +// foobarbaz</pre> + +<p>当一个值只是从一个 <code>then</code> 内部返回时，它将等价地返回 <code>Promise.resolve(<由被调用的处理程序返回的值>)</code>。</p> + +<pre class="brush: js">var p2 = new Promise(function(resolve, reject) { + resolve(1); +}); + +p2.then(function(value) { + console.log(value); // 1 + return value + 1; +}).then(function(value) { + console.log(value + ' - A synchronous value works'); +}); + +p2.then(function(value) { + console.log(value); // 1 +}); +</pre> + +<p>如果函数抛出错误或返回一个拒绝的Promise，则 <code>then</code> 将返回一个拒绝的Promise。</p> + +<pre class="brush: js">Promise.resolve() + .then(() => { + // 使 .then() 返回一个 rejected promise + throw new Error('Oh no!'); + }) + .then(() => { + console.log('Not called.'); + }, error => { + console.error('onRejected function called: ' + error.message); + });</pre> + +<p>在其他情况下，一个 resolving Promise 会被返回。在下面的例子里，第一个 <code>then()</code> 会返回一个用 resolving Promise 包装的 <code>42</code>，即使之前的 Promise 是 rejected 的。</p> + +<pre class="brush: js">Promise.reject() + .then(() => 99, () => 42) // onRejected returns 42 which is wrapped in a resolving Promise + .then(solution => console.log('Resolved with ' + solution)); // Resolved with 42</pre> + +<p>实际上，捕获 rejected promise 的需求经常大于使用 <code>then</code> 的两种情况语法，比如下面这样的：</p> + +<pre class="brush: js">Promise.resolve() + .then(() => { + // 使 .then() 返回一个 rejected promise + throw new Error('Oh no!'); + }) + .catch(error => { + console.error('onRejected function called: ' + error.message); + }) + .then(() => { + console.log("I am always called even if the prior then's promise rejects"); + });</pre> + +<p>你也可以在另一个顶层函数上使用链式去实现基于 Promise API 的函数。</p> + +<pre class="brush: js">function fetch_current_data() { + // fetch() API 返回了一个 Promise. + // 这个函数提供了类似的API， + // 这个函数除了实现 Promise，它还能够完成更多的工作。 + return fetch('current-data.json').then(response => { + if (response.headers.get('content-type') != 'application/json') { + throw new TypeError(); + } + var j = response.json(); + // maybe do something with j + return j; // fulfillment value given to user of + // fetch_current_data().then() + }); +} +</pre> + +<p>如果 <code>onFulfilled</code> 返回了一个 promise，<code>then</code> 的返回值就会被 Promise resolved 或者 rejected。</p> + +<pre class="brush: js">function resolveLater(resolve, reject) { + setTimeout(function() { + resolve(10); + }, 1000); +} +function rejectLater(resolve, reject) { + setTimeout(function() { + reject(new Error('Error')); + }, 1000); +} + +var p1 = Promise.resolve('foo'); +var p2 = p1.then(function() { + // Return promise here, that will be resolved to 10 after 1 second + return new Promise(resolveLater); +}); +p2.then(function(v) { + console.log('resolved', v); // "resolved", 10 +}, function(e) { + // not called + console.error('rejected', e); +}); + +var p3 = p1.then(function() { + // Return promise here, that will be rejected with 'Error' after 1 second + return new Promise(rejectLater); +}); +p3.then(function(v) { + // not called + console.log('resolved', v); +}, function(e) { + console.error('rejected', e); // "rejected", 'Error' +}); +</pre> + +<h3 id="基于_promise_的_domxrefwindow.setImmediate_polyfill">基于 promise 的 {{domxref("window.setImmediate")}} polyfill</h3> + +<p>Using a {{jsxref("Function.prototype.bind()")}} <code>Reflect.apply</code> ({{jsxref("Reflect.apply()")}}) method to create a (non-cancellable) setImmediate-style function.</p> + +<pre class="brush: js">const nextTick = (() => { + const noop = () => {}; // literally + const nextTickPromise = () => Promise.resolve().then(noop); + + const rfab = Reflect.apply.bind; // (thisArg, fn, thisArg, [...args]) + const nextTick = (fn, ...args) => ( + fn !== undefined + ? Promise.resolve(args).then(rfab(null, fn, null)) + : nextTickPromise(), + undefined + ); + nextTick.ntp = nextTickPromise; + + return nextTick; +})(); +</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>{{SpecName('ES2015', '#sec-promise.prototype.then', 'Promise.prototype.then')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>ECMA 标准中的首次定义。</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-promise.prototype.then', 'Promise.prototype.then')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p class="hidden">To contribute to this compatibility data, please write a pull request against this repository: <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>.</p> + +<p>{{Compat("javascript.builtins.Promise.then")}}</p> + +<h2 id="参见">参见</h2> + +<ul> + <li>{{jsxref("Promise")}}</li> + <li>{{jsxref("Promise.prototype.catch()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/proxy/handler/apply/index.html b/files/zh-cn/web/javascript/reference/global_objects/proxy/handler/apply/index.html new file mode 100644 index 0000000000..62b8b67f5f --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/proxy/handler/apply/index.html @@ -0,0 +1,117 @@ +--- +title: handler.apply() +slug: Web/JavaScript/Reference/Global_Objects/Proxy/handler/apply +tags: + - ECMAScript6 + - JavaScript + - Method + - Proxy +translation_of: Web/JavaScript/Reference/Global_Objects/Proxy/Proxy/apply +--- +<div>{{JSRef}}</div> + +<p><strong><code>handler.apply()</code></strong> 方法用于拦截函数的调用。</p> + +<div>{{EmbedInteractiveExample("pages/js/proxyhandler-apply.html", "taller")}}</div> + +<p class="hidden">此交互式示例的源代码存储在GitHub存储库中。 如果您想为交互式示例项目做出贡献，请克隆 <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> 并向我们发起拉取请求</p> + +<h2 id="语法">语法</h2> + +<pre class="brush: js">var p = new Proxy(target, { + apply: function(target, thisArg, argumentsList) { + } +}); +</pre> + +<h3 id="参数">参数</h3> + +<p>以下是传递给apply方法的参数，<code>this上下文绑定在</code>handler对象上.</p> + +<dl> + <dt><code>target</code></dt> + <dd>目标对象（函数）。</dd> + <dt><code>thisArg</code></dt> + <dd>被调用时的上下文对象。</dd> + <dt><code>argumentsList</code></dt> + <dd>被调用时的参数数组。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p><code>apply方法可以返回任何值。</code></p> + +<h2 id="描述">描述</h2> + +<p><strong><code>handler.apply</code></strong> 方法用于拦截函数的调用。</p> + +<h3 id="拦截">拦截</h3> + +<p>该方法会拦截目标对象的以下操作:</p> + +<ul> + <li><code>proxy(...args)</code></li> + <li>{{jsxref("Function.prototype.apply()")}} 和 {{jsxref("Function.prototype.call()")}}</li> + <li>{{jsxref("Reflect.apply()")}}</li> +</ul> + +<h3 id="约束">约束</h3> + +<p>如果违反了以下约束，代理将抛出一个TypeError：</p> + +<p><code>target</code>必须是可被调用的。也就是说，它必须是一个函数对象。</p> + +<h2 id="示例">示例</h2> + +<p>以下代码演示如何捕获函数的调用。</p> + +<pre class="brush: js">var p = new Proxy(function() {}, { + apply: function(target, thisArg, argumentsList) { + console.log('called: ' + argumentsList.join(', ')); + return argumentsList[0] + argumentsList[1] + argumentsList[2]; + } +}); + +console.log(p(1, 2, 3)); // "called: 1, 2, 3" + // 6 +</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-call-thisargument-argumentslist', '[[Call]]')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-proxy-object-internal-methods-and-internal-slots-call-thisargument-argumentslist', '[[Call]]')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> +<div class="hidden">此页面上的兼容性表格由结构化数据生成。 如果您想为数据做出贡献，请检出 <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> 并向我们发出拉取请求。</div> + +<p>{{Compat("javascript.builtins.Proxy.handler.apply")}}</p> +</div> + +<h2 id="另见">另见</h2> + +<ul> + <li>{{jsxref("Proxy")}}</li> + <li>{{jsxref("Proxy.handler", "handler")}}</li> + <li>{{jsxref("Function.prototype.apply")}}</li> + <li>{{jsxref("Function.prototype.call")}}</li> + <li>{{jsxref("Reflect.apply()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/proxy/handler/construct/index.html b/files/zh-cn/web/javascript/reference/global_objects/proxy/handler/construct/index.html new file mode 100644 index 0000000000..209e9752e3 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/proxy/handler/construct/index.html @@ -0,0 +1,130 @@ +--- +title: handler.construct() +slug: Web/JavaScript/Reference/Global_Objects/Proxy/handler/construct +translation_of: Web/JavaScript/Reference/Global_Objects/Proxy/Proxy/construct +--- +<div>{{JSRef}}</div> + +<p><code><strong>handler.construct()</strong></code> 方法用于拦截{{jsxref("Operators/new", "new")}} 操作符. 为了使new操作符在生成的Proxy对象上生效，用于初始化代理的目标对象自身必须具有[[Construct]]内部方法（即 <code>new target</code> 必须是有效的）。</p> + +<p>{{EmbedInteractiveExample("pages/js/proxyhandler-construct.html", "taller")}}</p> + +<h2 id="语法">语法</h2> + +<pre class="brush: js">var p = new Proxy(target, { + construct: function(target, argumentsList, newTarget) { + } +}); +</pre> + +<h3 id="参数">参数</h3> + +<p>下面的参数将会传递给<code>construct</code>方法，<code>this</code>绑定在handler上。</p> + +<dl> + <dt><code>target</code></dt> + <dd>目标对象。</dd> + <dt><code>argumentsList</code></dt> + <dd>constructor的参数列表。</dd> + <dt><code>newTarget</code></dt> + <dd>最初被调用的构造函数，就上面的例子而言是p。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p><code>construct</code> 方法必须返回一个对象。</p> + +<h2 id="描述">描述</h2> + +<p><code><strong>handler.construct()</strong></code> 方法用于拦截 {{jsxref("Operators/new", "new")}}操作符。</p> + +<h3 id="拦截">拦截</h3> + +<p>该拦截器可以拦截以下操作:</p> + +<ul> + <li><code>new proxy(...args)</code></li> + <li>{{jsxref("Reflect.construct()")}}</li> +</ul> + +<h3 id="约束">约束</h3> + +<p>如果违反以下约定，代理将会抛出错误 {{jsxref("TypeError")}}:</p> + +<ul> + <li>必须返回一个对象.</li> +</ul> + +<h2 id="示例">示例</h2> + +<p>下面代码演示如何拦截 {{jsxref("Operators/new", "new")}} 操作。</p> + +<pre class="brush: js">var p = new Proxy(function() {}, { + construct: function(target, argumentsList, newTarget) { + console.log('called: ' + argumentsList.join(', ')); + return { value: argumentsList[0] * 10 }; + } +}); + +console.log(new p(1).value); // "called: 1" + // 10 +</pre> + +<p>下面的代码违反了约定.</p> + +<pre class="brush: js">var p = new Proxy(function() {}, { + construct: function(target, argumentsList, newTarget) { + return 1; + } +}); + +new p(); // TypeError is thrown +</pre> + +<p>下面的代码未能正确的初始化Proxy。Proxy初始化时，传给它的<code>target</code> 必须具有一个有效的constructor供<code>new</code>操作符调用。</p> + +<pre class="brush: js">var p = new Proxy({}, { + construct: function(target, argumentsList, newTarget) { + return {}; + } +}); + +new p(); // TypeError is thrown, "p" is not a constructor +</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-construct-argumentslist-newtarget', '[[Construct]]')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-proxy-object-internal-methods-and-internal-slots-construct-argumentslist-newtarget', '[[Construct]]')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div>{{Compat("javascript.builtins.Proxy.handler.construct")}}</div> + +<div id="compat-mobile"> </div> + +<h2 id="相关主题">相关主题</h2> + +<ul> + <li>{{jsxref("Proxy")}}</li> + <li>{{jsxref("Proxy.handler", "handler")}}</li> + <li>{{jsxref("Operators/new", "new")}} operator.</li> + <li>{{jsxref("Reflect.construct()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/proxy/handler/defineproperty/index.html b/files/zh-cn/web/javascript/reference/global_objects/proxy/handler/defineproperty/index.html new file mode 100644 index 0000000000..9912e043a0 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/proxy/handler/defineproperty/index.html @@ -0,0 +1,181 @@ +--- +title: handler.defineProperty() +slug: Web/JavaScript/Reference/Global_Objects/Proxy/handler/defineProperty +translation_of: Web/JavaScript/Reference/Global_Objects/Proxy/Proxy/defineProperty +--- +<div>{{JSRef}}</div> + +<p><strong><code>handler.defineProperty()</code></strong> 用于拦截对对象的 {{jsxref("Object.defineProperty()")}} 操作。</p> + +<h2 id="语法">语法</h2> + +<pre class="brush: js">var p = new Proxy(target, { + defineProperty: function(target, property, descriptor) { + } +}); +</pre> + +<h3 id="参数">参数</h3> + +<p>下列参数将会被传递给 <code>defineProperty</code> 方法。<code> this</code> 绑定在 handler 对象上。</p> + +<dl> + <dt><code>target</code></dt> + <dd>目标对象。</dd> + <dt><code>property</code></dt> + <dd>待检索其描述的属性名。</dd> + <dt><code>descriptor</code></dt> + <dd>待定义或修改的属性的描述符。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p><code>defineProperty</code> 方法必须以一个 {{jsxref("Boolean")}} 返回，表示定义该属性的操作成功与否。</p> + +<h2 id="描述">描述</h2> + +<p><code><strong>handler.defineProperty()</strong></code> 用于拦截对对象的 {{jsxref("Object.defineProperty()")}} 操作。</p> + +<h3 id="拦截">拦截</h3> + +<p>该方法会拦截目标对象的以下操作 :</p> + +<ul> + <li>{{jsxref("Object.defineProperty()")}}</li> + <li>{{jsxref("Reflect.defineProperty()")}}</li> + <li>{{jsxref("proxy.property='value'")}}</li> +</ul> + +<h3 id="不变量">不变量</h3> + +<p>如果违背了以下的不变量，proxy会抛出 {{jsxref("TypeError")}}:</p> + +<ul> + <li>如果目标对象不可扩展， 将不能添加属性。</li> + <li>不能添加或者修改一个属性为不可配置的，如果它不作为一个目标对象的不可配置的属性存在的话。</li> + <li>如果目标对象存在一个对应的可配置属性，这个属性可能不会是不可配置的。</li> + <li>如果一个属性在目标对象中存在对应的属性，那么 <code>Object.defineProperty(target, prop, descriptor)</code> 将不会抛出异常。</li> + <li>在严格模式下， <code>false</code> 作为<code> handler.defineProperty</code> 方法的返回值的话将会抛出 {{jsxref("TypeError")}} 异常.</li> +</ul> + +<h2 id="示例">示例</h2> + +<p>以下代码演示如何拦截对目标对象的 {{jsxref("Object.defineProperty()")}} 操作。</p> + +<pre class="brush: js">var p = new Proxy({}, { + defineProperty: function(target, prop, descriptor) { + console.log('called: ' + prop); + return true; + } +}); + +var desc = { configurable: true, enumerable: true, value: 10 }; +Object.defineProperty(p, 'a', desc); // "called: a" +</pre> + +<p>当调用 {{jsxref("Object.defineProperty()")}} 或者 {{jsxref("Reflect.defineProperty()")}}，传递给 <code>defineProperty</code> 的 <code>descriptor</code> 有一个限制 - 只有以下属性才有用，非标准的属性将会被无视 :</p> + +<ul> + <li><code>enumerable</code></li> + <li><code>configurable</code></li> + <li><code>writable</code></li> + <li><code>value</code></li> + <li><code>get</code></li> + <li><code>set</code></li> +</ul> + +<pre class="brush: js">var p = new Proxy({}, { + defineProperty(target, prop, descriptor) { + console.log(descriptor); + return Reflect.defineProperty(target, prop, descriptor); + } +}); + +Object.defineProperty(p, 'name', { + value: 'proxy', + type: 'custom' +}); // { value: 'proxy' } +</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-defineownproperty-p-desc', '[[DefineOwnProperty]]')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-proxy-object-internal-methods-and-internal-slots-defineownproperty-p-desc', '[[DefineOwnProperty]]')}}</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("Object.defineProperty()")}}</li> + <li>{{jsxref("Reflect.defineProperty()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/proxy/handler/deleteproperty/index.html b/files/zh-cn/web/javascript/reference/global_objects/proxy/handler/deleteproperty/index.html new file mode 100644 index 0000000000..6cb4255755 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/proxy/handler/deleteproperty/index.html @@ -0,0 +1,149 @@ +--- +title: handler.deleteProperty() +slug: Web/JavaScript/Reference/Global_Objects/Proxy/handler/deleteProperty +translation_of: Web/JavaScript/Reference/Global_Objects/Proxy/Proxy/deleteProperty +--- +<div>{{JSRef}}</div> + +<p><strong><code>handler.deleteProperty()</code></strong> 方法用于拦截对对象属性的 {{jsxref("Operators/delete", "delete")}} 操作。</p> + +<h2 id="语法">语法</h2> + +<pre class="brush: js">var p = new Proxy(target, { + deleteProperty: function(target, property) { + } +}); +</pre> + +<h3 id="参数">参数</h3> + +<p><code>deleteProperty</code> 方法将会接受以下参数。 <code>this</code> 被绑定在 handler上。</p> + +<dl> + <dt><code>target</code></dt> + <dd>目标对象。</dd> + <dt><code>property</code></dt> + <dd>待删除的属性名。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p><code>deleteProperty</code> 必须返回一个 {{jsxref("Boolean")}} 类型的值，表示了该属性是否被成功删除。</p> + +<h2 id="描述">描述</h2> + +<p><code><strong>handler.deleteProperty()</strong></code> 方法可以拦截 {{jsxref("Operators/delete", "delete")}} 操作。</p> + +<h3 id="拦截">拦截</h3> + +<p>该方法会拦截以下操作:</p> + +<ul> + <li>删除属性: <code>delete proxy[foo]</code> 和 <code>delete proxy.foo</code></li> + <li>{{jsxref("Reflect.deleteProperty()")}}</li> +</ul> + +<h3 id="不变量">不变量</h3> + +<p>如果违背了以下不变量，proxy 将会抛出一个 {{jsxref("TypeError")}}:</p> + +<ul> + <li>如果目标对象的属性是不可配置的，那么该属性不能被删除。</li> +</ul> + +<h2 id="示例">示例</h2> + +<p>以下代码演示了对 {{jsxref("Operators/delete", "delete")}} 操作的拦截。</p> + +<pre class="brush: js">var p = new Proxy({}, { + deleteProperty: function(target, prop) { + console.log('called: ' + prop); + return true; + } +}); + +delete p.a; // "called: a" +</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-delete-p', '[[Delete]]')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-proxy-object-internal-methods-and-internal-slots-delete-p', '[[Delete]]')}}</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("Operators/delete", "delete")}} 操作符</li> + <li>{{jsxref("Reflect.deleteProperty()")}}</li> +</ul> 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> diff --git a/files/zh-cn/web/javascript/reference/global_objects/proxy/handler/getownpropertydescriptor/index.html b/files/zh-cn/web/javascript/reference/global_objects/proxy/handler/getownpropertydescriptor/index.html new file mode 100644 index 0000000000..470b2c6ad9 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/proxy/handler/getownpropertydescriptor/index.html @@ -0,0 +1,168 @@ +--- +title: handler.getOwnPropertyDescriptor() +slug: Web/JavaScript/Reference/Global_Objects/Proxy/handler/getOwnPropertyDescriptor +translation_of: Web/JavaScript/Reference/Global_Objects/Proxy/Proxy/getOwnPropertyDescriptor +--- +<div>{{JSRef}}</div> + +<p><strong><code>handler.getOwnPropertyDescriptor()</code></strong> 方法是 {{jsxref("Object.getOwnPropertyDescriptor()")}} 的钩子。</p> + +<h2 id="语法">语法</h2> + +<pre class="brush: js">var p = new Proxy(target, { + getOwnPropertyDescriptor: function(target, prop) { + } +}); +</pre> + +<h3 id="参数">参数</h3> + +<p><code>下列参数会被传入 getOwnPropertyDescriptor</code> 方法中。这是绑定到handler上。 </p> + +<dl> + <dt><code>target</code></dt> + <dd>目标对象。</dd> + <dt><code>prop</code></dt> + <dd>返回属性名称的描述。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p><code>getOwnPropertyDescriptor</code> 方法必须返回一个 object 或 <code>undefined</code>。</p> + +<h2 id="描述">描述</h2> + +<p><code><strong>handler.getOwnPropertyDescriptor()</strong></code> 方法是 {{jsxref("Object.getOwnPropertyDescriptor()")}} 的陷阱。</p> + +<h3 id="拦截">拦截</h3> + +<p>这个陷阱可以拦截这些操作：</p> + +<ul> + <li>{{jsxref("Object.getOwnPropertyDescriptor()")}}</li> + <li>{{jsxref("Reflect.getOwnPropertyDescriptor()")}}</li> +</ul> + +<h3 id="不变量">不变量</h3> + +<p>如果下列不变量被违反，代理将抛出一个 {{jsxref("TypeError")}}：</p> + +<ul> + <li><code>getOwnPropertyDescriptor</code> 必须返回一个 object 或 <code>undefined</code>。</li> + <li>如果属性作为目标对象的不可配置的属性存在，则该属性无法报告为不存在。</li> + <li>如果属性作为目标对象的属性存在，并且目标对象不可扩展，则该属性无法报告为不存在。</li> + <li>如果属性不存在作为目标对象的属性，并且目标对象不可扩展，则不能将其报告为存在。</li> + <li>属性不能被报告为不可配置，如果它不作为目标对象的自身属性存在，或者作为目标对象的可配置的属性存在。</li> + <li>Object.getOwnPropertyDescriptor（target）的结果可以使用 Object.defineProperty 应用于目标对象，也不会抛出异常。</li> +</ul> + +<h2 id="示例">示例</h2> + +<p>以下是 {{jsxref("Object.getOwnPropertyDescriptor()")}} 的代码陷阱：</p> + +<pre class="brush: js">var p = new Proxy({ a: 20}, { + getOwnPropertyDescriptor: function(target, prop) { + console.log('called: ' + prop); + return { configurable: true, enumerable: true, value: 10 }; + } +}); + +console.log(Object.getOwnPropertyDescriptor(p, 'a').value); // "called: a" + // 10 +</pre> + +<p>以下代码则违反了不变量。</p> + +<pre class="brush: js">var obj = { a: 10 }; +Object.preventExtensions(obj); +var p = new Proxy(obj, { + getOwnPropertyDescriptor: function(target, prop) { + return undefined; + } +}); + +Object.getOwnPropertyDescriptor(p, 'a'); // TypeError is thrown +</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-getownproperty-p', '[[GetOwnProperty]]')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-proxy-object-internal-methods-and-internal-slots-getownproperty-p', '[[GetOwnProperty]]')}}</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("Object.getOwnPropertyDescriptor()")}}</li> + <li>{{jsxref("Reflect.getOwnPropertyDescriptor()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/proxy/handler/getprototypeof/index.html b/files/zh-cn/web/javascript/reference/global_objects/proxy/handler/getprototypeof/index.html new file mode 100644 index 0000000000..215d2d9646 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/proxy/handler/getprototypeof/index.html @@ -0,0 +1,141 @@ +--- +title: handler.getPrototypeOf() +slug: Web/JavaScript/Reference/Global_Objects/Proxy/handler/getPrototypeOf +tags: + - ECMAScript 2015 + - JavaScript + - Method + - Proxy + - 方法 +translation_of: Web/JavaScript/Reference/Global_Objects/Proxy/Proxy/getPrototypeOf +--- +<div>{{JSRef("Global_Objects", "Proxy")}}</div> + +<p><strong><code>handler.getPrototypeOf()</code></strong> 是一个代理（Proxy）方法，当读取代理对象的原型时，该方法就会被调用。</p> + +<div>{{EmbedInteractiveExample("pages/js/proxyhandler-getprototypeof.html", "taller")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="brush: js">const <var>p</var> = new Proxy(<var>obj</var>, { + getPrototypeOf(<var>target</var>) { + ... + } +}); +</pre> + +<h3 id="参数">参数</h3> + +<p>当 <code>getPrototypeOf</code> 方法被调用时，<code>this</code> 指向的是它所属的处理器对象。</p> + +<dl> + <dt><code>target</code></dt> + <dd>被代理的目标对象。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p><code>getPrototypeOf</code> 方法的返回值必须是一个对象或者 <code>null</code>。</p> + +<h2 id="描述">描述</h2> + +<p>在 JavaScript 中，下面这五种操作（方法/属性/运算符）可以触发 JS 引擎读取一个对象的原型，也就是可以触发 <code>getPrototypeOf()</code> 代理方法的运行：</p> + +<ul> + <li>{{jsxref("Object.getPrototypeOf()")}}</li> + <li>{{jsxref("Reflect.getPrototypeOf()")}}</li> + <li>{{jsxref("Object/proto", "__proto__")}}</li> + <li>{{jsxref("Object.prototype.isPrototypeOf()")}}</li> + <li>{{jsxref("Operators/instanceof", "instanceof")}}</li> +</ul> + +<p>如果遇到了下面两种情况，JS 引擎会抛出 {{jsxref("TypeError")}} 异常：</p> + +<ul> + <li><code>getPrototypeOf()</code> 方法返回的不是对象也不是 <code>null。</code></li> + <li>目标对象是不可扩展的，且 <code>getPrototypeOf()</code> 方法返回的原型不是目标对象本身的原型。</li> +</ul> + +<h2 id="示例">示例</h2> + +<h3 id="基本用法">基本用法</h3> + +<pre class="brush: js">var obj = {}; +var proto = {}; +var handler = { + getPrototypeOf(target) { + console.log(target === obj); // true + console.log(this === handler); // true + return proto; + } +}; + +var p = new Proxy(obj, handler); +console.log(Object.getPrototypeOf(p) === proto); // true +</pre> + +<h3 id="5_种触发_getPrototypeOf_代理方法的方式">5 种触发 getPrototypeOf 代理方法的方式</h3> + +<pre class="brush: js">var obj = {}; +var p = new Proxy(obj, { + getPrototypeOf(target) { + return Array.prototype; + } +}); +console.log( + Object.getPrototypeOf(p) === Array.prototype, // true + Reflect.getPrototypeOf(p) === Array.prototype, // true + p.__proto__ === Array.prototype, // true + Array.prototype.isPrototypeOf(p), // true + p instanceof Array // true +); +</pre> + +<h3 id="两种情况下的异常">两种情况下的异常</h3> + +<pre class="brush: js">var obj = {}; +var p = new Proxy(obj, { + getPrototypeOf(target) { + return "foo"; + } +}); +Object.getPrototypeOf(p); // TypeError: "foo" is not an object or null + +var obj = Object.preventExtensions({}); +var p = new Proxy(obj, { + getPrototypeOf(target) { + return {}; + } +}); +Object.getPrototypeOf(p); // TypeError: expected same prototype value +</pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范</th> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-proxy-object-internal-methods-and-internal-slots-getprototypeof', '[[GetPrototypeOf]]')}}</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.Proxy.handler.getPrototypeOf")}}</p> + +<h2 id="参见">参见</h2> + +<ul> + <li>{{jsxref("Proxy")}}</li> + <li>{{jsxref("Proxy.handler", "handler")}}</li> + <li>{{jsxref("Object.getPrototypeOf()")}}</li> + <li>{{jsxref("Reflect.getPrototypeOf()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/proxy/handler/has/index.html b/files/zh-cn/web/javascript/reference/global_objects/proxy/handler/has/index.html new file mode 100644 index 0000000000..fead0846ff --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/proxy/handler/has/index.html @@ -0,0 +1,176 @@ +--- +title: handler.has() +slug: Web/JavaScript/Reference/Global_Objects/Proxy/handler/has +translation_of: Web/JavaScript/Reference/Global_Objects/Proxy/Proxy/has +--- +<div>{{JSRef}}</div> + +<p> <strong><code>handler.has()</code></strong> 方法是针对 {{jsxref("Operators/in", "in")}} 操作符的代理方法。</p> + + + + + +<p>{{EmbedInteractiveExample("pages/js/proxyhandler-has.html", "taller")}}</p> + + + + + +<h2 id="语法">语法</h2> + +<pre class="brush: js">var p = new Proxy(target, { + has: function(target, prop) { + } +}); +</pre> + +<h3 id="参数">参数</h3> + +<p><code>下面是传递给 has</code> 方法的参数. <code>this</code> is bound to the handler.</p> + +<dl> + <dt><code>target</code></dt> + <dd>目标对象.</dd> + <dt><code>prop</code></dt> + <dd>需要检查是否存在的属性.</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p><code>has</code> 方法返回一个 boolean 属性的值.</p> + +<h2 id="描述">描述</h2> + +<p><code><strong>handler.has</strong></code> 方法可以看作是针对 {{jsxref("Operators/in", "in")}} 操作的钩子.</p> + +<h3 id="拦截">拦截</h3> + +<p>这个钩子可以拦截下面这些操作:</p> + +<ul> + <li>属性查询: <code>foo in proxy</code></li> + <li>继承属性查询: <code>foo in Object.create(proxy)</code></li> + <li><code>with</code> 检查<code>: with(proxy) { (foo); }</code></li> + <li>{{jsxref("Reflect.has()")}}</li> +</ul> + +<h3 id="约束">约束</h3> + +<p>如果违反了下面这些规则, proxy 将会抛出 {{jsxref("TypeError")}}:</p> + +<ul> + <li>如果目标对象的某一属性本身不可被配置，则该属性不能够被代理隐藏.</li> + <li>如果目标对象为不可扩展对象，则该对象的属性不能够被代理隐藏</li> +</ul> + +<h2 id="示例">示例</h2> + +<p>下面的代码拦截了 {{jsxref("Operators/in", "in")}} 操作符.</p> + +<pre class="brush: js">var p = new Proxy({}, { + has: function(target, prop) { + console.log('called: ' + prop); + return true; + } +}); + +console.log('a' in p); // "called: a" + // true +</pre> + +<p>下面的代码违反了约束.</p> + +<pre class="brush: js">var obj = { a: 10 }; +Object.preventExtensions(obj); +var p = new Proxy(obj, { + has: function(target, prop) { + return false; + } +}); + +'a' in p; // TypeError is thrown +</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-hasproperty-p', '[[HasProperty]]')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-proxy-object-internal-methods-and-internal-slots-hasproperty-p', '[[HasProperty]]')}}</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("Operators/in", "in")}} operator</li> + <li>{{jsxref("Reflect.has()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/proxy/handler/index.html b/files/zh-cn/web/javascript/reference/global_objects/proxy/handler/index.html new file mode 100644 index 0000000000..7cbefe2838 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/proxy/handler/index.html @@ -0,0 +1,76 @@ +--- +title: Proxy handler +slug: Web/JavaScript/Reference/Global_Objects/Proxy/handler +tags: + - ECMAScript 2015 + - JavaScript + - Proxy +translation_of: Web/JavaScript/Reference/Global_Objects/Proxy/Proxy +--- +<div>{{JSRef}}</div> + +<div>Proxy 的 handler 对象是一个占位符对象，它包含了用于 {{jsxref("Proxy")}} 的陷阱（Trap）函数。</div> + +<div>此处可以理解为由Proxy所暴露出的钩子函数，handler作为挂载钩子函数的对象存在，不同的操作会触发不同的钩子函数</div> + +<div>，handler提供了覆写钩子函数的方法。</div> + +<h2 id="方法">方法</h2> + +<p>所有的陷阱是可选的。如果某个陷阱没有定义，那么就会保留默认行为。</p> + +<dl> + <dt>{{jsxref("Global_Objects/Proxy/handler/getPrototypeOf", "handler.getPrototypeOf()")}}</dt> + <dd>在读取代理对象的原型时触发该操作，比如在执行 <code>{{jsxref("Object.getPrototypeOf")}}(proxy)</code> 时。</dd> + <dt>{{jsxref("Global_Objects/Proxy/handler/setPrototypeOf", "handler.setPrototypeOf()")}}</dt> + <dd>在设置代理对象的原型时触发该操作，比如在执行 <code>{{jsxref("Object.setPrototypeOf")}}(proxy, null)</code> 时。</dd> + <dt>{{jsxref("Global_Objects/Proxy/handler/isExtensible", "handler.isExtensible()")}}</dt> + <dd>在判断一个代理对象是否是可扩展时触发该操作，比如在执行 <code>{{jsxref("Object.isExtensible")}}(proxy)</code> 时。</dd> + <dt>{{jsxref("Global_Objects/Proxy/handler/preventExtensions", "handler.preventExtensions()")}}</dt> + <dd>在让一个代理对象不可扩展时触发该操作，比如在执行 <code>{{jsxref("Object.preventExtensions")}}(proxy)</code> 时。</dd> + <dt>{{jsxref("Global_Objects/Proxy/handler/getOwnPropertyDescriptor", "handler.getOwnPropertyDescriptor()")}}</dt> + <dd>在获取代理对象某个属性的属性描述时触发该操作，比如在执行 <code>{{jsxref("Object.getOwnPropertyDescriptor")}}(proxy, "foo")</code> 时。</dd> + <dt>{{jsxref("Global_Objects/Proxy/handler/defineProperty", "handler.defineProperty()")}}</dt> + <dd>在定义代理对象某个属性时的属性描述时触发该操作，比如在执行 <code>{{jsxref("Object.defineProperty")}}(proxy, "foo", {})</code> 时。</dd> + <dt>{{jsxref("Global_Objects/Proxy/handler/has", "handler.has()")}}</dt> + <dd>在判断代理对象是否拥有某个属性时触发该操作，比如在执行 <code>"foo" {{jsxref("Operators/in", "in")}} proxy</code> 时。</dd> + <dt>{{jsxref("Global_Objects/Proxy/handler/get", "handler.get()")}}</dt> + <dd>在读取代理对象的某个属性时触发该操作，比如在执行 <code>proxy.foo</code> 时。</dd> + <dt>{{jsxref("Global_Objects/Proxy/handler/set", "handler.set()")}}</dt> + <dd>在给代理对象的某个属性赋值时触发该操作，比如在执行 <code>proxy.foo = 1</code> 时。</dd> + <dt>{{jsxref("Global_Objects/Proxy/handler/deleteProperty", "handler.deleteProperty()")}}</dt> + <dd>在删除代理对象的某个属性时触发该操作，即使用 {{jsxref("Operators/delete", "delete")}} 运算符，比如在执行 <code>delete proxy.foo</code> 时。</dd> + <dt>{{jsxref("Global_Objects/Proxy/handler/ownKeys", "handler.ownKeys()")}}</dt> + <dd>{{jsxref("Object.getOwnPropertyNames")}} 和{{jsxref("Object.getOwnPropertySymbols")}} 的陷阱。</dd> + <dt>{{jsxref("Global_Objects/Proxy/handler/apply", "handler.apply()")}}</dt> + <dd>函数调用操作的陷阱。</dd> + <dt>{{jsxref("Global_Objects/Proxy/handler/construct", "handler.construct()")}}</dt> + <dd>{{jsxref("Operators/new", "new")}} 运算符的陷阱。</dd> +</dl> + +<p>一些不标准的陷阱已经<a href="/zh-CN/docs/Web/JavaScript/Reference/Deprecated_and_obsolete_features#Proxy">废弃并且被移除了</a></p> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范</th> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-proxy-object-internal-methods-and-internal-slots', 'Proxy Object Internal Methods and Internal Slots')}}</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.Proxy.handler")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{JSxRef("Proxy")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/proxy/handler/isextensible/index.html b/files/zh-cn/web/javascript/reference/global_objects/proxy/handler/isextensible/index.html new file mode 100644 index 0000000000..7be418197f --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/proxy/handler/isextensible/index.html @@ -0,0 +1,123 @@ +--- +title: handler.isExtensible() +slug: Web/JavaScript/Reference/Global_Objects/Proxy/handler/isExtensible +tags: + - ECMAScript 2015 + - JavaScript + - Method + - Proxy +translation_of: Web/JavaScript/Reference/Global_Objects/Proxy/Proxy/isExtensible +--- +<div>{{JSRef}}<br> +<strong>handler.isExtensible() </strong>方法用于拦截对对象的Object.isExtensible()。</div> + +<div> +<p>{{EmbedInteractiveExample("pages/js/proxyhandler-isextensible.html", "taller")}}</p> +</div> + +<h2 id="语法">语法</h2> + +<pre class="brush: js">var p = new Proxy(target, { + isExtensible: function(target) { + } +}); +</pre> + +<h3 id="参数">参数</h3> + +<p>下列参数将会被传递给 <code>isExtensible</code>方法。 this 绑定在 handler 对象上。</p> + +<dl> + <dt><code>target</code></dt> + <dd>目标对象。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p><code>isExtensible</code>方法必须返回一个 Boolean值或可转换成Boolean的值。</p> + +<h2 id="描述">描述</h2> + +<p>handler.isExtensible()用于拦截对对象的Object.isExtensible()。</p> + +<h3 id="拦截">拦截</h3> + +<p>该方法会拦截目标对象的以下操作:</p> + +<ul> + <li>{{jsxref("Object.isExtensible()")}}</li> + <li>{{jsxref("Reflect.isExtensible()")}}</li> +</ul> + +<h3 id="约束">约束</h3> + +<p>如果违背了以下的约束，proxy会抛出 TypeError:</p> + +<ul> + <li><code>Object.isExtensible(proxy)</code> 必须同<code>Object.isExtensible(target)</code>返回相同值。也就是必须返回true或者为true的值,返回false和为false的值都会报错。</li> +</ul> + +<h2 id="示例">示例</h2> + +<p>以下代码演示{{jsxref("Object.isExtensible()")}}.</p> + +<pre class="brush: js">var p = new Proxy({}, { + isExtensible: function(target) { + console.log('called'); + return true;//也可以return 1;等表示为true的值 + } +}); + +console.log(Object.isExtensible(p)); // "called" + // true +</pre> + +<p>以下代码演示违反约束的情况。</p> + +<pre class="brush: js">var p = new Proxy({}, { + isExtensible: function(target) { + return false;//return 0;return NaN等都会报错 + } +}); + +Object.isExtensible(p); // TypeError is thrown +</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-isextensible', '[[IsExtensible]]')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-proxy-object-internal-methods-and-internal-slots-isextensible', '[[IsExtensible]]')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> + + +<p>{{Compat("javascript.builtins.Proxy.handler.isExtensible")}}</p> +</div> + +<h2 id="另见">另见</h2> + +<ul> + <li>{{jsxref("Proxy")}}</li> + <li>{{jsxref("Proxy.handler", "handler")}}</li> + <li>{{jsxref("Object.isExtensible()")}}</li> + <li>{{jsxref("Reflect.isExtensible()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/proxy/handler/ownkeys/index.html b/files/zh-cn/web/javascript/reference/global_objects/proxy/handler/ownkeys/index.html new file mode 100644 index 0000000000..956b908375 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/proxy/handler/ownkeys/index.html @@ -0,0 +1,193 @@ +--- +title: handler.ownKeys() +slug: Web/JavaScript/Reference/Global_Objects/Proxy/handler/ownKeys +translation_of: Web/JavaScript/Reference/Global_Objects/Proxy/Proxy/ownKeys +--- +<div>{{JSRef}}</div> + +<p><strong><code>handler.ownKeys()</code></strong> 方法用于拦截 {{jsxref("Reflect.ownKeys()")}}.</p> + + + +<p>{{EmbedInteractiveExample("pages/js/proxyhandler-ownkeys.html", "taller")}}</p> + + + +<h2 id="语法">语法</h2> + +<pre class="brush: js">var p = new Proxy(target, { + ownKeys: function(target) { + } +}); +</pre> + +<h3 id="参数">参数</h3> + +<p>下面的参数被传递给<code>ownKeys。this</code>被绑定在<code>handler上。</code></p> + +<dl> + <dt><code>target</code></dt> + <dd>目标对象.</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p><code>ownKeys</code> 方法必须返回一个可枚举对象.</p> + +<h2 id="描述">描述</h2> + +<p><code><strong>handler.ownKeys()</strong></code> 方法用于拦截 {{jsxref("Reflect.ownKeys()")}}.</p> + +<h3 id="拦截">拦截</h3> + +<p>该拦截器可以拦截以下操作::</p> + +<ul> + <li>{{jsxref("Object.getOwnPropertyNames()")}}</li> + <li>{{jsxref("Object.getOwnPropertySymbols()")}}</li> + <li>{{jsxref("Object.keys()")}}</li> + <li>{{jsxref("Reflect.ownKeys()")}}</li> +</ul> + +<h3 id="约束">约束</h3> + +<p>如果违反了下面的约束，proxy将抛出错误 {{jsxref("TypeError")}}:</p> + +<ul> + <li><code>ownKeys</code> 的结果必须是一个数组.</li> + <li>数组的元素类型要么是一个 {{jsxref("String")}} ，要么是一个 {{jsxref("Symbol")}}.</li> + <li>结果列表必须包含目标对象的所有不可配置（non-configurable ）、自有（own）属性的key.</li> + <li>如果目标对象不可扩展，那么结果列表必须包含目标对象的所有自有（own）属性的key，不能有其它值.</li> +</ul> + +<h2 id="示例">示例</h2> + +<p>下面的代码拦截 {{jsxref("Object.getOwnPropertyNames()")}}.</p> + +<pre class="brush: js">var p = new Proxy({}, { + ownKeys: function(target) { + console.log('called'); + return ['a', 'b', 'c']; + } +}); + +console.log(Object.getOwnPropertyNames(p)); // "called" + // [ 'a', 'b', 'c' ]</pre> + +<p>下面的代码违反了约定</p> + +<pre class="brush: js example-bad">var obj = {}; +Object.defineProperty(obj, 'a', { + configurable: false, + enumerable: true, + value: 10 } +); + +var p = new Proxy(obj, { + ownKeys: function(target) { + return [123, 12.5, true, false, undefined, null, {}, []]; + } +}); + +console.log(Object.getOwnPropertyNames(p)); + +// TypeError: proxy [[OwnPropertyKeys]] 必须返回一个数组 +// 数组元素类型只能是String或Symbol +</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-ownpropertykeys', '[[OwnPropertyKeys]]')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-proxy-object-internal-methods-and-internal-slots-ownpropertykeys', '[[OwnPropertyKeys]]')}}</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> + +<h3 id="Firefox火狐">Firefox火狐</h3> + +<ul> + <li>在Gecko 42 {{geckoRelease(42)}}版本中, <code>ownKey</code> 的实施已经更新了，为了反映最终的ES5标准 (see {{bug(1049662)}}): + + <ul> + <li>现在需要检查结果是不是数组以及数组元素类型是不是string或symbol.</li> + <li>枚举重复的自有的属性名称不再失败.</li> + </ul> + </li> +</ul> + +<h2 id="另见">另见</h2> + +<ul> + <li>{{jsxref("Proxy")}}</li> + <li>{{jsxref("Proxy.handler", "handler")}}</li> + <li>{{jsxref("Object.getOwnPropertyNames()")}}</li> + <li>{{jsxref("Reflect.ownKeys()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/proxy/handler/preventextensions/index.html b/files/zh-cn/web/javascript/reference/global_objects/proxy/handler/preventextensions/index.html new file mode 100644 index 0000000000..dd6823c9dd --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/proxy/handler/preventextensions/index.html @@ -0,0 +1,120 @@ +--- +title: handler.preventExtensions() +slug: Web/JavaScript/Reference/Global_Objects/Proxy/handler/preventExtensions +tags: + - Proxy 代理 拦截 +translation_of: Web/JavaScript/Reference/Global_Objects/Proxy/Proxy/preventExtensions +--- +<div>{{JSRef}}</div> + +<p><strong><code>handler.preventExtensions()</code></strong> 方法用于设置对{{jsxref("Object.preventExtensions()")}}的拦截</p> + +<p>{{EmbedInteractiveExample("pages/js/proxyhandler-preventextensions.html", "taller")}}</p> + +<h2 id="语法">语法</h2> + +<pre class="brush: js notranslate">var p = new Proxy(target, { + preventExtensions: function(target) { + } +}); +</pre> + +<h3 id="参数">参数</h3> + +<p>以下参数传递给 <code>preventExtensions</code> 方法. 它会绑定到这个handler.</p> + +<dl> + <dt><code>target</code></dt> + <dd>所要拦截的目标对象.</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p><code>preventExtensions</code> 方法返回一个布尔值.</p> + +<h2 id="描述">描述</h2> + +<p><code><strong>handler.preventExtensions()</strong></code> 拦截 {{jsxref("Object.preventExtensions()")}}返回一个布尔值.</p> + +<h3 id="拦截">拦截</h3> + +<p>这个trap可以拦截这些操作:</p> + +<ul> + <li>{{jsxref("Object.preventExtensions()")}}</li> + <li>{{jsxref("Reflect.preventExtensions()")}}</li> +</ul> + +<h3 id="约束">约束</h3> + +<p>如果违反了下列规则, proxy则会抛出一个 {{jsxref("TypeError")}}:</p> + +<ul> + <li>如果目标对象是可扩展的，那么只能返回 <code>false</code></li> +</ul> + +<h2 id="示例">示例</h2> + +<p>以下代码演示了如何拦截{{jsxref("Object.preventExtensions()")}}。</p> + +<pre class="brush: js notranslate">var p = new Proxy({}, { + preventExtensions: function(target) { + console.log('called'); + Object.preventExtensions(target); + return true; + } +}); + +console.log(Object.preventExtensions(p)); // "called" + // false +</pre> + +<p>以下代码违反了约束.</p> + +<pre class="brush: js notranslate">var p = new Proxy({}, { + preventExtensions: function(target) { + return true; + } +}); + +Object.preventExtensions(p); // 抛出类型错误 +</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-preventextensions', '[[PreventExtensions]]')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-proxy-object-internal-methods-and-internal-slots-preventextensions', '[[PreventExtensions]]')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> + + +<p>{{Compat("javascript.builtins.Proxy.handler.preventExtensions")}}</p> +</div> + +<h2 id="参考">参考</h2> + +<ul> + <li>{{jsxref("Proxy")}}</li> + <li>{{jsxref("Proxy.handler", "handler")}}</li> + <li>{{jsxref("Object.preventExtensions()")}}</li> + <li>{{jsxref("Reflect.preventExtensions()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/proxy/handler/set/index.html b/files/zh-cn/web/javascript/reference/global_objects/proxy/handler/set/index.html new file mode 100644 index 0000000000..c66481647a --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/proxy/handler/set/index.html @@ -0,0 +1,125 @@ +--- +title: handler.set() +slug: Web/JavaScript/Reference/Global_Objects/Proxy/handler/set +tags: + - ECMAScript6 + - JavaScript + - Method + - Proxy + - Proxy拦截 +translation_of: Web/JavaScript/Reference/Global_Objects/Proxy/Proxy/set +--- +<div>{{JSRef}}</div> + +<p><code><strong>handler.set()</strong></code> 方法是设置属性值操作的捕获器。</p> + +<div>{{EmbedInteractiveExample("pages/js/proxyhandler-set.html", "taller")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">const <var>p</var> = new Proxy(<var>target</var>, { + set: function(<var>target</var>, <var>property</var>, <var>value</var>, <var>receiver</var>) { + } +}); +</pre> + +<h3 id="参数">参数</h3> + +<p>以下是传递给 <code>set()</code> 方法的参数。<code>this</code> 绑定在 handler 对象上。</p> + +<dl> + <dt><code><var>target</var></code></dt> + <dd>目标对象。</dd> + <dt><code><var>property</var></code></dt> + <dd>将被设置的属性名或 {{jsxref("Symbol")}}。</dd> + <dt><code><var>value</var></code></dt> + <dd>新属性值。</dd> + <dt><code><var>receiver</var></code></dt> + <dd>最初被调用的对象。通常是 proxy 本身，但 handler 的 set 方法也有可能在原型链上，或以其他方式被间接地调用（因此不一定是 proxy 本身）。 + <div class="note"> + <p><strong>比如：</strong>假设有一段代码执行 <code>obj.name = "jen"</code>， <code><var>obj</var></code> 不是一个 proxy，且自身不含 <code>name</code> 属性，但是它的原型链上有一个 proxy，那么，那个 proxy 的 <code>set()</code> 处理器会被调用，而此时，<code><var>obj</var></code> 会作为 receiver 参数传进来。</p> + </div> + </dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p><code>set()</code> 方法应当返回一个布尔值。</p> + +<ul> + <li>返回 <code>true</code> 代表属性设置成功。</li> + <li>在严格模式下，如果 <code>set()</code> 方法返回 <code>false</code>，那么会抛出一个 {{jsxref("TypeError")}} 异常。</li> +</ul> + +<h2 id="描述">描述</h2> + +<p><code>handler.set()</code> 方法用于拦截设置属性值的操作。</p> + +<h3 id="拦截">拦截</h3> + +<p>该方法会拦截目标对象的以下操作:</p> + +<ul> + <li>指定属性值：<code>proxy[foo] = bar</code> 和 <code>proxy.foo = bar</code></li> + <li>指定继承者的属性值：<code>Object.create(proxy)[foo] = bar</code></li> + <li>{{jsxref("Reflect.set()")}}</li> +</ul> + +<h3 id="约束">约束</h3> + +<p>如果违背以下的约束条件，proxy 会抛出一个 {{jsxref("TypeError")}} 异常：</p> + +<ul> + <li>若目标属性是一个不可写及不可配置的数据属性，则不能改变它的值。</li> + <li>如果目标属性没有配置存储方法，即 <code>[[Set]]</code> 属性的是 <code>undefined</code>，则不能设置它的值。</li> + <li>在严格模式下，如果 <code>set()</code> 方法返回 <code>false</code>，那么也会抛出一个 {{jsxref("TypeError")}} 异常。</li> +</ul> + +<h2 id="示例">示例</h2> + +<p>以下代码演示如何捕获属性的设置操作。</p> + +<pre class="brush: js">var p = new Proxy({}, { + set: function(target, prop, value, receiver) { + target[prop] = value; + console.log('property set: ' + prop + ' = ' + value); + return true; + } +}) + +console.log('a' in p); // false + +p.a = 10; // "property set: a = 10" +console.log('a' in p); // true +console.log(p.a); // 10</pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">规范</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-proxy-object-internal-methods-and-internal-slots-set-p-v-receiver', '[[Set]]')}}</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.Proxy.handler.set")}}</p> + +<h2 id="另见">另见</h2> + +<ul> + <li>{{jsxref("Proxy")}}</li> + <li>{{jsxref("Proxy.handler", "handler")}}</li> + <li>{{jsxref("Reflect.set()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/proxy/handler/setprototypeof/index.html b/files/zh-cn/web/javascript/reference/global_objects/proxy/handler/setprototypeof/index.html new file mode 100644 index 0000000000..9d88cd2593 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/proxy/handler/setprototypeof/index.html @@ -0,0 +1,124 @@ +--- +title: handler.setPrototypeOf() +slug: Web/JavaScript/Reference/Global_Objects/Proxy/handler/setPrototypeOf +translation_of: Web/JavaScript/Reference/Global_Objects/Proxy/Proxy/setPrototypeOf +--- +<div>{{JSRef}}</div> + +<p><strong><code>handler.setPrototypeOf()</code></strong> 方法主要用来拦截 {{jsxref("Object.setPrototypeOf()")}}.</p> + +<h2 id="语法">语法</h2> + +<pre class="brush: js">var p = new Proxy(target, { + setPrototypeOf: function(target, prototype) { + } +}); +</pre> + +<h3 id="参数">参数</h3> + +<p>以下参数传递给 <code>setPrototypeOf</code> 方法. </p> + +<dl> + <dt><code>target</code></dt> + <dd>被拦截目标对象.</dd> + <dt><code>prototype</code></dt> + <dd>对象新原型或为<code>null</code>.</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>如果成功修改了<code>[[Prototype]]</code>, <code>setPrototypeOf</code> 方法返回 <code>true</code>,否则返回 <code>false</code>.</p> + +<h2 id="描述">描述</h2> + +<p>这个 <code><strong>handler.setPrototypeOf</strong></code> 方法用于拦截 {{jsxref("Object.setPrototypeOf()")}}.</p> + +<h3 id="拦截">拦截</h3> + +<p>这个方法可以拦截以下操作:</p> + +<ul> + <li>{{jsxref("Object.setPrototypeOf()")}}</li> + <li>{{jsxref("Reflect.setPrototypeOf()")}}</li> +</ul> + +<h3 id="Invariants">Invariants</h3> + +<p>如果违反了下列规则，则proxy将抛出一个{{jsxref("TypeError")}}:</p> + +<ul> + <li><code><font face="Open Sans, arial, x-locale-body, sans-serif"><span style="background-color: #ffffff;">如果 </span></font>target</code> 不可扩展, 原型参数必须与<code>Object.getPrototypeOf(target)</code> 的值相同.</li> +</ul> + +<h2 id="示例">示例</h2> + +<p>如果你不想为你的对象设置一个新的原型，你的handler's的<code>setPrototypeOf</code>方法可以返回false，也可以抛出异常。</p> + +<p>The former approach means that any operation that performs such mutation, that throws an exception on failure to mutate, will have to create the exception itself. For example, {{jsxref("Object.setPrototypeOf()")}} will create and throw a <code>TypeError</code> itself. If the mutation is performed by an operation that <em>doesn't</em> ordinarily throw in case of failure, such as {{jsxref("Reflect.setPrototypeOf()")}}, no exception will be thrown.</p> + +<pre class="brush: js">var handlerReturnsFalse = { + setPrototypeOf(target, newProto) { + return false; + } +}; + +var newProto = {}, target = {}; + +var p1 = new Proxy(target, handlerReturnsFalse); +Object.setPrototypeOf(p1, newProto); // throws a TypeError +Reflect.setPrototypeOf(p1, newProto); // returns false +</pre> + +<p>The latter approach will cause <em>any</em> operation that attempts to mutate, to throw. This approach is required if you want even non-throwing operations to throw on failure, or you want to throw a custom exception value.</p> + +<pre class="brush: js">var handlerThrows = { + setPrototypeOf(target, newProto) { + throw new Error('custom error'); + } +}; + +var newProto = {}, target = {}; + +var p2 = new Proxy(target, handlerThrows); +Object.setPrototypeOf(p2, newProto); // throws new Error("custom error") +Reflect.setPrototypeOf(p2, newProto); // throws new Error("custom error")</pre> + +<h2 id="Specifications">Specifications</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-setprototypeof-v', '[[SetPrototypeOf]]')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-proxy-object-internal-methods-and-internal-slots-setprototypeof-v', '[[SetPrototypeOf]]')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility">Browser compatibility</h2> + +<div> + + +<p>{{Compat("javascript.builtins.Proxy.handler.setPrototypeOf")}}</p> +</div> + +<h2 id="See_also">See also</h2> + +<ul> + <li>{{jsxref("Proxy")}}</li> + <li>{{jsxref("Proxy.handler", "handler")}}</li> + <li>{{jsxref("Object.setPrototypeOf()")}}</li> + <li>{{jsxref("Reflect.setPrototypeOf()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/proxy/index.html b/files/zh-cn/web/javascript/reference/global_objects/proxy/index.html new file mode 100644 index 0000000000..f9059ade82 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/proxy/index.html @@ -0,0 +1,435 @@ +--- +title: Proxy +slug: Web/JavaScript/Reference/Global_Objects/Proxy +tags: + - ECMAScript 2015 + - JavaScript + - Proxy +translation_of: Web/JavaScript/Reference/Global_Objects/Proxy +--- +<div>{{JSRef}}</div> + +<p><strong>Proxy</strong> 对象用于创建一个对象的代理，从而实现基本操作的拦截和自定义（如属性查找、赋值、枚举、函数调用等）。</p> + +<h2 id="术语">术语</h2> + +<dl> + <dt>{{jsxref("Global_Objects/Proxy/handler", "<dfn>handler</dfn>")}}</dt> + <dd>包含捕捉器（trap）的占位符对象，可译为处理器对象。</dd> + <dt><dfn>traps</dfn></dt> + <dd>提供属性访问的方法。这类似于操作系统中捕获器的概念。</dd> + <dt><dfn>target</dfn></dt> + <dd>被 Proxy 代理虚拟化的对象。它常被作为代理的存储后端。根据目标验证关于对象不可扩展性或不可配置属性的不变量（保持不变的语义）。</dd> +</dl> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox notranslate">const <var>p</var> = new Proxy(<var>target</var>, <var>handler</var>)</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code><var>target</var></code></dt> + <dd>要使用 <code>Proxy</code> 包装的目标对象（可以是任何类型的对象，包括原生数组，函数，甚至另一个代理）。</dd> + <dt><code><var>handler</var></code></dt> + <dd>一个通常以函数作为属性的对象，各属性中的函数分别定义了在执行各种操作时代理 <code><var>p</var></code> 的行为。</dd> +</dl> + +<h2 id="方法">方法</h2> + +<dl> + <dt>{{jsxref("Proxy.revocable()")}}</dt> + <dd>创建一个可撤销的<code>Proxy</code>对象。</dd> +</dl> + +<h2 id="handler_对象的方法">handler 对象的方法</h2> + +<p><code><var>handler</var></code> 对象是一个容纳一批特定属性的占位符对象。它包含有 <code>Proxy</code> 的各个捕获器（trap）。</p> + +<p>所有的捕捉器是可选的。如果没有定义某个捕捉器，那么就会保留源对象的默认行为。</p> + +<dl> + <dt>{{JSxRef("Global_Objects/Proxy/handler/getPrototypeOf", "handler.getPrototypeOf()")}}</dt> + <dd>{{JSxRef("Object.getPrototypeOf")}} 方法的捕捉器。</dd> + <dt>{{JSxRef("Global_Objects/Proxy/handler/setPrototypeOf", "handler.setPrototypeOf()")}}</dt> + <dd>{{JSxRef("Object.setPrototypeOf")}} 方法的捕捉器。</dd> + <dt>{{JSxRef("Global_Objects/Proxy/handler/isExtensible", "handler.isExtensible()")}}</dt> + <dd>{{JSxRef("Object.isExtensible")}} 方法的捕捉器。</dd> + <dt>{{JSxRef("Global_Objects/Proxy/handler/preventExtensions", "handler.preventExtensions()")}}</dt> + <dd>{{JSxRef("Object.preventExtensions")}} 方法的捕捉器。</dd> + <dt>{{JSxRef("Global_Objects/Proxy/handler/getOwnPropertyDescriptor", "handler.getOwnPropertyDescriptor()")}}</dt> + <dd>{{JSxRef("Object.getOwnPropertyDescriptor")}} 方法的捕捉器。</dd> + <dt>{{JSxRef("Global_Objects/Proxy/handler/defineProperty", "handler.defineProperty()")}}</dt> + <dd>{{JSxRef("Object.defineProperty")}} 方法的捕捉器。</dd> + <dt>{{JSxRef("Global_Objects/Proxy/handler/has", "handler.has()")}}</dt> + <dd>{{JSxRef("Operators/in", "in")}} 操作符的捕捉器。</dd> + <dt>{{JSxRef("Global_Objects/Proxy/handler/get", "handler.get()")}}</dt> + <dd>属性读取操作的捕捉器。</dd> + <dt>{{JSxRef("Global_Objects/Proxy/handler/set", "handler.set()")}}</dt> + <dd>属性设置操作的捕捉器。</dd> + <dt>{{JSxRef("Global_Objects/Proxy/handler/deleteProperty", "handler.deleteProperty()")}}</dt> + <dd>{{JSxRef("Operators/delete", "delete")}} 操作符的捕捉器。</dd> + <dt>{{JSxRef("Global_Objects/Proxy/handler/ownKeys", "handler.ownKeys()")}}</dt> + <dd>{{JSxRef("Object.getOwnPropertyNames")}} 方法和 {{JSxRef("Object.getOwnPropertySymbols")}} 方法的捕捉器。</dd> + <dt>{{JSxRef("Global_Objects/Proxy/handler/apply", "handler.apply()")}}</dt> + <dd>函数调用操作的捕捉器。</dd> + <dt>{{JSxRef("Global_Objects/Proxy/handler/construct", "handler.construct()")}}</dt> + <dd>{{JSxRef("Operators/new", "new")}} 操作符的捕捉器。</dd> +</dl> + +<p>一些不标准的捕捉器已经被<a href="/zh-CN/docs/Web/JavaScript/Reference/Deprecated_and_obsolete_features#Proxy">废弃并且移除</a>了。</p> + +<h2 id="示例">示例</h2> + +<h3 id="基础示例">基础示例</h3> + +<p>在以下简单的例子中，当对象中不存在属性名时，默认返回值为 <code>37</code>。下面的代码以此展示了 {{jsxref("Global_Objects/Proxy/handler/get", "get")}} handler 的使用场景。</p> + +<pre class="brush: js notranslate">const handler = { + get: function(obj, prop) { + return prop in obj ? obj[prop] : 37; + } +}; + +const p = new Proxy({}, handler); +p.a = 1; +p.b = undefined; + +console.log(p.a, p.b); // 1, undefined +console.log('c' in p, p.c); // false, 37 +</pre> + +<h3 id="无操作转发代理">无操作转发代理</h3> + +<p>在以下例子中，我们使用了一个原生 JavaScript 对象，代理会将所有应用到它的操作转发到这个对象上。</p> + +<pre class="brush: js notranslate">let target = {}; +let p = new Proxy(target, {}); + +p.a = 37; // 操作转发到目标 + +console.log(target.a); // 37. 操作已经被正确地转发 +</pre> + +<h3 id="验证">验证</h3> + +<p>通过代理，你可以轻松地验证向一个对象的传值。下面的代码借此展示了 {{jsxref("Global_Objects/Proxy/handler/set", "set")}} handler 的作用。</p> + +<pre class="brush: js notranslate">let validator = { + set: function(obj, prop, value) { + if (prop === 'age') { + if (!Number.isInteger(value)) { + throw new TypeError('The age is not an integer'); + } + if (value > 200) { + throw new RangeError('The age seems invalid'); + } + } + + // The default behavior to store the value + obj[prop] = value; + + // 表示成功 + return true; + } +}; + +let person = new Proxy({}, validator); + +person.age = 100; + +console.log(person.age); +// 100 + +person.age = 'young'; +// 抛出异常: Uncaught TypeError: The age is not an integer + +person.age = 300; +// 抛出异常: Uncaught RangeError: The age seems invalid +</pre> + +<h3 id="扩展构造函数">扩展构造函数</h3> + +<p>方法代理可以轻松地通过一个新构造函数来扩展一个已有的构造函数。这个例子使用了<a href="/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Proxy/handler/construct"><code>construct</code></a>和<code><a href="/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Proxy/handler/apply">apply</a></code>。</p> + +<pre class="brush: js notranslate">function extend(sup, base) { + var descriptor = Object.getOwnPropertyDescriptor( + base.prototype, "constructor" + ); + base.prototype = Object.create(sup.prototype); + var handler = { + construct: function(target, args) { + var obj = Object.create(base.prototype); + this.apply(target, obj, args); + return obj; + }, + apply: function(target, that, args) { + sup.apply(that, args); + base.apply(that, args); + } + }; + var proxy = new Proxy(base, handler); + descriptor.value = proxy; + Object.defineProperty(base.prototype, "constructor", descriptor); + return proxy; +} + +var Person = function (name) { + this.name = name +}; + +var Boy = extend(Person, function (name, age) { + this.age = age; +}); + +Boy.prototype.sex = "M"; + +var Peter = new Boy("Peter", 13); +console.log(Peter.sex); // "M" +console.log(Peter.name); // "Peter" +console.log(Peter.age); // 13</pre> + +<h3 id="操作_DOM_节点">操作 DOM 节点</h3> + +<p>有时，我们可能需要互换两个不同的元素的属性或类名。下面的代码以此为目标，展示了 {{jsxref("Global_Objects/Proxy/handler/set", "set")}} handler 的使用场景。</p> + +<pre class="brush: js notranslate">let view = new Proxy({ + selected: null +}, { + set: function(obj, prop, newval) { + let oldval = obj[prop]; + + if (prop === 'selected') { + if (oldval) { + oldval.setAttribute('aria-selected', 'false'); + } + if (newval) { + newval.setAttribute('aria-selected', 'true'); + } + } + + // 默认行为是存储被传入 setter 函数的属性值 + obj[prop] = newval; + + // 表示操作成功 + return true; + } +}); + +let i1 = view.selected = document.getElementById('item-1'); +console.log(i1.getAttribute('aria-selected')); // 'true' + +let i2 = view.selected = document.getElementById('item-2'); +console.log(i1.getAttribute('aria-selected')); // 'false' +console.log(i2.getAttribute('aria-selected')); // 'true' +</pre> + +<h3 id="值修正及附加属性">值修正及附加属性</h3> + +<p>以下<code>products</code>代理会计算传值并根据需要转换为数组。这个代理对象同时支持一个叫做 <code>latestBrowser</code>的附加属性，这个属性可以同时作为 getter 和 setter。</p> + +<pre class="brush: js notranslate">let products = new Proxy({ + browsers: ['Internet Explorer', 'Netscape'] +}, { + get: function(obj, prop) { + // 附加一个属性 + if (prop === 'latestBrowser') { + return obj.browsers[obj.browsers.length - 1]; + } + + // 默认行为是返回属性值 + return obj[prop]; + }, + set: function(obj, prop, value) { + // 附加属性 + if (prop === 'latestBrowser') { + obj.browsers.push(value); + return; + } + + // 如果不是数组，则进行转换 + if (typeof value === 'string') { + value = [value]; + } + + // 默认行为是保存属性值 + obj[prop] = value; + + // 表示成功 + return true; + } +}); + +console.log(products.browsers); // ['Internet Explorer', 'Netscape'] +products.browsers = 'Firefox'; // 如果不小心传入了一个字符串 +console.log(products.browsers); // ['Firefox'] <- 也没问题, 得到的依旧是一个数组 + +products.latestBrowser = 'Chrome'; +console.log(products.browsers); // ['Firefox', 'Chrome'] +console.log(products.latestBrowser); // 'Chrome' +</pre> + +<h3 id="通过属性查找数组中的特定对象">通过属性查找数组中的特定对象</h3> + +<p>以下代理为数组扩展了一些实用工具。如你所见，通过 Proxy，我们可以灵活地“定义”属性，而不需要使用 {{jsxref("Object.defineProperties")}} 方法。以下例子可以用于通过单元格来查找表格中的一行。在这种情况下，target 是 <code><a href="/zh-CN/docs/DOM/table.rows">table.rows</a></code>。</p> + +<pre class="brush: js notranslate">let products = new Proxy([ + { name: 'Firefox' , type: 'browser' }, + { name: 'SeaMonkey' , type: 'browser' }, + { name: 'Thunderbird', type: 'mailer' } +], { + get: function(obj, prop) { + // 默认行为是返回属性值， prop ?通常是一个整数 + if (prop in obj) { + return obj[prop]; + } + + // 获取 products 的 number; 它是 products.length 的别名 + if (prop === 'number') { + return obj.length; + } + + let result, types = {}; + + for (let product of obj) { + if (product.name === prop) { + result = product; + } + if (types[product.type]) { + types[product.type].push(product); + } else { + types[product.type] = [product]; + } + } + + // 通过 name 获取 product + if (result) { + return result; + } + + // 通过 type 获取 products + if (prop in types) { + return types[prop]; + } + + // 获取 product type + if (prop === 'types') { + return Object.keys(types); + } + + return undefined; + } +}); + +console.log(products[0]); // { name: 'Firefox', type: 'browser' } +console.log(products['Firefox']); // { name: 'Firefox', type: 'browser' } +console.log(products['Chrome']); // undefined +console.log(products.browser); // [{ name: 'Firefox', type: 'browser' }, { name: 'SeaMonkey', type: 'browser' }] +console.log(products.types); // ['browser', 'mailer'] +console.log(products.number); // 3 +</pre> + +<h3 id="一个完整的_traps_列表示例">一个完整的 <code>traps</code> 列表示例</h3> + +<p>出于教学目的，这里为了创建一个完整的 traps 列表示例，我们将尝试代理化一个非原生对象，这特别适用于这类操作：由 <a href="/zh-CN/docs/DOM/document.cookie#A_little_framework.3A_a_complete_cookies_reader.2Fwriter_with_full_unicode_support">发布在 document.cookie页面上的“小型框架”</a>创建的<code>docCookies</code>全局对象。</p> + +<pre class="brush: js notranslate">/* + var docCookies = ... get the "docCookies" object here: + https://developer.mozilla.org/zh-CN/docs/DOM/document.cookie#A_little_framework.3A_a_complete_cookies_reader.2Fwriter_with_full_unicode_support +*/ + +var docCookies = new Proxy(docCookies, { + "get": function (oTarget, sKey) { + return oTarget[sKey] || oTarget.getItem(sKey) || undefined; + }, + "set": function (oTarget, sKey, vValue) { + if (sKey in oTarget) { return false; } + return oTarget.setItem(sKey, vValue); + }, + "deleteProperty": function (oTarget, sKey) { + if (sKey in oTarget) { return false; } + return oTarget.removeItem(sKey); + }, + "enumerate": function (oTarget, sKey) { + return oTarget.keys(); + }, + "ownKeys": function (oTarget, sKey) { + return oTarget.keys(); + }, + "has": function (oTarget, sKey) { + return sKey in oTarget || oTarget.hasItem(sKey); + }, + "defineProperty": function (oTarget, sKey, oDesc) { + if (oDesc && "value" in oDesc) { oTarget.setItem(sKey, oDesc.value); } + return oTarget; + }, + "getOwnPropertyDescriptor": function (oTarget, sKey) { + var vValue = oTarget.getItem(sKey); + return vValue ? { + "value": vValue, + "writable": true, + "enumerable": true, + "configurable": false + } : undefined; + }, +}); + +/* Cookies 测试 */ + +alert(docCookies.my_cookie1 = "First value"); +alert(docCookies.getItem("my_cookie1")); + +docCookies.setItem("my_cookie1", "Changed value"); +alert(docCookies.my_cookie1);</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-objects', 'Proxy')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES2016', '#sec-proxy-objects', 'Proxy')}}</td> + <td>{{Spec2('ES2016')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES2017', '#sec-proxy-objects', 'Proxy')}}</td> + <td>{{Spec2('ES2017')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-proxy-objects', 'Proxy')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div class="hidden">The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</div> + +<p>{{Compat("javascript.builtins.Proxy", 2)}}</p> + +<h2 id="参考">参考</h2> + +<ul> + <li><a class="external" href="http://jsconf.eu/2010/speaker/be_proxy_objects.html">"Proxies are awesome" Brendan Eich presentation at JSConf</a> (<a class="external" href="http://www.slideshare.net/BrendanEich/metaprog-5303821">slides</a>)</li> + <li><a class="external" href="http://wiki.ecmascript.org/doku.php?id=harmony:proxies">ECMAScript Harmony Proxy proposal page</a> and <a class="external" href="http://wiki.ecmascript.org/doku.php?id=harmony:proxies_semantics">ECMAScript Harmony proxy semantics page</a></li> + <li><a class="external" href="http://soft.vub.ac.be/~tvcutsem/proxies/">Tutorial on proxies</a></li> + <li><a href="/zh-CN/docs/JavaScript/Old_Proxy_API">SpiderMonkey specific Old Proxy API</a></li> + <li>{{jsxref("Object.watch()")}} is a non-standard feature but has been supported in Gecko for a long time.</li> +</ul> + +<h2 id="版权声明">版权声明</h2> + +<p>一些内容（如文本、例子）是复制自或修改自<a class="external" href="http://wiki.ecmascript.org/doku.php">ECMAScript wiki</a>（版权声明 <a class="external" href="http://creativecommons.org/licenses/by-nc-sa/2.0/">CC 2.0 BY-NC-SA</a>）。</p> diff --git a/files/zh-cn/web/javascript/reference/global_objects/proxy/proxy/index.html b/files/zh-cn/web/javascript/reference/global_objects/proxy/proxy/index.html new file mode 100644 index 0000000000..71a257174f --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/proxy/proxy/index.html @@ -0,0 +1,118 @@ +--- +title: Proxy() 构造器 +slug: Web/JavaScript/Reference/Global_Objects/Proxy/Proxy +translation_of: Web/JavaScript/Reference/Global_Objects/Proxy/Proxy +--- +<div>{{JSRef}}</div> + +<div> <code><strong>Proxy()</strong></code> 构造器用来创建 {{jsxref("Proxy")}} 对象。</div> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox notranslate">new Proxy(<var>target</var>, <var>handler</var>)</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code><var>target</var></code></dt> + <dd> <code>Proxy</code> 会对 target 对象进行包装。它可以是任何类型的对象，包括内置的数组，函数甚至是另一个代理对象。</dd> + <dt><code><var>handler</var></code></dt> + <dd>它是一个对象，它的属性提供了某些操作发生时所对应的处理函数。</dd> +</dl> + +<h2 id="描述">描述</h2> + +<p>我们可以使用 <code>Proxy()</code> 构造器来创建一个新的 <code>Proxy</code> 对象。 构造器接收两个主要参数：</p> + +<ul> + <li><code>target</code> 被代理的对象</li> + <li><code>handler</code> 被代理对象上的自定义行为</li> +</ul> + +<p>一个空的 <code>handler</code> 参数将会创建一个与被代理对象行为几乎完全相同的代理对象。通过在 <code>handler</code> 对象上定义一组处理函数，你可以自定义被代理对象的一些特定行为。例如， 通过定义 <code>get()</code> 你就可以自定义被代理对象的 <a href="/en-US/docs/Web/JavaScript/Reference/Operators/Property_Accessors">属性访问器</a>。</p> + +<h3 id="处理函数">处理函数</h3> + +<p>本节列出了所有你可以自定义的处理函数。处理函数有时候也被成为“劫持”（traps），这是由于它们会对底层被代理对象的调用进行劫持。</p> + +<dl> + <dt>{{JSxRef("Global_Objects/Proxy/Proxy/apply", "handler.apply()")}}</dt> + <dd>函数调用劫持。</dd> + <dt>{{JSxRef("Global_Objects/Proxy/Proxy/construct", "handler.construct()")}}</dt> + <dd>{{JSxRef("Operators/new", "new")}} 操作符劫持</dd> + <dt>{{JSxRef("Global_Objects/Proxy/Proxy/defineProperty", "handler.defineProperty()")}}</dt> + <dd>{{JSxRef("Object.defineProperty")}}调用劫持。</dd> + <dt>{{JSxRef("Global_Objects/Proxy/Proxy/deleteProperty", "handler.deleteProperty()")}}</dt> + <dd>{{JSxRef("Operators/delete", "delete")}} 操作符劫持。</dd> + <dt>{{JSxRef("Global_Objects/Proxy/Proxy/get", "handler.get()")}}</dt> + <dd>获取属性值劫持。</dd> + <dt>{{JSxRef("Global_Objects/Proxy/Proxy/getOwnPropertyDescriptor", "handler.getOwnPropertyDescriptor()")}}</dt> + <dd>{{JSxRef("Object.getOwnPropertyDescriptor")}} 调用劫持。</dd> + <dt>{{JSxRef("Global_Objects/Proxy/Proxy/getPrototypeOf", "handler.getPrototypeOf()")}}</dt> + <dd>{{JSxRef("Object.getPrototypeOf")}}调用劫持。</dd> + <dt>{{JSxRef("Global_Objects/Proxy/Proxy/has", "handler.has()")}}</dt> + <dd>{{JSxRef("Operators/in", "in")}} 操作符劫持。</dd> + <dt>{{JSxRef("Global_Objects/Proxy/Proxy/isExtensible", "handler.isExtensible()")}}</dt> + <dd> {{JSxRef("Object.isExtensible")}}调用劫持。</dd> + <dt>{{JSxRef("Global_Objects/Proxy/Proxy/ownKeys", "handler.ownKeys()")}}</dt> + <dd>{{JSxRef("Object.getOwnPropertyNames")}} 和{{JSxRef("Object.getOwnPropertySymbols")}}调用劫持。</dd> + <dt>{{JSxRef("Global_Objects/Proxy/Proxy/preventExtensions", "handler.preventExtensions()")}}</dt> + <dd>{{JSxRef("Object.preventExtensions")}}调用劫持。</dd> + <dt>{{JSxRef("Global_Objects/Proxy/Proxy/set", "handler.set()")}}</dt> + <dd>设置属性值劫持。</dd> + <dt>{{JSxRef("Global_Objects/Proxy/Proxy/setPrototypeOf", "handler.setPrototypeOf()")}}</dt> + <dd>{{JSxRef("Object.setPrototypeOf")}}调用劫持。</dd> +</dl> + +<h2 id="示例">示例</h2> + +<h3 id="选择性代理属性访问器">选择性代理属性访问器</h3> + +<p>本例中，被代理对象有两个属性： <code>notProxied</code> 和 <code>proxied</code> 。我们定义了一个处理函数，它为 <code>proxied</code> 属性返回一个不同的值，而其他属性返回原值。</p> + +<pre class="brush: js notranslate">const target = { + notProxied: "original value", + proxied: "original value" +}; + +const handler = { + get: function(target, prop, receiver) { + if (prop === "proxied") { + return "replaced value"; + } + return Reflect.get(...arguments); + } +}; + +const proxy = new Proxy(target, handler); + +console.log(proxy.notProxied); // "original value" +console.log(proxy.proxied); // "replaced value"</pre> + +<h2 id="标准">标准</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Specification</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-proxy-constructor', 'Proxy constructor')}}</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.Proxy.Proxy")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li><a href="/en-US/docs/Web/JavaScript/Guide/Meta_programming"><code>Proxy</code> and <code>Reflect</code> in the JavaScript Guide</a></li> + <li>{{jsxref("Global_Objects/Reflect", "Reflect")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/proxy/revocable/index.html b/files/zh-cn/web/javascript/reference/global_objects/proxy/revocable/index.html new file mode 100644 index 0000000000..5f0095ae65 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/proxy/revocable/index.html @@ -0,0 +1,89 @@ +--- +title: Proxy.revocable() +slug: Web/JavaScript/Reference/Global_Objects/Proxy/revocable +tags: + - ECMAScript6 + - JavaScript + - Method + - Proxy +translation_of: Web/JavaScript/Reference/Global_Objects/Proxy/revocable +--- +<div>{{JSRef("Global_Objects", "Proxy")}}</div> + +<p><code><strong>Proxy.revocable()</strong></code> 方法可以用来创建一个可撤销的代理对象。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">Proxy.revocable(target, handler); +</pre> + +<dl> + <dt><code>target</code></dt> + <dd>将用 <code>Proxy</code> 封装的目标对象。可以是任何类型的对象，包括原生数组，函数，甚至可以是另外一个代理对象。</dd> + <dt><code>handler</code></dt> + <dd>一个对象，其属性是一批可选的函数，这些函数定义了对应的操作被执行时代理的行为。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>返回一个包含了代理对象本身和它的撤销方法的可撤销 <code>Proxy</code> 对象。</p> + +<h2 id="描述">描述</h2> + +<p>该方法的返回值是一个对象，其结构为： <code>{"proxy": proxy, "revoke": revoke}</code>，其中：</p> + +<dl> + <dt><code>proxy</code></dt> + <dd>表示新生成的代理对象本身，和用一般方式 <code>new Proxy(target, handler)</code> 创建的代理对象没什么不同，只是它可以被撤销掉。</dd> + <dt><code>revoke</code></dt> + <dd>撤销方法，调用的时候不需要加任何参数，就可以撤销掉和它一起生成的那个代理对象。</dd> +</dl> + +<p>一旦某个代理对象被撤销，它将变得几乎完全不可调用，在它身上执行任何的<strong>可代理操作</strong>都会抛出 {{jsxref("TypeError")}} 异常（注意，可代理操作一共有 {{jsxref("Proxy", "14 种", "#Methods_of_the_handler_object")}}，执行这 14 种操作以外的操作不会抛出异常）。一旦被撤销，这个代理对象便不可能被直接恢复到原来的状态，同时和它关联的<strong>目标对象</strong>以及<strong>处理器对象</strong>都有可能被垃圾回收掉。再次调用撤销方法 <code>revoke()</code> 则不会有任何效果，但也不会报错。</p> + +<h2 id="示例">示例</h2> + +<pre class="brush: js">var revocable = Proxy.revocable({}, { + get(target, name) { + return "[[" + name + "]]"; + } +}); +var proxy = revocable.proxy; +proxy.foo; // "[[foo]]" + +revocable.revoke(); + +console.log(proxy.foo); // 抛出 TypeError +proxy.foo = 1 // 还是 TypeError +delete proxy.foo; // 又是 TypeError +typeof proxy // "object"，因为 typeof 不属于可代理操作 +</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>{{SpecName('ES6', '#sec-proxy.revocable', 'Proxy Revocation Functions')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.Proxy.revocable")}}</p> + +<h2 id="参见">参见</h2> + +<ul> + <li>{{jsxref("Proxy")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/rangeerror/index.html b/files/zh-cn/web/javascript/reference/global_objects/rangeerror/index.html new file mode 100644 index 0000000000..c46f557e24 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/rangeerror/index.html @@ -0,0 +1,163 @@ +--- +title: RangeError +slug: Web/JavaScript/Reference/Global_Objects/RangeError +translation_of: Web/JavaScript/Reference/Global_Objects/RangeError +--- +<div>{{JSRef}}</div> + +<p><strong>RangeError</strong>对象标明一个错误，当一个值不在其所允许的范围或者集合中。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code>new RangeError([<var>message</var>[, <var>fileName</var>[, <var>lineNumber</var>]]])</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>message</code></dt> + <dd>可选，可读的错误描述</dd> + <dt><code>fileName</code> {{non-standard_inline}}</dt> + <dd>可选，包含造成异常代码的文件名</dd> + <dt><code>lineNumber</code> {{non-standard_inline}}</dt> + <dd>可选，造成异常的代码所在的行数</dd> +</dl> + +<h2 id="描述">描述</h2> + +<p>试图传递一个number参数给一个范围内不包含该number的函数时则会引发<strong>RangeError</strong>。当传递一个不合法的length值作为{{jsxref("Array")}} 构造器的参数创建数组，或者传递错误值到数值计算方法（{{jsxref("Number.toExponential()")}}，{{jsxref("Number.toFixed()")}} ，{{jsxref("Number.toPrecision()")}}），会出现<strong>RangeError</strong>。.</p> + +<h2 id="属性">属性</h2> + +<dl> + <dt>{{jsxref("RangeError.prototype")}}</dt> + <dd><code>允许在<strong>RangeError</strong>对象上附加属性。</code></dd> +</dl> + +<h2 id="方法">方法</h2> + +<p><code>RangeError</code>全局对象没有自带方法，但它通过可以原型链继承一些方法。</p> + +<h2 id="RangeError实例"><code>RangeError</code>实例</h2> + +<h3 id="属性_2">属性</h3> + +<div>{{page('/en-US/docs/Web/JavaScript/Reference/Global_Objects/RangeError/prototype', 'Properties')}}</div> + +<h3 id="方法_2">方法</h3> + +<div>{{page('/en-US/docs/Web/JavaScript/Reference/Global_Objects/RangeError/prototype', 'Methods')}}</div> + +<h2 id="例子">例子</h2> + +<h3 id="使用RangeError">使用<code>RangeError</code></h3> + +<pre class="brush: js">var check = function(num) { + if (num < MIN || num > MAX) { + throw new RangeError('Parameter must be between ' + MIN + ' and ' + MAX); + } +}; + +try { + check(500); +} +catch (e) { + if (e instanceof RangeError) { + // 处理越界错误 + } +} +</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('ES3')}}</td> + <td>{{Spec2('ES3')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.11.6.2', 'RangeError')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-native-error-types-used-in-this-standard-rangeerror', 'RangeError')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-native-error-types-used-in-this-standard-rangeerror', 'RangeError')}}</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>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</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>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="相关连接">相关连接</h2> + +<ul> + <li>{{jsxref("Error")}}</li> + <li>{{jsxref("RangeError.prototype")}}</li> + <li>{{jsxref("Array")}}</li> + <li>{{jsxref("Number.toExponential()")}}</li> + <li>{{jsxref("Number.toFixed()")}}</li> + <li>{{jsxref("Number.toPrecision()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/rangeerror/prototype/index.html b/files/zh-cn/web/javascript/reference/global_objects/rangeerror/prototype/index.html new file mode 100644 index 0000000000..ea09336ec0 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/rangeerror/prototype/index.html @@ -0,0 +1,88 @@ +--- +title: RangeError.prototype +slug: Web/JavaScript/Reference/Global_Objects/RangeError/prototype +translation_of: Web/JavaScript/Reference/Global_Objects/RangeError +--- +<div>{{JSRef}}</div> + +<div> </div> + +<div><code><strong>RangeError.prototype</strong></code> 属性表示 {{jsxref("RangeError")}} 构造函数的原型。</div> + +<div> </div> + +<div>{{js_property_attributes(0, 0, 0)}}</div> + +<h2 id="描述">描述</h2> + +<p>所有 {{jsxref("RangeError")}} 的实例都继承自 <code>RangeError.prototype</code> ，所以你可以使用这个属性来为所有的实例添加属性或方法。</p> + +<h2 id="属性">属性</h2> + +<dl> + <dt><code>RangeError.prototype.constructor</code></dt> + <dd>指定了创建实例原型的函数</dd> + <dt>{{jsxref("Error.prototype.message", "RangeError.prototype.message")}}</dt> + <dd>错误信息。尽管 ECMA-262 规定了 {{jsxref("RangeError")}} 应该拥有一个 <code>message</code> 属性，但在 <a href="/zh-CN/docs/Mozilla/Projects/SpiderMonkey">SpiderMonkey</a> 中，该属性继承自 {{jsxref("Error.prototype.message")}}。</dd> + <dt>{{jsxref("Error.prototype.name", "RangeError.prototype.name")}}</dt> + <dd>错误名字，继承自 {{jsxref("Error")}}。</dd> + <dt>{{jsxref("Error.prototype.fileName", "RangeError.prototype.fileName")}}</dt> + <dd>引起该错误的文件路径，继承自 {{jsxref("Error")}}。</dd> + <dt>{{jsxref("Error.prototype.lineNumber", "RangeError.prototype.lineNumber")}}</dt> + <dd>引起该错误的行号，继承自 {{jsxref("Error")}}。</dd> + <dt>{{jsxref("Error.prototype.columnNumber", "RangeError.prototype.columnNumber")}}</dt> + <dd>引起该错误的列号，继承自 {{jsxref("Error")}}。</dd> + <dt>{{jsxref("Error.prototype.stack", "RangeError.prototype.stack")}}</dt> + <dd>堆栈跟踪记录，继承自 {{jsxref("Error")}}。</dd> +</dl> + +<h2 id="方法">方法</h2> + +<p>尽管 {{jsxref("RangeError")}} 原型对象自身没有包含任何方法，但是 {{jsxref("RangeError")}} 实例却通过原型链继承到了一些方法。</p> + +<h2 id="Specifications">Specifications</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('ES3')}}</td> + <td>{{Spec2('ES3')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.11.7.6', 'NativeError.prototype')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td>Defined as <code><em>NativeError</em>.prototype</code>.</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-nativeerror.prototype', 'NativeError.prototype')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Defined as <code><em>NativeError</em>.prototype</code>.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-nativeerror.prototype', 'NativeError.prototype')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td>Defined as <code><em>NativeError</em>.prototype</code>.</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility">Browser compatibility</h2> + +<div> + + +<p>{{Compat("javascript.builtins.RangeError")}}</p> +</div> + +<h2 id="See_also">See also</h2> + +<ul> + <li>{{jsxref("Error.prototype")}}</li> + <li>{{jsxref("Function.prototype")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/referenceerror/index.html b/files/zh-cn/web/javascript/reference/global_objects/referenceerror/index.html new file mode 100644 index 0000000000..1d42786c00 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/referenceerror/index.html @@ -0,0 +1,168 @@ +--- +title: ReferenceError +slug: Web/JavaScript/Reference/Global_Objects/ReferenceError +translation_of: Web/JavaScript/Reference/Global_Objects/ReferenceError +--- +<div>{{JSRef("Global_Objects", "Error", "EvalError,InternalError,RangeError,ReferenceError,SyntaxError,TypeError,URIError")}}</div> + +<h2 id="Summary" name="Summary">概述</h2> + +<p><code><strong>ReferenceError（引用错误）</strong></code> 对象代表当一个不存在的变量被引用时发生的错误。</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code>new ReferenceError([<var>message</var>[, <var>fileName</var>[, <var>lineNumber</var>]]])</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>message</code></dt> + <dd>可选。描述可读的错误信息</dd> + <dt><code>fileName</code> {{non-standard_inline}}</dt> + <dd>可选。包含引起异常代码的文件名</dd> + <dt><code>lineNumber</code> {{non-standard_inline}}</dt> + <dd>可选。引起异常的代码行号</dd> +</dl> + +<h2 id="Description" name="Description">描述</h2> + +<p>当你尝试引用一个未被定义的变量时，将会抛出一个 <code>ReferenceError</code> 。</p> + +<h2 id="Properties" name="Properties">属性</h2> + +<dl> + <dt>{{jsxref("ReferenceError.prototype")}}</dt> + <dd>Allows the addition of properties to an <code>ReferenceError</code> object.</dd> +</dl> + +<h2 id="Methods" name="Methods">方法</h2> + +<p>全局的 <code>ReferenceError</code> 本身并不包含有方法，但是他可以从原型链上继承一些方法</p> + +<h2 id="ReferenceError_instances" name="ReferenceError_instances"><code>ReferenceError</code> 实例</h2> + +<h3 id="Properties_of_ReferenceError_instances" name="Properties_of_ReferenceError_instances">属性</h3> + +<div>{{page('/en-US/docs/Web/JavaScript/Reference/Global_Objects/ReferenceError/prototype', 'Properties')}}</div> + +<h3 id="Methods_of_ReferenceError_instances" name="Methods_of_ReferenceError_instances">方法</h3> + +<div>{{page('/en-US/docs/Web/JavaScript/Reference/Global_Objects/ReferenceError/prototype', 'Methods')}}</div> + +<h2 id="Examples" name="Examples">例子</h2> + +<h3 id="Example:_Catch_an_ReferenceError" name="Example:_Catch_an_ReferenceError">例: 捕获一个 <code>ReferenceError</code></h3> + +<pre class="brush: js">try { + var a = undefinedVariable; +} catch (e) { + console.log(e instanceof ReferenceError); // true + console.log(e.message); // "undefinedVariable is not defined" + console.log(e.name); // "ReferenceError" + console.log(e.fileName); // "Scratchpad/1" + console.log(e.lineNumber); // 2 + console.log(e.columnNumber); // 6 + console.log(e.stack); // "@Scratchpad/2:2:7\n" +} +</pre> + +<h3 id="Example:_Create_an_ReferenceError" name="Example:_Create_an_ReferenceError">例: 创建一个 <code>ReferenceError</code></h3> + +<pre class="brush: js">try { + throw new ReferenceError('Hello', 'someFile.js', 10); +} catch (e) { + console.log(e instanceof ReferenceError); // true + console.log(e.message); // "Hello" + console.log(e.name); // "ReferenceError" + console.log(e.fileName); // "someFile.js" + console.log(e.lineNumber); // 10 + console.log(e.columnNumber); // 0 + console.log(e.stack); // "@Scratchpad/2:2:9\n" +} +</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>ECMAScript 3rd Edition.</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.11.6.3', 'ReferenceError')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-native-error-types-used-in-this-standard-referenceerror', 'ReferenceError')}}</td> + <td>{{Spec2('ES6')}}</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>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</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>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("Error")}}</li> + <li>{{jsxref("ReferenceError.prototype")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/referenceerror/prototype/index.html b/files/zh-cn/web/javascript/reference/global_objects/referenceerror/prototype/index.html new file mode 100644 index 0000000000..90f74dc4b1 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/referenceerror/prototype/index.html @@ -0,0 +1,92 @@ +--- +title: ReferenceError.prototype +slug: Web/JavaScript/Reference/Global_Objects/ReferenceError/prototype +tags: + - Error + - JavaScript + - Property + - Prototype + - ReferenceError +translation_of: Web/JavaScript/Reference/Global_Objects/ReferenceError +--- +<div>{{JSRef}}</div> + +<p><code><strong>ReferenceError.prototype</strong></code> 表示 {{jsxref("ReferenceError")}} 的原型构造器。</p> + +<div>{{js_property_attributes(0, 0, 0)}}</div> + +<h2 id="描述">描述</h2> + +<p>所有{{jsxref("ReferenceError")}} 实例都继承自 <code>ReferenceError.prototype</code>. 你可以使用原型来为所有实例添加属性和方法。</p> + +<h2 id="属性">属性</h2> + +<dl> + <dt><code>ReferenceError.prototype.constructor</code></dt> + <dd>创建一个实例原型的函数。</dd> + <dt>{{jsxref("Error.prototype.message", "ReferenceError.prototype.message")}}</dt> + <dd>错误信息。尽管ECMA-262 曾表示 {{jsxref("ReferenceError")}} 应该提供自己的 <code>message</code> 属性, 在 <a href="/en-US/docs/Mozilla/Projects/SpiderMonkey">SpiderMonkey</a> 中, 它继承自{{jsxref("Error.prototype.message")}}.</dd> + <dt>{{jsxref("Error.prototype.name", "ReferenceError.prototype.name")}}</dt> + <dd>错误名称. 继承自{{jsxref("Error")}}.</dd> + <dt>{{jsxref("Error.prototype.fileName", "ReferenceError.prototype.fileName")}}</dt> + <dd>出现这个错误的路径. 继承自 {{jsxref("Error")}}.</dd> + <dt>{{jsxref("Error.prototype.lineNumber", "ReferenceError.prototype.lineNumber")}}</dt> + <dd>出现这个错误的行号. 继承自 {{jsxref("Error")}}.</dd> + <dt>{{jsxref("Error.prototype.columnNumber", "ReferenceError.prototype.columnNumber")}}</dt> + <dd>出现这个错误的列号. 继承自 {{jsxref("Error")}}.</dd> + <dt>{{jsxref("Error.prototype.stack", "ReferenceError.prototype.stack")}}</dt> + <dd>堆栈追踪. 继承自 {{jsxref("Error")}}.</dd> +</dl> + +<h2 id="方法">方法</h2> + +<p>尽管 {{jsxref("ReferenceError")}} 原型对象自身没有包括任何方法, {{jsxref("ReferenceError")}} 实例确实从原型链中继承了一些方法。</p> + +<h2 id="规格">规格</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规格版本</th> + <th scope="col">状态</th> + <th scope="col">注释</th> + </tr> + <tr> + <td>{{SpecName('ES3')}}</td> + <td>{{Spec2('ES3')}}</td> + <td>初始定义</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.11.7.6', 'NativeError.prototype')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> + <p>Defined as <code><em>NativeError</em>.prototype</code>.</p> + </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-nativeerror.prototype', 'NativeError.prototype')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Defined as <code><em>NativeError</em>.prototype</code>.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-nativeerror.prototype', 'NativeError.prototype')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td>Defined as <code><em>NativeError</em>.prototype</code>.</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> + + +<p>{{Compat("javascript.builtins.ReferenceError")}}</p> +</div> + +<h2 id="参见">参见</h2> + +<ul> + <li>{{jsxref("Error.prototype")}}</li> + <li>{{jsxref("Function.prototype")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/reflect/apply/index.html b/files/zh-cn/web/javascript/reference/global_objects/reflect/apply/index.html new file mode 100644 index 0000000000..d3cb19ec78 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/reflect/apply/index.html @@ -0,0 +1,101 @@ +--- +title: Reflect.apply() +slug: Web/JavaScript/Reference/Global_Objects/Reflect/apply +tags: + - JavaScript + - Method + - Reference + - Reflect +translation_of: Web/JavaScript/Reference/Global_Objects/Reflect/apply +--- +<div>{{JSRef}}</div> + +<p>静态方法 <code><strong>Reflect</strong></code><strong><code>.apply()</code></strong> 通过指定的参数列表发起对目标(target)函数的调用。</p> + +<div>{{EmbedInteractiveExample("pages/js/reflect-apply.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">Reflect.apply(target, thisArgument, argumentsList) +</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt>target</dt> + <dd>目标函数。</dd> + <dt>thisArgument</dt> + <dd>target函数调用时绑定的this对象。</dd> + <dt>argumentsList</dt> + <dd>target函数调用时传入的实参列表，该参数应该是一个类数组的对象。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>返回值是调用完带着指定参数和 <code>this</code> 值的给定的函数后返回的结果。</p> + +<h3 id="异常">异常</h3> + +<p>如果 <code>target</code> 对象不可调用，抛出 {{jsxref("TypeError")}}。</p> + +<h2 id="描述">描述</h2> + +<p>该方法与ES5中{{jsxref("Function.prototype.apply()")}}方法类似：调用一个方法并且显式地指定 <code>this</code> 变量和参数列表(arguments) ，参数列表可以是数组，或类似数组的对象。</p> + +<pre class="brush: js">Function.prototype.apply.call(Math.floor, undefined, [1.75]);</pre> + +<p>使用 <code>Reflect.apply</code> 方法会使代码更加简洁易懂。</p> + +<h2 id="使用示例">使用示例</h2> + +<h3 id="Reflect.apply"><code>Reflect.apply()</code></h3> + +<pre class="brush: js">Reflect.apply(Math.floor, undefined, [1.75]); +// 1; + +Reflect.apply(String.fromCharCode, undefined, [104, 101, 108, 108, 111]); +// "hello" + +Reflect.apply(RegExp.prototype.exec, /ab/, ["confabulation"]).index; +// 4 + +Reflect.apply("".charAt, "ponies", [3]); +// "i" +</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('ES6', '#sec-reflect.apply', 'Reflect.apply')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>首次定义.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-reflect.apply', 'Reflect.apply')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.Reflect.apply")}}</p> + +<h2 id="相关连接">相关连接</h2> + +<ul> + <li>{{jsxref("Reflect")}}</li> + <li>{{jsxref("Function.prototype.apply()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/reflect/construct/index.html b/files/zh-cn/web/javascript/reference/global_objects/reflect/construct/index.html new file mode 100644 index 0000000000..8c6c4e2126 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/reflect/construct/index.html @@ -0,0 +1,189 @@ +--- +title: Reflect.construct() +slug: Web/JavaScript/Reference/Global_Objects/Reflect/construct +translation_of: Web/JavaScript/Reference/Global_Objects/Reflect/construct +--- +<div>{{JSRef}}</div> + +<p><code><strong>Reflect</strong></code><strong><code>.construct()</code></strong> 方法的行为有点像 <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/new"><code>new</code> 操作符</a> 构造函数 ， 相当于运行 <code>new target(...args)</code>.</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox notranslate">Reflect.construct(target, argumentsList[, newTarget]) +</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>target</code></dt> + <dd>被运行的目标构造函数</dd> + <dt><code>argumentsList</code></dt> + <dd>类数组，目标构造函数调用时的参数。</dd> + <dt><code>newTarget</code> {{optional_inline}}</dt> + <dd>作为新创建对象的原型对象的<code>constructor</code>属性， 参考 <code><a href="/en-US/docs/Web/JavaScript/Reference/Operators/new.target">new.target</a></code> 操作符，默认值为<code>target。</code></dd> +</dl> + +<h3 id="返回值"><code>返回值</code></h3> + +<p>以<code>target</code>（如果<code>newTarget</code>存在，则为<code>newTarget</code>）函数为构造函数，<code>argumentList</code>为其初始化参数的对象实例。</p> + +<h3 id="异常">异常</h3> + +<p>如果target或者newTarget不是构造函数，抛出{{jsxref("TypeError")}},异常。</p> + +<h2 id="描述">描述</h2> + +<p><code>Reflect.construct</code>允许你使用可变的参数来调用构造函数 ，这和使用<a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Operators/new">new操作符</a>搭配<a href="https://developer.mozilla.org/ zh-CN/docs/Web/JavaScript/Reference/Operators/new">对象展开符</a>调用一样。</p> + +<pre class="brush: js notranslate">var obj = new Foo(...args); +var obj = Reflect.construct(Foo, args); </pre> + +<h3 id="Reflect.construct_vs_Object.create"><code>Reflect.construct()</code> vs <code>Object.create()</code></h3> + +<p><code><font face="Arial, x-locale-body, sans-serif"><span style="background-color: #ffffff;">在新语法</span></font>Reflect</code>出现之前，是通过明确指定构造函数和原型对象（ 使用{{jsxref("Object.create()")}}）来创建一个对象的。</p> + +<pre class="brush: js notranslate">function OneClass() { + this.name = 'one'; +} + +function OtherClass() { + this.name = 'other'; +} + +// 创建一个对象: +var obj1 = Reflect.construct(OneClass, args, OtherClass); + +// 与上述方法等效: +var obj2 = Object.create(OtherClass.prototype); +OneClass.apply(obj2, args); + +console.log(obj1.name); // 'one' +console.log(obj2.name); // 'one' + +console.log(obj1 instanceof OneClass); // false +console.log(obj2 instanceof OneClass); // false + +console.log(obj1 instanceof OtherClass); // true +console.log(obj2 instanceof OtherClass); // true</pre> + +<p>虽然两种方式结果相同，但在创建对象过程中仍一点不同。 </p> + +<p><font face="Arial, x-locale-body, sans-serif"><span style="background-color: #ffffff;">当使用</span></font><code>Object.create()</code>和{{jsxref("Function.prototype.apply()")}}时，如果不使用<code>new</code>操作符调用构造函数，构造函数内部的<code>new.target</code>值会指向<code>undefined</code>。</p> + +<p>当调用<code>Reflect.construct()</code>来创建对象，<code>new.target</code>值会自动指定到<code>target</code>（或者newTarget，前提是newTarget指定了）。</p> + +<pre class="brush: js notranslate">function OneClass() { + console.log('OneClass'); + console.log(new.target); +} +function OtherClass() { + console.log('OtherClass'); + console.log(new.target); +} + +var obj1 = Reflect.construct(OneClass, args); +// 输出: +// OneClass +// function OneClass { ... } + +var obj2 = Reflect.construct(OneClass, args, OtherClass); +// 输出: +// OneClass +// function OtherClass { ... } + +var obj3 = Object.create(OtherClass.prototype); +OneClass.apply(obj3, args); +// 输出: +// OneClass +// undefined</pre> + +<h2 id="举例"><font face="x-locale-heading-primary, zillaslab, Palatino, Palatino Linotype, x-locale-heading-secondary, serif"><span style="font-size: 37.33327865600586px;"><strong>举例</strong></span></font></h2> + +<h3 id="使用_Reflect.construct">使用 <code>Reflect.construct()</code></h3> + +<pre class="brush: js notranslate">var d = Reflect.construct(Date, [1776, 6, 4]); +d instanceof Date; // true +d.getFullYear(); // 1776 +</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('ES6', '#sec-reflect.construct', 'Reflect.construct')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-reflect.construct', 'Reflect.construct')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容">浏览器兼容</h2> + +<p>{{CompatibilityTable}}</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>49</td> + <td>{{CompatGeckoDesktop(42)}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</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>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatGeckoMobile(42)}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Reflect")}}</li> + <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/new"><code>new</code></a></li> + <li><code><a href="/en-US/docs/Web/JavaScript/Reference/Operators/new.target">new.target</a></code></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/reflect/defineproperty/index.html b/files/zh-cn/web/javascript/reference/global_objects/reflect/defineproperty/index.html new file mode 100644 index 0000000000..14882c24b9 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/reflect/defineproperty/index.html @@ -0,0 +1,87 @@ +--- +title: Reflect.defineProperty() +slug: Web/JavaScript/Reference/Global_Objects/Reflect/defineProperty +tags: + - ECMAScript 2016 + - JavaScript + - Method + - Reflect +translation_of: Web/JavaScript/Reference/Global_Objects/Reflect/defineProperty +--- +<div>{{JSRef}}</div> + +<p>静态方法 <code><strong>Reflect</strong></code><strong><code>.defineProperty()</code></strong> 基本等同于 {{jsxref("Object.defineProperty()")}} 方法，唯一不同是返回 {{jsxref("Boolean")}} 值。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox notranslate">Reflect.defineProperty(target, propertyKey, attributes) +</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>target</code></dt> + <dd>目标对象。</dd> + <dt><code>propertyKey</code></dt> + <dd>要定义或修改的属性的名称。</dd> + <dt><code>attributes</code></dt> + <dd>要定义或修改的属性的描述。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p> {{jsxref("Boolean")}} 值指示了属性是否被成功定义。</p> + +<h3 id="异常">异常</h3> + +<p>如果<code>target</code>不是 {{jsxref("Object")}}，抛出一个 {{jsxref("TypeError")}}。</p> + +<h2 id="描述">描述</h2> + +<p><code>Reflect.defineProperty</code> 方法允许精确添加或修改对象上的属性。更多的细节请参阅类似的{{jsxref("Object.defineProperty")}} 。</p> + +<div class="blockIndicator note"> +<p><strong>区别：</strong><code>Object.defineProperty </code>返回一个对象，或者如果属性没有被成功定义，抛出一个 {{jsxref("TypeError")}} 。 相比之下，<code>Reflect.defineProperty</code>方法只返回一个 {{jsxref("Boolean")}} ，来说明该属性是否被成功定义。</p> +</div> + +<h2 id="示例">示例</h2> + +<h3 id="使用_Reflect.defineProperty">使用 <code>Reflect.defineProperty()</code></h3> + +<pre class="notranslate">let obj = {} +Reflect.defineProperty(obj, 'x', {value: 7}) // true +obj.x // 7</pre> + +<h3 id="检查属性是否被成功定义">检查属性是否被成功定义</h3> + +<p>{{jsxref("Object.defineProperty")}} 方法，如果成功则返回一个对象，否则抛出一个 {{jsxref("TypeError")}} 。另外，当定义一个属性时，你也可以使用 <code><a href="/en-US/docs/Web/JavaScript/Reference/Statements/try...catch">try...catch</a></code> 去捕获其中任何的错误。而因为 <code>Reflect.defineProperty</code> 返回 Boolean 值作为成功的标识，所以只能使用 <code><a href="/en-US/docs/Web/JavaScript/Reference/Statements/if...else">if...else</a></code> ：</p> + +<pre class="brush: js notranslate">if (Reflect.defineProperty(target, property, attributes)) { + // 成功 +} else { + // 失败 +}</pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Specification</th> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-reflect.defineproperty', 'Reflect.defineProperty')}}</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{Compat("javascript.builtins.Reflect.defineProperty")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Reflect")}}</li> + <li>{{jsxref("Object.defineProperty()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/reflect/deleteproperty/index.html b/files/zh-cn/web/javascript/reference/global_objects/reflect/deleteproperty/index.html new file mode 100644 index 0000000000..3be36d7965 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/reflect/deleteproperty/index.html @@ -0,0 +1,134 @@ +--- +title: Reflect.deleteProperty() +slug: Web/JavaScript/Reference/Global_Objects/Reflect/deleteProperty +translation_of: Web/JavaScript/Reference/Global_Objects/Reflect/deleteProperty +--- +<div>{{JSRef}}</div> + +<p>静态方法 <code><strong>Reflect</strong></code><strong><code>.deleteProperty()</code></strong> 允许用于删除属性。它很像 <a href="/en-US/docs/Web/JavaScript/Reference/Operators/delete"><code>delete</code> operator</a> ，但它是一个函数。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">Reflect.deleteProperty(target, propertyKey) +</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>target</code></dt> + <dd>删除属性的目标对象。</dd> + <dt><code>propertyKey</code></dt> + <dd>需要删除的属性的名称。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>{{jsxref("Boolean")}} 值表明该属性是否被成功删除。</p> + +<h3 id="异常">异常</h3> + +<p>抛出一个 {{jsxref("TypeError")}}，如果<code>target</code>不是 {{jsxref("Object")}}。</p> + +<h2 id="描述">描述</h2> + +<p><code>Reflect.deleteProperty</code> 允许你删除一个对象上的属性。返回一个 {{jsxref("Boolean")}} 值表示该属性是否被成功删除。它几乎与非严格的 <a href="/zh-CN/docs/Web/JavaScript/Reference/Operators/delete"><code>delete</code> operator</a> 相同。</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用_Reflect.deleteProperty()">使用 <code>Reflect.deleteProperty()</code></h3> + +<pre class="brush: js">var obj = { x: 1, y: 2 }; +Reflect.deleteProperty(obj, "x"); // true +obj; // { y: 2 } + +var arr = [1, 2, 3, 4, 5]; +Reflect.deleteProperty(arr, "3"); // true +arr; // [1, 2, 3, , 5] + +// 如果属性不存在，返回 true +Reflect.deleteProperty({}, "foo"); // true + +// 如果属性不可配置，返回 false +Reflect.deleteProperty(Object.freeze({foo: 1}), "foo"); // false +</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('ES6', '#sec-reflect.deleteproperty', 'Reflect.deleteProperty')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-reflect.deleteproperty', 'Reflect.deleteProperty')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{CompatibilityTable}}</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>49</td> + <td>{{CompatGeckoDesktop(42)}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>10</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>{{CompatNo}}</td> + <td>49</td> + <td>{{CompatGeckoMobile(42)}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>10</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Reflect")}}</li> + <li><a href="/en-US/docs/Web/JavaScript/Reference/Operators/delete"><code>delete</code> operator</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/reflect/get/index.html b/files/zh-cn/web/javascript/reference/global_objects/reflect/get/index.html new file mode 100644 index 0000000000..340178d61f --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/reflect/get/index.html @@ -0,0 +1,90 @@ +--- +title: Reflect.get() +slug: Web/JavaScript/Reference/Global_Objects/Reflect/get +translation_of: Web/JavaScript/Reference/Global_Objects/Reflect/get +--- +<div>{{JSRef}}</div> + +<p><code><strong>Reflect</strong></code><strong><code>.get()</code></strong>方法与从 对象 (<code>target[propertyKey]</code>) 中读取属性类似，但它是通过一个函数执行来操作的。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">Reflect.get(target, propertyKey[, receiver]) +</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>target</code></dt> + <dd>需要取值的目标对象</dd> + <dt><code>propertyKey</code></dt> + <dd>需要获取的值的键值</dd> + <dt>receiver</dt> + <dd>如果<code>target</code>对象中指定了<code>getter</code>，<code>receiver</code>则为<code>getter</code>调用时的<code>this</code>值。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>属性的值。</p> + +<h3 id="异常">异常</h3> + +<p>如果目标值类型不是 {{jsxref("Object")}}，则抛出一个 {{jsxref("TypeError")}}。</p> + +<h2 id="描述">描述</h2> + +<p><code>Reflect.get</code>方法允许你从一个对象中取属性值。就如同<a href="/en-US/docs/Web/JavaScript/Reference/Operators/Property_Accessors">属性访问器</a> 语法，但却是通过函数调用来实现。</p> + +<h2 id="实例">实例</h2> + +<h3 id="使用_Reflect.get"><code><font face="Open Sans, Arial, sans-serif">使用 </font>Reflect.get()</code></h3> + +<pre class="brush: js">// Object +var obj = { x: 1, y: 2 }; +Reflect.get(obj, "x"); // 1 + +// Array +Reflect.get(["zero", "one"], 1); // "one" + +// Proxy with a get handler +var x = {p: 1}; +var obj = new Proxy(x, { + get(t, k, r) { return k + "bar"; } +}); +Reflect.get(obj, "foo"); // "foobar" +</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('ES6', '#sec-reflect.get', 'Reflect.get')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-reflect.get', 'Reflect.get')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{Compat("javascript.builtins.Reflect.get")}}</p> + +<div id="compat-desktop"></div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Reflect")}}</li> + <li><a href="/en-US/docs/Web/JavaScript/Reference/Operators/Property_Accessors">Property accessors</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/reflect/getownpropertydescriptor/index.html b/files/zh-cn/web/javascript/reference/global_objects/reflect/getownpropertydescriptor/index.html new file mode 100644 index 0000000000..e999254e32 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/reflect/getownpropertydescriptor/index.html @@ -0,0 +1,139 @@ +--- +title: Reflect.getOwnPropertyDescriptor() +slug: Web/JavaScript/Reference/Global_Objects/Reflect/getOwnPropertyDescriptor +translation_of: Web/JavaScript/Reference/Global_Objects/Reflect/getOwnPropertyDescriptor +--- +<div>{{JSRef}}</div> + +<p>静态方法 <code><strong>Reflect</strong></code><strong><code>.getOwnPropertyDescriptor()</code></strong> 与 {{jsxref("Object.getOwnPropertyDescriptor()")}} 方法相似。如果在对象中存在，则返回给定的属性的属性描述符。否则返回 {{jsxref("undefined")}}。 </p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">Reflect.getOwnPropertyDescriptor(target, propertyKey) +</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>target</code></dt> + <dd>需要寻找属性的目标对象。</dd> + <dt><code>propertyKey</code></dt> + <dd>获取自己的属性描述符的属性的名称。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>如果属性存在于给定的目标对象中，则返回属性描述符；否则，返回 {{jsxref("undefined")}}。</p> + +<h3 id="异常">异常</h3> + +<p>抛出一个 {{jsxref("TypeError")}}，如果目标不是 {{jsxref("Object")}}。</p> + +<h2 id="描述">描述</h2> + +<p><code>Reflect.getOwnPropertyDescriptor</code>方法返回一个属性描述符，如果给定的属性存在于对象中，否则返回 {{jsxref("undefined")}} 。 与 {{jsxref("Object.getOwnPropertyDescriptor()")}} 的唯一不同在于如何处理非对象目标。</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用_Reflect.getOwnPropertyDescriptor()">使用 <code>Reflect.getOwnPropertyDescriptor()</code></h3> + +<pre class="brush: js">Reflect.getOwnPropertyDescriptor({x: "hello"}, "x"); +// {value: "hello", writable: true, enumerable: true, configurable: true} + +Reflect.getOwnPropertyDescriptor({x: "hello"}, "y"); +// undefined + +Reflect.getOwnPropertyDescriptor([], "length"); +// {value: 0, writable: true, enumerable: false, configurable: false} +</pre> + +<h3 id="与_Object.getOwnPropertyDescriptor()_的不同点">与 <code>Object.getOwnPropertyDescriptor() 的不同点</code></h3> + +<p>如果该方法的第一个参数不是一个对象（一个原始值），那么将造成 {{jsxref("TypeError")}} 错误。而对于 {{jsxref("Object.getOwnPropertyDescriptor")}}，非对象的第一个参数将被强制转换为一个对象处理。</p> + +<pre class="brush: js">Reflect.getOwnPropertyDescriptor("foo", 0); +// TypeError: "foo" is not non-null object + +Object.getOwnPropertyDescriptor("foo", 0); +// { value: "f", writable: false, enumerable: true, configurable: false }</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('ES6', '#sec-reflect.getownpropertydescriptor', 'Reflect.getOwnPropertyDescriptor')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-reflect.getownpropertydescriptor', 'Reflect.getOwnPropertyDescriptor')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{CompatibilityTable}}</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>49</td> + <td>{{CompatGeckoDesktop(42)}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>10</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>{{CompatNo}}</td> + <td>49</td> + <td>{{CompatGeckoMobile(42)}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>10</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Reflect")}}</li> + <li>{{jsxref("Object.getOwnPropertyDescriptor()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/reflect/getprototypeof/index.html b/files/zh-cn/web/javascript/reference/global_objects/reflect/getprototypeof/index.html new file mode 100644 index 0000000000..8189b3fb0f --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/reflect/getprototypeof/index.html @@ -0,0 +1,84 @@ +--- +title: Reflect.getPrototypeOf() +slug: Web/JavaScript/Reference/Global_Objects/Reflect/getPrototypeOf +translation_of: Web/JavaScript/Reference/Global_Objects/Reflect/getPrototypeOf +--- +<div>{{JSRef}}</div> + +<p>静态方法 <code><strong>Reflect</strong></code><strong><code>.getPrototypeOf()</code></strong> 与 {{jsxref("Object.getPrototypeOf()")}} 方法几乎是一样的。都是返回指定对象的原型（即内部的 <code>[[Prototype]]</code> 属性的值）。</p> + +<p>{{EmbedInteractiveExample("pages/js/reflect-getprototypeof.html")}}</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">Reflect.getPrototypeOf(target) +</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>target</code></dt> + <dd>获取原型的目标对象。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>给定对象的原型。如果给定对象没有继承的属性，则返回 {{jsxref("null")}}。</p> + +<h3 id="异常">异常</h3> + +<p>如果 <code><var>target</var></code> 不是 {{jsxref("Object")}}，抛出一个 {{jsxref("TypeError")}} 异常。</p> + +<h2 id="描述">描述</h2> + +<p><code>Reflect.getPrototypeOf</code> 返回指定对象的原型 (即内部的 <code>[[Prototype]]</code> 属性的值) 。</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用_Reflect.getPrototypeOf">使用 <code>Reflect.getPrototypeOf()</code></h3> + +<pre class="brush: js">Reflect.getPrototypeOf({}); // Object.prototype +Reflect.getPrototypeOf(Object.prototype); // null +Reflect.getPrototypeOf(Object.create(null)); // null +</pre> + +<h3 id="与_Object.getPrototypeOf_比较">与 <code>Object.getPrototypeOf()</code> 比较</h3> + +<pre>// 如果参数为 Object，返回结果相同 +Object.getPrototypeOf({}) // Object.prototype +Reflect.getPrototypeOf({}) // Object.prototype + +// 在 ES5 规范下，对于非 Object，抛异常 +Object.getPrototypeOf('foo') // Throws TypeError +Reflect.getPrototypeOf('foo') // Throws TypeError + +// 在 ES2015 规范下，Reflect 抛异常, Object 强制转换非 Object +Object.getPrototypeOf('foo') // String.prototype +Reflect.getPrototypeOf('foo') // Throws TypeError + +// 如果想要模拟 Object 在 ES2015 规范下的表现，需要强制类型转换 +Reflect.getPrototypeOf(Object('foo')) // String.prototype</pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Specification</th> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-reflect.getprototypeof', 'Reflect.getPrototypeOf')}}</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{Compat("javascript.builtins.Reflect.getPrototypeOf")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Reflect")}}</li> + <li>{{jsxref("Object.getPrototypeOf()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/reflect/has/index.html b/files/zh-cn/web/javascript/reference/global_objects/reflect/has/index.html new file mode 100644 index 0000000000..aaf55532e3 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/reflect/has/index.html @@ -0,0 +1,133 @@ +--- +title: Reflect.has() +slug: Web/JavaScript/Reference/Global_Objects/Reflect/has +translation_of: Web/JavaScript/Reference/Global_Objects/Reflect/has +--- +<div>{{JSRef}}</div> + +<p>静态方法 <code><strong>Reflect</strong></code><strong><code>.has()</code></strong> 作用与 <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/in"><code>in</code> 操作符</a> 相同。</p> + +<h2 id="句法">句法</h2> + +<pre class="syntaxbox">Reflect.has(target, propertyKey) +</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>target</code></dt> + <dd>目标对象.</dd> + <dt><code>propertyKey</code></dt> + <dd>属性名，需要检查目标对象是否存在此属性。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>一个 {{jsxref("Boolean")}} 类型的对象指示是否存在此属性。</p> + +<h3 id="异常">异常</h3> + +<p>如果目标对象并非{{jsxref("Object")}} 类型，抛出{{jsxref("TypeError")}}。</p> + +<h2 id="描述">描述</h2> + +<p><code>Reflect.has</code> 用于检查一个对象是否拥有某个属性， 相当于<a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/in"><code>in</code> 操作符</a> 。</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用_Reflect.has()">使用 <code>Reflect.has()</code></h3> + +<pre class="brush: js">Reflect.has({x: 0}, "x"); // true +Reflect.has({x: 0}, "y"); // false + +// 如果该属性存在于原型链中，返回true +Reflect.has({x: 0}, "toString"); + +// Proxy 对象的 .has() 句柄方法 +obj = new Proxy({}, { + has(t, k) { return k.startsWith("door"); } +}); +Reflect.has(obj, "doorbell"); // true +Reflect.has(obj, "dormitory"); // false +</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('ES6', '#sec-reflect.has', 'Reflect.has')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-reflect.has', 'Reflect.has')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{CompatibilityTable}}</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>49</td> + <td>{{CompatGeckoDesktop(42)}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</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>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatGeckoMobile(42)}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="相关连接">相关连接</h2> + +<ul> + <li>{{jsxref("Reflect")}}</li> + <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/in"><code>in</code> operator</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/reflect/index.html b/files/zh-cn/web/javascript/reference/global_objects/reflect/index.html new file mode 100644 index 0000000000..c9cb4a36cf --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/reflect/index.html @@ -0,0 +1,106 @@ +--- +title: Reflect +slug: Web/JavaScript/Reference/Global_Objects/Reflect +tags: + - ECMAScript 2015 + - JavaScript + - Overview + - Reflect +translation_of: Web/JavaScript/Reference/Global_Objects/Reflect +--- +<div>{{JSRef}}</div> + +<p><strong>Reflect</strong> 是一个内置的对象，它提供拦截 JavaScript 操作的方法。这些方法与<a href="https://wiki.developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Proxy/handler">proxy handlers</a>的方法相同。<code>Reflect</code>不是一个函数对象，因此它是不可构造的。</p> + +<h2 id="描述">描述</h2> + +<p>与大多数全局对象不同<code>Reflect</code>并非一个构造函数，所以不能通过<a href="/zh-CN/docs/Web/JavaScript/Reference/Operators/new">new运算符</a>对其进行调用，或者将<code>Reflect</code>对象作为一个函数来调用。<code>Reflect</code>的所有属性和方法都是静态的（就像{{jsxref("Math")}}对象）。</p> + +<p><code>Reflect</code> 对象提供了以下静态方法，这些方法与<a href="https://wiki.developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Proxy/handler">proxy handler methods</a>的命名相同.</p> + +<p>其中的一些方法与 {{jsxref("Object")}}相同, 尽管二者之间存在 <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Reflect/Comparing_Reflect_and_Object_methods">某些细微上的差别</a> .</p> + +<h2 id="静态方法">静态方法</h2> + +<dl> + <dt>{{jsxref("Reflect.apply()", "Reflect.apply(<var>target</var>, <var>thisArgument</var>, <var>argumentsList</var>)")}}</dt> + <dd>对一个函数进行调用操作，同时可以传入一个数组作为调用参数。和 {{jsxref("Function.prototype.apply()")}} 功能类似。</dd> + <dt>{{jsxref("Reflect.construct()", "Reflect.construct(<var>target</var>, <var>argumentsList</var>[, <var>newTarget</var>])")}}</dt> + <dd>对构造函数进行 <a href="/zh-CN/docs/Web/JavaScript/Reference/Operators/new"><code>new</code> </a> 操作，相当于执行 <code>new target(...args)</code>。</dd> + <dt>{{jsxref("Reflect.defineProperty()", "Reflect.defineProperty(<var>target</var>, <var>propertyKey</var>, <var>attributes</var>)")}}</dt> + <dd>和 {{jsxref("Object.defineProperty()")}} 类似。如果设置成功就会返回 <code>true</code></dd> + <dt>{{jsxref("Reflect.deleteProperty()", "Reflect.deleteProperty(<var>target</var>, <var>propertyKey</var>)")}}</dt> + <dd>作为函数的<a href="/zh-CN/docs/Web/JavaScript/Reference/Operators/delete"><code>delete</code></a>操作符，相当于执行 <code>delete target[name]</code>。</dd> + <dt>{{jsxref("Reflect.get()", "Reflect.get(<var>target</var>, <var>propertyKey</var>[, <var>receiver</var>])")}}</dt> + <dd>获取对象身上某个属性的值，类似于 <code>target[name]。</code></dd> + <dt>{{jsxref("Reflect.getOwnPropertyDescriptor()", "Reflect.getOwnPropertyDescriptor(<var>target</var>, <var>propertyKey</var>)")}}</dt> + <dd>类似于 {{jsxref("Object.getOwnPropertyDescriptor()")}}。如果对象中存在该属性，则返回对应的属性描述符, 否则返回 {{jsxref("undefined")}}.</dd> + <dt>{{jsxref("Reflect.getPrototypeOf()", "Reflect.getPrototypeOf(<var>target</var>)")}}</dt> + <dd>类似于 {{jsxref("Object.getPrototypeOf()")}}。</dd> + <dt>{{jsxref("Reflect.has()", "Reflect.has(<var>target, propertyKey</var>)")}}</dt> + <dd>判断一个对象是否存在某个属性，和 <a href="/zh-CN/docs/Web/JavaScript/Reference/Operators/in"><code>in</code> 运算符</a> 的功能完全相同。</dd> + <dt>{{jsxref("Reflect.isExtensible()", "Reflect.isExtensible(<var>target</var>)")}}</dt> + <dd>类似于 {{jsxref("Object.isExtensible()")}}.</dd> + <dt>{{jsxref("Reflect.ownKeys()", "Reflect.ownKeys(<var>target</var>)")}}</dt> + <dd>返回一个包含所有自身属性（不包含继承属性）的数组。(类似于 {{jsxref("Object.keys()")}}, 但不会受<code>enumerable影响</code>).</dd> + <dt>{{jsxref("Reflect.preventExtensions()", "Reflect.preventExtensions(<var>target</var>)")}}</dt> + <dd>类似于 {{jsxref("Object.preventExtensions()")}}。返回一个{{jsxref("Boolean")}}。</dd> + <dt>{{jsxref("Reflect.set()", "Reflect.set(<var>target</var>, <var>propertyKey</var>, <var>value</var>[, <var>receiver</var>])")}}</dt> + <dd>将值分配给属性的函数。返回一个{{jsxref("Boolean")}}，如果更新成功，则返回<code>true</code>。</dd> + <dt>{{jsxref("Reflect.setPrototypeOf()", "Reflect.setPrototypeOf(<var>target</var>, <var>prototype</var>)")}}</dt> + <dd>设置对象原型的函数. 返回一个 {{jsxref("Boolean")}}， 如果更新成功，则返回<code>true。</code></dd> +</dl> + +<h2 id="Examples">Examples</h2> + +<h3 id="检测一个对象是否存在特定属性">检测一个对象是否存在特定属性</h3> + +<pre class="notranslate">const duck = { + name: 'Maurice', + color: 'white', + greeting: function() { + console.log(`Quaaaack! My name is ${this.name}`); + } +} + +Reflect.has(duck, 'color'); +// true +Reflect.has(duck, 'haircut'); +// false</pre> + +<h3 id="返回这个对象自身的属性">返回这个对象自身的属性</h3> + +<pre class="notranslate">Reflect.ownKeys(duck); +// [ "name", "color", "greeting" ]</pre> + +<h3 id="为这个对象添加一个新的属性">为这个对象添加一个新的属性</h3> + +<pre class="notranslate">Reflect.set(duck, 'eyes', 'black'); +// returns "true" if successful +// "duck" now contains the property "eyes: 'black'"</pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Specification</th> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-reflect-object', 'Reflect')}}</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容">浏览器兼容</h2> + +<div class="hidden">The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</div> + +<p>{{Compat("javascript.builtins.Reflect")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Proxy")}} 全局对象。</li> + <li>{{jsxref("Proxy.handler", "处理器")}} 对象。</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/reflect/isextensible/index.html b/files/zh-cn/web/javascript/reference/global_objects/reflect/isextensible/index.html new file mode 100644 index 0000000000..a04fbd5fb0 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/reflect/isextensible/index.html @@ -0,0 +1,147 @@ +--- +title: Reflect.isExtensible() +slug: Web/JavaScript/Reference/Global_Objects/Reflect/isExtensible +translation_of: Web/JavaScript/Reference/Global_Objects/Reflect/isExtensible +--- +<div>{{JSRef}}</div> + +<p><code><font face="Open Sans, Arial, sans-serif">静态方法 </font><strong>Reflect</strong></code><strong><code>.isExtensible()</code></strong> 判断一个对象是否可扩展 （即是否能够添加新的属性）。与它 {{jsxref("Object.isExtensible()")}} 方法相似，但有一些不同，详情可见 {{anch("Difference to Object.isExtensible()", "differences")}}。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">Reflect.isExtensible(target) +</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>target</code></dt> + <dd>检查是否可扩展的目标对象。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>返回一个 {{jsxref("Boolean")}} 值表明该对象是否可扩展。</p> + +<h3 id="异常">异常</h3> + +<p>抛出一个 {{jsxref("TypeError")}}，如果对象不是 {{jsxref("Object")}}。</p> + +<h2 id="描述">描述</h2> + +<p><code>Reflect.isExtensible 判断</code>一个对象是否可扩展 （即是否能够添加新的属性）。它与 {{jsxref("Object.isExtensible()")}} 方法一样。</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用_Reflect.isExtensible()">使用 <code>Reflect.isExtensible()</code></h3> + +<p>详情可见 {{jsxref("Object.isExtensible()")}}。</p> + +<pre class="brush: js">// New objects are extensible. +var empty = {}; +Reflect.isExtensible(empty); // === true + +// ...but that can be changed. +Reflect.preventExtensions(empty); +Reflect.isExtensible(empty); // === false + +// Sealed objects are by definition non-extensible. +var sealed = Object.seal({}); +Reflect.isExtensible(sealed); // === false + +// Frozen objects are also by definition non-extensible. +var frozen = Object.freeze({}); +Reflect.isExtensible(frozen); // === false +</pre> + +<h3 id="与_Object.isExtensible()_的不同点">与 <code>Object.isExtensible() 的不同点</code></h3> + +<p>如果该方法的第一个参数不是一个对象（原始值），那么将造成一个 {{jsxref("TypeError")}} 异常。对于 {{jsxref("Object.isExtensible()")}}，非对象的第一个参数会被强制转换为一个对象。</p> + +<pre class="brush: js">Reflect.isExtensible(1); +// TypeError: 1 is not an object + +Object.isExtensible(1); +// false +</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('ES6', '#sec-reflect.isextensible', 'Reflect.isExtensible')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-reflect.isextensible', 'Reflect.isExtensible')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{CompatibilityTable}}</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>49</td> + <td>{{CompatGeckoDesktop(42)}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>10</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>{{CompatNo}}</td> + <td>49</td> + <td>{{CompatGeckoMobile(42)}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>10</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Reflect")}}</li> + <li>{{jsxref("Object.isExtensible()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/reflect/ownkeys/index.html b/files/zh-cn/web/javascript/reference/global_objects/reflect/ownkeys/index.html new file mode 100644 index 0000000000..bfa393f2ff --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/reflect/ownkeys/index.html @@ -0,0 +1,91 @@ +--- +title: Reflect.ownKeys() +slug: Web/JavaScript/Reference/Global_Objects/Reflect/ownKeys +tags: + - Reflect +translation_of: Web/JavaScript/Reference/Global_Objects/Reflect/ownKeys +--- +<div>{{JSRef}}</div> + +<p>静态方法 <code><strong>Reflect</strong></code><strong><code>.ownKeys()</code></strong> 返回一个由目标对象自身的属性键组成的数组。</p> + +<div>{{EmbedInteractiveExample("pages/js/reflect-ownkeys.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">Reflect.ownKeys(target) +</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>target</code></dt> + <dd>获取自身属性键的目标对象。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>由目标对象的自身属性键组成的 {{jsxref("Array")}}。 </p> + +<h3 id="异常">异常</h3> + +<p>如果目标不是 {{jsxref("Object")}}，抛出一个 {{jsxref("TypeError")}}。</p> + +<h2 id="描述">描述</h2> + +<p><code>Reflect.ownKeys</code> 方法返回一个由目标对象自身的属性键组成的数组。它的返回值等同于<code>{{jsxref("Object.getOwnPropertyNames")}}(target).concat({{jsxref("Object.getOwnPropertySymbols")}}(target))。</code></p> + +<h2 id="示例">示例</h2> + +<h3 id="使用_Reflect.ownKeys()">使用 <code>Reflect.ownKeys()</code></h3> + +<pre class="brush: js">Reflect.ownKeys({z: 3, y: 2, x: 1}); // [ "z", "y", "x" ] +Reflect.ownKeys([]); // ["length"] + +var sym = Symbol.for("comet"); +var sym2 = Symbol.for("meteor"); +var obj = {[sym]: 0, "str": 0, "773": 0, "0": 0, + [sym2]: 0, "-1": 0, "8": 0, "second str": 0}; +Reflect.ownKeys(obj); +// [ "0", "8", "773", "str", "-1", "second str", Symbol(comet), Symbol(meteor) ] +// Indexes in numeric order, +// strings in insertion order, +// symbols in insertion order +</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('ES6', '#sec-reflect.ownkeys', 'Reflect.ownKeys')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-reflect.ownkeys', 'Reflect.ownKeys')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容">浏览器兼容</h2> + + + +<p>{{Compat("javascript.builtins.Reflect.ownKeys")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Reflect")}}</li> + <li>{{jsxref("Object.getOwnPropertyNames()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/reflect/preventextensions/index.html b/files/zh-cn/web/javascript/reference/global_objects/reflect/preventextensions/index.html new file mode 100644 index 0000000000..7d24c17fe6 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/reflect/preventextensions/index.html @@ -0,0 +1,93 @@ +--- +title: Reflect.preventExtensions() +slug: Web/JavaScript/Reference/Global_Objects/Reflect/preventExtensions +translation_of: Web/JavaScript/Reference/Global_Objects/Reflect/preventExtensions +--- +<div>{{JSRef}}</div> + +<p>静态方法 <code><strong>Reflect</strong></code><strong><code>.preventExtensions()</code></strong> 方法阻止新属性添加到对象 (例如：防止将来对对象的扩展被添加到对象中)。该方法与 {{jsxref("Object.preventExtensions()")}}相似，但有一些不同点。详情可见 {{anch("与_Object.preventExtensions_的不同点", "differences")}}。</p> + +<p>{{EmbedInteractiveExample("pages/js/reflect-preventextensions.html")}}</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">Reflect.preventExtensions(target) +</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>target</code></dt> + <dd>阻止扩展的目标对象。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>返回一个 {{jsxref("Boolean")}} 值表明目标对象是否成功被设置为不可扩展。</p> + +<h3 id="异常">异常</h3> + +<p>抛出一个 {{jsxref("TypeError")}} 错误，如果 <code>target</code> 不是 {{jsxref("Object")}}。</p> + +<h2 id="描述">描述</h2> + +<p><code>Reflect.preventExtensions</code> 方法阻止新属性添加到对象 (例如：防止将来对对象的扩展被添加到对象中)。该方法与 {{jsxref("Object.preventExtensions()")}} 方法相似。</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用_Reflect.preventExtensions">使用 <code>Reflect.preventExtensions()</code></h3> + +<p>详情可见 {{jsxref("Object.preventExtensions()")}}.</p> + +<pre class="brush: js">// Objects are extensible by default. +var empty = {}; +Reflect.isExtensible(empty); // === true + +// ...but that can be changed. +Reflect.preventExtensions(empty); +Reflect.isExtensible(empty); // === false +</pre> + +<h3 id="与_Object.preventExtensions_的不同点">与 <code>Object.preventExtensions()</code> 的不同点</h3> + +<p>如果该方法的 <em><code>target</code></em> 参数不是一个对象（是原始值），那么将造成一个 {{jsxref("TypeError")}} 异常。 对于{{jsxref("Object.preventExtensions()")}} 方法， 非对象的 <em><code>target</code></em> 参数将被强制转换为对象。</p> + +<pre class="brush: js">Reflect.preventExtensions(1); +// TypeError: 1 is not an object + +Object.preventExtensions(1); +// 1 +</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('ES6', '#sec-reflect.preventextensions', 'Reflect.preventExtensions')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-reflect.preventextensions', 'Reflect.preventExtensions')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{Compat("javascript.builtins.Reflect.preventExtensions")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Reflect")}}</li> + <li>{{jsxref("Object.isExtensible()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/reflect/set/index.html b/files/zh-cn/web/javascript/reference/global_objects/reflect/set/index.html new file mode 100644 index 0000000000..9cb7bbe280 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/reflect/set/index.html @@ -0,0 +1,98 @@ +--- +title: Reflect.set() +slug: Web/JavaScript/Reference/Global_Objects/Reflect/set +translation_of: Web/JavaScript/Reference/Global_Objects/Reflect/set +--- +<div>{{JSRef}}</div> + +<p>静态方法 <code><strong>Reflect</strong></code><strong><code>.set()</code></strong> 工作方式就像在一个对象上设置一个属性。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">Reflect.set(target, propertyKey, value[, receiver]) +</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>target</code></dt> + <dd>设置属性的目标对象。</dd> + <dt><code>propertyKey</code></dt> + <dd>设置的属性的名称。</dd> + <dt><code>value</code></dt> + <dd>设置的值。</dd> + <dt><code>receiver</code></dt> + <dd>如果遇到 <code>setter</code>，<code>receiver</code>则为<code>setter</code>调用时的<code>this</code>值。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>返回一个 {{jsxref("Boolean")}} 值表明是否成功设置属性。</p> + +<h3 id="异常">异常</h3> + +<p>抛出一个 {{jsxref("TypeError")}}，如果目标不是 {{jsxref("Object")}}。</p> + +<h2 id="描述">描述</h2> + +<p><code>Reflect.set</code> 方法允许你在对象上设置属性。它的作用是给属性赋值并且就像 <a href="/en-US/docs/Web/JavaScript/Reference/Operators/Property_Accessors">property accessor</a> 语法一样，但是它是以函数的方式。 </p> + +<h2 id="示例">示例</h2> + +<h3 id="使用_Reflect.set">使用 <code>Reflect.set()</code></h3> + +<pre class="brush: js">// Object +var obj = {}; +Reflect.set(obj, "prop", "value"); // true +obj.prop; // "value" + +// Array +var arr = ["duck", "duck", "duck"]; +Reflect.set(arr, 2, "goose"); // true +arr[2]; // "goose" + +// It can truncate an array. +Reflect.set(arr, "length", 1); // true +arr; // ["duck"]; + +// With just one argument, propertyKey and value are "undefined". +var obj = {}; +Reflect.set(obj); // true +Reflect.getOwnPropertyDescriptor(obj, "undefined"); +// { value: undefined, writable: true, enumerable: true, configurable: true } +</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('ES6', '#sec-reflect.set', 'Reflect.set')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-reflect.set', 'Reflect.set')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.Reflect.set")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Reflect")}}</li> + <li><a href="/en-US/docs/Web/JavaScript/Reference/Operators/Property_Accessors">Property accessors</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/reflect/setprototypeof/index.html b/files/zh-cn/web/javascript/reference/global_objects/reflect/setprototypeof/index.html new file mode 100644 index 0000000000..c7dce35dd3 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/reflect/setprototypeof/index.html @@ -0,0 +1,78 @@ +--- +title: Reflect.setPrototypeOf() +slug: Web/JavaScript/Reference/Global_Objects/Reflect/setPrototypeOf +translation_of: Web/JavaScript/Reference/Global_Objects/Reflect/setPrototypeOf +--- +<div>{{JSRef}}</div> + +<p>除了返回类型以外，静态方法 <code><strong>Reflect</strong></code><strong><code>.setPrototypeOf()</code></strong> 与 {{jsxref("Object.setPrototypeOf()")}} 方法是一样的。它可设置对象的原型（即内部的 <code>[[Prototype]]</code> 属性）为另一个对象或 {{jsxref("null")}}，如果操作成功返回 <code>true</code>，否则返回 <code>false</code>。</p> + +<p>{{EmbedInteractiveExample("pages/js/reflect-setprototypeof.html")}}</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">Reflect.setPrototypeOf(<em>target</em>, <em>prototype</em>) +</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><em><code>target</code></em></dt> + <dd>设置原型的目标对象。</dd> + <dt><em><code>prototype</code></em></dt> + <dd>对象的新原型（一个对象或 {{jsxref("null")}}）。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>返回一个 {{jsxref("Boolean")}} 值表明是否原型已经成功设置。</p> + +<h3 id="异常">异常</h3> + +<p>如果 <em><code>target</code></em> 不是 {{jsxref("Object")}} ，或 <em><code>prototype</code> </em>既不是对象也不是 {{jsxref("null")}}，抛出一个 {{jsxref("TypeError")}} 异常。</p> + +<h2 id="描述">描述</h2> + +<p><code>Reflect.setPrototypeOf</code> 方法改变指定对象的原型（即，内部的 <code>[[Prototype]]</code> 属性值）。</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用_Reflect.setPrototypeOf">使用 <code>Reflect.setPrototypeOf()</code></h3> + +<pre class="brush: js">Reflect.setPrototypeOf({}, Object.prototype); // true + +// It can change an object's [[Prototype]] to null. +Reflect.setPrototypeOf({}, null); // true + +// Returns false if target is not extensible. +Reflect.setPrototypeOf(Object.freeze({}), null); // false + +// Returns false if it cause a prototype chain cycle. +var target = {}; +var proto = Object.create(target); +Reflect.setPrototypeOf(target, proto); // false +</pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Specification</th> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-reflect.setprototypeof', 'Reflect.setPrototypeOf')}}</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{Compat("javascript.builtins.Reflect.setPrototypeOf")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Reflect")}}</li> + <li>{{jsxref("Object.setPrototypeOf()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/reflect/比较_reflect_和_object_方法/index.html b/files/zh-cn/web/javascript/reference/global_objects/reflect/比较_reflect_和_object_方法/index.html new file mode 100644 index 0000000000..43023eae7f --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/reflect/比较_reflect_和_object_方法/index.html @@ -0,0 +1,134 @@ +--- +title: 比较 Reflect 和 Object 方法 +slug: Web/JavaScript/Reference/Global_Objects/Reflect/比较_Reflect_和_Object_方法 +tags: + - Guide + - JavaScript + - Object + - Overview + - Reflect +translation_of: >- + Web/JavaScript/Reference/Global_Objects/Reflect/Comparing_Reflect_and_Object_methods +--- +<div>{{jssidebar}}</div> + +<p>ES2015中引入的 {{jsxref("Reflect")}} 对象是一个内置对象，提供了与JavaScript对象交互的方法。<code>Reflect</code> 上存在的一些静态函数也对应于ES2015之前的{{jsxref("Object")}}上可用的方法。尽管某些方法在行为上看似相似，但它们之间常常存在细微的差异。</p> + +<p>下表详细介绍了<code>Object</code> 和 <code>Reflect</code> API上可用方法之间的差异。请注意，如果API中不存在某种方法，则将其标记为N/A。</p> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Method Name</th> + <th scope="col"><code>Object</code></th> + <th scope="col"><code>Reflect</code></th> + </tr> + </thead> + <tbody> + <tr> + <td><code>defineProperty()</code></td> + <td> + <p>{{jsxref("Object.defineProperty()")}} 返回传递给函数的对象。如果未在对象上成功定义属性，则返回<code>TypeError</code>。</p> + </td> + <td> + <p>如果在对象上定义了属性，则{{jsxref("Reflect.defineProperty()")}}返回<code>true</code>，否则返回<code>false</code>。</p> + </td> + </tr> + <tr> + <td><code>defineProperties()</code></td> + <td> + <p>{{jsxref("Object.defineProperties()")}} 返回传递给函数的对象。如果未在对象上成功定义属性，则返回<code>TypeError</code>。</p> + </td> + <td>N/A</td> + </tr> + <tr> + <td><code>set()</code></td> + <td>N/A</td> + <td> + <p>如果在对象上成功设置了属性，则{{jsxref("Reflect.set()")}}返回<code>true</code>，否则返回<code>false</code>。如果目标不是<code>Object</code>，则抛出<code>TypeError</code></p> + </td> + </tr> + <tr> + <td><code>get()</code></td> + <td>N/A</td> + <td> + <p>{{jsxref("Reflect.get()")}}返回属性的值。如果目标不是<code>Object</code>，则抛出<code>TypeError</code>。</p> + </td> + </tr> + <tr> + <td><code>deleteProperty()</code></td> + <td>N/A</td> + <td> + <p>如果属性从对象中删除，则{{jsxref("Reflect.deleteProperty()")}}返回<code>true</code>，否则返回<code>false</code>。</p> + </td> + </tr> + <tr> + <td><code>getOwnPropertyDescriptor()</code></td> + <td> + <p>如果传入的对象参数上存在{{jsxref("Object.getOwnPropertyDescriptor()")}} ，则会返回给定属性的属性描述符，如果不存在，则返回<code>undefined</code>。</p> + </td> + <td> + <p>如果给定属性存在于对象上，则{{jsxref("Reflect.getOwnPropertyDescriptor()")}} 返回给定属性的属性描述符。如果不存在则返回<code>undefined</code>，如果传入除对象（原始值）以外的任何东西作为第一个参数，则返回<code>TypeError</code></p> + </td> + </tr> + <tr> + <td><code>getOwnPropertyDescriptors()</code></td> + <td> + <p>{{jsxref("Object.getOwnPropertyDescriptors()")}} 返回一个对象，其中包含每个传入对象的属性描述符。如果传入的对象没有拥有的属性描述符，则返回一个空对象。</p> + </td> + <td>N/A</td> + </tr> + <tr> + <td><code>getPrototypeOf()</code></td> + <td> + <p>{{jsxref("Object.getPrototypeOf()")}}返回给定对象的原型。如果没有继承的原型，则返回<code>null。</code>在ES5中为非对象抛出<code>TypeError</code>，但在ES2015中强制为非对象。</p> + </td> + <td> + <p>{{jsxref("Reflect.getPrototypeOf()")}}返回给定对象的原型。如果没有继承的原型，则返回null，并为非对象抛出<code>TypeError</code>。</p> + </td> + </tr> + <tr> + <td><code>setPrototypeOf()</code></td> + <td> + <p>如果对象的原型设置成功，则{{jsxref("Object.setPrototypeOf()")}}返回对象本身。如果设置的原型不是<code>Object</code>或<code>null</code>，或者被修改的对象的原型不可扩展，则抛出<code>TypeError</code>。</p> + </td> + <td> + <p>如果在对象上成功设置了原型，则{{jsxref("Reflect.setPrototypeOf()")}} 返回true，否则返回false（包括原型是否不可扩展）。如果传入的目标不是<code>Object</code>，或者设置的原型不是<code>Object</code>或<code>null</code>，则抛出<code>TypeError</code>。</p> + </td> + </tr> + <tr> + <td><code>isExtensible()</code></td> + <td> + <p>如果对象是可扩展的，则Object.isExtensible（）返回true，否则返回false。如果第一个参数不是对象（原始值），则在ES5中抛出<code>TypeError</code>。在ES2015中，它将被强制为不可扩展的普通对象并返回<code>false</code>。</p> + </td> + <td> + <p>如果对象是可扩展的，则{{jsxref("Reflect.isExtensible()")}} 返回<code>true</code>，否则返回<code>false</code>。如果第一个参数不是对象（原始值），则抛出<code>TypeError</code>。</p> + </td> + </tr> + <tr> + <td><code>preventExtensions()</code></td> + <td> + <p>{{jsxref("Object.preventExtensions()")}} 返回被设为不可扩展的对象。如果参数不是对象（原始值），则在ES5中抛出<code>TypeError</code>。在ES2015中，参数如为不可扩展的普通对象，然后返回对象本身。</p> + </td> + <td> + <p>returns <code>true</code> if the object has been made non-extensible, and <code>false</code> if it has not. Throws a <code>TypeError</code> if the argument is not an object (a primitive).</p> + + <p>如果对象已变得不可扩展，则{{jsxref("Reflect.preventExtensions()")}} 返回<code>true</code>，否则返回<code>false</code>。如果参数不是对象（原始值），则抛出<code>TypeError</code>。</p> + </td> + </tr> + <tr> + <td><code>keys()</code></td> + <td> + <p>{{jsxref("Object.keys()")}}返回一个字符串<code>数组</code>，该字符串映射到目标对象自己的（可枚举）属性键。如果目标不是对象，则在ES5中抛出<code>TypeError</code>，但将非对象目标强制为ES2015中的对象</p> + </td> + <td>N/A</td> + </tr> + <tr> + <td><code>ownKeys()</code></td> + <td>N/A</td> + <td> + <p>{{jsxref("Reflect.ownKeys()")}}返回一个属性名称<font face="consolas, Liberation Mono, courier, monospace"><span style="background-color: rgba(220, 220, 220, 0.5);">数组</span></font>，该属性名称映射到目标对象自己的属性键。如果目标不是<code>Object</code>，则抛出<code>TypeError</code>。</p> + </td> + </tr> + </tbody> +</table> diff --git a/files/zh-cn/web/javascript/reference/global_objects/regexp/@@match/index.html b/files/zh-cn/web/javascript/reference/global_objects/regexp/@@match/index.html new file mode 100644 index 0000000000..28b4431659 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/regexp/@@match/index.html @@ -0,0 +1,109 @@ +--- +title: 'RegExp.prototype[@@match]()' +slug: Web/JavaScript/Reference/Global_Objects/RegExp/@@match +tags: + - JavaScript + - RegExp + - 正则 +translation_of: Web/JavaScript/Reference/Global_Objects/RegExp/@@match +--- +<div>{{JSRef}}</div> + +<p>对<em>正则表达式</em>匹配<em>字符串</em>时，<strong><code>[@@match]()</code></strong>方法用于获取匹配结果。</p> + +<p>{{EmbedInteractiveExample("pages/js/regexp-prototype-@@match.html")}}</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>regexp</var>[Symbol.match](str)</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>str</code></dt> + <dd>match 的目标参数是{{jsxref("String")}}</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>match 方法会返回一个数组，它包括整个匹配结果，和通过捕获组匹配到的结果，如果没有匹配到则返回null</p> + +<h2 id="描述">描述</h2> + +<p>这个方法在 {{jsxref("String.prototype.match()")}} 的内部调用。例如，下面的两个方法返回相同结果。</p> + +<pre class="brush: js">'abc'.match(/a/); + +/a/[Symbol.match]('abc');</pre> + +<p>这个方法为自定义 <code>RegExp</code> 子类中的匹配行为而存在。</p> + +<h2 id="示例">示例</h2> + +<h3 id="直接调用">直接调用</h3> + +<p>这个方法的使用方式和 {{jsxref("String.prototype.match()")}} 相同，不同之处是 <code>this</code> 和参数顺序。</p> + +<pre class="brush: js">var re = /[0-9]+/g; +var str = '2016-01-02'; +var result = re[Symbol.match](str); +console.log(result); // ["2016", "01", "02"] +</pre> + +<h3 id="在子类中使用match">在子类中使用<code>@@match</code></h3> + +<p>{{jsxref("RegExp")}} 的子类可以覆写 <code>[@@match]()</code>方法来修改默认行为。</p> + +<pre class="brush: js">class MyRegExp extends RegExp { + [Symbol.match](str) { + var result = RegExp.prototype[Symbol.match].call(this, str); + if (!result) return null; + return { + group(n) { + return result[n]; + } + }; + } +} + +var re = new MyRegExp('([0-9]+)-([0-9]+)-([0-9]+)'); +var str = '2016-01-02'; +var result = str.match(re); // String.prototype.match calls re[@@match]. +console.log(result.group(1)); // 2016 +console.log(result.group(2)); // 01 +console.log(result.group(3)); // 02 +</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('ESDraft', '#sec-regexp.prototype-@@match', 'RegExp.prototype[@@match]')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> +<p>{{Compat("javascript.builtins.RegExp.@@match")}}</p> +</div> + +<h2 id="另见">另见</h2> + +<ul> + <li>{{jsxref("String.prototype.match()")}}</li> + <li>{{jsxref("RegExp.prototype.@@replace()", "RegExp.prototype[@@replace]()")}}</li> + <li>{{jsxref("RegExp.prototype.@@search()", "RegExp.prototype[@@search]()")}}</li> + <li>{{jsxref("RegExp.prototype.@@split()", "RegExp.prototype[@@split]()")}}</li> + <li>{{jsxref("RegExp.prototype.exec()")}}</li> + <li>{{jsxref("RegExp.prototype.test()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/regexp/@@matchall/index.html b/files/zh-cn/web/javascript/reference/global_objects/regexp/@@matchall/index.html new file mode 100644 index 0000000000..3cc1465704 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/regexp/@@matchall/index.html @@ -0,0 +1,89 @@ +--- +title: 'RegExp.prototype[@@matchAll]()' +slug: Web/JavaScript/Reference/Global_Objects/RegExp/@@matchAll +tags: + - JavaScript + - 正则表达式 +translation_of: Web/JavaScript/Reference/Global_Objects/RegExp/@@matchAll +--- +<p>{{JSRef}}</p> + +<p> <strong><code>[@@matchAll]</code></strong>方法返回对字符串使用正则表达式的所有匹配项。</p> + +<div>\{{EmbedInteractiveExample("pages/js/regexp-prototype-@@matchall.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>regexp</var>[Symbol.matchAll](<var>str</var>)</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>str</code></dt> + <dd>一个{{jsxref("String")}}的匹配对象。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>一个<a href="/zh-CN/docs/Web/JavaScript/Guide/Iterators_and_Generators">迭代器</a>。</p> + +<h2 id="描述">描述</h2> + +<p>本方法在{{jsxref("String.prototype.matchAll()")}}中被内部调用。例如，以下两个示例返回相同的结果。</p> + +<pre class="brush: js">'abc'.matchAll(/a/); + +/a/[Symbol.matchAll]('abc');</pre> + +<p>本方法用于自定义<code>RegExp</code>子类中的匹配行为。</p> + +<h2 id="示例">示例</h2> + +<h3 id="直接调用">直接调用</h3> + +<p>本方法的使用方法几乎与{{jsxref("String.prototype.matchAll()")}}相同，除了<code>this</code> 的不同以及参数顺序的的差异。</p> + +<pre class="brush: js">var re = /[0-9]+/g; +var str = '2016-01-02'; +var result = re[Symbol.matchAll](str); + +console.log(<span class="message-body-wrapper"><span class="message-flex-body"><span class="devtools-monospace message-body"><span class="cm-variable">Array</span>.<span class="cm-property">from</span>(<span class="cm-variable">result</span>, <span class="cm-def">x</span> <span class="cm-operator">=></span> <span class="cm-variable-2">x</span>[<span class="cm-number">0</span>])</span></span></span>); +// ["2016", "01", "02"] +</pre> + +<h3 id="在子类中使用matchAll">在子类中使用<code>@@matchAll</code></h3> + +<p>{{jsxref("RegExp")}}的子类可以重写<code>[@@matchAll]()</code>方法来修改默认行为。例如，返回一个{{jsxref("Array")}}而不是<a href="/zh-CN/docs/Web/JavaScript/Guide/Iterators_and_Generators">iterator</a>:</p> + +<pre class="brush: js">class MyRegExp extends RegExp { + [Symbol.matchAll](str) { + var result = RegExp.prototype[Symbol.matchAll].call(this, str); + if (!result) { + return null; + } else { + return Array.from(result); + } + } +} + +var re = new MyRegExp('([0-9]+)-([0-9]+)-([0-9]+)', 'g'); +var str = '2016-01-02|2019-03-07'; +var result = str.matchAll(re); +console.log(result[0]); // [ "2016-01-02", "2016", "01", "02" ] +console.log(result[1]); // [ "2019-03-07", "2019", "03", "07" ] +</pre> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div class="hidden">The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</div> + +<p>{{Compat("javascript.builtins.RegExp.@@matchAll")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{JSxRef("String.prototype.matchAll()")}}</li> + <li>{{JSxRef("Symbol.matchAll")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/regexp/@@replace/index.html b/files/zh-cn/web/javascript/reference/global_objects/regexp/@@replace/index.html new file mode 100644 index 0000000000..a8604f9415 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/regexp/@@replace/index.html @@ -0,0 +1,120 @@ +--- +title: 'RegExp.prototype[@@replace]()' +slug: Web/JavaScript/Reference/Global_Objects/RegExp/@@replace +tags: + - JavaScript + - RegExp + - 正则表达式 +translation_of: Web/JavaScript/Reference/Global_Objects/RegExp/@@replace +--- +<div>{{JSRef}}</div> + +<p> <strong><code>[@@replace]()</code></strong> 方法会在一个字符串中用给定的替换器，替换所有符合正则模式的匹配项，并返回替换后的新字符串结果。用来替换的参数可以是一个字符串或是一个针对每次匹配的回调函数。</p> + +<p>{{EmbedInteractiveExample("pages/js/regexp-prototype-@@replace.html")}}</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>regexp</var>[Symbol.replace](str, <var>newSubStr</var>|<var>function</var>)</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>str</code></dt> + <dd>正则替换的目标字符串。</dd> + <dt><code>newSubStr (replacement)</code></dt> + <dd>类型为 {{jsxref("String")}} 的替换器。支持大多数特殊的替换匹配模式； 见{{jsxref("String.prototype.replace()")}}页的{{jsxref("String.prototype.replace", "Specifying a string as a parameter", "#Specifying_a_string_as_a_parameter", 1)}}部分。</dd> + <dt><code>function (replacement)</code></dt> + <dd>生成新的子字符串的回调函数替换器。作用于该函数的参数的详细描述见{{jsxref("String.prototype.replace()")}}页的 {{jsxref("String.prototype.replace", "Specifying a function as a parameter", "#Specifying_a_function_as_a_parameter", 1)}} 部分。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>用替换器替换相应匹配项后的新字符串。</p> + +<h2 id="描述">描述</h2> + +<p>如果匹配模式也是{{jsxref("RegExp")}}对象，这个方法在 {{jsxref("String.prototype.replace()")}} 的内部调用。例如，下面的两个方法返回相同结果。</p> + +<pre class="brush: js">'abc'.replace(/a/, 'A'); + +/a/[Symbol.replace]('abc', 'A');</pre> + +<p>该方法是为了在RegExp子类中自定义匹配的替换模式。</p> + +<p>如果匹配模式不是一个{{jsxref("RegExp")}} 对象, {{jsxref("String.prototype.replace()")}} 就不会调用该方法，也不会创建一个 {{jsxref("RegExp")}}对象。</p> + +<h2 id="示例">示例</h2> + +<h3 id="直接调用">直接调用</h3> + +<p>这个方法基本可以和 {{jsxref("String.prototype.replace()")}} 一样使用, 不同之处是 <code>this</code> 和参数顺序。</p> + +<pre class="brush: js">var re = /-/g; +var str = '2016-01-01'; +var newstr = re[Symbol.replace](str, '.'); +console.log(newstr); // 2016.01.01 +</pre> + +<h3 id="在子类中使用replace">在子类中使用@@replace</h3> + +<p>{{jsxref("RegExp")}} 的子类可以覆写 <code>[@@replace]()</code>方法来修改默认行为。</p> + +<pre class="brush: js">class MyRegExp extends RegExp { + constructor(pattern, flags, count) { + super(pattern, flags); + this.count = count; + } + [Symbol.replace](str, replacement) { + // Perform @@replace |count| times. + var result = str; + for (var i = 0; i < this.count; i++) { + result = RegExp.prototype[Symbol.replace].call(this, result, replacement); + } + return result; + } +} + +var re = new MyRegExp('\\d', '', 3); +var str = '01234567'; +var newstr = str.replace(re, '#'); // String.prototype.replace calls re[@@replace]. +console.log(newstr); // ###34567</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>{{SpecName('ES6', '#sec-regexp.prototype-@@replace', 'RegExp.prototype[@@replace]')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>初始定义</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-regexp.prototype-@@replace', 'RegExp.prototype[@@replace]')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> +<p>{{Compat("javascript.builtins.RegExp.@@replace")}}</p> +</div> + +<h2 id="另见">另见</h2> + +<ul> + <li>{{jsxref("String.prototype.replace()")}}</li> + <li>{{jsxref("RegExp.prototype.@@match()", "RegExp.prototype[@@match]()")}}</li> + <li>{{jsxref("RegExp.prototype.@@search()", "RegExp.prototype[@@search]()")}}</li> + <li>{{jsxref("RegExp.prototype.@@split()", "RegExp.prototype[@@split]()")}}</li> + <li>{{jsxref("RegExp.prototype.exec()")}}</li> + <li>{{jsxref("RegExp.prototype.test()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/regexp/@@search/index.html b/files/zh-cn/web/javascript/reference/global_objects/regexp/@@search/index.html new file mode 100644 index 0000000000..c88398e1a2 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/regexp/@@search/index.html @@ -0,0 +1,153 @@ +--- +title: 'RegExp.prototype[@@search]()' +slug: Web/JavaScript/Reference/Global_Objects/RegExp/@@search +translation_of: Web/JavaScript/Reference/Global_Objects/RegExp/@@search +--- +<div>{{JSRef}}</div> + +<p><strong><code>[@@search]()</code></strong> 方法执行了一个在给定字符串中的一个搜索以取得匹配正则模式的项。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>regexp</var>[Symbol.search](str)</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>str</code></dt> + <dd>搜索的目标 {{jsxref("String")}}。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<dl> + <dt>整数</dt> + <dd>如果成功的话，<code>[@@search]()</code> 返回该正则模式的第一个匹配项的在字符串中的位置索引。否则将返回-1。</dd> +</dl> + +<h2 id="描述">描述</h2> + +<p>这个方法在 {{jsxref("String.prototype.search()")}} 的内部调用。例如，下面的两个方法返回相同结果。</p> + +<pre class="brush: js">'abc'.search(/a/); + +/a/[Symbol.search]('abc');</pre> + +<p>这个方法为自定义 <code>RegExp</code> 子类中的匹配行为而存在。</p> + +<h2 id="示例">示例</h2> + +<h3 id="直接调用">直接调用</h3> + +<p>这个方法的使用方式和 {{jsxref("String.prototype.search()")}} 相同，不同之处是 <code>this</code> 和参数顺序。</p> + +<pre class="brush: js">var re = /-/g; +var str = '2016-01-02'; +var result = re[Symbol.search](str); +console.log(result); // 4 +</pre> + +<h3 id="在子类中使用search">在子类中使用<code>@@search</code></h3> + +<p>{jsxref("RegExp")}} 的子类可以覆写 <code>[@@search]()</code>方法来修改默认行为。</p> + +<pre class="brush: js">class MyRegExp extends RegExp { + constructor(str) { + super(str) + this.pattern = str; + } + [Symbol.search](str) { + return str.indexOf(this.pattern); + } +} + +var re = new MyRegExp('a+b'); +var str = 'ab a+b'; +var result = str.search(re); // String.prototype.search calls re[@@search]. +console.log(result); // 3 +</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('ES6', '#sec-regexp.prototype-@@search', 'RegExp.prototype[@@search]')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>初始定义</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-regexp.prototype-@@search', 'RegExp.prototype[@@search]')}}</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(49)}}</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(49)}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="另见">另见</h2> + +<ul> + <li>{{jsxref("String.prototype.search()")}}</li> + <li>{{jsxref("RegExp.prototype.@@match()", "RegExp.prototype[@@match]()")}}</li> + <li>{{jsxref("RegExp.prototype.@@replace()", "RegExp.prototype[@@replace]()")}}</li> + <li>{{jsxref("RegExp.prototype.@@split()", "RegExp.prototype[@@split]()")}}</li> + <li>{{jsxref("RegExp.prototype.exec()")}}</li> + <li>{{jsxref("RegExp.prototype.test()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/regexp/@@species/index.html b/files/zh-cn/web/javascript/reference/global_objects/regexp/@@species/index.html new file mode 100644 index 0000000000..49f72f06f7 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/regexp/@@species/index.html @@ -0,0 +1,111 @@ +--- +title: 'get RegExp[@@species]' +slug: Web/JavaScript/Reference/Global_Objects/RegExp/@@species +translation_of: Web/JavaScript/Reference/Global_Objects/RegExp/@@species +--- +<div>{{JSRef}}</div> + +<p><code><strong>RegExp[@@species]</strong></code> 访问器属性返回<code>RegExp</code> 的构造器。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">RegExp[Symbol.species] +</pre> + +<h2 id="描述">描述</h2> + +<p><code>species</code> 访问器属性返回 <code>RegExp</code> 对象的默认构造器。子类构造器可能会覆盖它，来修改构造器的指派。</p> + +<h2 id="示例">示例</h2> + +<p><code>species</code>属性返回默认构造器函数，它是用于<code>RegExp</code> 对象的<code>RegExp</code>构造器：</p> + +<pre class="brush: js">RegExp[Symbol.species]; // 函数 RegExp()</pre> + +<p>在派生的正则类（也就是你自定义的正则类 <code>MyRegExp</code>）中，<code>MyRegExp</code> 的 species 是 <code>MyRegExp</code> 构造器。但是，你可能希望覆盖它，以便在你的派生类方法中，返回 <code>RegExp</code> 父类对象：</p> + +<pre class="brush: js">class MyRegExp extends RegExp { + // 将 MyRegExp species 覆盖为 RegExp 父类构造器 + static get [Symbol.species]() { return RegExp; } +}</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('ES6', '#sec-get-regexp-@@species', 'get RegExp [ @@species ]')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>初始定义。</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-get-regexp-@@species', 'get RegExp [ @@species ]')}}</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("49")}}</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("49")}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="另见">另见</h2> + +<ul> + <li>{{jsxref("RegExp")}}</li> + <li>{{jsxref("Symbol.species")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/regexp/@@split/index.html b/files/zh-cn/web/javascript/reference/global_objects/regexp/@@split/index.html new file mode 100644 index 0000000000..b3bfa32317 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/regexp/@@split/index.html @@ -0,0 +1,151 @@ +--- +title: 'RegExp.prototype[@@split]()' +slug: Web/JavaScript/Reference/Global_Objects/RegExp/@@split +translation_of: Web/JavaScript/Reference/Global_Objects/RegExp/@@split +--- +<div>{{JSRef}}</div> + +<p><strong><code>[@@split]()</code></strong> 方法切割 {{jsxref("String")}} 对象为一个其子字符串的数组 。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>regexp</var>[Symbol.split](str[, <var>limit</var>])</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>str</code></dt> + <dd>切割操作的目标字符串</dd> + <dt><code>limit</code></dt> + <dd> + <p>可选。一个为了限制切割数量的特定整数。 <code>[@@split]()</code> 防范仍会切割每个匹配正则模式的匹配项，直到切割数量达到该限制数，除非提前切割完字符串。</p> + </dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>包含其子字符串的{{jsxref("Array")}} 。</p> + +<h2 id="描述">描述</h2> + +<p>如果切割器是一个{{jsxref("RegExp")}}对象，这个方法就将在 {{jsxref("String.prototype.split()")}} 的内部调用。例如，下面的两个方法返回相同结果。</p> + +<pre class="brush: js">'a-b-c'.split(/-/); + +/-/[Symbol.split]('a-b-c');</pre> + +<p>这个方法为自定义 <code>RegExp</code> 子类中的匹配行为而存在。</p> + +<p>如果str参数不是一个{{jsxref("RegExp")}} 对象, {{jsxref("String.prototype.split()")}} 就不会调用该方法，也不会创建一个 {{jsxref("RegExp")}} 对象。示例</p> + +<h3 id="直接调用">直接调用</h3> + +<p>这个方法的使用方式和 {{jsxref("String.prototype.split()")}} 相同，不同之处是 <code>this</code> 和参数顺序。</p> + +<pre class="brush: js">var re = /-/g; +var str = '2016-01-02'; +var result = re[Symbol.split](str); +console.log(result); // ["2016", "01", "02"] +</pre> + +<h3 id="在子类中使用_split">在子类中使用 <code>@@split</code></h3> + +<p>{{jsxref("RegExp")}} 的子类可以覆写 <code>[@@split]()</code>方法来修改默认行为。</p> + +<pre class="brush: js">class MyRegExp extends RegExp { + [Symbol.split](str, limit) { + var result = RegExp.prototype[Symbol.split].call(this, str, limit); + return result.map(x => "(" + x + ")"); + } +} + +var re = new MyRegExp('-'); +var str = '2016-01-02'; +var result = str.split(re); // String.prototype.split calls re[@@split]. +console.log(result); // ["(2016)", "(01)", "(02)"] +</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('ES6', '#sec-regexp.prototype-@@split', 'RegExp.prototype[@@split]')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>初始定义</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-regexp.prototype-@@split', 'RegExp.prototype[@@split]')}}</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(49)}}</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(49)}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="另见">另见</h2> + +<ul> + <li>{{jsxref("String.prototype.split()")}}</li> + <li>{{jsxref("RegExp.prototype.@@match()", "RegExp.prototype[@@match]()")}}</li> + <li>{{jsxref("RegExp.prototype.@@replace()", "RegExp.prototype[@@replace]()")}}</li> + <li>{{jsxref("RegExp.prototype.@@search()", "RegExp.prototype[@@search]()")}}</li> + <li>{{jsxref("RegExp.prototype.exec()")}}</li> + <li>{{jsxref("RegExp.prototype.test()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/regexp/compile/index.html b/files/zh-cn/web/javascript/reference/global_objects/regexp/compile/index.html new file mode 100644 index 0000000000..e5b080a839 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/regexp/compile/index.html @@ -0,0 +1,131 @@ +--- +title: RegExp.prototype.compile() +slug: Web/JavaScript/Reference/Global_Objects/RegExp/compile +tags: + - Deprecated + - JavaScript +translation_of: Web/JavaScript/Reference/Global_Objects/RegExp/compile +--- +<div>{{JSRef}} {{deprecated_header}}</div> + +<p><code>已废弃的<strong>compile</strong></code><strong><code>()</code></strong> 方法被用于在脚本执行过程中（重新）编译正则表达式。与<code>RegExp</code>构造函数基本一样。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><var>regexObj</var>.compile(<var>pattern, flags</var>)</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>pattern</code></dt> + <dd>正则表达式的文本 。</dd> + <dt><code>flags</code></dt> + <dd> + <p>如果指定，标志可以具有以下值的任意组合：</p> + + <dl> + <dt><code>g</code></dt> + <dd>全局匹配</dd> + <dt><code>i</code></dt> + <dd>忽略大小写</dd> + <dt><code>m</code></dt> + <dd>多行;让开始和结束字符（^ 和 $）工作在多行模式工作（例如，^ 和 $ 可以匹配字符串中每一行的开始和结束（行是由 \n 或 \r 分割的），而不只是整个输入字符串的最开始和最末尾处。</dd> + <dt><code>y</code></dt> + <dd>黏度; 在目标字符串中，只从正则表达式的lastIndex属性指定的显示位置开始匹配（并且不试图从任何之后的索引匹配）。</dd> + </dl> + </dd> +</dl> + +<h2 id="描述">描述</h2> + +<p><code>不推荐compile方法。你可以使用</code> <code>RegExp</code> 构造函数来得到相同效果。</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用compile()"><code>使用compile()</code></h3> + +<p>以下展示如何用新模式和新标志来重新编译正则表达式。</p> + +<pre class="brush: js">var regexObj = new RegExp("foo", "gi"); +regexObj.compile("new foo", "g"); +</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('ES6', '#sec-regexp.prototype.compile', 'RegExp.prototype.compile')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition. Defined in the (normative) Annex B for Additional ECMAScript Features for Web Browsers.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-regexp.prototype.compile', 'RegExp.prototype.compile')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td>Defined in the (normative) Annex B for Additional ECMAScript Features for Web Browsers.</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>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</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>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("RegExp")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/regexp/dotall/index.html b/files/zh-cn/web/javascript/reference/global_objects/regexp/dotall/index.html new file mode 100644 index 0000000000..8608cfd1c2 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/regexp/dotall/index.html @@ -0,0 +1,47 @@ +--- +title: RegExp.prototype.dotAll +slug: Web/JavaScript/Reference/Global_Objects/RegExp/dotAll +tags: + - JavaScript + - 修饰符 + - 正则表达式 +translation_of: Web/JavaScript/Reference/Global_Objects/RegExp/dotAll +--- +<p>{{JSRef}}{{Draft}}</p> + +<p><strong><code>dotAll</code></strong> 属性表明是否在正则表达式中一起使用"<code>s</code>"修饰符（引入/s修饰符，使得.可以匹配任意单个字符）。<code>dotAll</code> 是一个只读的属性，属于单个正则表达式实例。</p> + +<p>{{JS_Property_Attributes(0, 0, 1)}}</p> + +<h2 id="描述">描述</h2> + +<p>如果使用了"<code>s</code>"修饰符，<code>dotAll</code> 的值将返回{{JSxRef("Boolean")}}类型的<code>true</code>，否则将返回<code>false</code>。"<code>s</code>"修饰符表示，特殊字符"<code>.</code>"应另外匹配字符串中的下述行终结符（line terminator characters），否则将会失配：</p> + +<ul> + <li>U+000A 换行符（"<code>\n</code>"）</li> + <li>U+000D 回车符（"<code>\r</code>"）</li> + <li>U+2028 行分隔符（<span class="message-body-wrapper"><span class="message-flex-body"><span class="devtools-monospace message-body"><span class="objectBox objectBox-string">line separator</span></span></span></span>）</li> + <li>U+2029 段分隔符（<span class="message-body-wrapper"><span class="message-flex-body"><span class="devtools-monospace message-body"><span class="objectBox objectBox-string">paragraph separator</span></span></span></span>）</li> +</ul> + +<p>这实际上意味着"<code>.</code>"将会匹配任意的单个Unicode Basic Multilingual Plane (BMP)字符。若要使其与astral字符（大于\uFFFF的Unicode字符）匹配，你应当使用"<code>u</code>"（Unicode）修饰符。一起使用这两个修饰符，"<code>.</code>"将无一例外地匹配任意Unicode字符。</p> + +<p>无法直接修改此属性。</p> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div class="hidden">The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</div> + +<p>{{Compat("javascript.builtins.RegExp.dotAll")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{JSxRef("RegExp.lastIndex")}}</li> + <li>{{JSxRef("RegExp.prototype.global")}}</li> + <li>{{JSxRef("RegExp.prototype.ignoreCase")}}</li> + <li>{{JSxRef("RegExp.prototype.multiline")}}</li> + <li>{{JSxRef("RegExp.prototype.source")}}</li> + <li>{{JSxRef("RegExp.prototype.sticky")}}</li> + <li>{{JSxRef("RegExp.prototype.unicode")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/regexp/exec/index.html b/files/zh-cn/web/javascript/reference/global_objects/regexp/exec/index.html new file mode 100644 index 0000000000..6648813f00 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/regexp/exec/index.html @@ -0,0 +1,199 @@ +--- +title: RegExp.prototype.exec() +slug: Web/JavaScript/Reference/Global_Objects/RegExp/exec +tags: + - '## lastIndex bug???' + - JavaScript + - Method + - Prototype + - RegExp + - Regular Expressions +translation_of: Web/JavaScript/Reference/Global_Objects/RegExp/exec +--- +<div>{{JSRef}}</div> + +<p><code><strong>exec() </strong></code>方法在一个指定字符串中执行一个搜索匹配。返回一个结果数组或 {{jsxref("null")}}。</p> + +<p>在设置了 {{jsxref("RegExp.global", "global")}} 或 {{jsxref("RegExp.sticky", "sticky")}} 标志位的情况下（如 <code>/foo/g</code> or <code>/foo/y</code>），JavaScript {{jsxref("RegExp")}} 对象是<strong>有状态</strong>的。他们会将上次成功匹配后的位置记录在 <span style="font-size: 1rem; letter-spacing: -0.00278rem;">{{jsxref("RegExp.lastIndex", "lastIndex")}} 属性中。使用此特性，</span><code style="font-size: 1rem; letter-spacing: -0.00278rem;">exec()</code><span style="font-size: 1rem; letter-spacing: -0.00278rem;"> 可用来对单个字符串中的多次匹配结果进行逐条的遍历（包括捕获到的匹配），而相比之下， {{jsxref("String.prototype.match()")}} 只会返回匹配到的结果。</span></p> + +<p>如果你只是为了判断是否匹配（true或 false），可以使用 {{jsxref("RegExp.test()")}} 方法，或者 {{jsxref("String.search()")}} 方法。</p> + +<div>{{EmbedInteractiveExample("pages/js/regexp-prototype-exec.html")}}</div> + + + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><var>regexObj</var>.exec(<var>str</var>)</pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>str</code></dt> + <dd>要匹配正则表达式的字符串。</dd> +</dl> + +<h3 id="Description" name="Description">返回值</h3> + +<p>如果匹配成功，<code>exec()</code> 方法返回一个数组（包含额外的属性 <code>index</code> 和 <code>input</code> ，参见下方表格），并更新正则表达式对象的 {{jsxref("RegExp.lastIndex", "lastIndex")}} 属性。完全匹配成功的文本将作为返回数组的第一项，从第二项起，后续每项都对应正则表达式内捕获括号里匹配成功的文本。</p> + +<p>如果匹配失败，<code>exec()</code> 方法返回 {{jsxref("null")}}，并将 {{jsxref("RegExp.lastIndex", "lastIndex")}} 重置为 0 。</p> + +<h2 id="描述">描述</h2> + +<p>考虑以下示例：</p> + +<pre class="brush: js">// Match "quick brown" followed by "jumps", ignoring characters in between +// Remember "brown" and "jumps" +// Ignore case +var re = /quick\s(brown).+?(jumps)/ig; +var result = re.exec('The Quick Brown Fox Jumps Over The Lazy Dog'); +</pre> + +<p>下表列出这个脚本的返回值：</p> + +<table class="fullwidth-table"> + <tbody> + <tr> + <td class="header">对象</td> + <td class="header">属性/索引</td> + <td class="header">描述</td> + <td class="header">例子</td> + </tr> + <tr> + <td rowspan="4"><code>result</code></td> + <td><code>[0]</code></td> + <td>匹配的全部字符串</td> + <td><code>Quick Brown Fox Jumps</code></td> + </tr> + <tr> + <td><code>[1], ...[<em>n</em> ]</code></td> + <td>括号中的分组捕获</td> + <td><code>[1] = Brown<br> + [2] = Jumps</code></td> + </tr> + <tr> + <td><code>index</code></td> + <td>匹配到的字符位于原始字符串的基于0的索引值</td> + <td><code>4</code></td> + </tr> + <tr> + <td><code>input</code></td> + <td>原始字符串</td> + <td><code>The Quick Brown Fox Jumps Over The Lazy Dog</code></td> + </tr> + <tr> + <td rowspan="5"><code>re</code></td> + <td><code>lastIndex</code></td> + <td>下一次匹配开始的位置</td> + <td><code>25</code></td> + </tr> + <tr> + <td><code>ignoreCase</code></td> + <td>是否使用了 "<code>i</code>" 标记使正则匹配忽略大小写</td> + <td><code>true</code></td> + </tr> + <tr> + <td><code>global</code></td> + <td>是否使用了 "<code>g</code>" 标记来进行全局的匹配.</td> + <td><code>true</code></td> + </tr> + <tr> + <td><code>multiline</code></td> + <td> + <p>是否使用了 "<code>m</code>" 标记使正则工作在多行模式（也就是，^ 和 $ 可以匹配字符串中每一行的开始和结束（行是由 \n 或 \r 分割的），而不只是整个输入字符串的最开始和最末尾处。）</p> + </td> + <td><code>false</code></td> + </tr> + <tr> + <td><code>source</code></td> + <td>正则匹配的字符串</td> + <td><code>quick\s(brown).+?(jumps)</code></td> + </tr> + </tbody> +</table> + +<h2 id="示例">示例</h2> + +<h3 id="查找所有匹配">查找所有匹配</h3> + +<p>当正则表达式使用 "<code>g</code>" 标志时，可以多次执行 <code>exec</code> 方法来查找同一个字符串中的成功匹配。当你这样做时，查找将从正则表达式的 {{jsxref("RegExp.lastIndex", "lastIndex")}} 属性指定的位置开始。（{{jsxref("RegExp.test", "test()")}} 也会更新 <code>lastIndex</code> 属性）。注意，即使再次查找的字符串不是原查找字符串时，{{jsxref("RegExp.lastIndex", "lastIndex")}} 也不会被重置，它依旧会从记录的 {{jsxref("RegExp.lastIndex", "lastIndex")}} 开始。</p> + +<p>例如，你使用下面的脚本：</p> + +<pre class="brush: js">var myRe = /ab*/g; +var str = 'abbcdefabh'; +var myArray; +while ((myArray = myRe.exec(str)) !== null) { + var msg = 'Found ' + myArray[0] + '. '; + msg += 'Next match starts at ' + myRe.lastIndex; + console.log(msg); +} +</pre> + +<p>脚本运行结果如下：</p> + +<pre>Found abb. Next match starts at 3 +Found ab. Next match starts at 9 +</pre> + +<div class="blockIndicator warning"> +<p>注意：不要把正则表达式字面量（或者{{jsxref("RegExp")}}构造器）放在 <code>while</code> 条件表达式里。由于每次迭代时 {{jsxref("RegExp.lastIndex", "lastIndex")}} 的属性都被重置，如果匹配，将会造成一个死循环。并且要确保使用了'g'标记来进行全局的匹配，否则同样会造成死循环。</p> +</div> + +<h3 id="结合_RegExp_字面量使用_exec">结合 <code>RegExp</code> 字面量使用 <code>exec()</code></h3> + +<p>你也可以直接使用 <code>exec()</code> 而不是创建一个 {{jsxref("RegExp")}} 对象：</p> + +<pre class="brush: js">var matches = /(hello \S+)/.exec('This is a hello world!'); +console.log(matches[1]); +</pre> + +<p>运行上面的代码，控制台会输出"hello world!" 字符串。</p> + +<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('ES3')}}</td> + <td>{{Spec2('ES3')}}</td> + <td>Initial definition. Implemented in JavaScript 1.2.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.10.6.21', 'RegExp.exec')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-regexp.prototype.exec', 'RegExp.exec')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-regexp.prototype.exec', 'RegExp.exec')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> + + +<p>{{Compat("javascript.builtins.RegExp.exec")}}</p> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li><a href="/en-US/docs/Web/JavaScript/Guide/Regular_Expressions">Regular Expressions</a> chapter in the <a href="/en-US/docs/Web/JavaScript/Guide">JavaScript Guide</a></li> + <li>{{jsxref("RegExp")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/regexp/flags/index.html b/files/zh-cn/web/javascript/reference/global_objects/regexp/flags/index.html new file mode 100644 index 0000000000..bb74a28131 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/regexp/flags/index.html @@ -0,0 +1,114 @@ +--- +title: RegExp.prototype.flags +slug: Web/JavaScript/Reference/Global_Objects/RegExp/flags +translation_of: Web/JavaScript/Reference/Global_Objects/RegExp/flags +--- +<div>{{JSRef}}</div> + +<p><strong><code>flags</code></strong>属性返回一个字符串，由当前正则表达式对象的标志组成。</p> + +<div>{{js_property_attributes(0, 0, 1)}}</div> + +<h2 id="描述">描述</h2> + +<p><code>flags</code>属性中的标志以字典序排序（从左到右，即<code>"gimuy"</code>）。</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用flags">使用<code>flags</code></h3> + +<pre class="brush: js">/foo/ig.flags; // "gi" +/bar/myu.flags; // "muy" +</pre> + +<h2 id="Polyfill">Polyfill</h2> + +<pre class="brush: js">if (RegExp.prototype.flags === undefined) { + Object.defineProperty(RegExp.prototype, 'flags', { + configurable: true, + get: function() { + return this.toString().match(/[gimuy]*$/)[0]; + } + }); +} +</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-get-regexp.prototype.flags', 'RegExp.prototype.flags')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>初始定义。</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-get-regexp.prototype.flags', 'RegExp.prototype.flags')}}</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>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoDesktop("37")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</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>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatGeckoMobile("37")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="另见">另见</h2> + +<ul> + <li>{{jsxref("RegExp.prototype.source")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/regexp/global/index.html b/files/zh-cn/web/javascript/reference/global_objects/regexp/global/index.html new file mode 100644 index 0000000000..cddfc3724f --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/regexp/global/index.html @@ -0,0 +1,107 @@ +--- +title: RegExp.prototype.global +slug: Web/JavaScript/Reference/Global_Objects/RegExp/global +tags: + - JavaScript + - Property + - Prototype + - RegExp +translation_of: Web/JavaScript/Reference/Global_Objects/RegExp/global +--- +<div> + {{JSRef("Global_Objects", "RegExp")}}</div> +<h2 id="Summary" name="Summary">概述</h2> +<p><code><strong>global</strong></code> 属性表明正则表达式是否使用了 "<code>g</code>" 标志。<code>global</code> 是一个正则表达式实例的只读属性。</p> +<div> + {{js_property_attributes(0,0,0)}}</div> +<h2 id="Description" name="Description">描述</h2> +<p><code>global</code> 的值是布尔对象，如果使用了 "<code>g</code>" 标志，则返回 <code>true</code>；否则返回 <code>false</code>。 "<code>g</code>" 标志意味着正则表达式应该测试字符串中所有可能的匹配。</p> +<p>你无法直接更改此属性。</p> +<h2 id="Examples" name="Examples">示例</h2> +<h3 id="Example:_Using_MIN_VALUE" name="Example:_Using_MIN_VALUE">例子：使用 <code>global</code></h3> +<pre class="brush:js">var regex = new RegExp("foo", "g") + +console.log(regex.global) // true +</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>ECMAScript 3rd Edition. Implemented in JavaScript 1.2.</td> + <td>Standard</td> + <td>Initial definition.<br> + JavaScript 1.5: <code>global</code> is a property of a <code>RegExp</code> instance, not the <code>RegExp</code> object.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.10.7.2', 'RegExp.prototype.global')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-get-regexp.prototype.global', 'RegExp.prototype.global')}}</td> + <td>{{Spec2('ES6')}}</td> + <td><code>global</code> is now a prototype accessor property rather than an instance's own data property.</td> + </tr> + </tbody> +</table> +<h2 id="浏览器兼容性">浏览器兼容性</h2> +<p>{{ CompatibilityTable() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> + </table> +</div> +<h2 id="See_also" name="See_also">相关链接</h2> +<ul> + <li>{{jsxref("RegExp.prototype.ignoreCase")}}</li> + <li>{{jsxref("RegExp.prototype.lastIndex")}}</li> + <li>{{jsxref("RegExp.prototype.multiline")}}</li> + <li>{{jsxref("RegExp.prototype.source")}}</li> + <li>{{jsxref("RegExp.prototype.sticky")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/regexp/ignorecase/index.html b/files/zh-cn/web/javascript/reference/global_objects/regexp/ignorecase/index.html new file mode 100644 index 0000000000..b2d0742626 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/regexp/ignorecase/index.html @@ -0,0 +1,107 @@ +--- +title: RegExp.prototype.ignoreCase +slug: Web/JavaScript/Reference/Global_Objects/RegExp/ignoreCase +tags: + - JavaScript + - Property + - Prototype + - RegExp +translation_of: Web/JavaScript/Reference/Global_Objects/RegExp/ignoreCase +--- +<div> + {{JSRef("Global_Objects", "RegExp")}}</div> +<h2 id="Summary" name="Summary">概述</h2> +<p><code><strong>ignoreCase</strong></code> 属性表明正则表达式是否使用了 "<code>i</code>" 标志。<code>ignoreCase</code> 是正则表达式实例的只读属性。</p> +<div> + {{js_property_attributes(0,0,0)}}</div> +<h2 id="Description" name="Description">描述</h2> +<p><code>ignoreCase</code> 的值是布尔对象，如果使用了"<code>i</code>" 标志，则返回 <code>true</code>；否则，返回 <code>false</code>。"<code>i</code>" 标志意味着在字符串进行匹配时，应该忽略大小写。</p> +<p>你无法直接更改此属性。</p> +<h2 id="Examples" name="Examples">示例</h2> +<h3 id="Example:_Using_MIN_VALUE" name="Example:_Using_MIN_VALUE">例子：使用 <code>ignoreCase</code></h3> +<pre class="brush:js">var regex = new RegExp("foo", "i") + +console.log(regex.ignoreCase) // true +</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>ECMAScript 3rd Edition. Implemented in JavaScript 1.2.</td> + <td>Standard</td> + <td>Initial definition.<br> + JavaScript 1.5: <code>ignoreCase</code> is a property of a <code>RegExp</code> instance, not the <code>RegExp</code> object.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.10.7.3', 'RegExp.prototype.ignoreCase')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-get-regexp.prototype.ignorecase', 'RegExp.prototype.ignoreCase')}}</td> + <td>{{Spec2('ES6')}}</td> + <td><code>ignoreCase</code> is now a prototype accessor property rather than an instance's own data property.</td> + </tr> + </tbody> +</table> +<h2 id="浏览器兼容性">浏览器兼容性</h2> +<p>{{ CompatibilityTable() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> + </table> +</div> +<h2 id="See_also" name="See_also">相关链接</h2> +<ul> + <li>{{jsxref("RegExp.prototype.global")}}</li> + <li>{{jsxref("RegExp.prototype.lastIndex")}}</li> + <li>{{jsxref("RegExp.prototype.multiline")}}</li> + <li>{{jsxref("RegExp.prototype.source")}}</li> + <li>{{jsxref("RegExp.prototype.sticky")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/regexp/index.html b/files/zh-cn/web/javascript/reference/global_objects/regexp/index.html new file mode 100644 index 0000000000..77e10c7396 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/regexp/index.html @@ -0,0 +1,269 @@ +--- +title: RegExp +slug: Web/JavaScript/Reference/Global_Objects/RegExp +tags: + - Class + - JavaScript + - Reference + - RegExp + - Regular Expressions +translation_of: Web/JavaScript/Reference/Global_Objects/RegExp +--- +<div>{{JSRef}}</div> + +<p><strong><code>RegExp</code></strong> 对象用于将文本与一个模式匹配。</p> + +<p>有关正则表达式的介绍，请阅读 <a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Guide/">JavaScript指南</a>中的<a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Guide/Regular_Expressions">正则表达式章节</a>。</p> + +<h2 id="描述">描述</h2> + +<h3 id="字面量和构造函数">字面量和构造函数</h3> + +<p>有两种方法可以创建一个 <code>RegExp</code> 对象：一种是字面量，另一种是构造函数。</p> + +<dl> + <dt>字面量</dt> + <dd>由斜杠包围而不是引号包围。</dd> + <dt>构造函数的字符串参数</dt> + <dd>由引号而不是斜杠包围。</dd> +</dl> + +<p>以下三种表达式都会创建相同的正则表达式：</p> + +<pre class="brush: js notranslate" style="font-size: 14px;">/ab+c/i; +new RegExp('ab+c', 'i'); +new RegExp(/ab+c/, 'i');</pre> + +<p>当表达式被赋值时，字面量形式提供正则表达式的编译（compilation）状态，当正则表达式保持为常量时使用字面量。例如当你在循环中使用字面量构造一个正则表达式时，正则表达式不会在每一次迭代中都被重新编译（recompiled）。</p> + +<p>而正则表达式对象的构造函数，如 <code>new RegExp('ab+c')</code> 提供了正则表达式运行时编译（runtime compilation）。如果你知道正则表达式模式将会改变，或者你事先不知道什么模式，而是从另一个来源获取，如用户输入，这些情况都可以使用构造函数。</p> + +<h3 id="构造函数中的标志参数flags">构造函数中的标志参数(flags)</h3> + +<p>从 ECMAScript 6 开始，当第一个参数为正则表达式而第二个标志参数存在时，<code>new RegExp(/ab+c/, 'i')</code> 不再抛出 {{jsxref("TypeError")}} （<code>"从另一个RegExp构造一个RegExp时无法提供标志"</code>）的异常，取而代之，将使用这些参数创建一个新的正则表达式。</p> + +<p>当使用构造函数创造正则对象时，需要常规的字符转义规则（在前面加反斜杠 <code>\</code>）。</p> + +<p>比如，以下是等价的：</p> + +<pre class="brush: js notranslate">var re = new RegExp("\\w+"); +var re = /\w+/;</pre> + +<h3 id="Perl-like_RegExp_属性">Perl-like RegExp 属性</h3> + +<p>请注意，{{jsxref("RegExp")}}属性有长名称和短名称（类似Perl）。两个名称总是引用同一个值。（Perl是JavaScript为其正则表达式建模的编程语言）。另请参见<a href="/en-US/docs/Web/JavaScript/Reference/Deprecated_and_obsolete_features#RegExp_Properties">不推荐使用的RegExp属性。</a></p> + +<h2 id="构造函数">构造函数</h2> + +<dl> + <dt>{{jsxref("RegExp/RegExp", "RegExp()")}}</dt> + <dd>创建一个新的 <code>RegExp</code> 对象。</dd> +</dl> + +<h2 id="静态属性">静态属性</h2> + +<dl> + <dt>{{jsxref("RegExp.@@species", "get RegExp[@@species]")}}</dt> + <dd>该构造函数用于创建派生对象。</dd> + <dt>{{jsxref("RegExp.lastIndex")}}</dt> + <dd>该索引表示从哪里开始下一个匹配</dd> +</dl> + +<h2 id="实例属性">实例属性</h2> + +<dl> + <dt>{{JSxRef("RegExp.prototype.flags")}}</dt> + <dd>含有 <code>RegExp</code> 对象 flags 的字符串。</dd> + <dt>{{JSxRef("RegExp.prototype.dotAll")}}</dt> + <dd><code>.</code> 是否要匹配新行（newlines）。</dd> + <dt>{{JSxRef("RegExp.prototype.global")}}</dt> + <dd>针对字符串中所有可能的匹配项测试正则表达式，还是仅针对第一个匹配项。</dd> + <dt></dt> + <dt></dt> + <dt>{{JSxRef("RegExp.prototype.ignoreCase")}}</dt> + <dd>匹配文本的时候是否忽略大小写。</dd> + <dt>{{JSxRef("RegExp.prototype.multiline")}}</dt> + <dd>是否进行多行搜索。</dd> + <dt>{{JSxRef("RegExp.prototype.source")}}</dt> + <dd>正则表达式的文本。</dd> + <dt>{{JSxRef("RegExp.prototype.sticky")}}</dt> + <dd>搜索是否是 sticky。</dd> + <dt>{{JSxRef("RegExp.prototype.unicode")}}</dt> + <dd>Unicode 功能是否开启。</dd> +</dl> + +<h2 id="实例方法">实例方法</h2> + +<dl> + <dt>{{JSxRef("RegExp.prototype.compile()")}}</dt> + <dd>运行脚本的期间（重新）编译正则表达式。</dd> + <dt>{{JSxRef("RegExp.prototype.exec()")}}</dt> + <dd>在该字符串中执行匹配项的搜索。</dd> + <dt>{{JSxRef("RegExp.prototype.test()")}}</dt> + <dd>该正则在字符串里是否有匹配。</dd> + <dt>{{JSxRef("RegExp.prototype.@@match()", "RegExp.prototype[@@match]()")}}</dt> + <dd>对给定字符串执行匹配并返回匹配结果。</dd> + <dt>{{JSxRef("RegExp.prototype.@@matchAll()", "RegExp.prototype[@@matchAll]()")}}</dt> + <dd>对给定字符串执行匹配，返回所有匹配结果。</dd> + <dt>{{JSxRef("RegExp.prototype.@@replace()", "RegExp.prototype[@@replace]()")}}</dt> + <dd>给定新的子串，替换所有匹配结果。</dd> + <dt>{{JSxRef("RegExp.prototype.@@search()", "RegExp.prototype[@@search]()")}}</dt> + <dd>在给定字符串中搜索匹配项，并返回在字符串中找到字符索引。</dd> + <dt>{{JSxRef("RegExp.prototype.@@split()", "RegExp.prototype[@@split]()")}}</dt> + <dd>通过将给定字符串拆分为子字符串，并返回字符串形成的数组。</dd> + <dt>{{JSxRef("RegExp.prototype.toString()")}}</dt> + <dd>返回表示指定对象的字符串。重写{{jsxref("Object.prototype.toString()")}}方法。</dd> +</dl> + +<h2 id="Syntax" name="Syntax">示例</h2> + +<h3 id="Using_a_regular_expression_to_change_data_format" name="Using_a_regular_expression_to_change_data_format">使用正则改变数据结构</h3> + +<p>下例使用 {{jsxref("Global_Objects/String", "String")}} 的 {{jsxref("String.prototype.replace()", "replace()")}} 方法去匹配姓名 <em>first last </em>输出新的格式 <em>last</em>, <em>first</em>。</p> + +<p>在替换的文本中，脚本中使用 <code>$1</code> 和 <code>$2</code> 指明括号里先前的匹配.</p> + +<pre class="brush: js notranslate">let re = /(\w+)\s(\w+)/; +let str = "John Smith"; +let newstr = str.replace(re, "$2, $1"); +console.log(newstr); +</pre> + +<p>这将显示 "Smith, John".</p> + +<h3 id="使用正则来划分带有多种行结束符和换行符的文本">使用正则来划分带有多种行结束符和换行符的文本</h3> + +<p>对于不同的平台（Unix，Windows等等），其默认的行结束符是不一样的. 而下面的划分方式适用于所有平台。</p> + +<pre class="notranslate">let text = 'Some text\nAnd some more\r\nAnd yet\rThis is the end' +let lines = text.split(/\r\n|\r|\n/) +console.log(lines) // logs [ 'Some text', 'And some more', 'And yet', 'This is the end' ] +</pre> + +<p>注意：在正则表达式中，以竖线分割的子模式的顺序会影响匹配结果。</p> + +<h3 id="在多行文本中使用正则表达式">在多行文本中使用正则表达式</h3> + +<pre class="brush: js notranslate">let s = "Please yes\nmake my day!"; + +s.match(/yes.*day/); +// Returns null + +s.match(/yes[^]*day/); +// Returns 'yes\nmake my day'</pre> + +<h3 id="Using_a_regular_expression_with_the_sticky_flag" name="Using_a_regular_expression_with_the_sticky_flag">使用带有 sticky 标志的正则表达式</h3> + +<p>带有{{JSxRef("Global_Objects/RegExp/sticky", "sticky")}}标志的正则表达式将会从源字符串的{{jsxref("RegExp.prototype.lastIndex")}}位置开始匹配，也就是进行“粘性匹配”。</p> + +<pre class="brush: js notranslate">let str = '#foo#' +let regex = /foo/y + +regex.lastIndex = 1 +regex.test(str) // true +regex.lastIndex = 5 +regex.test(str) // false (lastIndex is taken into account with sticky flag) +regex.lastIndex // 0 (reset after match failure)</pre> + +<h3 id="sticky_标志和_global_标志的不同点"> sticky 标志和 global 标志的不同点</h3> + +<p>如果正则表达式有粘性 <code>y</code> 标志，下一次匹配一定在 <code>lastIndex</code> 位置开始；如果正则表达式有全局 <code>g</code> 标志，下一次匹配可能在 <code>lastIndex</code> 位置开始，也可能在这个位置的后面开始。</p> + +<pre class="brush: js notranslate">re = /\d/y; +while (r = re.exec("123 456")) console.log(r, "AND re.lastIndex", re.lastIndex); + +// [ '1', index: 0, input: '123 456', groups: undefined ] AND re.lastIndex 1 +// [ '2', index: 1, input: '123 456', groups: undefined ] AND re.lastIndex 2 +// [ '3', index: 2, input: '123 456', groups: undefined ] AND re.lastIndex 3 +// ... and no more match.</pre> + +<p>如果使用带有全局标志<code>g</code>的正则表达式<code>re</code>，就会捕获字符串中的所有6个数字，而非3个</p> + +<h3 id="Browser_Compatibility" name="Browser_Compatibility">使用正则表达式和 Unicode 字符</h3> + +<p>正如上面表格提到的，<code>\w</code> 或 <code>\W</code> 只会匹配基本的 ASCII 字符；如 <code>a</code> 到 <code>z</code>、 <code>A</code> 到 <code>Z</code>、 <code>0</code> 到 <code>9</code> 及 <code>_</code>。</p> + +<p>为了匹配其他语言中的字符，如西里尔（Cyrillic）或 希伯来语（Hebrew），要使用 <code>\uhhhh</code>，<code>hhhh</code> 表示以十六进制表示的字符的 Unicode 值。</p> + +<p>下例展示了怎样从一个单词中分离出 Unicode 字符。</p> + +<pre class="brush: js notranslate">let text = "Образец text на русском языке"; +let regex = /[\u0400-\u04FF]+/g; + +let match = regex.exec(text); +console.log(match[1]); // prints "Образец" +console.log(regex.lastIndex); // prints "7" + +let match2 = regex.exec(text); +console.log(match2[1]); // prints "на" [did not print "text"] +console.log(regex.lastIndex); // prints "15" + +// and so on</pre> + +<p><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Regular_Expressions/Unicode_Property_Escapes">Unicode属性转义特性</a>引入了一种解决方案，它允许使用像\p{scx=Cyrl}这样简单的语句。这里有一个外部资源，用来获取 Unicode 中的不同区块范围：<a href="http://kourge.net/projects/regexp-unicode-block" title="http://kourge.net/projects/regexp-unicode-block">Regexp-unicode-block</a></p> + +<h3 id="从_URL_中提取子域名">从 URL 中提取子域名</h3> + +<pre class="brush: js notranslate">var url = "http://xxx.domain.com"; +console.log(/[^.]+/.exec(url)[0].substr(7)); // logs "xxx" + +</pre> + +<div class="blockIndicator note"> +<p>使用浏览器内建的<a href="/en-US/docs/Web/API/URL_API">URL API</a>而非正则表达式来解析URL是更好的做法</p> +</div> + +<h2 id="规范" style="margin-bottom: 20px; line-height: 30px;">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范</th> + <th scope="col">状态</th> + <th scope="col">备注</th> + </tr> + <tr> + <td>ECMAScript 1st Edition. Implemented in JavaScript 1.1</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.10', 'RegExp')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-regexp-regular-expression-objects', 'RegExp')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="Browser_Compatibility" name="Browser_Compatibility">浏览器兼容性</h2> + +<p>{{Compat("javascript.builtins.RegExp")}}</p> + +<h3 id="Firefox_特定版本提示">Firefox 特定版本提示</h3> + +<p>Starting with Gecko 34 {{geckoRelease(34)}}, in the case of a capturing group with quantifiers preventing its exercise, the matched text for a capturing group is now <code>undefined</code> instead of an empty string:</p> + +<pre class="notranslate"><code>// Firefox 33 or older +'x'.replace(/x(.)?/g, function(m, group) { + console.log("'group:" + group + "'"); +}); // 'group:' + +// Firefox 34 or newer +'x'.replace(/x(.)?/g, function(m, group) { + console.log("'group:" + group + "'"); +}); // 'group:undefined'</code></pre> + +<p>注意，由于web兼容性 <code>RegExp.$N</code> 仍会返回一个空的字符串代替 <code>undefined</code> ({{bug(1053944)}}).</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li><a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Guide" title="JavaScript/Guide">JavaScript指南</a>中的<a href="/zh-CN/docs/Web/JavaScript/Guide/Regular_Expressions" title="JavaScript/Guide/Regular_Expressions">正则表达式</a>一节</li> + <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/match">String.prototype.match()</a></li> + <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/replace">String.prototype.replace()</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/regexp/input/index.html b/files/zh-cn/web/javascript/reference/global_objects/regexp/input/index.html new file mode 100644 index 0000000000..87b9ecb657 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/regexp/input/index.html @@ -0,0 +1,99 @@ +--- +title: RegExp.input ($_) +slug: Web/JavaScript/Reference/Global_Objects/RegExp/input +translation_of: Web/JavaScript/Reference/Global_Objects/RegExp/input +--- +<div>{{JSRef}} {{non-standard_header}}</div> + +<p><strong><code>input</code> </strong>非标准属性是正则表达式静态属性，含有正则表达式所匹配的字符串。<code>RegExp.$_</code>是这个属性的别名。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>RegExp</var>.input +RegExp.$_ +</pre> + +<h2 id="描述">描述</h2> + +<p><code>input</code> 属性是静态的，并不是正则表达式独立对象的属性。反之，你应始终将其使用为 <code>RegExp.input</code> 或者 <code>RegExp.$_。</code></p> + +<p>当正则表达式上搜索的字符串发生改变，并且字符串匹配时，<code><strong>input</strong></code> 属性的值会修改。</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用_input_和__">使用 <code>input</code> 和 <code>$_</code></h3> + +<pre class="brush: js">var re = /hi/g; +re.test('hi there!'); +RegExp.input; // "hi there!" +re.test('foo'); // 新测试，不匹配 +RegExp.$_; // "hi there!" +re.test('hi world!'); // 新测试，匹配 +RegExp.$_; // "hi world!" +</pre> + +<h2 id="规范">规范</h2> + +<p>非标准。并不是任何现行规范的一部分。</p> + +<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>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</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>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="另见">另见</h2> + +<ul> + <li>{{non-standard_inline}} {{jsxref("RegExp.lastMatch", "RegExp.lastMatch ($&)")}}</li> + <li>{{non-standard_inline}} {{jsxref("RegExp.lastParen", "RegExp.lastParen ($+)")}}</li> + <li>{{non-standard_inline}} {{jsxref("RegExp.leftContext", "RegExp.leftContext ($`)")}}</li> + <li>{{non-standard_inline}} {{jsxref("RegExp.rightContext", "RegExp.rightContext ($')")}}</li> + <li>{{non-standard_inline}} {{jsxref("RegExp.n", "RegExp.$1-$9")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/regexp/lastindex/index.html b/files/zh-cn/web/javascript/reference/global_objects/regexp/lastindex/index.html new file mode 100644 index 0000000000..4931537cb6 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/regexp/lastindex/index.html @@ -0,0 +1,128 @@ +--- +title: RegExp.lastIndex +slug: Web/JavaScript/Reference/Global_Objects/RegExp/lastIndex +tags: + - JavaScript + - Property + - RegExp + - Regular Expressions +translation_of: Web/JavaScript/Reference/Global_Objects/RegExp/lastIndex +--- +<div> + {{JSRef("Global_Objects", "RegExp")}}</div> +<h2 id="Summary" name="Summary" style="margin-bottom: 20px; line-height: 30px;">概述</h2> +<p><code><strong>lastIndex</strong></code> 是正则表达式的一个可读可写的整型属性，用来指定下一次匹配的起始索引。</p> +<div> + {{js_property_attributes(1,0,0)}}</div> +<h2 id="语法" style="margin-bottom: 20px; line-height: 30px;">语法</h2> +<pre class="syntaxbox language-html" style="margin-bottom: 0px; padding: 1em; border-left-width: 6px; border-left-style: solid; font-family: Consolas, Monaco, 'Andale Mono', monospace; font-size: 14px; direction: ltr; white-space: normal; text-shadow: none; background-color: rgba(212, 221, 228, 0.498039);"><var>lastIndex</var> = <var>regExpObj</var>.lastIndex;</pre> +<h2 id="Description" name="Description" style="margin-bottom: 20px; line-height: 30px;">描述</h2> +<p>只有正则表达式使用了表示全局检索的 "<code>g</code>" 标志时，该属性才会起作用。此时应用下面的规则：</p> +<ul> + <li>如果 <code>lastIndex</code> 大于字符串的长度，则 <code>regexp.test</code> 和 <code>regexp.exec</code> 将会匹配失败，然后 <code>lastIndex</code> 被设置为 0。</li> + <li>如果 <code>lastIndex</code> 等于字符串的长度，且该正则表达式匹配空字符串，则该正则表达式匹配从 <code>lastIndex</code> 开始的字符串。（then the regular expression matches input starting at <code style="font-style: normal;">lastIndex</code>.）</li> + <li>如果 <code>lastIndex</code> 等于字符串的长度，且该正则表达式不匹配空字符串 ，则该正则表达式不匹配字符串，<code>lastIndex</code> 被设置为 0.。</li> + <li>否则，<code>lastIndex</code> 被设置为紧随最近一次成功匹配的下一个位置。</li> +</ul> +<h2 id="示例" style="margin-bottom: 20px; line-height: 30px;">示例</h2> +<p>考虑下面的语句：</p> +<pre class="brush: js">var re = /(hi)?/g;</pre> +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 0px; background: 0px 0px;"> + </div> +<p>匹配空字符串</p> +<pre class="brush: js">console.log(re.exec("hi")); +console.log(re.lastIndex);</pre> +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 0px; background: 0px 0px;"> + </div> +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 19px; background: 0px 0px;"> + </div> +<p>返回 <code>["hi", "hi"]</code> ，<code>lastIndex</code> 等于 2。</p> +<pre class="brush: js">console.log(re.exec("hi")); +console.log(re.lastIndex);</pre> +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 0px; background: 0px 0px;"> + </div> +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 19px; background: 0px 0px;"> + </div> +<p>返回 <code>["", undefined]</code>，即一个数组，其第 0 个元素为匹配的字符串。此种情况下为空字符串，是因为 <code>lastIndex</code> 为 2（且一直是 2），"<code>hi</code>" 长度为 2。</p> +<h2 id="规范" style="margin-bottom: 20px; line-height: 30px;">规范</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>ECMAScript 3rd Edition. Implemented in JavaScript 1.2.</td> + <td>Standard</td> + <td>Initial definition.<br> + JavaScript 1.5: <code>lastIndex</code> is a property of a <code>RegExp</code> instance, not the <code>RegExp</code> object.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.10.7.5', 'RegExp.lastIndex')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-properties-of-regexp-instances', 'RegExp.lastIndex')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> +<h2 id="浏览器兼容性" style="margin-bottom: 20px; line-height: 30px;">浏览器兼容性</h2> +<p>{{ CompatibilityTable() }}</p> +<div id="compat-desktop"> + <table class="compat-table"> + <tbody> + <tr> + <th style="line-height: 16px;">Feature</th> + <th style="line-height: 16px;">Chrome</th> + <th style="line-height: 16px;">Firefox (Gecko)</th> + <th style="line-height: 16px;">Internet Explorer</th> + <th style="line-height: 16px;">Opera</th> + <th style="line-height: 16px;">Safari</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> + </table> +</div> +<div id="compat-mobile"> + <table class="compat-table"> + <tbody> + <tr> + <th style="line-height: 16px;">Feature</th> + <th style="line-height: 16px;">Android</th> + <th style="line-height: 16px;">Chrome for Android</th> + <th style="line-height: 16px;">Firefox Mobile (Gecko)</th> + <th style="line-height: 16px;">IE Mobile</th> + <th style="line-height: 16px;">Opera Mobile</th> + <th style="line-height: 16px;">Safari Mobile</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> + </table> +</div> +<h2 id="See_also" name="See_also" style="margin-bottom: 20px; line-height: 30px;">相关链接</h2> +<ul> + <li>{{jsxref("RegExp.prototype.ignoreCase")}}</li> + <li>{{jsxref("RegExp.prototype.global")}}</li> + <li>{{jsxref("RegExp.prototype.multiline")}}</li> + <li>{{jsxref("RegExp.prototype.source")}}</li> + <li>{{jsxref("RegExp.prototype.sticky")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/regexp/lastmatch/index.html b/files/zh-cn/web/javascript/reference/global_objects/regexp/lastmatch/index.html new file mode 100644 index 0000000000..71a49daf44 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/regexp/lastmatch/index.html @@ -0,0 +1,98 @@ +--- +title: RegExp.lastMatch ($&) +slug: Web/JavaScript/Reference/Global_Objects/RegExp/lastMatch +translation_of: Web/JavaScript/Reference/Global_Objects/RegExp/lastMatch +--- +<div>{{JSRef}} {{non-standard_header}}</div> + +<p><strong>lastMatch </strong>非标准属性是正则表达式的静态和只读属性，含有最后匹配到的字符串。<code>RegExp.$&</code> 是这个属性的别名。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>RegExp</var>.lastMatch +RegExp['$&'] +</pre> + +<h2 id="描述">描述</h2> + +<p><code>lastMatch</code> 属性是静态的，不是正则表达式独立对象的属性。反之，你应始终将其使用为 <code>RegExp.lastMatch</code> 或者 <code>RegExp['$&']</code>。</p> + +<p><code>lastMatch</code> 属性的值是只读的，并且会在匹配成功时修改。</p> + +<p>你不能使用属性访问器(<code>RegExp.$&</code>)来使用简写的别名，因为解析器在这里会将 "&" 看做表达式，并抛出 {{jsxref("SyntaxError")}} 。使用 <a href="/en-US/docs/Web/JavaScript/Reference/Operators/Property_Accessors">方括号符号</a>来访问属性。</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用_lastMatch_和">使用 <code>lastMatch</code> 和 <code>$&</code></h3> + +<pre class="brush: js">var re = /hi/g; +re.test('hi there!'); +RegExp.lastMatch; // "hi" +RegExp['$&']; // "hi" +</pre> + +<h2 id="规范">规范</h2> + +<p>非标准。并不是任何现行规范的一部分。</p> + +<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>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</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>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="另见">另见</h2> + +<ul> + <li>{{non-standard_inline}} {{jsxref("RegExp.input", "RegExp.input ($_)")}}</li> + <li>{{non-standard_inline}} {{jsxref("RegExp.lastParen", "RegExp.lastParen ($+)")}}</li> + <li>{{non-standard_inline}} {{jsxref("RegExp.leftContext", "RegExp.leftContext ($`)")}}</li> + <li>{{non-standard_inline}} {{jsxref("RegExp.rightContext", "RegExp.rightContext ($')")}}</li> + <li>{{non-standard_inline}} {{jsxref("RegExp.n", "RegExp.$1-$9")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/regexp/lastparen/index.html b/files/zh-cn/web/javascript/reference/global_objects/regexp/lastparen/index.html new file mode 100644 index 0000000000..0424c58ab3 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/regexp/lastparen/index.html @@ -0,0 +1,98 @@ +--- +title: RegExp.lastParen ($+) +slug: Web/JavaScript/Reference/Global_Objects/RegExp/lastParen +translation_of: Web/JavaScript/Reference/Global_Objects/RegExp/lastParen +--- +<div>{{JSRef}} {{non-standard_header}}</div> + +<p><strong>lastParen </strong>非标准属性是正则表达式的静态和只读属性，包含匹配到的最后一个子串（如果存在）。<code>RegExp.$+</code>是这一属性的别名。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>RegExp</var>.lastParen +RegExp['$+'] +</pre> + +<h2 id="描述">描述</h2> + +<p><code>lastParen</code> 属性是静态的，不是正则表达式独立对象的属性。反之，你应始终将其使用为 <code>RegExp.lastParen</code> 或者 <code>RegExp['$+']</code>。</p> + +<p><code>lastParen</code> 属性的值是只读的，并且会在匹配成功时修改。</p> + +<p>你不能使用属性访问器(<code>RegExp.$+</code>)来使用简写的别名，因为解析器在这里会将 "+" 看做表达式，并抛出 {{jsxref("SyntaxError")}} 。使用 <a href="/en-US/docs/Web/JavaScript/Reference/Operators/Property_Accessors">方括号符号</a>来访问属性。</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用_lastParen_和">使用 <code>lastParen</code> 和 <code>$+</code></h3> + +<pre class="brush: js">var re = /(hi)/g; +re.test('hi there!'); +RegExp.lastParen; // "hi" +RegExp['$+']; // "hi" +</pre> + +<h2 id="规范">规范</h2> + +<p>非标准。并不是任何现行规范的一部分。</p> + +<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>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</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>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="另见">另见</h2> + +<ul> + <li>{{non-standard_inline}} {{jsxref("RegExp.input", "RegExp.input ($_)")}}</li> + <li>{{non-standard_inline}} {{jsxref("RegExp.lastMatch", "RegExp.lastMatch ($&)")}}</li> + <li>{{non-standard_inline}} {{jsxref("RegExp.leftContext", "RegExp.leftContext ($`)")}}</li> + <li>{{non-standard_inline}} {{jsxref("RegExp.rightContext", "RegExp.rightContext ($')")}}</li> + <li>{{non-standard_inline}} {{jsxref("RegExp.n", "RegExp.$1-$9")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/regexp/leftcontext/index.html b/files/zh-cn/web/javascript/reference/global_objects/regexp/leftcontext/index.html new file mode 100644 index 0000000000..b2bf7596ce --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/regexp/leftcontext/index.html @@ -0,0 +1,98 @@ +--- +title: RegExp.leftContext ($`) +slug: Web/JavaScript/Reference/Global_Objects/RegExp/leftContext +translation_of: Web/JavaScript/Reference/Global_Objects/RegExp/leftContext +--- +<div>{{JSRef}} {{non-standard_header}}</div> + +<p><strong>leftContext </strong>非标准属性是正则表达式的静态和只读属性，含有最新匹配的左侧子串。 <code>RegExp.$`</code> 是这个属性的别名。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>RegExp</var>.leftContext +RegExp['$`'] +</pre> + +<h2 id="描述">描述</h2> + +<p><code>leftContext</code> 属性是静态的，不是正则表达式独立对象的属性。反之，你应始终将其使用为 <code>RegExp.leftContext</code> 或者 <code>RegExp['$`']</code>。</p> + +<p><code>leftContext</code> 属性的值是只读的，并且会在匹配成功时修改。</p> + +<p>你不能使用属性访问器(<code>RegExp.$`</code>)来使用简写的别名，因为解析器在这里会将其看做模板字符串的开始，并抛出 {{jsxref("SyntaxError")}} 。使用 <a href="/en-US/docs/Web/JavaScript/Reference/Operators/Property_Accessors">方括号符号</a>来访问属性。</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用_leftContext_和">使用 <code>leftContext</code> 和 <code>$`</code></h3> + +<pre class="brush: js">var re = /world/g; +re.test('hello world!'); +RegExp.leftContext; // "hello " +RegExp['$`']; // "hello " +</pre> + +<h2 id="规范">规范</h2> + +<p>非标准。并不是任何现行规范的一部分。</p> + +<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>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</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>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="另见">另见</h2> + +<ul> + <li>{{non-standard_inline}} {{jsxref("RegExp.input", "RegExp.input ($_)")}}</li> + <li>{{non-standard_inline}} {{jsxref("RegExp.lastMatch", "RegExp.lastMatch ($&)")}}</li> + <li>{{non-standard_inline}} {{jsxref("RegExp.lastParen", "RegExp.lastParen ($+)")}}</li> + <li>{{non-standard_inline}} {{jsxref("RegExp.rightContext", "RegExp.rightContext ($')")}}</li> + <li>{{non-standard_inline}} {{jsxref("RegExp.n", "RegExp.$1-$9")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/regexp/multiline/index.html b/files/zh-cn/web/javascript/reference/global_objects/regexp/multiline/index.html new file mode 100644 index 0000000000..8f9a9adbd6 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/regexp/multiline/index.html @@ -0,0 +1,108 @@ +--- +title: RegExp.prototype.multiline +slug: Web/JavaScript/Reference/Global_Objects/RegExp/multiline +tags: + - JavaScript + - Property + - Prototype + - RegExp + - Regular Expressions +translation_of: Web/JavaScript/Reference/Global_Objects/RegExp/multiline +--- +<div> + {{JSRef("Global_Objects", "RegExp")}}</div> +<h2 id="Summary" name="Summary">概述</h2> +<p><code><strong>multiline</strong></code> 属性表明正则表达式是否使用了 "<code>m</code>" 标志。<code>multiline</code> 是正则表达式实例的一个只读属性。</p> +<div> + {{js_property_attributes(0,0,0)}}</div> +<h2 id="Description" name="Description">描述</h2> +<p><code>multiline</code> 是一个布尔对象，如果使用了 "<code>m</code>" 标志，则返回 <code>true</code>；否则，返回 <code>false</code>。"<code>m</code>" 标志意味着一个多行输入字符串被看作多行。例如，使用 "<code>m</code>"，"<code>^</code>" 和 "<code>$</code>" 将会从只匹配正则字符串的开头或结尾，变为匹配字符串中任一行的开头或结尾。</p> +<p>你无法直接更改此属性。</p> +<h2 id="Examples" name="Examples">示例</h2> +<h3 id="Example:_Using_MIN_VALUE" name="Example:_Using_MIN_VALUE">例子：使用 <code>multiline</code></h3> +<pre class="brush:js">var regex = new RegExp("foo", "m") + +console.log(regex.multiline) // true +</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>ECMAScript 3rd Edition. Implemented in JavaScript 1.2.</td> + <td>Standard</td> + <td>Initial definition.<br> + JavaScript 1.5: <code>multiline</code> is a property of a <code>RegExp</code> instance, not the <code>RegExp</code> object.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.10.7.4', 'RegExp.prototype.multiline')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-get-regexp.prototype.multiline', 'RegExp.prototype.multiline')}}</td> + <td>{{Spec2('ES6')}}</td> + <td><code>multiline</code> is now a prototype accessor property rather than an instance's own data property.</td> + </tr> + </tbody> +</table> +<h2 id="浏览器兼容性">浏览器兼容性</h2> +<p>{{ CompatibilityTable() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> + </table> +</div> +<h2 id="See_also" name="See_also">相关链接</h2> +<ul> + <li>{{jsxref("RegExp.prototype.global")}}</li> + <li>{{jsxref("RegExp.prototype.lastIndex")}}</li> + <li>{{jsxref("RegExp.prototype.ignoreCase")}}</li> + <li>{{jsxref("RegExp.prototype.source")}}</li> + <li>{{jsxref("RegExp.prototype.sticky")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/regexp/n/index.html b/files/zh-cn/web/javascript/reference/global_objects/regexp/n/index.html new file mode 100644 index 0000000000..5101f73b28 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/regexp/n/index.html @@ -0,0 +1,110 @@ +--- +title: RegExp.$1-$9 +slug: Web/JavaScript/Reference/Global_Objects/RegExp/n +translation_of: Web/JavaScript/Reference/Global_Objects/RegExp/n +--- +<div>{{JSRef}} {{non-standard_header}}</div> + +<p>非标准<strong>$1, $2, $3, $4, $5, $6, $7, $8, $9 </strong>属性是包含括号子串匹配的正则表达式的静态和只读属性。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><var>RegExp</var>.$1 +RegExp.$2</code> +RegExp.$3 +RegExp.$4 +RegExp.$5 +RegExp.$6 +RegExp.$7 +RegExp.$8 +RegExp.$9 +</pre> + +<h2 id="描述">描述</h2> + +<p>$1, ..., $9 属性是静态的, 他不是独立的的正则表达式属性. 所以, 我们总是像这样子使用他们<code>RegExp.$1</code>, ..., <code>RegExp.$9</code>.</p> + +<p>属性的值是只读的而且只有在正确匹配的情况下才会改变.</p> + +<p>括号匹配项是无限的, 但是RegExp对象能捕获的只有九个. 你可以通过返回一个数组索引来取得所有的括号匹配项.</p> + +<p>这些属性可以在{{jsxref("String.replace")}} 方法中替换字符串. 在这种情况下, 不用在前面加上RegExp。下面的例子将详细说明. 当正则表达式中不包含括号, 脚本中的 <code>$n</code>'s 就是字面上的意思 (当n是正整数).</p> + +<h2 id="例子">例子</h2> + +<h3 id="n_在_String.replace中的应用"><code>$n</code> 在 <code>String.replace中的应用</code></h3> + +<p>以下脚本用 {{jsxref("String.prototype.replace()", "replace()")}} 方法去匹配一个first last格式的 name{{jsxref("String")}} 实例 输出last first格式. 在替换文本里, 脚本用 <code>$1</code> 和 <code>$2</code> 表示正则表达式中的括号匹配项的结果.</p> + +<pre class="brush: js">var re = /(\w+)\s(\w+)/; +var str = 'John Smith'; +str.replace(re, '$2, $1'); // "Smith, John" +RegExp.$1; // "John" +RegExp.$2; // "Smith" +</pre> + +<h2 id="技术指标">技术指标</h2> + +<p>非标准. 不属于当前的任何规范.</p> + +<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>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</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>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="参见">参见</h2> + +<ul> + <li>{{non-standard_inline}} {{jsxref("RegExp.input", "RegExp.input ($_)")}}</li> + <li>{{non-standard_inline}} {{jsxref("RegExp.lastMatch", "RegExp.lastMatch ($&)")}}</li> + <li>{{non-standard_inline}} {{jsxref("RegExp.lastParen", "RegExp.lastParen ($+)")}}</li> + <li>{{non-standard_inline}} {{jsxref("RegExp.leftContext", "RegExp.leftContext ($`)")}}</li> + <li>{{non-standard_inline}} {{jsxref("RegExp.rightContext", "RegExp.rightContext ($')")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/regexp/prototype/index.html b/files/zh-cn/web/javascript/reference/global_objects/regexp/prototype/index.html new file mode 100644 index 0000000000..e841c0e72d --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/regexp/prototype/index.html @@ -0,0 +1,152 @@ +--- +title: RegExp.prototype +slug: Web/JavaScript/Reference/Global_Objects/RegExp/prototype +tags: + - JavaScript + - Property + - RegExp +translation_of: Web/JavaScript/Reference/Global_Objects/RegExp +--- +<p>{{JSRef("Global_Objects", "RegExp")}}</p> +<h2 id="Summary" name="Summary">概述</h2> +<p><font face="Courier New, Andale Mono, monospace">RegExp.prototype 属性表示 </font><span style="line-height: 1.5;">{{jsxref("Global_Objects/RegExp", "RegExp")}} </span><span style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: 1.5;">构造函数的原型对象。</span></p> +<h2 id="Description" name="Description">描述</h2> +<p>查看<font face="Courier New, Andale Mono, monospace"> </font><span style="line-height: 1.5;">{{jsxref("Global_Objects/RegExp", "RegExp")}} </span><span style="line-height: 1.5;">了解更多关于 </span><code style="font-style: normal; line-height: 1.5;">RegExp</code> <code style="font-style: normal; line-height: 1.5;">实例的说明。</code></p> +<p><code>RegExp</code> 实例继承 <code>RegExp.prototype</code>。修改该原型对象上的属性或方法会影响到所有的 <code>RegExp</code> <code>实例。</code></p> +<h2 id="Properties" name="Properties">属性</h2> +<p>查看<a href="/zh-CN/docs/JavaScript/Reference/Deprecated_Features#RegExp_Properties" title="zh-CN/docs/JavaScript/Reference/Deprecated_Features#RegExp_Properties">已废弃的RegExp属性</a></p> +<p>注意，<code>RegExp</code> 对象的几个属性既有完整的长属性名，也有对应的类 Perl 的短属性名。两个属性都有着同样的值。JavaScript 的正则语法就是基于 Perl 的。</p> +<dl> + <dt> + <code style="font-style: normal; font-weight: bold;">RegExp.prototype.</code><code style="font-style: normal; font-weight: bold;">constructor</code></dt> + <dd> + 创建该正则对象的构造函数。</dd> + <dt> + {{jsxref("RegExp.prototype.global")}}</dt> + <dd> + 是否开启全局匹配，也就是匹配目标字符串中所有可能的匹配项，而不是只进行第一次匹配。</dd> + <dt> + {{jsxref("RegExp.prototype.ignoreCase")}}</dt> + <dd> + 在匹配字符串时是否要忽略字符的大小写。</dd> + <dt> + {{jsxref("RegExp.prototype.lastIndex")}}</dt> + <dd> + 下次匹配开始的字符串索引位置。</dd> + <dt> + {{jsxref("RegExp.prototype.multiline")}}</dt> + <dd> + 是否开启多行模式匹配（影响 ^ 和 $ 的行为）。</dd> + <dt> + {{jsxref("RegExp.prototype.source")}}</dt> + <dd> + 正则对象的源模式文本。</dd> + <dt> + {{jsxref("RegExp.prototype.sticky")}} {{experimental_inline}}</dt> + <dd> + 是否开启粘滞匹配。</dd> +</dl> +<div> + {{ jsOverrides("Object", "properties", "constructor", "global", "ignoreCase", "lastIndex", "multiline", "source", "sticky") }}</div> +<h2 id="Methods" name="Methods">方法</h2> +<p>查看<a href="/zh-CN/docs/JavaScript/Reference/Deprecated_Features#RegExp_Methods" title="zh-CN/docs/JavaScript/Reference/Deprecated_Features#RegExp_Methods">已废弃的RegExp方法</a></p> +<dl> + <dt> + {{jsxref("RegExp.prototype.exec()")}}</dt> + <dd> + 在目标字符串中执行一次正则匹配操作。</dd> + <dt> + {{jsxref("RegExp.prototype.test()")}}</dt> + <dd> + 测试当前正则是否能匹配目标字符串。</dd> + <dt> + {{jsxref("RegExp.prototype.toSource()")}} {{non-standard_inline}}</dt> + <dd> + 返回一个字符串，其值为该正则对象的字面量形式。覆盖了<code>Object.prototype.toSource</code> 方法.</dd> + <dt> + {{jsxref("RegExp.prototype.toString()")}}</dt> + <dd> + 返回一个字符串，其值为该正则对象的字面量形式。覆盖了{{jsxref("Object.prototype.toString()")}} 方法。</dd> +</dl> +<div> + {{ jsOverrides("Object", "Methods", "exec", "test", "toSource", "toString") }}</div> +<h2 id="规范" style="margin-bottom: 20px; line-height: 30px;">规范</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>ECMAScript 1st Edition. Implemented in JavaScript 1.1</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.10.5.1', 'RegExp')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-regexp.prototype', 'RegExp.prototype')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> +<h2 id="浏览器兼容性" style="margin-bottom: 20px; line-height: 30px;">浏览器兼容性</h2> +<p>{{ CompatibilityTable() }}</p> +<div id="compat-desktop"> + <table class="compat-table"> + <tbody> + <tr> + <th style="line-height: 16px;">Feature</th> + <th style="line-height: 16px;">Chrome</th> + <th style="line-height: 16px;">Firefox (Gecko)</th> + <th style="line-height: 16px;">Internet Explorer</th> + <th style="line-height: 16px;">Opera</th> + <th style="line-height: 16px;">Safari</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> + </table> +</div> +<div id="compat-mobile"> + <table class="compat-table"> + <tbody> + <tr> + <th style="line-height: 16px;">Feature</th> + <th style="line-height: 16px;">Android</th> + <th style="line-height: 16px;">Chrome for Android</th> + <th style="line-height: 16px;">Firefox Mobile (Gecko)</th> + <th style="line-height: 16px;">IE Mobile</th> + <th style="line-height: 16px;">Opera Mobile</th> + <th style="line-height: 16px;">Safari Mobile</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> + </table> +</div> +<h2 id="相关链接" style="margin-bottom: 20px; line-height: 30px;">相关链接</h2> +<ul> + <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Regular_Expressions" title="JavaScript/Guide/Regular_Expressions">Regular Expressions</a> chapter in the <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide" title="JavaScript/Guide">JavaScript Guide</a></li> + <li>{{jsxref("Global_Objects/RegExp", "RegExp")}}</li> + <li>{{jsxref("Function.prototype")}}</li> +</ul> +<p> </p> diff --git a/files/zh-cn/web/javascript/reference/global_objects/regexp/regexp/index.html b/files/zh-cn/web/javascript/reference/global_objects/regexp/regexp/index.html new file mode 100644 index 0000000000..138ebf4ba7 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/regexp/regexp/index.html @@ -0,0 +1,109 @@ +--- +title: RegExp() constructor +slug: Web/JavaScript/Reference/Global_Objects/RegExp/RegExp +translation_of: Web/JavaScript/Reference/Global_Objects/RegExp/RegExp +--- +<div>{{JSRef}}</div> + +<p><strong><code>RegExp</code></strong> 用于创建正则表达式对象，该对象用于将文本与一个模式匹配</p> + +<p>阅读<a href="/zh-CN/docs/Web/JavaScript/Guide" title="JavaScript/Guide">JavaScript指南</a>中的<a href="/zh-CN/docs/Web/JavaScript/Guide/Regular_Expressions" title="JavaScript/Guide/Regular_Expressions">正则表达式</a>一节以了解正则表达式。</p> + +<div>{{EmbedInteractiveExample("pages/js/regexp-constructor.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<p>可以使用字面量、构造函数和工厂方法来创建正则表达式</p> + +<pre class="syntaxbox notranslate">/<var>pattern</var>/<var>flags</var> +new RegExp(<var>pattern</var>[, <var>flags</var>]) +RegExp(<var>pattern</var>[, <var>flags</var>]) +</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code><var>pattern</var></code></dt> + <dd>The text of the regular expression.</dd> + <dd>As of ES5, this can also be another <code>RegExp</code> object or literal (for the two RegExp constructor notations only). Patterns may include <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Regular_Expressions#Using_special_characters">special characters</a> to match a wider range of values than would a literal string. </dd> + <dt><code><var>flags</var></code></dt> + <dd> + <p>If specified, <code><var>flags</var></code> is a string that contains the flags to add.</p> + + <p>Alternatively, if an object is supplied for the pattern, the <code><var>flags</var></code> string will replace any of that object's flags (and <code>lastIndex</code> will be reset to <code>0</code>) (as of ES2015).</p> + + <p>If <code><var>flags</var></code> is not specified and a regular expressions object is supplied, that object's flags (and <code>lastIndex</code> value) will be copied over.</p> + + <p><code>flags</code> may contain any combination of the following characters:</p> + + <dl> + <dt><code>g</code> （全局匹配）</dt> + <dd>Find all matches rather than stopping after the first match.</dd> + <dt><code>i</code> （忽略大小写）</dt> + <dd>If <code>u</code> flag is also enabled, use Unicode case folding.</dd> + <dt><code>m</code> （多行匹配）</dt> + <dd>Treat beginning and end characters (<code>^</code> and <code>$</code>) as working over multiple lines. In other words, match the beginning or end of <em>each</em> line (delimited by <code>\n</code> or <code>\r</code>), not only the very beginning or end of the whole input string.</dd> + <dt><code>s</code> （点号匹配所有字符）</dt> + <dd>Allows <code>.</code> to match newlines.</dd> + <dt><code>u</code> （unicode）</dt> + <dd>Treat <code><var>pattern</var></code> as a sequence of Unicode code points. (See also <a href="/en-US/docs/Web/API/DOMString/Binary">Binary strings</a>).</dd> + <dt><code>y</code> （sticky，粘性匹配）</dt> + <dd>Matches only from the index indicated by the <code>lastIndex</code> property of this regular expression in the target string. Does not attempt to match from any later indexes.</dd> + </dl> + </dd> +</dl> + +<h2 id="例子">例子</h2> + +<h3 id="字面量和构造函数">字面量和构造函数</h3> + +<p>There are two ways to create a <code>RegExp</code> object: a <em>literal notation</em> and a <em>constructor</em>.</p> + +<ul> + <li><strong>The literal notation's</strong> parameters are enclosed between slashes and do not use quotation marks.</li> + <li><strong>The constructor function's</strong> parameters are not enclosed between slashes but do use quotation marks.</li> +</ul> + +<p>The following three expressions create the same regular expression:</p> + +<pre class="brush: js notranslate">/ab+c/i +new RegExp(/ab+c/, 'i') // literal notation +new RegExp('ab+c', 'i') // constructor +</pre> + +<p>The literal notation results in compilation of the regular expression when the expression is evaluated. Use literal notation when the regular expression will remain constant. For example, if you use literal notation to construct a regular expression used in a loop, the regular expression won't be recompiled on each iteration.</p> + +<p>The constructor of the regular expression object—for example, <code>new RegExp('ab+c')</code>—results in runtime compilation of the regular expression. Use the constructor function when you know the regular expression pattern will be changing, or you don't know the pattern and are getting it from another source, such as user input.</p> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Specification</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-regexp-constructor', 'RegExp constructor')}}</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> + + +<p>{{Compat("javascript.builtins.RegExp.RegExp")}}</p> +</div> + +<h2 id="参见">参见</h2> + +<ul> +<a href="/zh-CN/docs/Web/JavaScript/Guide" title="JavaScript/Guide">JavaScript指南</a>中的<a href="/zh-CN/docs/Web/JavaScript/Guide/Regular_Expressions" title="JavaScript/Guide/Regular_Expressions">正则表达式</a>一节 + <li>{{jsxref("String.prototype.match()")}}</li> + <li>{{jsxref("String.prototype.replace()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/regexp/rightcontext/index.html b/files/zh-cn/web/javascript/reference/global_objects/regexp/rightcontext/index.html new file mode 100644 index 0000000000..5426301369 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/regexp/rightcontext/index.html @@ -0,0 +1,98 @@ +--- +title: RegExp.rightContext ($') +slug: Web/JavaScript/Reference/Global_Objects/RegExp/rightContext +translation_of: Web/JavaScript/Reference/Global_Objects/RegExp/rightContext +--- +<div>{{JSRef}} {{non-standard_header}}</div> + +<p><strong>rightContext </strong>非标准属性是正则表达式的静态和只读属性，含有最新匹配的右侧子串。 <code>RegExp.$'</code> 是这个属性的别名。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><var>RegExp</var>.rightContext +RegExp["$'"]</code> +</pre> + +<h2 id="描述">描述</h2> + +<p><code>rightContext</code> 属性是静态的，不是正则表达式独立对象的属性。反之，你应始终将其使用为 <code>RegExp.rightContext</code> 或者 <code>RegExp["$'"]</code>。</p> + +<p><code>rightContext</code> 属性的值是只读的，并且会在匹配成功时修改。</p> + +<p>你不能使用属性访问器(<code>RegExp.$'</code>)来使用简写的别名，因为解析器在这里会将其看做字符串的开始，并抛出 {{jsxref("SyntaxError")}}。使用 <a href="/en-US/docs/Web/JavaScript/Reference/Operators/Property_Accessors">方括号符号</a>来访问属性。</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用_rightContext_和_'">使用 <code>rightContext</code> 和 <code>$'</code></h3> + +<pre class="brush: js">var re = /hello/g; +re.test('hello world!'); +RegExp.rightContext; // " world!" +RegExp["$'"]; // " world!" +</pre> + +<h2 id="规范">规范</h2> + +<p>非标准。并不是任何现行规范的一部分。</p> + +<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>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</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>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="另见">另见</h2> + +<ul> + <li>{{non-standard_inline}} {{jsxref("RegExp.input", "RegExp.input ($_)")}}</li> + <li>{{non-standard_inline}} {{jsxref("RegExp.lastMatch", "RegExp.lastMatch ($&)")}}</li> + <li>{{non-standard_inline}} {{jsxref("RegExp.lastParen", "RegExp.lastParen ($+)")}}</li> + <li>{{non-standard_inline}} {{jsxref("RegExp.leftContext", "RegExp.leftContext ($`)")}}</li> + <li>{{non-standard_inline}} {{jsxref("RegExp.n", "RegExp.$1-$9")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/regexp/source/index.html b/files/zh-cn/web/javascript/reference/global_objects/regexp/source/index.html new file mode 100644 index 0000000000..8f526e39ca --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/regexp/source/index.html @@ -0,0 +1,109 @@ +--- +title: RegExp.prototype.source +slug: Web/JavaScript/Reference/Global_Objects/RegExp/source +tags: + - JavaScript + - Property + - Prototype + - Reference + - RegExp + - Regular Expressions +translation_of: Web/JavaScript/Reference/Global_Objects/RegExp/source +--- +<div>{{JSRef("Global_Objects", "RegExp")}}</div> + +<h2 id="Summary" name="Summary">概述</h2> + +<p><strong><code>source</code></strong> 属性返回一个值为当前正则表达式对象的模式文本的字符串，该字符串不会包含正则字面量两边的斜杠以及任何的标志字符。</p> + +<h2 id="Examples" name="Examples">示例</h2> + +<pre class="brush: js">var regex = /fooBar/ig; + +console.log(regex.source); // "fooBar"，不包含 /.../ 和 "ig"。 +</pre> + +<h2 id="Specifications" name="Specifications">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范名称</th> + <th scope="col">规范状态</th> + <th scope="col">备注</th> + </tr> + <tr> + <td>ECMAScript 3rd Edition.</td> + <td>Standard</td> + <td><code>source</code> 是正则对象自身的数据属性</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.10.7.1', 'RegExp.prototype.source')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-get-regexp.prototype.source', 'RegExp.prototype.source')}}</td> + <td>{{Spec2('ES6')}}</td> + <td><code>source</code> 成为了正则对象原型上的一个访问器属性</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">浏览器兼容性</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>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</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>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("RegExp.prototype.flags")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/regexp/sticky/index.html b/files/zh-cn/web/javascript/reference/global_objects/regexp/sticky/index.html new file mode 100644 index 0000000000..f74b96499b --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/regexp/sticky/index.html @@ -0,0 +1,86 @@ +--- +title: RegExp.prototype.sticky +slug: Web/JavaScript/Reference/Global_Objects/RegExp/sticky +tags: + - JavaScript + - RegExp + - 正则表达式 +translation_of: Web/JavaScript/Reference/Global_Objects/RegExp/sticky +--- +<div>{{JSRef}}</div> + +<p><strong><code>sticky</code></strong> 属性反映了搜索是否具有粘性（ 仅从正则表达式的 {{jsxref("RegExp.lastIndex", "lastIndex")}} 属性表示的索引处搜索 ）。<code>sticky</code> 是正则表达式对象的只读属性。</p> + +<p>{{EmbedInteractiveExample("pages/js/regexp-prototype-sticky.html", "taller")}}</p> + +<div>{{js_property_attributes(0, 0, 1)}}</div> + +<h2 id="描述">描述</h2> + +<p><code>sticky</code> 的值是 {{jsxref("Boolean")}} ，并在 <code>y</code> 标志使用时为真; 否则为假。<code>y</code> 标志指示，仅从正则表达式的 {{jsxref("RegExp.lastIndex", "lastIndex")}} 属性表示的索引处为目标字符串匹配（并且不会尝试从后续索引匹配）。如果一个表达式同时指定了 <code>sticky</code> 和 <code>global</code>，其将会忽略 <code>global</code> 标志。</p> + +<p>你不能直接更改这个属性，它是只读的。</p> + +<h2 id="例子">例子</h2> + +<h3 id="使用带_sticky_标志的正则表达式">使用带 sticky 标志的正则表达式</h3> + +<pre class="brush: js">var str = '#foo#'; +var regex = /foo/y; + +regex.lastIndex = 1; +regex.test(str); // true （译注：此例仅当 lastIndex = 1 时匹配成功，这就是 sticky 的作用） +regex.lastIndex = 5; +regex.test(str); // false （lastIndex 被 sticky 标志考虑到，从而导致匹配失败） +regex.lastIndex; // 0 （匹配失败后重置） +</pre> + +<h3 id="锚定的_sticky_标志">锚定的 sticky 标志</h3> + +<p>火狐的 SpiderMonkey 引擎的几个版本有一个 <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=773687">bug</a>，处理 <code>^</code> 断言和 sticky 标志时，会允许使用了 sticky 标志的表达式从 <code>^</code> 断言开始匹配，这是不对的。这个 bug 是在 Firefox 3.6 之后的某个版本引入的（which had the sticky flag but not the bug）并于2015年修复。 可能正因为这个 bug， ES2015 规范 <a href="http://www.ecma-international.org/ecma-262/7.0/index.html#sec-assertion">特别指出</a>：</p> + +<blockquote> +<p>当使用带有 <code>y</code> 标识的匹配模式时，^ 断言总是会匹配输入的开始位置或者（如果是多行模式）每一行的开始位置。</p> +</blockquote> + +<p>正确行为的示例：</p> + +<pre class="brush: js">var regex = /^foo/y; +regex.lastIndex = 2; +regex.test("..foo"); // false - 索引2不是字符串的开始 + +var regex2 = /^foo/my; +regex2.lastIndex = 2; +regex2.test("..foo"); // false - 索引2不是字符串或行的开始 +regex2.lastIndex = 2; +regex2.test(".\nfoo"); // true - 索引2是行的开始 +</pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Specification</th> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-get-regexp.prototype.sticky', 'RegExp.prototype.sticky')}}</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{Compat("javascript.builtins.RegExp.sticky")}}</p> + +<div></div> + +<h2 id="相关链接"><span style="">相关链接</span></h2> + +<ul> + <li>{{jsxref("RegExp.lastIndex")}}</li> + <li>{{jsxref("RegExp.prototype.global")}}</li> + <li>{{jsxref("RegExp.prototype.ignoreCase")}}</li> + <li>{{jsxref("RegExp.prototype.multiline")}}</li> + <li>{{jsxref("RegExp.prototype.source")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/regexp/test/index.html b/files/zh-cn/web/javascript/reference/global_objects/regexp/test/index.html new file mode 100644 index 0000000000..d742f6c172 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/regexp/test/index.html @@ -0,0 +1,128 @@ +--- +title: RegExp.prototype.test() +slug: Web/JavaScript/Reference/Global_Objects/RegExp/test +tags: + - JavaScript + - Method + - Prototype + - RegExp + - Regular Expressions +translation_of: Web/JavaScript/Reference/Global_Objects/RegExp/test +--- +<div>{{JSRef}}</div> + +<p><code><strong>test()</strong></code> 方法执行一个检索，用来查看正则表达式与指定的字符串是否匹配。返回 <code>true</code> 或 <code>false</code>。</p> + +<div>{{EmbedInteractiveExample("pages/js/regexp-prototype-test.html", "taller")}}</div> + +<div class="hidden">The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> and send us a pull request.</div> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="notranslate"><var>regexObj</var>.test(str)</pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>str</code></dt> + <dd>用来与正则表达式匹配的字符串</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>如果正则表达式与指定的字符串匹配 ，返回<code>true</code>；否则<code>false</code>。</p> + +<h2 id="Description" name="Description">描述</h2> + +<p>当你想要知道一个正则表达式是否与指定的字符串匹配时，就可以使用 <code>test()</code>（类似于<code> </code> {{jsxref("String.prototype.search()")}} 方法），差别在于test返回一个布尔值，而 search 返回索引（如果找到）或者-1（如果没找到）；若想知道更多信息（然而执行比较慢），可使用{{jsxref("RegExp.prototype.exec()", "exec()")}} 方法（类似于 {{jsxref("String.prototype.match()")}} 方法）。 和 {{jsxref("RegExp.prototype.exec()", "exec()")}} (或者组合使用),一样，在相同的全局正则表达式实例上多次调用<code><code>test</code></code>将会越过之前的匹配。</p> + +<h2 id="Examples" name="Examples">示例</h2> + +<h3 id="Example_Using_test" name="Example:_Using_test">使用 <code>test()</code></h3> + +<p>一个简单的例子，测试 "hello" 是否包含在字符串的最开始，返回布尔值。</p> + +<pre class="brush: js notranslate">let str = 'hello world!'; +let result = /^hello/.test(str); +console.log(result); +// true +</pre> + +<p>下例打印一条信息，该信息内容取决于是否成功通过指定测试：</p> + +<pre class="brush: js notranslate">function testinput(re, str){ + var midstring; + if (re.test(str)) { + midstring = " contains "; + } else { + midstring = " does not contain "; + } + console.log(str + midstring + re.source); +} +</pre> + +<h3 id="当设置全局标志的正则使用test">当设置全局标志的正则使用<code>test()</code></h3> + +<p>如果正则表达式设置了全局标志，<code>test() </code>的执行会改变正则表达式 <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp/lastIndex" title="The lastIndex is a read/write integer property of regular expression instances that specifies the index at which to start the next match."><code>lastIndex</code></a>属性。连续的执行<code>test()</code>方法，后续的执行将会从 lastIndex 处开始匹配字符串，({{jsxref("RegExp.prototype.exec()", "<code>exec()</code>")}} 同样改变正则本身的 <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp/lastIndex" title="The lastIndex is a read/write integer property of regular expression instances that specifies the index at which to start the next match.">lastIndex</a>属性值</code>).</p> + +<p>下面的实例表现了这种行为： </p> + +<pre class="brush: js notranslate">var regex = /foo/g; + +// regex.lastIndex is at 0 +regex.test('foo'); // true + +// regex.lastIndex is now at 3 +regex.test('foo'); // false +</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('ES3')}}</td> + <td>{{Spec2('ES3')}}</td> + <td>Initial definition. Implemented in JavaScript 1.2.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.10.6.3', 'RegExp.test')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-regexp.prototype.test', 'RegExp.test')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-regexp.prototype.test', 'RegExp.test')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h3 id="sect1"></h3> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div class="hidden">这个页面的兼容性表格是由结构数据生成。如果你想对数据作出贡献，详情请前往 <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> 并给我们一个PR。</div> + +<p>{{Compat("javascript.builtins.RegExp.test")}}</p> + +<h2 id="Firefox特殊注意">Firefox特殊注意</h2> + +<p>在 Firefox 8之前， <code>test()</code> 被不正确地实现了；当无参数地调用时，它会匹配之前的输入值 (RegExp.input 属性)，而不是字符串"undefined"。这已经被修正了；现在 <code>/undefined/.test()</code> 正确地返回<code>true</code>，而不是错误。</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>在<a href="/zh-CN/docs/Web/JavaScript/Guide" title="JavaScript/Guide">JavaScript指南</a>的<a href="/zh-CN/docs/Web/JavaScript/Guide/Regular_Expressions" title="JavaScript/Guide/Regular_Expressions">正则表达式</a>章节</li> + <li>{{jsxref("RegExp")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/regexp/tosource/index.html b/files/zh-cn/web/javascript/reference/global_objects/regexp/tosource/index.html new file mode 100644 index 0000000000..80f4972ca0 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/regexp/tosource/index.html @@ -0,0 +1,44 @@ +--- +title: RegExp.prototype.toSource() +slug: Web/JavaScript/Reference/Global_Objects/RegExp/toSource +tags: + - JavaScript + - Method + - Non-standard + - Prototype + - RegExp +translation_of: Web/JavaScript/Reference/Global_Objects/RegExp/toSource +--- +<p>{{JSRef("Global_Objects", "RegExp")}}{{ Non-standard_header() }}</p> + +<h2 id="Summary" name="Summary">概述</h2> + +<p>返回一个字符串,代表当前对象的源代码</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code><var>regexObj</var>.toSource() +</code></pre> + +<h2 id="Description" name="Description">描述</h2> + +<p><code>toSource</code>方法返回值如下:</p> + +<ul> + <li>对于内置的<code>RegExp</code>对象, <code>toSource</code> 如下字符串:</li> +</ul> + +<pre class="brush: js">function RegExp() { + [native code] +} +</pre> + +<ul> + <li>对于一个<code>RegExp实例</code>, <code>toSource返回代表该正则的字符串.</code></li> +</ul> + +<p>该方法通常由JavaScript内部隐含调用,而不会明确的出现在用户代码中.</p> + +<h2 id="See_Also" name="See_Also">相关链接</h2> + +<p><a href="/zh-cn/JavaScript/Reference/Global_Objects/Object/toSource" title="zh-cn/JavaScript/Reference/Global_Objects/Object/toSource">Object.prototype.toSource</a></p> diff --git a/files/zh-cn/web/javascript/reference/global_objects/regexp/tostring/index.html b/files/zh-cn/web/javascript/reference/global_objects/regexp/tostring/index.html new file mode 100644 index 0000000000..22aef815b4 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/regexp/tostring/index.html @@ -0,0 +1,106 @@ +--- +title: RegExp.prototype.toString() +slug: Web/JavaScript/Reference/Global_Objects/RegExp/toString +tags: + - JavaScript + - Method + - Prototype + - RegExp +translation_of: Web/JavaScript/Reference/Global_Objects/RegExp/toString +--- +<div> + {{JSRef("Global_Objects", "RegExp")}}</div> +<h2 id="Summary" name="Summary">概述</h2> +<p><code><strong>toString()</strong></code> 返回一个表示该正则表达式的字符串。</p> +<h2 id="Syntax" name="Syntax">语法</h2> +<pre class="syntaxbox"><var>regexObj</var>.toString()</pre> +<h3 id="Parameters" name="Parameters">参数</h3> +<p>无</p> +<h2 id="Description" name="Description">描述</h2> +<p>{{jsxref("Global_Objects/RegExp", "RegExp")}} 对象覆盖了 {{jsxref("Global_Objects/Object", "Object")}} 对象的 <code>toString()</code> 方法，并没有继承 {{jsxref("Object.prototype.toString()")}}。对于 <code>RegExp</code> 对象，<code>toString</code> 方法返回一个该正则表达式的字符串形式。</p> +<h2 id="Examples" name="Examples">示例</h2> +<h3 id="Example:_Using_toString" name="Example:_Using_toString">例子：使用 <code>toString</code></h3> +<p>下例输出 <code>RegExp</code> 对象的字符串值：</p> +<pre>myExp = new RegExp("a+b+c"); +alert(myExp.toString()); // 显示 "/a+b+c/" + +foo = new RegExp("bar", "g"); +alert(foo.toString()); // 显示 "/bar/g" +</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>ECMAScript 3rd Edition. Implemented in JavaScript 1.1</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.9.5.2', 'RegExp.prototype.toString')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-regexp.prototype.tostring', 'RegExp.prototype.toString')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> +<h2 id="浏览器兼容性">浏览器兼容性</h2> +<p>{{ CompatibilityTable() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> + </table> +</div> +<h2 id="See_Also" name="See_Also">相关链接</h2> +<ul> + <li>{{jsxref("Object.prototype.toString()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/regexp/unicode/index.html b/files/zh-cn/web/javascript/reference/global_objects/regexp/unicode/index.html new file mode 100644 index 0000000000..bd4253824c --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/regexp/unicode/index.html @@ -0,0 +1,112 @@ +--- +title: RegExp.prototype.unicode +slug: Web/JavaScript/Reference/Global_Objects/RegExp/unicode +translation_of: Web/JavaScript/Reference/Global_Objects/RegExp/unicode +--- +<div>{{JSRef}}</div> + +<p><strong><code>unicode</code></strong> 属性表明正则表达式带有"<code>u</code>" 标志。 <code>unicode</code> 是正则表达式独立实例的只读属性。</p> + +<div>{{js_property_attributes(0, 0, 1)}}</div> + +<h2 id="描述">描述</h2> + +<p><code>unicode</code> 的值是 {{jsxref("Boolean")}}，并且如果使用了 "<code>u</code>" 标志则为 <code>true</code>；否则为 <code>false</code>。"<code>u</code>" 标志开启了多种 Unicode 相关的特性。使用 "u" 标志，任何 Unicode 代码点的转义都会被解释。</p> + +<p>你不能直接修改这个属性，它是只读的。</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用_unicode_属性">使用 <code>unicode</code> 属性</h3> + +<pre class="brush: js">var regex = new RegExp('\u{61}', 'u'); + +console.log(regex.unicode); // true +</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-get-regexp.prototype.unicode', 'RegExp.prototype.unicode')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>初始定义。</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-get-regexp.prototype.unicode', 'RegExp.prototype.unicode')}}</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>Edge</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{CompatChrome(50)}}</td> + <td>12 (case folding 13)</td> + <td>{{CompatGeckoDesktop(46)}}</td> + <td>{{CompatNo}}</td> + <td>37</td> + <td>10</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>{{CompatNo}}</td> + <td>{{CompatChrome(50)}}</td> + <td>{{CompatGeckoMobile(46)}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>10</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="另见">另见</h2> + +<ul> + <li>{{jsxref("RegExp.lastIndex")}}</li> + <li>{{jsxref("RegExp.prototype.global")}}</li> + <li>{{jsxref("RegExp.prototype.ignoreCase")}}</li> + <li>{{jsxref("RegExp.prototype.multiline")}}</li> + <li>{{jsxref("RegExp.prototype.source")}}</li> + <li>{{jsxref("RegExp.prototype.sticky")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/set/@@iterator/index.html b/files/zh-cn/web/javascript/reference/global_objects/set/@@iterator/index.html new file mode 100644 index 0000000000..fa3f7c61e5 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/set/@@iterator/index.html @@ -0,0 +1,81 @@ +--- +title: 'Set.prototype[@@iterator]()' +slug: Web/JavaScript/Reference/Global_Objects/Set/@@iterator +tags: + - ECMAScript2015 + - Iterator + - JavaScript + - Method + - set +translation_of: Web/JavaScript/Reference/Global_Objects/Set/@@iterator +--- +<div>{{JSRef}}</div> + +<p><code><strong>@@iterator</strong></code> 属性的初始值和 {{jsxref("Set.prototype.values()", "values")}} 属性的初始值是同一个函数。</p> + +<div>{{EmbedInteractiveExample("pages/js/set-prototype-@@iterator.html")}}</div> + + + +<h2 id="Syntax">Syntax</h2> + +<pre class="syntaxbox notranslate"><code><em>mySet</em>[Symbol.iterator]</code></pre> + +<h3 id="Return_value">Return value</h3> + +<p>返回 <code>Set</code> <strong>iterator</strong> 函数，默认值是 {{jsxref("Set.prototype.values()", "values()")}} 函数。</p> + +<h2 id="Examples">Examples</h2> + +<h3 id="Using_iterator">Using <code>[@@iterator]()</code></h3> + +<pre class="brush:js notranslate">const mySet = new Set(); +mySet.add('0'); +mySet.add(1); +mySet.add({}); + +const setIter = mySet[Symbol.iterator](); + +console.log(setIter.next().value); // "0" +console.log(setIter.next().value); // 1 +console.log(setIter.next().value); // Object +</pre> + +<h3 id="Using_iterator_with_for..of">Using <code>[@@iterator]()</code> with <code>for..of</code></h3> + +<pre class="brush:js notranslate">const mySet = new Set(); +mySet.add('0'); +mySet.add(1); +mySet.add({}); + +for (const v of mySet) { + console.log(v); +} +</pre> + +<h2 id="Specifications">Specifications</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Specification</th> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-set.prototype-@@iterator', 'Set.prototype[@@iterator]')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility">Browser compatibility</h2> + + + +<p>{{Compat("javascript.builtins.Set.@@iterator")}}</p> + +<h2 id="See_also">See also</h2> + +<ul> + <li>{{jsxref("Set.prototype.entries()")}}</li> + <li>{{jsxref("Set.prototype.keys()")}}</li> + <li>{{jsxref("Set.prototype.values()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/set/@@species/index.html b/files/zh-cn/web/javascript/reference/global_objects/set/@@species/index.html new file mode 100644 index 0000000000..c950ccbf5a --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/set/@@species/index.html @@ -0,0 +1,61 @@ +--- +title: 'get Set[@@species]' +slug: Web/JavaScript/Reference/Global_Objects/Set/@@species +tags: + - ECMAScript2015 + - JavaScript + - set +translation_of: Web/JavaScript/Reference/Global_Objects/Set/@@species +--- +<div>{{JSRef}}</div> + +<p><code><strong>Set[@@species]</strong></code> 访问器属性返回<code>Set</code>的构造函数.</p> + +<h2 id="描述">描述</h2> + +<p>species 访问属性返回 <code>Set</code> 对象的默认构造函数. 子构造函数或许会重载这个属性以至改变构造函数的赋值.</p> + +<h2 id="示例">示例</h2> + +<h3 id="普通对象中的_Species">普通对象中的 Species</h3> + +<p>species 属性返回默认的构造函数, 它是<code>Set</code> 对象的构造函数:</p> + +<pre class="brush: js notranslate">Set[Symbol.species]; // function Set()</pre> + +<h3 id="派生对象中的_Species">派生对象中的 Species</h3> + +<p>在一个派生集合对象中 (比如你自定义的<code>MySet</code>集合), <code>MySet</code> 的species 属性 是 <code>MySet</code> 构造函数. 又或者, 你想要重写它, 让它能在你派生的类方法中能返回父级<code>Set</code> 对象:</p> + +<pre class="brush: js notranslate">class MySet extends Set { + // Overwrite MySet species to the parent Set constructor + static get [Symbol.species]() { return Set; } +}</pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Specification</th> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-get-set-@@species', 'get Set [ @@species ]')}}</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> + + +<p>{{Compat("javascript.builtins.Set.@@species")}}</p> +</div> + +<h2 id="另见">另见</h2> + +<ul> + <li>{{jsxref("Set")}}</li> + <li>{{jsxref("Symbol.species")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/set/add/index.html b/files/zh-cn/web/javascript/reference/global_objects/set/add/index.html new file mode 100644 index 0000000000..255379d70c --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/set/add/index.html @@ -0,0 +1,77 @@ +--- +title: Set.prototype.add() +slug: Web/JavaScript/Reference/Global_Objects/Set/add +tags: + - ECMAScript6 + - JavaScript + - Prototype + - set + - 原型 + - 方法 +translation_of: Web/JavaScript/Reference/Global_Objects/Set/add +--- +<div>{{JSRef}} </div> + +<p><code><strong>add()</strong></code> 方法用来向一个 <code>Set</code> 对象的末尾添加一个指定的值。</p> + +<div>{{EmbedInteractiveExample("pages/js/set-prototype-add.html")}}</div> + + + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox notranslate"><code><em>mySet</em>.add(value);</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt>value</dt> + <dd>必需。需要添加到 <code>Set </code>对象的元素的值。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p><code>Set</code> 对象本身</p> + +<p>注意：不能添加重复的值</p> + +<h2 id="Examples" name="Examples">示例</h2> + +<pre class="brush: js notranslate">var mySet = new Set(); + +mySet.add(1); +mySet.add(5).add("some text"); // 可以链式调用 + +console.log(mySet); +// Set [1, 5, "some text"] + +mySet.add(5).add(1); +console.log(mySet); +// Set [1, 5, "some text"] // 重复的值没有被添加进去</pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范</th> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-set.prototype.add', 'Set.prototype.add')}}</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.Set.add")}}</p> + +<h2 id="参见">参见</h2> + +<ul> + <li>{{jsxref("Set")}}</li> + <li>{{jsxref("Set.prototype.delete()")}}</li> + <li>{{jsxref("Set.prototype.has()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/set/clear/index.html b/files/zh-cn/web/javascript/reference/global_objects/set/clear/index.html new file mode 100644 index 0000000000..6103b63a67 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/set/clear/index.html @@ -0,0 +1,120 @@ +--- +title: Set.prototype.clear() +slug: Web/JavaScript/Reference/Global_Objects/Set/clear +tags: + - ECMAScript6 + - JavaScript + - Prototype + - set + - 原型 + - 方法 +translation_of: Web/JavaScript/Reference/Global_Objects/Set/clear +--- +<div>{{JSRef}}</div> + +<p><code><strong>clear()</strong></code> 方法用来清空一个 <code>Set</code> 对象中的所有元素。</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code><em>mySet</em>.clear();</code> +</pre> + +<h3 id="返回值">返回值</h3> + +<p>{{jsxref("undefined")}}.</p> + +<h2 id="Examples" name="Examples">示例</h2> + +<pre class="brush: js">var mySet = new Set(); +mySet.add(1); +mySet.add("foo"); + +mySet.size; // 2 +mySet.has("foo"); // true + +mySet.clear(); + +mySet.size; // 0 +mySet.has("bar") // false +</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('ES6', '#sec-set.prototype.clear', 'Set.prototype.clear')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-set.prototype.clear', 'Set.prototype.clear')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{ CompatibilityTable() }}</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>38</td> + <td>{{CompatGeckoDesktop("19.0")}}</td> + <td>11</td> + <td>25</td> + <td>7.1</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>{{ CompatNo() }}</td> + <td>25</td> + <td>{{CompatGeckoMobile("19.0")}}</td> + <td>{{ CompatNo() }}</td> + <td>{{ CompatNo() }}</td> + <td>8</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="相关链接"><strong style="font-size: 2.14285714285714rem; font-weight: 700; letter-spacing: -1px; line-height: 30px;">相关链接</strong></h2> + +<ul> + <li>{{jsxref("Set")}}</li> + <li>{{jsxref("Set.prototype.delete()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/set/delete/index.html b/files/zh-cn/web/javascript/reference/global_objects/set/delete/index.html new file mode 100644 index 0000000000..5602ae7942 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/set/delete/index.html @@ -0,0 +1,120 @@ +--- +title: Set.prototype.delete() +slug: Web/JavaScript/Reference/Global_Objects/Set/delete +tags: + - ECMAScript6 + - JavaScript + - set + - 方法 +translation_of: Web/JavaScript/Reference/Global_Objects/Set/delete +--- +<div>{{JSRef}}</div> + +<p><code><strong>delete()</strong></code> 方法可以从一个 <code>Set</code> 对象中删除指定的元素。</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code><em>mySet</em>.delete(value);</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt>value</dt> + <dd>将要删除的元素</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>成功删除返回 <code>true</code>，否则返回 <code>false。</code></p> + +<h2 id="Examples" name="Examples">示例</h2> + +<pre class="brush: js">var mySet = new Set(); +mySet.add("foo"); + +mySet.delete("bar"); // 返回 false，不包含 "bar" 这个元素 +mySet.delete("foo"); // 返回 true，删除成功 + +mySet.has("foo"); // 返回 false，"foo" 已经成功删除 +</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('ES6', '#sec-set.prototype.delete', 'Set.prototype.delete')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-set.prototype.delete', 'Set.prototype.delete')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{ CompatibilityTable() }}</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>38</td> + <td>{{CompatGeckoDesktop("13.0")}}</td> + <td>11</td> + <td>25</td> + <td>7.1</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>{{ CompatNo() }}</td> + <td>38</td> + <td>{{CompatGeckoMobile("13.0")}}</td> + <td>{{ CompatNo() }}</td> + <td>{{ CompatNo() }}</td> + <td>8</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("Set")}}</li> + <li>{{jsxref("Set.prototype.clear()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/set/entries/index.html b/files/zh-cn/web/javascript/reference/global_objects/set/entries/index.html new file mode 100644 index 0000000000..f73a1e1a26 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/set/entries/index.html @@ -0,0 +1,113 @@ +--- +title: Set.prototype.entries() +slug: Web/JavaScript/Reference/Global_Objects/Set/entries +translation_of: Web/JavaScript/Reference/Global_Objects/Set/entries +--- +<div>{{JSRef}}</div> + +<p>entries() 方法返回一个新的迭代器对象 ，这个对象的元素是类似 [value, value] 形式的数组，value 是集合对象中的每个元素，迭代器对象元素的顺序即集合对象中元素插入的顺序。由于集合对象不像 Map 对象那样拥有 key，然而，为了与 Map 对象的 API 形式保持一致，故使得每一个 entry 的 key 和 value 都拥有相同的值，因而最终返回一个 [value, value] 形式的数组。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><em>mySet</em>.entries()</code></pre> + +<h3 id="返回值">返回值</h3> + +<p>一个新的包含 [value, value] 形式的数组迭代器对象，value 是给定集合中的每个元素，迭代器 对象元素的顺序即集合对象中元素插入的顺序。</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用_entries()">使用 <code>entries()</code></h3> + +<pre class="brush:js">var mySet = new Set(); +mySet.add("foobar"); +mySet.add(1); +mySet.add("baz"); + +var setIter = mySet.entries(); + +console.log(setIter.next().value); // ["foobar", "foobar"] +console.log(setIter.next().value); // [1, 1] +console.log(setIter.next().value); // ["baz", "baz"] +</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>{{SpecName('ES6', '#sec-set.prototype.entries', 'Set.prototype.entries')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>初始定义。</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-set.prototype.entries', 'Set.prototype.entries')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性 </h2> + +<p>{{CompatibilityTable}}</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>38</td> + <td>{{ CompatGeckoDesktop("24") }}</td> + <td>{{CompatNo}}</td> + <td>25</td> + <td>7.1</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>{{CompatNo}}</td> + <td>38</td> + <td>{{ CompatGeckoMobile("24") }}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>8</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Set.prototype.keys()")}}</li> + <li>{{jsxref("Set.prototype.values()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/set/foreach/index.html b/files/zh-cn/web/javascript/reference/global_objects/set/foreach/index.html new file mode 100644 index 0000000000..e89be3af36 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/set/foreach/index.html @@ -0,0 +1,145 @@ +--- +title: Set.prototype.forEach() +slug: Web/JavaScript/Reference/Global_Objects/Set/forEach +translation_of: Web/JavaScript/Reference/Global_Objects/Set/forEach +--- +<div>{{JSRef}}</div> + +<p><code>forEach</code> 方法会根据集合中元素的插入顺序，依次执行提供的回调函数。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><em>mySet</em>.forEach(<em>callback</em>[, <em>thisArg</em>])</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>callback</code></dt> + <dd>为集合中每个元素执行的回调函数，该函数接收三个参数：</dd> + <dd> + <dl> + <dt><strong><font face="consolas, Liberation Mono, courier, monospace"><span style="background-color: rgba(220, 220, 220, 0.5);">currentValue</span>, </font></strong><strong><font face="consolas, Liberation Mono, courier, monospace"><span style="background-color: rgba(220, 220, 220, 0.5);">currentKey</span>{{optional_inline}}</font></strong></dt> + <dd><strong>currentValue</strong> 是正在被操作的元素。并且由于集合没有索引，所以 <strong>currentKey</strong> 也表示这个正在被操作的元素。</dd> + <dt><strong><font face="consolas, Liberation Mono, courier, monospace"><span style="background-color: rgba(220, 220, 220, 0.5);">set</span>{{optional_inline}}</font></strong></dt> + <dd>调用当前 <code>forEach</code> 方法的集合对象</dd> + </dl> + </dd> + <dt><code>thisArg</code><strong><font face="consolas, Liberation Mono, courier, monospace">{{optional_inline}}</font></strong></dt> + <dd>回调函数执行过程中的 <code>this</code> 值。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>{{jsxref("undefined")}}.</p> + +<h2 id="描述">描述</h2> + +<p><code>forEach</code> 方法会依次为集合中的元素执行回调函数，就算元素的值是 <code>undefined </code>。</p> + +<p><strong>回调函数</strong>有三个参数:</p> + +<ul> + <li>元素的值</li> + <li>元素的索引</li> + <li>正在遍历的集合对象</li> +</ul> + +<p>但是由于集合对象中没有索引(keys)，所以前两个参数都是{{domxref("Set")}}中元素的值(<strong>values</strong>)，之所以这样设计回调函数是为了和{{jsxref("Map.foreach", "Map")}} 以及{{jsxref("Array.forEach","Array")}}的 <code>forEach</code> 函数用法保持一致。</p> + +<p>如果提供了一个 <code>thisArg</code> 参数给 <code>forEach</code> 函数，则参数将会作为回调函数中的 <code>this</code>值。否则 <code>this</code> 值为 <code>undefined</code>。回调函数中 <code>this</code> 的绑定是根据<a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Operators/this">函数被调用时通用的 <code>this</code> 绑定规则来决定的</a>。</p> + +<p><code>forEach</code> 函数为集合对象中每个元素都执行一次回调；它不会返回任何值。</p> + +<h2 id="例子">例子</h2> + +<h3 id="输出集合对象的内容">输出集合对象的内容</h3> + +<p><span class="outputBox-2liU7_0">以下代码依次打印集合对象的元素:</span></p> + +<pre class="brush:js">function logSetElements(value1, value2, set) { + console.log("s[" + value1 + "] = " + value2); +} + +new Set(["foo", "bar", undefined]).forEach(logSetElements); + +// logs: +// "s[foo] = foo" +// "s[bar] = bar" +// "s[undefined] = undefined" +</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('ES6', '#sec-set.prototype.foreach', 'Set.prototype.forEach')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{CompatibilityTable}}</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>{{ CompatChrome(38) }}</td> + <td>{{CompatGeckoDesktop("25.0")}}</td> + <td>{{ CompatIE("11") }}</td> + <td>25</td> + <td>7.1</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>{{CompatNo}}</td> + <td>38</td> + <td>{{CompatGeckoMobile("25.0")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>8</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="参见">参见</h2> + +<ul> + <li>{{jsxref("Array.prototype.forEach()")}}</li> + <li>{{jsxref("Map.prototype.forEach()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/set/has/index.html b/files/zh-cn/web/javascript/reference/global_objects/set/has/index.html new file mode 100644 index 0000000000..e9edc5d978 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/set/has/index.html @@ -0,0 +1,127 @@ +--- +title: Set.prototype.has() +slug: Web/JavaScript/Reference/Global_Objects/Set/has +tags: + - ECMAScript 2015 + - JavaScript + - set +translation_of: Web/JavaScript/Reference/Global_Objects/Set/has +--- +<div>{{JSRef("Global_Objects", "Set")}}</div> + +<h2 id="Summary" name="Summary">概述</h2> + +<p><strong>has() </strong>方法返回一个布尔值来指示对应的值value是否存在Set对象中。</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code><em>mySet</em>.has(value);</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt>value</dt> + <dd>必需。用以测试该值是否存在于 Set 对象中。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<dl> + <dt>Boolean</dt> + <dd>如果指定的值（value）存在于Set对象当中，返回<code>true</code>；否则返回 <code>false</code>。</dd> +</dl> + +<h2 id="Examples" name="Examples">示例</h2> + +<h3 id="Example:_Testing_size_of_all_array_elements" name="Example:_Testing_size_of_all_array_elements">使用 <code>has</code> 方法</h3> + +<pre class="brush: js line-numbers language-js"><code class="language-js"><span class="keyword token">var</span> mySet <span class="operator token">=</span> <span class="keyword token">new</span> <span class="class-name token">Set</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">;</span> +mySet<span class="punctuation token">.</span><span class="function token">add</span><span class="punctuation token">(</span><span class="string token">'foo'</span><span class="punctuation token">)</span><span class="punctuation token">;</span> + +mySet<span class="punctuation token">.</span><span class="function token">has</span><span class="punctuation token">(</span><span class="string token">'foo'</span><span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// 返回 true</span> +mySet<span class="punctuation token">.</span><span class="function token">has</span><span class="punctuation token">(</span><span class="string token">'bar'</span><span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// 返回 false</span> + +<span class="keyword token">var</span> set1 <span class="operator token">=</span> <span class="keyword token">new</span> <span class="class-name token">Set</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">;</span> +<span class="keyword token">var</span> obj1 <span class="operator token">=</span> <span class="punctuation token">{</span><span class="string token">'key1'</span><span class="punctuation token">:</span> <span class="number token">1</span><span class="punctuation token">}</span><span class="punctuation token">;</span> +set1<span class="punctuation token">.</span><span class="function token">add</span><span class="punctuation token">(</span>obj1<span class="punctuation token">)</span><span class="punctuation token">;</span> + +set1<span class="punctuation token">.</span><span class="function token">has</span><span class="punctuation token">(</span>obj1<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// 返回 true</span> +set1<span class="punctuation token">.</span><span class="function token">has</span><span class="punctuation token">(</span><span class="punctuation token">{</span><span class="string token">'key1'</span><span class="punctuation token">:</span> <span class="number token">1</span><span class="punctuation token">}</span><span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// 会返回 false，因为其是另一个对象的引用</span> +set1<span class="punctuation token">.</span><span class="function token">add</span><span class="punctuation token">(</span><span class="punctuation token">{</span><span class="string token">'key1'</span><span class="punctuation token">:</span> <span class="number token">1</span><span class="punctuation token">}</span><span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// 现在 set1 中有2条（不同引用的）对象了</span></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>{{SpecName('ES6', '#sec-set.prototype.has', 'Set.prototype.has')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{ CompatibilityTable() }}</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>38</td> + <td>{{CompatGeckoDesktop("13.0")}}</td> + <td>11</td> + <td>25</td> + <td>7.1</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>{{ CompatNo() }}</td> + <td>38</td> + <td>{{CompatGeckoMobile("13.0")}}</td> + <td>{{ CompatNo() }}</td> + <td>{{ CompatNo() }}</td> + <td>iOS 8</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="相关连接"><span style="font-size: 30px; letter-spacing: -1px; line-height: 30px;"><strong>相关连接</strong></span></h2> + +<ul> + <li>{{jsxref("Set")}}</li> + <li>{{jsxref("Set.prototype.add()")}}</li> + <li>{{jsxref("Set.prototype.delete()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/set/index.html b/files/zh-cn/web/javascript/reference/global_objects/set/index.html new file mode 100644 index 0000000000..6d4dca88c9 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/set/index.html @@ -0,0 +1,273 @@ +--- +title: Set +slug: Web/JavaScript/Reference/Global_Objects/Set +tags: + - Class + - ECMAScript6 + - JavaScript + - set + - 全局对象 +translation_of: Web/JavaScript/Reference/Global_Objects/Set +--- +<div>{{ JSRef }}</div> + +<p><strong><code>Set</code></strong> 对象允许你存储任何类型的唯一值，无论是{{ Glossary('Primitive', '原始值') }}或者是对象引用。</p> + +<h2 id="简述">简述</h2> + +<p><code>Set</code>对象是值的集合，你可以按照插入的顺序迭代它的元素。 Set中的元素只会<strong>出现一次</strong>，即 Set 中的元素是唯一的。</p> + +<h3 id="值的相等">值的相等</h3> + +<p>因为 Set 中的值总是唯一的，所以需要判断两个值是否相等。在ECMAScript规范的早期版本中，这不是基于和===操作符中使用的算法相同的算法。具体来说，对于 Set s， +0 （+0 严格相等于-0）和-0是不同的值。然而，在 ECMAScript 2015规范中这点已被更改。有关详细信息，请参阅<a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Set#浏览器兼容性">浏览器兼容性</a> 表中的“<em>Key equality for -0 and 0</em>”。</p> + +<p>另外，<code>NaN</code>和<code>undefined</code>都可以被存储在Set 中， <code>NaN</code>之间被视为相同的值（NaN被认为是相同的，尽管 NaN !== NaN）。</p> + +<h2 id="Constructor">Constructor</h2> + +<dl> + <dt><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set/Set"><code>Set()</code></a></dt> + <dd>创建一个新的<code>Set</code>对象。</dd> +</dl> + +<h2 id="静态属性">静态属性</h2> + +<dl> + <dt>{{jsxref("Set.@@species", "get Set[@@species]")}}</dt> + <dd>构造函数用来创建派生对象.</dd> +</dl> + +<h2 id="Properties" name="Properties">实例属性</h2> + +<dl> + <dt>{{jsxref("Set.prototype.size")}}</dt> + <dd>返回 Set 对象中的值的个数</dd> +</dl> + +<h2 id="实例方法">实例方法</h2> + +<dl> + <dt>{{jsxref("Set.add", "Set.prototype.add(<em>value</em>)")}}</dt> + <dd>在<code>Set</code>对象尾部添加一个元素。返回该<code>Set</code>对象。</dd> + <dt>{{jsxref("Set.prototype.clear()")}}</dt> + <dd>移除<code>Set</code>对象内的所有元素。</dd> + <dt>{{jsxref("Set.delete", "Set.prototype.delete(<em>value</em>)")}}</dt> + <dd>移除<code>Set</code>中与这个值相等的元素，返回<code>Set.prototype.has(value)</code>在这个操作前会返回的值（即如果该元素存在，返回<code>true</code>，否则返回<code>false</code>）。<code>Set.prototype.has(value)</code>在此后会返回<code>false</code>。</dd> + <dt>{{jsxref("Set.prototype.entries()")}}</dt> + <dd>返回一个新的迭代器对象，该对象包含<code>Set</code>对象中的按插入顺序排列的所有元素的值的<code>[value, value]</code>数组。为了使这个方法和<code>Map</code>对象保持相似， 每个值的键和值相等。</dd> + <dt>{{jsxref("Set.forEach", "Set.prototype.forEach(<em>callbackFn</em>[, <em>thisArg</em>])")}}</dt> + <dd>按照插入顺序，为Set对象中的每一个值调用一次callBackFn。如果提供了<code>thisArg</code>参数，回调中的<code>this</code>会是这个参数。</dd> + <dt>{{jsxref("Set.has", "Set.prototype.has(<em>value</em>)")}}</dt> + <dd>返回一个布尔值，表示该值在<code>Set</code>中存在与否。</dd> + <dt>{{jsxref("Set.prototype.keys()")}}</dt> + <dd>与<strong><code>values()</code></strong>方法相同，返回一个新的迭代器对象，该对象包含<code>Set</code>对象中的按插入顺序排列的所有元素的值。</dd> + <dt>{{jsxref("Set.prototype.values()")}}</dt> + <dd>返回一个新的迭代器对象，该对象包含<code>Set</code>对象中的按插入顺序排列的所有元素的值。</dd> + <dt>{{jsxref("Set.prototype.@@iterator()", "Set.prototype[@@iterator]()")}}</dt> + <dd>返回一个新的迭代器对象，该对象包含<code>Set</code>对象中的按插入顺序排列的所有元素的值。</dd> +</dl> + +<h2 id="示例">示例</h2> + +<h3 id="使用Set对象">使用<code>Set</code>对象</h3> + +<pre class="brush: js notranslate">let mySet = new Set(); + +mySet.add(1); // Set [ 1 ] +mySet.add(5); // Set [ 1, 5 ] +mySet.add(5); // Set [ 1, 5 ] +mySet.add("some text"); // Set [ 1, 5, "some text" ] +let o = {a: 1, b: 2}; +mySet.add(o); + +mySet.add({a: 1, b: 2}); // o 指向的是不同的对象，所以没问题 + +mySet.has(1); // true +mySet.has(3); // false +mySet.has(5); // true +mySet.has(Math.sqrt(25)); // true +mySet.has("Some Text".toLowerCase()); // true +mySet.has(o); // true + +mySet.size; // 5 + +mySet.delete(5); // true, 从set中移除5 +mySet.has(5); // false, 5已经被移除 + +mySet.size; // 4, 刚刚移除一个值 + +console.log(mySet); +// logs Set(4) [ 1, "some text", {…}, {…} ] in Firefox +// logs Set(4) { 1, "some text", {…}, {…} } in Chrome</pre> + +<h3 id="迭代Set">迭代Set</h3> + +<pre class="brush: js notranslate">// 迭代整个set +// 按顺序输出：1, "some text", {"a": 1, "b": 2}, {"a": 1, "b": 2} +for (let item of mySet) console.log(item); + +// 按顺序输出：1, "some text", {"a": 1, "b": 2}, {"a": 1, "b": 2} +for (let item of mySet.keys()) console.log(item); + +// 按顺序输出：1, "some text", {"a": 1, "b": 2}, {"a": 1, "b": 2} +for (let item of mySet.values()) console.log(item); + +// 按顺序输出：1, "some text", {"a": 1, "b": 2}, {"a": 1, "b": 2} +//(键与值相等) +for (let [key, value] of mySet.entries()) console.log(key); + +// 使用 Array.from 转换Set为Array +var myArr = Array.from(mySet); // [1, "some text", {"a": 1, "b": 2}, {"a": 1, "b": 2}] + +// 如果在HTML文档中工作，也可以： +mySet.add(document.body); +mySet.has(document.querySelector("body")); // true + +// Set 和 Array互换 +mySet2 = new Set([1, 2, 3, 4]); +mySet2.size; // 4 +[...mySet2]; // [1,2,3,4] + +// 可以通过如下代码模拟求交集 +let intersection = new Set([...set1].filter(x => set2.has(x))); + +// 可以通过如下代码模拟求差集 +let difference = new Set([...set1].filter(x => !set2.has(x))); + +// 用forEach迭代 +mySet.forEach(function(value) { + console.log(value); +}); + +// 1 +// 2 +// 3 +// 4 +</pre> + +<h3 id="实现基本集合操作">实现基本集合操作</h3> + +<pre class="brush: js notranslate">function isSuperset(set, subset) { + for (let elem of subset) { + if (!set.has(elem)) { + return false; + } + } + return true; +} + +function union(setA, setB) { + let _union = new Set(setA); + for (let elem of setB) { + _union.add(elem); + } + return _union; +} + +function intersection(setA, setB) { + let _intersection = new Set(); + for (let elem of setB) { + if (setA.has(elem)) { + _intersection.add(elem); + } + } + return _intersection; +} + +<code>function symmetricDifference(setA, setB) { + let _difference = new Set(setA); + for (let elem of setB) { + if (_difference.has(elem)) { + _difference.delete(elem); + } else { + _difference.add(elem); + } + } + return _difference; +}</code> + +function difference(setA, setB) { + let _difference = new Set(setA); + for (let elem of setB) { + _difference.delete(elem); + } + return _difference; +} + +//Examples +let setA = new Set([1, 2, 3, 4]), + setB = new Set([2, 3]), + setC = new Set([3, 4, 5, 6]); + +isSuperset(setA, setB); // => true +union(setA, setC); // => Set [1, 2, 3, 4, 5, 6] +intersection(setA, setC); // => Set [3, 4] +symmetricDifference(setA, setC); // => Set [1, 2, 5, 6] +difference(setA, setC); // => Set [1, 2] +</pre> + +<h3 id="Array_相关"> <code>Array</code> 相关</h3> + +<pre class="brush: js notranslate">let myArray = ["value1", "value2", "value3"]; + +// 用Set构造器将Array转换为Set +let mySet = new Set(myArray); + +mySet.has("value1"); // returns true + +// 用...(展开操作符)操作符将Set转换为Array +console.log([...mySet]); // 与myArray完全一致 +</pre> + +<h3 id="数组去重">数组去重</h3> + +<pre class="brush: js notranslate">// Use to remove duplicate elements from the array +const numbers = [2,3,4,4,2,3,3,4,4,5,5,6,6,7,5,32,3,4,5] +console.log([...new Set(numbers)]) +// [2, 3, 4, 5, 6, 7, 32] +</pre> + +<h3 id="String_相关"><code>String</code> 相关</h3> + +<pre class="brush: js notranslate">let text = 'India'; + +let mySet = new Set(text); // Set {'I', 'n', 'd', 'i', 'a'} +mySet.size; // 5 + +// 大小写敏感 & duplicate ommision +new Set("Firefox") // Set(7) [ "F", "i", "r", "e", "f", "o", "x" ] +new Set("firefox") // Set(6) [ "f", "i", "r", "e", "o", "x" ] +</pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范</th> + </tr> + <tr> + <td>{{ SpecName('ESDraft', '#sec-set-objects', 'Set') }}</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div class="hidden"> +<p>The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> +</div> + +<p>{{ Compat('javascript.builtins.Set') }}</p> + +<h2 id="参见">参见</h2> + +<ul> + <li>{{ jsxref('Map') }}</li> + <li>{{ jsxref('WeakMap') }}</li> + <li>{{ jsxref('WeakSet') }}</li> +</ul> + +<p> + <audio style="display: none;"></audio> +</p> diff --git a/files/zh-cn/web/javascript/reference/global_objects/set/set/index.html b/files/zh-cn/web/javascript/reference/global_objects/set/set/index.html new file mode 100644 index 0000000000..2ead74e30a --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/set/set/index.html @@ -0,0 +1,73 @@ +--- +title: Set() constructor +slug: Web/JavaScript/Reference/Global_Objects/Set/Set +tags: + - Constructor + - JavaScript + - Reference + - set +translation_of: Web/JavaScript/Reference/Global_Objects/Set/Set +--- +<div>{{JSRef}}</div> + +<p><span class="seoSummary"><strong><code>Set</code> 构造函数</strong>能让你创建 <code>Set</code> 对象，其可以存储任意类型的唯一值，无论是 <a href="/en-US/docs/Glossary/Primitive">primitive values</a> 或者对象引用。</span></p> + +<div>{{EmbedInteractiveExample("pages/js/set-prototype-constructor.html")}}</div> + + + +<h2 id="Syntax">Syntax</h2> + +<pre class="syntaxbox notranslate">new Set([<var>iterable</var>])</pre> + +<h3 id="Parameters">Parameters</h3> + +<dl> + <dt><em><code>iterable</code></em> {{optional_inline}}</dt> + <dd>如果传递一个<a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...of">可迭代对象</a>，它的所有元素将不重复地被添加到新的 <strong>Set</strong>中。</dd> + <dd>如果不指定此参数或其值为<code>null</code>，则新的 <strong>Set</strong>为空。</dd> +</dl> + +<h3 id="Return_value">Return value</h3> + +<p>A new <code>Set</code> object.</p> + +<h2 id="Examples">Examples</h2> + +<h3 id="Using_the_Set_object">Using the <code>Set</code> object</h3> + +<pre class="brush: js notranslate">let mySet = new Set() + +mySet.add(1) // Set [ 1 ] +mySet.add(5) // Set [ 1, 5 ] +mySet.add(5) // Set [ 1, 5 ] +mySet.add('some text') // Set [ 1, 5, 'some text' ] +let o = {a: 1, b: 2} +mySet.add(o)</pre> + +<h2 id="Specifications">Specifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Specification</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-set-constructor', 'Set constructor')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility">Browser compatibility</h2> + + + +<p>{{Compat("javascript.builtins.Set.Set")}}</p> + +<h2 id="See_also">See also</h2> + +<ul> + <li>{{jsxref("Set")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/set/size/index.html b/files/zh-cn/web/javascript/reference/global_objects/set/size/index.html new file mode 100644 index 0000000000..a18e85fade --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/set/size/index.html @@ -0,0 +1,75 @@ +--- +title: Set.prototype.size +slug: Web/JavaScript/Reference/Global_Objects/Set/size +tags: + - ECMAScript 2015 + - JavaScript + - Property + - set +translation_of: Web/JavaScript/Reference/Global_Objects/Set/size +--- +<div>{{JSRef}}</div> + +<p><strong>Size</strong>属性将会返回{{jsxref("Set")}}对象中元素的个数。</p> + +<p>{{EmbedInteractiveExample("pages/js/set-prototype-size.html")}}</p> + +<div class="hidden"> +<p>The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> and send us a pull request.</p> +</div> + +<h2 id="描述">描述</h2> + +<p><code>size</code>的值是一个整数，表示<code>Set</code>对象有多少条目。<code>size</code>的集合访问函数是<code>undefined</code>; 你不能改变这个属性。</p> + +<h2 id="例子">例子</h2> + +<h3 id="使用size">使用<code>size</code></h3> + +<pre class="brush:js">var mySet = new Set(); +mySet.add(1); +mySet.add(5); +mySet.add("some text") + +mySet.size; // 3 +</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> + <p>{{SpecName('ES6', '#sec-get-set.prototype.size', 'Set.prototype.size')}}</p> + </td> + <td>{{Spec2('ES6')}}</td> + <td>初始定义</td> + </tr> + <tr> + <td> + <p>{{SpecName('ESDraft', '#sec-get-set.prototype.size', 'Set.prototype.size')}}</p> + </td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容">浏览器兼容</h2> + +<div class="hidden"> +<p>The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> +</div> + +<p>{{Compat("javascript.builtins.Set.size")}}</p> + +<h2 id="参见">参见</h2> + +<ul> + <li>{{jsxref("Set")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/set/values/index.html b/files/zh-cn/web/javascript/reference/global_objects/set/values/index.html new file mode 100644 index 0000000000..846bd7421d --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/set/values/index.html @@ -0,0 +1,70 @@ +--- +title: Set.prototype.values() +slug: Web/JavaScript/Reference/Global_Objects/Set/values +tags: + - ECMAScript 2015 + - Iterator + - JavaScript + - Method + - Prototype + - set +translation_of: Web/JavaScript/Reference/Global_Objects/Set/values +--- +<div>{{JSRef}}</div> + +<p><code><strong>values()</strong></code> 方法按照元素插入顺序返回一个具有 <code>Set</code> 对象每个元素值的全新 <code>Iterator</code> 对象。</p> + +<p><strong><code>keys()</code></strong> 方法是这个方法的别名（与 {{jsxref("Map")}} 对象相似）；他们的行为一致，都是返回<code>Set</code> 对象中的元素值。</p> + +<div>{{EmbedInteractiveExample("pages/js/set-prototype-values.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox notranslate"><code><em>mySet</em>.values(); +</code></pre> + +<h3 id="返回值">返回值</h3> + +<p>按照元素插入顺序返回一个包含给定的 <code>Set</code> 对象中每个元素值的全新 <code><strong>Iterator</strong></code> 对象。</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用_values">使用 <code>values()</code></h3> + +<pre class="brush:js notranslate">var mySet = new Set(); +mySet.add('foo'); +mySet.add('bar'); +mySet.add('baz'); + +var setIter = mySet.values(); + +console.log(setIter.next().value); // "foo" +console.log(setIter.next().value); // "bar" +console.log(setIter.next().value); // "baz"</pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范</th> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-set.prototype.values', 'Set.prototype.values')}}</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.Set.values")}}</p> + +<h2 id="参见">参见</h2> + +<ul> + <li>{{jsxref("Set.prototype.entries()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/sharedarraybuffer/bytelength/index.html b/files/zh-cn/web/javascript/reference/global_objects/sharedarraybuffer/bytelength/index.html new file mode 100644 index 0000000000..a558623014 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/sharedarraybuffer/bytelength/index.html @@ -0,0 +1,53 @@ +--- +title: SharedArrayBuffer.prototype.byteLength +slug: Web/JavaScript/Reference/Global_Objects/SharedArrayBuffer/byteLength +tags: + - SharedArrayBuffer +translation_of: Web/JavaScript/Reference/Global_Objects/SharedArrayBuffer/byteLength +--- +<div>{{JSRef}}</div> + +<p> <code><strong>byteLength</strong></code> 访问器属性表示以字节为单位的一个{{jsxref("SharedArrayBuffer")}}的长度。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>sab</var>.byteLength</pre> + +<h2 id="描述">描述</h2> + +<p><code>byteLength</code>属性是一个访问者属性，其set访问者函数为 <code>undefined</code>，这意味着您只能读取此属性。 该值在构造共享数组时建立，并且无法更改。</p> + +<h2 id="例子">例子</h2> + +<pre class="brush:js">var sab = new SharedArrayBuffer(1024); +sab.byteLength; // 1024 +</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('ESDraft', '#sec-get-sharedarraybuffer.prototype.bytelength', 'SharedArrayBuffer.prototype.byteLength')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td>Initial definition in ES2017.</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.SharedArrayBuffer.byteLength")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("SharedArrayBuffer")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/sharedarraybuffer/index.html b/files/zh-cn/web/javascript/reference/global_objects/sharedarraybuffer/index.html new file mode 100644 index 0000000000..93b5740def --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/sharedarraybuffer/index.html @@ -0,0 +1,144 @@ +--- +title: SharedArrayBuffer +slug: Web/JavaScript/Reference/Global_Objects/SharedArrayBuffer +tags: + - ArrayBuffer + - Service Worker + - Shared Memory + - SharedArrayBuffer + - TypedArrays + - Web Worker + - Worker + - 共享内存 + - 实验的 + - 构造函数 +translation_of: Web/JavaScript/Reference/Global_Objects/SharedArrayBuffer +--- +<div>{{JSRef}}</div> + +<p><strong><code>SharedArrayBuffer</code></strong> 对象用来表示一个通用的，固定长度的原始二进制数据缓冲区，类似于 {{jsxref("ArrayBuffer")}} 对象，它们都可以用来在共享内存（shared memory）上创建视图。与 <code>ArrayBuffer</code> 不同的是，<code><strong>SharedArrayBuffer</strong></code> 不能被分离。</p> + +<div class="blockIndicator note"> +<p>请注意，作为对<a href="https://meltdownattack.com/">Spectre</a>的响应，所有主流浏览器均默认于2018年1月5日禁用<code>SharedArrayBuffer</code>。 Chrome在启用了网站隔离功能的平台上的<a href="https://bugs.chromium.org/p/chromium/issues/detail?id=821270">v67中重新启用</a>了该功能，以防止出现Spectre风格的漏洞。</p> +</div> + +<p>{{EmbedInteractiveExample("pages/js/sharedarraybuffer-constructor.html")}}</p> + +<div class="hidden"> +<p>The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> and send us a pull request.</p> +</div> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">new SharedArrayBuffer(length) +</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>length</code></dt> + <dd>所创建的数组缓冲区的大小，以字节(byte)为单位。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>一个大小指定的新 <code>SharedArrayBuffer</code> 对象。其内容被初始化为 0。</p> + +<h2 id="描述">描述</h2> + +<h3 id="分配及共享内存">分配及共享内存</h3> + +<p>为了将一个{{jsxref("SharedArrayBuffer")}} 对象从一个用户代理共享到另一个用户代理（另一个页面的主进程或者当前页面的一个 <code>worker</code> ）从而实现共享内存，我们需要运用 <code><a href="/en-US/docs/Web/API/Worker/postMessage">postMessage</a></code> 和结构化克隆算法（ <a href="/en-US/docs/Web/API/Web_Workers_API/Structured_clone_algorithm">structured cloning</a> ）。</p> + +<p>结构化克隆算法接收被映射到一个新的 <code>SharedArrayBuffers</code> 对象上的 <code>SharedArrayBuffers</code> 对象与 <code>TypedArrays</code> 对象。在这两种映射下，这个新的 <code>SharedArrayBuffer</code> 对象会被传递到目标用户代理的接收函数上，导致在目标用户代理产生了一个新的私有 <code>SharedArrayBuffer</code> 对象（正如 {{jsxref("ArrayBuffer")}} 一样）。然而，这两个 <code>SharedArrayBuffer</code> 对象指向的共享数据块其实是同一个，并且在某一代理中的一个块的副作用将最终导致另一个代理具有可见性。</p> + +<pre class="brush: js">let sab = new SharedArrayBuffer(1024); +worker.postMessage(sab); +</pre> + +<h3 id="通过原子操作更新及同步来共享内存">通过原子操作更新及同步来共享内存</h3> + +<p>共享内存能被同时创建和更新于工作者线程或主线程。依赖于系统（CPU，操作系统，浏览器），变化传递给所有上下文环境需要一段时间。需要通过 {{jsxref("Atomics", "atomic", "", 1)}} 操作来进行同步。</p> + +<h3 id="接受_SharedArrayBuffer_对象的API"><font face="Open Sans, Arial, sans-serif">接受 </font><code>SharedArrayBuffer</code> 对象的API</h3> + +<ul> + <li>{{domxref("WebGLRenderingContext.bufferData()")}}</li> + <li>{{domxref("WebGLRenderingContext.bufferSubData()")}}</li> + <li>{{domxref("WebGL2RenderingContext.getBufferSubData()")}}</li> +</ul> + +<h3 id="需要_new_运算符来构造">需要 <code>new</code> 运算符来构造</h3> + +<p><code>SharedArrayBuffer</code> 需要 {{jsxref("Operators/new", "new")}} 运算符来构造一个构造函数. 作为函数来调用一个 <code>SharedArrayBuffer</code> 构造函数时，如果不用 <code>new</code> 运算符，将会抛出一个 {{jsxref("TypeError")}} 异常。</p> + +<pre class="brush: js example-bad">var sab = SharedArrayBuffer(1024); +// TypeError: calling a builtin SharedArrayBuffer constructor +// 必须用 new 来构造</pre> + +<pre class="brush: js example-good">var sab = new SharedArrayBuffer(1024);</pre> + +<h2 id="属性">属性</h2> + +<dl> + <dt><code>SharedArrayBuffer.length</code></dt> + <dd><code>SharedArrayBuffer</code> 构造函数的 length 属性值为1。 </dd> + <dt>{{jsxref("SharedArrayBuffer.prototype")}}</dt> + <dd>允许所有 <code>SharedArrayBuffer</code> 对象的附加属性。</dd> +</dl> + +<h2 id="SharedArrayBuffer_原型对象"><code>SharedArrayBuffer</code> 原型对象</h2> + +<p>所有 <code>SharedArrayBuffer</code> 实例继承自 {{jsxref("SharedArrayBuffer.prototype")}}。</p> + +<h3 id="属性_2">属性</h3> + +<p>{{page('zh-CN/Web/JavaScript/Reference/Global_Objects/SharedArrayBuffer/prototype','Properties')}}</p> + +<h3 id="方法">方法</h3> + +<p>{{page('zh-CN/Web/JavaScript/Reference/Global_Objects/SharedArrayBuffer/prototype','Methods')}}</p> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范</th> + <th scope="col">状态</th> + <th scope="col">备注</th> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-sharedarraybuffer-objects', 'SharedArrayBuffer')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td>Initial definition in ES2017.</td> + </tr> + <tr> + <td>{{SpecName('ES8', '#sec-sharedarraybuffer-objects', 'SharedArrayBuffer')}}</td> + <td>{{Spec2('ES8')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div class="hidden"> +<p>The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> +</div> + +<p>{{Compat("javascript.builtins.SharedArrayBuffer")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Atomics")}}</li> + <li>{{jsxref("ArrayBuffer")}}</li> + <li><a href="/en-US/docs/Web/JavaScript/Typed_arrays">JavaScript typed arrays</a></li> + <li><a href="/en-US/docs/Web/API/Web_Workers_API">Web Workers</a></li> + <li><a href="https://github.com/lars-t-hansen/parlib-simple">parlib-simple </a>– a simple library providing synchronization and work distribution abstractions.</li> + <li><a href="https://github.com/tc39/ecmascript_sharedmem/blob/master/TUTORIAL.md">Shared Memory – a brief tutorial</a></li> + <li> + <p><a href="https://hacks.mozilla.org/2016/05/a-taste-of-javascripts-new-parallel-primitives/">A Taste of JavaScript’s New Parallel Primitives – Mozilla Hacks</a></p> + </li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/sharedarraybuffer/prototype/index.html b/files/zh-cn/web/javascript/reference/global_objects/sharedarraybuffer/prototype/index.html new file mode 100644 index 0000000000..ab4f881dff --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/sharedarraybuffer/prototype/index.html @@ -0,0 +1,62 @@ +--- +title: SharedArrayBuffer.prototype +slug: Web/JavaScript/Reference/Global_Objects/SharedArrayBuffer/prototype +tags: + - Prototype + - SharedArrayBuffer +translation_of: Web/JavaScript/Reference/Global_Objects/SharedArrayBuffer +--- +<div>{{JSRef}}</div> + +<p><strong><code>SharedArrayBuffer.prototype</code></strong> 属性表示 {{jsxref("SharedArrayBuffer")}} 对象的原型。</p> + +<div>{{js_property_attributes(0,0,0)}}</div> + +<h2 id="描述">描述</h2> + +<p><code>SharedArrayBuffer</code>实例继承自<code>SharedArrayBuffer.prototype</code>。 与所有构造函数一样，您可以更改构造函数的原型对象以对所有<code>SharedArrayBuffer</code>实例进行更改。</p> + +<h2 id="属性">属性</h2> + +<dl> + <dt>SharedArrayBuffer.prototype.constructor</dt> + <dd>指定创建对象原型的函数。 初始值为标准的内置<code>SharedArrayBuffer</code>构造函数。</dd> + <dt>{{jsxref("SharedArrayBuffer.prototype.byteLength")}} {{readonlyInline}}</dt> + <dd>数组的大小（以字节为单位）。 这是在数组初始化时建立的，并且无法被更改。<strong> 只读</strong>。</dd> +</dl> + +<h2 id="方法">方法</h2> + +<dl> + <dt>{{jsxref("SharedArrayBuffer.slice", "SharedArrayBuffer.prototype.slice(begin, end)")}}</dt> + <dd>返回一个新的<code>SharedArrayBuffer</code>，其内容是此<code>SharedArrayBuffer</code>字节从<code>beigin</code>开始（包括<code>begin</code>）到<code>end</code>结束（不包括<code>end</code>）的副本。 如果<code>begin</code>或<code>end</code>为负，则它是指数组末尾的索引，而不是开头的索引。</dd> +</dl> + +<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('ESDraft', '#sec-sharedarraybuffer.prototype', 'SharedArrayBuffer.prototype')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td>Initial definition in ES2017.</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.SharedArrayBuffer.prototype")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("SharedArrayBuffer")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/sharedarraybuffer/slice/index.html b/files/zh-cn/web/javascript/reference/global_objects/sharedarraybuffer/slice/index.html new file mode 100644 index 0000000000..a13b9885f3 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/sharedarraybuffer/slice/index.html @@ -0,0 +1,76 @@ +--- +title: SharedArrayBuffer.prototype.slice() +slug: Web/JavaScript/Reference/Global_Objects/SharedArrayBuffer/slice +tags: + - SharedArrayBuffer + - slice +translation_of: Web/JavaScript/Reference/Global_Objects/SharedArrayBuffer/slice +--- +<div>{{JSRef}}</div> + +<p><code><strong>SharedArrayBuffer.prototype.slice()</strong></code> 方法返回一个新的{{jsxref("SharedArrayBuffer")}} 副本，其内容是<code>该SharedArrayBuffer</code>的字节从<code>begin</code>开始(包含<code>begin</code>)，直到<code>end</code>结束(不包含<code>end</code>)。如果<code>begin</code>或<code>end</code>是负的，它指的是从数组末尾开始的索引。此方法与 {{jsxref("Array.prototype.slice()")}} 具有相同的算法。</p> + +<p>{{EmbedInteractiveExample("pages/js/sharedarraybuffer-slice.html")}}</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>sab</var>.slice() +<var>sab</var>.slice(begin) +<var>sab</var>.slice(begin, end)</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>begin</code> {{optional_inline}}</dt> + <dd>从零开始的索引，从该索引开始提取。</dd> + <dd>可以使用一个负索引，表示从序列末尾开始的偏移量。 <code>slice(-2)</code>提取序列中的最后两个元素。</dd> + <dd>If <code>begin</code> is undefined, <code>slice</code> begins from index <code>0</code>.如果<code>begin</code>为undefined，<code>slice</code>则从索引为<code>0</code>处开始。</dd> + <dt><code>end</code> {{optional_inline}}</dt> + <dd>从零开始的索引，在此索引<em>之前</em>终止提取。 <code>slice</code> 执行提取到索引为<code>end</code>的位置(不包含<code>end</code>)。</dd> + <dd>例如，<code>slice(1,4)</code>提取第二个元素到第四个元素（索引为1、2和3的元素）。</dd> + <dd>可以使用一个负索引，表示从序列末尾开始的偏移量。 <code>slice(2,-1)</code>提取序列中从第三个元素开始，到倒数第二个元素结束的全部元素。</dd> + <dd>如果省略<code>end</code>，则<code>slice</code>一直提取到序列的末尾（<code>sab.byteLength）。</code></dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>一个包含被提取出的元素的新 {{jsxref("SharedArrayBuffer")}} 。</p> + +<h2 id="例子">例子</h2> + +<pre class="brush:js">var sab = new SharedArrayBuffer(1024); +sab.slice(); // SharedArrayBuffer { byteLength: 1024 } +sab.slice(2); // SharedArrayBuffer { byteLength: 1022 } +sab.slice(-2); // SharedArrayBuffer { byteLength: 2 } +sab.slice(0, 1); // SharedArrayBuffer { byteLength: 1 } +</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('ESDraft', '#sec-sharedarraybuffer.prototype.slice', 'SharedArrayBuffer.prototype.slice')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td>Initial definition in ES2017.</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.SharedArrayBuffer.slice")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("SharedArrayBuffer")}}</li> + <li>{{jsxref("Array.prototype.slice()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/string/@@iterator/index.html b/files/zh-cn/web/javascript/reference/global_objects/string/@@iterator/index.html new file mode 100644 index 0000000000..8ea489430f --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/string/@@iterator/index.html @@ -0,0 +1,137 @@ +--- +title: 'String.prototype[@@iterator]()' +slug: Web/JavaScript/Reference/Global_Objects/String/@@iterator +translation_of: Web/JavaScript/Reference/Global_Objects/String/@@iterator +--- +<div>{{JSRef}}</div> + +<p><strong><code>[@@iterator]()</code></strong> 方法返回一个新的Iterator对象，它遍历字符串的代码点，返回每一个代码点的字符串值。</p> + +<p>{{EmbedInteractiveExample("pages/js/string-iterator.html")}}</p> + +<p>The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> and send us a pull request.</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><var>string</var>[Symbol.iterator]</code></pre> + +<h3 id="返回值">返回值</h3> + +<p>一个新的Iterator对象。</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用iterator"><code>使用[@@iterator]()</code></h3> + +<pre class="brush:js">var string = 'A\uD835\uDC68'; + +var strIter = string[Symbol.iterator](); + +console.log(strIter.next().value); // "A" +console.log(strIter.next().value); // "\uD835\uDC68" +</pre> + +<h3 id="通过_for..of_使用iterator"><code>通过</code> <code>for..of 使用[@@iterator]()</code></h3> + +<pre class="brush:js">var string = 'A\uD835\uDC68B\uD835\uDC69C\uD835\uDC6A'; + +for (var v of string) { + console.log(v); +} +// "A" +// "\uD835\uDC68" +// "B" +// "\uD835\uDC69" +// "C" +// "\uD835\uDC6A" +</pre> + +<h2 id="规范">规范</h2> + +<table> + <tbody> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + <tr> + <td>{{SpecName('ES2015', '#sec-string.prototype-@@iterator', 'String.prototype[@@iterator]()')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype-@@iterator', 'String.prototype[@@iterator]()')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<table class="standard-table"> + <tbody> + <tr> + <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>基本支持</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoDesktop("36")}} [1]</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</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>基本支持</td> + <td>{{CompatNo}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoMobile("36")}} [1]</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<p>[1] From Gecko 17 (Firefox 17 / Thunderbird 17 / SeaMonkey 2.14) to Gecko 26 (Firefox 26 / Thunderbird 26 / SeaMonkey 2.23 / Firefox OS 1.2) the <code>iterator</code> property was used (<a href="https://bugzilla.mozilla.org/show_bug.cgi?id=907077">bug 907077</a>), and from Gecko 27 to Gecko 35 the <code>"@@iterator"</code> placeholder was used. In Gecko 36 (Firefox 36 / Thunderbird 36 / SeaMonkey 2.33), the <code>@@iterator</code> <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Symbol">symbol</a> got implemented (<a href="https://bugzilla.mozilla.org/show_bug.cgi?id=918828">bug 918828</a>).</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li><a href="/en-US/docs/Web/JavaScript/Reference/Iteration_protocols">Iteration protocols</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/string/anchor/index.html b/files/zh-cn/web/javascript/reference/global_objects/string/anchor/index.html new file mode 100644 index 0000000000..0b3a4169cd --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/string/anchor/index.html @@ -0,0 +1,136 @@ +--- +title: String.prototype.anchor() +slug: Web/JavaScript/Reference/Global_Objects/String/anchor +tags: + - HTML + - JavaScript + - Method + - Prototype + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/anchor +--- +<div>{{JSRef("Global_Objects", "String")}}</div> + +<h2 id="概述">概述</h2> + +<div class="blockIndicator warning"> +<p>已废弃<br> + 该特性已经从 Web 标准中删除，虽然一些浏览器目前仍然支持它，但也许会在未来的某个时间停止支持，请尽量不要使用该特性。</p> +</div> + +<p><code><strong>anchor()</strong></code> 方法创建一个 {{HTMLElement("a")}} HTML 锚元素，被用作超文本靶标（hypertext target）。</p> + +<p id="Syntax">语法</p> + +<pre class="syntaxbox"><code>str.anchor(<em>name</em>) </code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>name</code></dt> + <dd>一个字符串，表示被创建的标签的 <code>name</code> 属性。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p> 包含 {{HTMLElement("a")}} HTML元素的一个字符串。</p> + +<h2 id="描述">描述</h2> + +<p>使用 <code>anchor</code> 方法能够以编程方式在一个文档中创建和展现一个锚链接。</p> + +<p>语法上来讲，字符串表示你想让用户看到的文本。<code>name</code> 字符串参数表示 {{HTMLElement("a")}} 元素的 <code>name</code> 属性。</p> + +<p>使用 anchor 方法创建的锚点（anchors）将会成为 {{domxref("document.anchors")}} 数组的元素。</p> + +<h2 id="示例">示例</h2> + +<h3 id="例子：使用_anchor">例子：使用 <code>anchor</code></h3> + +<pre class="brush:js">var myString = "Table of Contents"; + +document.body.innerHTML = myString.anchor("contents_anchor");</pre> + +<p>将会输出下面的 HTML：</p> + +<pre class="brush: html"><a name="contents_anchor">Table of Contents</a></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>{{SpecName('ES6', '#sec-string.prototype.anchor', 'String.prototype.anchor')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition. Implemented in JavaScript 1.0.<br> + Defined in the (normative) Annex B for Additional ECMAScript Features for Web Browsers.</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{ CompatibilityTable() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatGeckoDesktop("1.0") }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatGeckoMobile("1.0") }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<h3 id="Gecko-specific_notes">Gecko-specific notes</h3> + +<p>从{{gecko("17")}}开始 <strong>"</strong> (引号) 被 HTML引用字符 <code>&quot所替代</code>；在字符串中申请<code>命名参数</code>.</p> + +<h2 id="See_Also" name="See_Also">相关链接</h2> + +<ul> + <li>{{jsxref("String.prototype.link()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/string/big/index.html b/files/zh-cn/web/javascript/reference/global_objects/string/big/index.html new file mode 100644 index 0000000000..8854fd3b2b --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/string/big/index.html @@ -0,0 +1,123 @@ +--- +title: String.prototype.big() +slug: Web/JavaScript/Reference/Global_Objects/String/big +translation_of: Web/JavaScript/Reference/Global_Objects/String/big +--- +<div>{{JSRef}} {{deprecated_header}}</div> + +<p><strong><code>big()</code></strong>方法的作用是创建一个使字符串显示大号字体的{{HTMLElement("big")}}标签。</p> + +<div class="note"> +<p><strong>使用说明:</strong> <big> 元素在<a href="/en-US/docs/Web/Guide/HTML/HTML5">HTML5</a>中已经被移除了，不应该再使用它。 取而代之的是web开发人员应该使用<a href="/en-US/docs/Web/CSS">CSS</a> 属性。</p> +</div> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><var>str</var>.big()</code></pre> + +<h3 id="返回值">返回值</h3> + +<p>带有 {{HTMLElement("big")}}标签的字符串。</p> + +<h2 id="描述">描述</h2> + +<p><code>big()</code> 方法会将一个字符串嵌入到<code><big>标签中:</code> <code>"<big>str</big>"。</code></p> + +<h2 id="示例">示例</h2> + +<h3 id="使用big()函数"><code><font face="Open Sans, Arial, sans-serif">使用</font>big()函数</code></h3> + +<p>下面的例子使用了字符串方法来改变一个字符串的字体大小：</p> + +<pre class="brush: js">var worldString = 'Hello, world'; + +console.log(worldString.small()); // <small>Hello, world</small> +console.log(worldString.big()); // <big>Hello, world</big> +console.log(worldString.fontsize(7)); // <fontsize=7>Hello, world</fontsize> +</pre> + +<p>使用 {{domxref("HTMLElement.style", "element.style")}} 对象，你能更加一般地获得和操作该元素的style属性，比如：</p> + +<pre class="brush: js">document.getElementById('yourElemId').style.fontSize = '2em'; +</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('ES6', '#sec-string.prototype.big', 'String.prototype.big')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>初始定义。 在JavaScript 1.0中实现。在（规范性）附件B中定义了用于Web浏览器的附加ECMAScript 特性。</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.big', 'String.prototype.big')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td>在（规范性）附件B中定义了用于Web浏览器的附加ECMAScript 特性。</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>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoDesktop("1.0")}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</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>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoMobile("1.0")}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("String.prototype.fontsize()")}}</li> + <li>{{jsxref("String.prototype.small()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/string/blink/index.html b/files/zh-cn/web/javascript/reference/global_objects/string/blink/index.html new file mode 100644 index 0000000000..88cdb9cbf8 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/string/blink/index.html @@ -0,0 +1,119 @@ +--- +title: String.prototype.blink() +slug: Web/JavaScript/Reference/Global_Objects/String/blink +translation_of: Web/JavaScript/Reference/Global_Objects/String/blink +--- +<div>{{JSRef}} {{deprecated_header}}</div> + +<p><strong><code>blink()</code></strong>方法创建使字符串闪烁的 {{HTMLElement("blink")}} HTML 元素。</p> + +<div class="warning"> +<p><strong>警告：</strong>闪烁文本被多种普及标准否决。 <code><blink></code>元素自身是非标准的，并且已废弃！</p> +</div> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><var>str</var>.blink()</code></pre> + +<h3 id="返回值">返回值</h3> + +<p>包含 {{HTMLElement("blink")}} HTML 元素的字符串。</p> + +<h2 id="描述">描述</h2> + +<p><code>blink()</code>方法将字符串嵌入 <code><blink></code> 标签中： <code>"<blink>str</blink>"</code>.</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用blink()函数"><code>使用blink()函数</code></h3> + +<p>下面的示例使用了字符串方法来修改字符串格式：</p> + +<pre class="brush: js">var worldString = 'Hello, world'; + +console.log(worldString.blink()); // <blink>Hello, world</blink> +console.log(worldString.bold()); // <b>Hello, world</b> +console.log(worldString.italics()); // <i>Hello, world</i> +console.log(worldString.strike()); // <strike>Hello, world</strike></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('ES6', '#sec-string.prototype.blink', 'String.prototype.blink')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>初始定义。在 JavaScript 1.0 中实现。 在（规范性）附件 B 中定义了用于 Web 浏览器的 ECMAScript 附加特性。</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.blink', 'String.prototype.blink')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td>在（规范性）附件 B 中定义了用于 Web 浏览器的 ECMAScript 附加特性。</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>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoDesktop("1.0")}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</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>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoMobile("1.0")}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("String.prototype.bold()")}}</li> + <li>{{jsxref("String.prototype.italics()")}}</li> + <li>{{jsxref("String.prototype.strike()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/string/bold/index.html b/files/zh-cn/web/javascript/reference/global_objects/string/bold/index.html new file mode 100644 index 0000000000..1ff02a8d34 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/string/bold/index.html @@ -0,0 +1,119 @@ +--- +title: String.prototype.bold() +slug: Web/JavaScript/Reference/Global_Objects/String/bold +tags: + - Deprecated + - HTML wrapper methods + - JavaScript +translation_of: Web/JavaScript/Reference/Global_Objects/String/bold +--- +<p>{{JSRef}} {{deprecated_header}}</p> + +<p id="概述"><strong><code>bold() </code></strong><code>方法会创建</code> HTML 元素 “b”，并将字符串加粗展示。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><var>str</var>.bold()</code></pre> + +<h3 id="返回值"><strong>返回值</strong></h3> + +<p>包含HTML元素 {{HTMLElement("b")}} 的字符串。</p> + +<h2 id="描述">描述</h2> + +<p><code>bold()</code> 方法将一个字符串嵌入到<b></b>标记中。</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用bold()"><code><font face="Open Sans, Arial, sans-serif">使用</font>bold()</code></h3> + +<p>下面的例子使用字符串方法来改变字符串的格式。</p> + +<pre class="brush: js">var worldString = 'Hello, world'; + +console.log(worldString.blink()); // <blink>Hello, world</blink> +console.log(worldString.bold()); // <b>Hello, world</b> +console.log(worldString.italics()); // <i>Hello, world</i> +console.log(worldString.strike()); // <strike>Hello, world</strike></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('ES6', '#sec-string.prototype.bold', 'String.prototype.bold')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition. Implemented in JavaScript 1.0. Defined in the (normative) Annex B for Additional ECMAScript Features for Web Browsers.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.bold', 'String.prototype.bold')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td>Defined in the (normative) Annex B for Additional ECMAScript Features for Web Browsers.</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>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoDesktop("1.0")}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</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>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoMobile("1.0")}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="相关连接">相关连接</h2> + +<ul> + <li>{{jsxref("String.prototype.blink()")}}</li> + <li>{{jsxref("String.prototype.italics()")}}</li> + <li>{{jsxref("String.prototype.strike()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/string/charat/index.html b/files/zh-cn/web/javascript/reference/global_objects/string/charat/index.html new file mode 100644 index 0000000000..3ed7dd0e7b --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/string/charat/index.html @@ -0,0 +1,280 @@ +--- +title: String.prototype.charAt() +slug: Web/JavaScript/Reference/Global_Objects/String/charAt +tags: + - String.prototype.charAt() +translation_of: Web/JavaScript/Reference/Global_Objects/String/charAt +--- +<p>{{JSRef}}</p> + +<h2 id="Summary" name="Summary">概述</h2> + +<p><strong>charAt()</strong> 方法从一个字符串中返回指定的字符。</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><em>str</em>.charAt(<em>index</em>)</pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>index</code></dt> + <dd>一个介于0 和字符串长度减1之间的整数。 (0~length-1)</dd> + <dd>如果没有提供索引，charAt() 将使用0。</dd> + <dt> </dt> +</dl> + +<h2 id="Description" name="Description">描述</h2> + +<p>字符串中的字符从左向右索引，第一个字符的索引值为 0，最后一个字符（假设该字符位于字符串 stringName 中）的索引值为 <code>stringName.length - 1</code>。 如果指定的 index 值超出了该范围，则返回一个空字符串。</p> + +<h2 id="Examples" name="Examples">示例</h2> + +<h3 id="Example:_Displaying_characters_at_different_locations_in_a_string" name="Example:_Displaying_characters_at_different_locations_in_a_string">例子：输出字符串中不同位置的字符</h3> + +<p>下例输出字符串 "<code>Brave new world</code>" 不同位置处的字符：</p> + +<pre class="brush:js">var anyString = "Brave new world"; + +console.log("The character at index 0 is '" + anyString.charAt(0) + "'"); +console.log("The character at index 1 is '" + anyString.charAt(1) + "'"); +console.log("The character at index 2 is '" + anyString.charAt(2) + "'"); +console.log("The character at index 3 is '" + anyString.charAt(3) + "'"); +console.log("The character at index 4 is '" + anyString.charAt(4) + "'"); +console.log("The character at index 999 is '" + anyString.charAt(999) + "'"); +</pre> + +<p>上面代码的输出为：</p> + +<pre>The character at index 0 is 'B' +The character at index 1 is 'r' +The character at index 2 is 'a' +The character at index 3 is 'v' +The character at index 4 is 'e' +The character at index 999 is '' +</pre> + +<h3 id="例子：获取所有字符">例子：获取所有字符</h3> + +<p>以下提供了一种确保通过字符串循环总是提供整个字符的方法，即使该字符串包含不在<a href="https://zh.wikipedia.org/wiki/Unicode%E5%AD%97%E7%AC%A6%E5%B9%B3%E9%9D%A2%E6%98%A0%E5%B0%84#.E5.9F.BA.E6.9C.AC.E5.A4.9A.E6.96.87.E7.A7.8D.E5.B9.B3.E9.9D.A2">基本多文种平面</a>（BMP）中的字符。</p> + +<pre class="brush:js">var str = 'A \uD87E\uDC04 Z'; // We could also use a non-BMP character directly +for (var i=0, chr; i < str.length; i++) { + if ((chr = getWholeChar(str, i)) === false) { + continue; + } // Adapt this line at the top of each loop, passing in the whole string and + // the current iteration and returning a variable to represent the + // individual character + + alert(chr); +} + +function getWholeChar (str, i) { + var code = str.charCodeAt(i); + + if (isNaN(code)) { + return ''; // Position not found + } + if (code < 0xD800 || code > 0xDFFF) { + return str.charAt(i); + } + + // High surrogate (could change last hex to 0xDB7F to treat high private + // surrogates as single characters) + if (0xD800 <= code && code <= 0xDBFF) { + if (str.length <= (i+1)) { + throw 'High surrogate without following low surrogate'; + } + var next = str.charCodeAt(i+1); + if (0xDC00 > next || next > 0xDFFF) { + throw 'High surrogate without following low surrogate'; + } + return str.charAt(i)+str.charAt(i+1); + } + // Low surrogate (0xDC00 <= code && code <= 0xDFFF) + if (i === 0) { + throw 'Low surrogate without preceding high surrogate'; + } + var prev = str.charCodeAt(i-1); + + // (could change last hex to 0xDB7F to treat high private + // surrogates as single characters) + if (0xD800 > prev || prev > 0xDBFF) { + throw 'Low surrogate without preceding high surrogate'; + } + // We can pass over low surrogates now as the second component + // in a pair which we have already processed + return false; +} + +</pre> + +<p>在允许解构分配的独占JavaScript 1.7+环境（如Firefox）中，以下是一个更简洁和更灵活的替代方法，它会自动递增一个递增变量（如果字符保证它是一个替代对）。</p> + +<pre class="brush: js">var str = 'A\uD87E\uDC04Z'; // We could also use a non-BMP character directly +for (var i=0, chr; i < str.length; i++) { + [chr, i] = getWholeCharAndI(str, i); + // Adapt this line at the top of each loop, passing in the whole string and + // the current iteration and returning an array with the individual character + // and 'i' value (only changed if a surrogate pair) + + alert(chr); +} + +function getWholeCharAndI (str, i) { + var code = str.charCodeAt(i); + + if (isNaN(code)) { + return ''; // Position not found + } + if (code < 0xD800 || code > 0xDFFF) { + return [str.charAt(i), i]; // Normal character, keeping 'i' the same + } + + // High surrogate (could change last hex to 0xDB7F to treat high private + // surrogates as single characters) + if (0xD800 <= code && code <= 0xDBFF) { + if (str.length <= (i+1)) { + throw 'High surrogate without following low surrogate'; + } + var next = str.charCodeAt(i+1); + if (0xDC00 > next || next > 0xDFFF) { + throw 'High surrogate without following low surrogate'; + } + return [str.charAt(i)+str.charAt(i+1), i+1]; + } + // Low surrogate (0xDC00 <= code && code <= 0xDFFF) + if (i === 0) { + throw 'Low surrogate without preceding high surrogate'; + } + var prev = str.charCodeAt(i-1); + + // (could change last hex to 0xDB7F to treat high private surrogates + // as single characters) + if (0xD800 > prev || prev > 0xDBFF) { + throw 'Low surrogate without preceding high surrogate'; + } + // Return the next character instead (and increment) + return [str.charAt(i+1), i+1]; +}</pre> + +<h3 id="示例：修复charAt以支持非基本多文种平面（BMP）字符">示例：修复charAt以支持非基本多文种平面（BMP）字符</h3> + +<p>虽然上面的例子对于那些希望支持非BMP字符的用户可能更有用（因为它不要求调用者知道任何非BMP字符可能出现在哪里），在人们希望的情况下，在选择字符 通过索引，将字符串中的替代对作为它们表示的单个字符，可以使用以下：</p> + +<pre class="brush: js">function fixedCharAt (str, idx) { + var ret = ''; + str += ''; + var end = str.length; + + var surrogatePairs = /[\uD800-\uDBFF][\uDC00-\uDFFF]/g; + while ((surrogatePairs.exec(str)) != null) { + var li = surrogatePairs.lastIndex; + if (li - 2 < idx) { + idx++; + } else { + break; + } + } + + if (idx >= end || idx < 0) { + return ''; + } + + ret += str.charAt(idx); + + if (/[\uD800-\uDBFF]/.test(ret) && /[\uDC00-\uDFFF]/.test(str.charAt(idx+1))) { + // Go one further, since one of the "characters" is part of a surrogate pair + ret += str.charAt(idx+1); + } + return ret; +}</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>ECMAScript 1st Edition.</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.5.4.4', 'String.prototype.charAt')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-string.prototype.charat', 'String.prototype.charAt')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{ CompatibilityTable() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("String.prototype.indexOf()")}}, {{jsxref("String.prototype.lastIndexOf()")}}</li> + <li>{{jsxref("String.prototype.split()")}}</li> + <li>{{jsxref("String.prototype.charCodeAt()")}}</li> + <li>{{jsxref("String.fromCodePoint()")}}</li> + <li>{{jsxref("String.prototype.codePointAt()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/string/charcodeat/index.html b/files/zh-cn/web/javascript/reference/global_objects/string/charcodeat/index.html new file mode 100644 index 0000000000..2fa6e19305 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/string/charcodeat/index.html @@ -0,0 +1,161 @@ +--- +title: String.prototype.charCodeAt() +slug: Web/JavaScript/Reference/Global_Objects/String/charCodeAt +tags: + - JavaScript + - String + - Unicode + - 参考 + - 字符串 + - 方法 +translation_of: Web/JavaScript/Reference/Global_Objects/String/charCodeAt +--- +<div>{{JSRef}}</div> + +<p><code><strong>charCodeAt()</strong></code> 方法返回 <code>0</code> 到 <code>65535</code> 之间的整数，表示给定索引处的 UTF-16 代码单元</p> + +<div>{{EmbedInteractiveExample("pages/js/string-charcodeat.html", "shorter")}}</div> + + + +<p>UTF-16 编码单元匹配能用一个 UTF-16 编码单元表示的 Unicode 码点。如果 Unicode 码点不能用一个 UTF-16 编码单元表示（因为它的值大于<code>0xFFFF</code>），则所返回的编码单元会是这个码点代理对的第一个编码单元) 。如果你想要整个码点的值，使用 {{jsxref("Global_Objects/String/codePointAt", "codePointAt()")}}。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox notranslate"><code><em>str</em>.charCodeAt(<em>index</em>)</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>index</code></dt> + <dd>一个大于等于 <code>0</code>，小于字符串长度的整数。如果不是一个数值，则默认为 <code>0</code>。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>指定 <code>index</code> 处字符的 UTF-16 代码单元值的一个数字；如果 <code>index</code> 超出范围，<code>charCodeAt()</code> 返回 {{jsxref("Global_Objects/NaN", "NaN")}}。</p> + +<h2 id="描述">描述</h2> + +<p>Unicode 码点（code points）的范围从 <code>0</code> 到 <code>1114111</code> <code>(0x10FFFF）</code>。开头的 128 个 Unicode 编码单元和 ASCII 字符编码一样。（关于 Unicode 的更多信息，可查看 <a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Guide/Values,_variables,_and_literals#Unicode">JavaScript Guide</a>。）</p> + +<div class="blockIndicator note"> +<p><strong>注意：</strong>，<code>charCodeAt</code> 总是返回一个小于 65,536 的值。这是因为高位编码单元（higher code point）使用一对（低位编码 lower valued）代理伪字符（"surrogate" pseudo-characters）来表示，从而构成一个真正的字符。</p> + +<p>因此，为了检查（或重现）<code>65536</code> 及以上编码字符的完整字符，需要在获取 <code>charCodeAt(i)</code> 的值的同时获取 <code>charCodeAt(i+1)</code> 的值（如同用两个字母操纵一个字符串），或者改为获取 <code>codePointAt(i)</code> 的值。参看下面例 2 和例 3。</p> +</div> + +<p>如果指定的 <code>index</code> 小于 <code>0</code> 、等于或大于字符串的长度，则 <code>charCodeAt</code> 返回 {{jsxref("Global_Objects/NaN", "NaN")}}。</p> + +<p>向后兼容：在历史版本中（如 JavaScript 1.2），<code>charCodeAt</code> 返回一个数字，表示给定 index 处字符的 ISO-Latin-1 编码值。ISO-Latin-1 编码集范围从 <code>0</code> 到 <code>255</code>。开头的 <code>0</code> 到 <code>127</code> 直接匹配 ASCII 字符集。</p> + +<h2 id="Examples" name="Examples">示例</h2> + +<h3 id="Example_Using_charCodeAt" name="Example:_Using_charCodeAt">使用 <code>charCodeAt()</code></h3> + +<p>下例介绍了不同索引情况下返回的 Unicode 值：</p> + +<pre class="brush: js notranslate">"ABC".charCodeAt(0) // returns 65:"A" + +"ABC".charCodeAt(1) // returns 66:"B" + +"ABC".charCodeAt(2) // returns 67:"C" + +"ABC".charCodeAt(3) // returns NaN</pre> + +<h3 id="使用_charCodeAt_修复字符串中出现的未知的非基本多语言范围（非BMP，non-Basic-Multilingual-Plane）字符">使用 <code>charCodeAt()</code> 修复字符串中出现的未知的非基本多语言范围（非BMP，non-Basic-Multilingual-Plane）字符</h3> + +<p>这段代码可以被用在 for 循环和其他类似语句中，当在指定引索之前不确定是否有非BMP字符存在时。</p> + +<pre class="brush:js notranslate">function fixedCharCodeAt (str, idx) { + // ex. fixedCharCodeAt ('\uD800\uDC00', 0); // 65536 + // ex. fixedCharCodeAt ('\uD800\uDC00', 1); // false + idx = idx || 0; + var code = str.charCodeAt(idx); + var hi, low; + + // High surrogate (could change last hex to 0xDB7F to treat high + // private surrogates as single characters) + if (0xD800 <= code && code <= 0xDBFF) { + hi = code; + low = str.charCodeAt(idx+1); + if (isNaN(low)) { + throw 'High surrogate not followed by low surrogate in fixedCharCodeAt()'; + } + return ((hi - 0xD800) * 0x400) + (low - 0xDC00) + 0x10000; + } + if (0xDC00 <= code && code <= 0xDFFF) { // Low surrogate + // We return false to allow loops to skip this iteration since should have + // already handled high surrogate above in the previous iteration + return false; + /*hi = str.charCodeAt(idx-1); + low = code; + return ((hi - 0xD800) * 0x400) + (low - 0xDC00) + 0x10000;*/ + } + return code; +} +</pre> + +<h3 id="使用_charCodeAt_修复字符串中出现的已知的非BMP字符">使用 <code>charCodeAt()</code> 修复字符串中出现的已知的非BMP字符</h3> + +<pre class="brush:js notranslate">function knownCharCodeAt (str, idx) { + str += ''; + var code, + end = str.length; + + var surrogatePairs = /[\uD800-\uDBFF][\uDC00-\uDFFF]/g; + while ((surrogatePairs.exec(str)) != null) { + var li = surrogatePairs.lastIndex; + if (li - 2 < idx) { + idx++; + } + else { + break; + } + } + + if (idx >= end || idx < 0) { + return NaN; + } + + code = str.charCodeAt(idx); + + var hi, low; + if (0xD800 <= code && code <= 0xDBFF) { + hi = code; + low = str.charCodeAt(idx+1); + // Go one further, since one of the "characters" is part of a surrogate pair + return ((hi - 0xD800) * 0x400) + (low - 0xDC00) + 0x10000; + } + return code; +} + +</pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Specification</th> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.charcodeat', 'String.prototype.charCodeAt')}}</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.String.charCodeAt")}}</p> + +<h2 id="参见">参见</h2> + +<ul> + <li>{{jsxref("String.fromCharCode()")}}</li> + <li>{{jsxref("String.prototype.charAt()")}}</li> + <li>{{jsxref("String.fromCodePoint()")}}</li> + <li>{{jsxref("String.prototype.codePointAt()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/string/codepointat/index.html b/files/zh-cn/web/javascript/reference/global_objects/string/codepointat/index.html new file mode 100644 index 0000000000..567de8abc1 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/string/codepointat/index.html @@ -0,0 +1,173 @@ +--- +title: String.prototype.codePointAt() +slug: Web/JavaScript/Reference/Global_Objects/String/codePointAt +translation_of: Web/JavaScript/Reference/Global_Objects/String/codePointAt +--- +<div>{{JSRef}}</div> + +<p><strong><code>codePointAt()</code></strong> 方法返回 一个 Unicode 编码点值的非负整数。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><var>str</var>.codePointAt(<var>pos</var>)</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>pos</code></dt> + <dd>这个字符串中需要转码的元素的位置。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>返回值是在字符串中的给定索引的编码单元体现的数字，如果在索引处没找到元素则返回 {{jsxref("undefined")}} 。</p> + +<h2 id="描述">描述</h2> + +<p>如果在指定的位置没有元素则返回 {{jsxref("undefined")}} 。如果在索引处开始没有UTF-16 代理对，将直接返回在那个索引处的编码单元。</p> + +<p>Surrogate Pair是UTF-16中用于扩展字符而使用的编码方式，是一种采用四个字节(两个UTF-16编码)来表示一个字符，称作代理对。</p> + +<h2 id="例子">例子</h2> + +<h3 id="使用_codePointAt()">使用 <code>codePointAt()</code></h3> + +<pre class="brush: js">'ABC'.codePointAt(1); // 66 +'\uD800\uDC00'.codePointAt(0); // 65536 + +'XYZ'.codePointAt(42); // undefined +</pre> + +<h2 id="替补支持(Polyfill)">替补支持(Polyfill)</h2> + +<p>给原生不支持 ECMAScript 6 的浏览器使用<code>codePointAt()</code>方法的的一个字符串扩展方法。</p> + +<pre class="brush: js">/*! http://mths.be/codepointat v0.1.0 by @mathias */ +if (!String.prototype.codePointAt) { + (function() { + 'use strict'; // 严格模式，needed to support `apply`/`call` with `undefined`/`null` + var codePointAt = function(position) { + if (this == null) { + throw TypeError(); + } + var string = String(this); + var size = string.length; + // 变成整数 + var index = position ? Number(position) : 0; + if (index != index) { // better `isNaN` + index = 0; + } + // 边界 + if (index < 0 || index >= size) { + return undefined; + } + // 第一个编码单元 + var first = string.charCodeAt(index); + var second; + if ( // 检查是否开始 surrogate pair + first >= 0xD800 && first <= 0xDBFF && // high surrogate + size > index + 1 // 下一个编码单元 + ) { + second = string.charCodeAt(index + 1); + if (second >= 0xDC00 && second <= 0xDFFF) { // low surrogate + // http://mathiasbynens.be/notes/javascript-encoding#surrogate-formulae + return (first - 0xD800) * 0x400 + second - 0xDC00 + 0x10000; + } + } + return first; + }; + if (Object.defineProperty) { + Object.defineProperty(String.prototype, 'codePointAt', { + 'value': codePointAt, + 'configurable': true, + 'writable': true + }); + } else { + String.prototype.codePointAt = codePointAt; + } + }()); +} +</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('ES6', '#sec-string.prototype.codepointat', 'String.prototype.codePointAt')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.codepointat', 'String.prototype.codePointAt')}}</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>特性</th> + <th>Chrome</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>基本支持</td> + <td>{{CompatChrome("41")}}</td> + <td>{{CompatGeckoDesktop("29")}}</td> + <td>11</td> + <td>{{CompatOpera("28")}}</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>特性</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>基本支持</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatGeckoMobile("29")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("String.fromCodePoint()")}}</li> + <li>{{jsxref("String.fromCharCode()")}}</li> + <li>{{jsxref("String.prototype.charCodeAt()")}}</li> + <li>{{jsxref("String.prototype.charAt()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/string/concat/index.html b/files/zh-cn/web/javascript/reference/global_objects/string/concat/index.html new file mode 100644 index 0000000000..ee2d8dd06d --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/string/concat/index.html @@ -0,0 +1,83 @@ +--- +title: String.prototype.concat() +slug: Web/JavaScript/Reference/Global_Objects/String/concat +tags: + - JavaScript + - Method + - Prototype + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/concat +--- +<div>{{JSRef}}</div> + +<p><strong><code>concat()</code></strong> 方法将一个或多个字符串与原字符串连接合并，形成一个新的字符串并返回。</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="notranslate"><code><var>str</var>.concat(<var>str2</var>, [, ...<var>strN</var>])</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code><var>str2</var> [, ...<var>strN</var>]</code></dt> + <dd>需要连接到 <code><var>str</var></code> 的字符串。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>一个新的字符串，包含参数所提供的连接字符串。</p> + +<h2 id="Description" name="Description">描述</h2> + +<p><code>concat</code> 方法将一个或多个字符串与原字符串连接合并，形成一个新的字符串并返回。 <code>concat</code> 方法并不影响原字符串。</p> + +<p>如果参数不是字符串类型，它们在连接之前将会被转换成字符串。</p> + +<h2 id="性能" style="margin-bottom: 20px; line-height: 30px;">性能</h2> + +<p>强烈建议使用<a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Operators/Assignment_Operators">赋值操作符</a>（<code>+</code>, <code>+=</code>）代替 <code>concat</code> 方法。</p> + +<h2 id="Examples" name="Examples">示例</h2> + +<h3 id="Examples" name="Examples">使用 <code>concat</code></h3> + +<p>下面的例子演示如何将多个字符串与原字符串合并为一个新字符串</p> + +<pre class="brush: js notranslate">let hello = 'Hello, ' +console.log(hello.concat('Kevin', '. Have a nice day.')) +// Hello, Kevin. Have a nice day. + +let greetList = ['Hello', ' ', 'Venkat', '!'] +"".concat(...greetList) // "Hello Venkat!" + +"".concat({}) // [object Object] +"".concat([]) // "" +"".concat(null) // "null" +"".concat(true) // "true" +"".concat(4, 5) // "45"</pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Specification</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.concat', 'String.prototype.concat')}}</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{Compat("javascript.builtins.String.concat")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Array.prototype.concat()")}}</li> + <li>{{jsxref("Operators/Assignment_Operators", "Assignment operators", "", 1)}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/string/endswith/index.html b/files/zh-cn/web/javascript/reference/global_objects/string/endswith/index.html new file mode 100644 index 0000000000..f7ed81e221 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/string/endswith/index.html @@ -0,0 +1,98 @@ +--- +title: String.prototype.endsWith() +slug: Web/JavaScript/Reference/Global_Objects/String/endsWith +tags: + - JavaScript + - Method + - Prototype + - Reference + - String + - 原型 + - 参考 + - 字符串 + - 方法 +translation_of: Web/JavaScript/Reference/Global_Objects/String/endsWith +--- +<p>{{JSRef}}</p> + +<p><code><strong>endsWith()</strong></code>方法用来判断当前字符串是否是以另外一个给定的子字符串“结尾”的，根据判断结果返回 <code>true</code> 或 <code>false</code>。</p> + +<div>{{EmbedInteractiveExample("pages/js/string-endswith.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox notranslate"><var>str</var>.endsWith(<var>searchString</var>[, <var>length</var>])</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>searchString</code></dt> + <dd>要搜索的子字符串。</dd> + <dt><code><var>length</var></code> {{optional_inline}}</dt> + <dd>作为 <code>str</code> 的长度。默认值为 <code>str.length</code>。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>如果传入的子字符串在搜索字符串的末尾则返回<strong><code>true</code></strong>；否则将返回 <strong><code>false</code></strong>。</p> + +<h2 id="描述">描述</h2> + +<p>这个方法帮助你确定一个字符串是否在另一个字符串的末尾。这个方法是大小写敏感的。</p> + +<h2 id="Polyfill">Polyfill</h2> + +<p>这个方法已经加入到 ECMAScript 6 标准当中，但是可能还没有在所有的 JavaScript 实现中可用。然而，你可以通过如下的代码片段扩展 <code>String.prototype.endsWith()</code> 实现兼容：</p> + +<pre class="brush: js notranslate">if (!String.prototype.endsWith) { + String.prototype.endsWith = function(search, this_len) { + if (this_len === undefined || this_len > this.length) { + this_len = this.length; + } + return this.substring(this_len - search.length, this_len) === search; + }; +} +</pre> + +<h2 id="示例">示例</h2> + +<h3 id="使用_endsWith">使用 <code>endsWith()</code></h3> + +<pre class="brush:js; notranslate">var str = "To be, or not to be, that is the question."; + +alert( str.endsWith("question.") ); // true +alert( str.endsWith("to be") ); // false +alert( str.endsWith("to be", 19) ); // true +</pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范</th> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.endswith', 'String.prototype.endsWith')}}</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div class="hidden"> +<p>这个页面上的兼容性表格是通过结构化的数据自动生成的，如果你希望改进这些数据，你可以查看 <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> 并提交你的改进。 </p> +</div> + +<p>{{Compat("javascript.builtins.String.endsWith")}}</p> + +<h2 id="参见">参见</h2> + +<ul> + <li>{{jsxref("String.prototype.startsWith()")}}</li> + <li>{{jsxref("String.prototype.includes()")}}</li> + <li>{{jsxref("String.prototype.indexOf()")}}</li> + <li>{{jsxref("String.prototype.lastIndexOf()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/string/fixed/index.html b/files/zh-cn/web/javascript/reference/global_objects/string/fixed/index.html new file mode 100644 index 0000000000..f4af9c1103 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/string/fixed/index.html @@ -0,0 +1,117 @@ +--- +title: String.prototype.fixed() +slug: Web/JavaScript/Reference/Global_Objects/String/fixed +tags: + - Deprecated + - HTML wrapper methods + - JavaScript +translation_of: Web/JavaScript/Reference/Global_Objects/String/fixed +--- +<div>{{JSRef}} {{deprecated_header}}</div> + +<p>fixed()方法创建了一个<tt>标签元素将字符串包裹起来，从而让这个字符串里面的内容具有固定间距。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">str.fixed() +</pre> + +<h3 id="Return_value">Return value</h3> + +<p>返回一个表示 {{HTMLElement("tt")}} HTML 元素的字符串。</p> + +<h2 id="描述">描述</h2> + +<p id="fixed()_方法将一个字符串包裹在<tt><tt>标签中，比如_<tt>str<tt>."><code style="font-size: 14px; font-style: normal; font-weight: normal; line-height: 1.5;">fixed()</code><span style="font-size: 14px; font-weight: normal; line-height: 1.5;"> 方法将一个字符串包裹在<tt></tt>标签中，比如</span><span style="font-size: 14px; font-weight: normal; line-height: 1.5;">: </span><code style="font-size: 14px; font-style: normal; font-weight: normal; line-height: 1.5;">"<tt>str</tt>"</code><span style="font-size: 14px; font-weight: normal; line-height: 1.5;">.</span></p> + +<h2 id="举例">举例</h2> + +<h3 id="使用fixed()">使用fixed()</h3> + +<p>下面的示例代码使用这个fixed方法来改变字符串的格式：</p> + +<pre class="brush: js">var worldString = 'Hello, world'; +console.log(worldString.fixed()); // "<tt>Hello, world</tt>" +</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('ES6', '#sec-string.prototype.fixed', 'String.prototype.fixed')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition. Implemented in JavaScript 1.0. Defined in the (normative) Annex B for Additional ECMAScript Features for Web Browsers.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.fixed', 'String.prototype.fixed')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td>Defined in the (normative) Annex B for Additional ECMAScript Features for Web Browsers.</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div>{{CompatibilityTable}}</div> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>版本</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>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoDesktop("1.0")}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>版本</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>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoMobile("1.0")}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("String.prototype.bold()")}}</li> + <li>{{jsxref("String.prototype.italics()")}}</li> + <li>{{jsxref("String.prototype.strike()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/string/fontcolor/index.html b/files/zh-cn/web/javascript/reference/global_objects/string/fontcolor/index.html new file mode 100644 index 0000000000..1f9775194a --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/string/fontcolor/index.html @@ -0,0 +1,141 @@ +--- +title: String.prototype.fontcolor() +slug: Web/JavaScript/Reference/Global_Objects/String/fontcolor +tags: + - Deprecated + - HTML wrapper methods + - JavaScript + - Method + - Prototype + - Reference + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/fontcolor +--- +<div><font><font>{{JSRef}} {{deprecated_header}}</font></font></div> + +<p><strong><code>fontcolor()</code></strong><font><font>方法创建一个{{HTMLElement("font")}}的HTML元素让字符串被显示成指定的字体颜色。</font></font></p> + +<div class="note"> +<p><strong><font><font>使用注意：</font></font></strong><font><font><font>元素已经在在</font></font><a href="/en-US/docs/Web/Guide/HTML/HTML5"><font><font>HTML5中</font></font></a><font><font>被移除并且不应该在使用。</font><font>替代的是，web开发者应该使用</font></font><a href="/en-US/docs/Web/CSS"><font><font>CSS</font></font></a><font><font>属性。</font></font></p> +</div> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><var>str</var>.fontcolor(<var>color</var>)</code></pre> + +<h3 id="参数"><font><font>参数</font></font></h3> + +<dl> + <dt><code>color</code></dt> + <dd><font><font>代表颜色的一个字符串，可以是三个一组的十六进制的RGB值，也可以是一个颜色名称的字符串字面量，</font><font>颜色名称的字符串字面量被列在了这里</font></font><a href="/en-US/docs/Web/CSS/color_value"><font><font>CSS颜色参考</font></font></a><font><font>。</font></font></dd> +</dl> + +<h3 id="返回值"><font><font>返回值</font></font></h3> + +<dl> + <dd><font><font>一个包含一个{{HTMLElement("font")}} HTML元素的字符串。</font></font></dd> +</dl> + +<h2 id="描述"><font><font>描述</font></font></h2> + +<p><font><font>如果你表示的颜色为十六进制RGB三原色，则必须使用的格式</font></font><code>rrggbb</code><font><font>。</font><font>例如，对于橙红色的十六进制RGB值是红色=FA，绿色=80，和蓝=72，所以橙红色的RGB三原色</font></font><code>"FA8072"</code><font><font>。</font></font></p> + +<h2 id="例子"><font><font>例子</font></font></h2> + +<h3 id="使用_fontcolor()"><font><font>使用 </font></font><code>fontcolor()</code></h3> + +<p><font><font>下面的示例使用</font></font><code>fontcolor()</code><font><font>方法来改变字符串的颜色，通过产生一个被HTML <font> 标签包裹的字符串</font></font>。</p> + +<pre class="brush: js"><font><font>var worldString = "Hello, world"</font></font> +<font><font> +console.log(worldString.fontcolor('red') + ' is red in this line'); +// <font color="red">Hello, world </font> is red in this line"</font></font> +<font><font> +console.log（worldString.fontcolor('FF00') + ' is red in hexadecimal'</font></font><font><font> +// <font color="FF00">Hello，world </font> is red in hexadecimal</font></font> +</pre> + +<p><font><font>和{{domxref("HTMLElement.style","element.style")}}对象一起，你可以访问元素的</font></font><code>style</code><font><font>属性，并且更随意的去操纵它，例如：</font></font></p> + +<pre class="brush: js"><font><font>document.getElementById('yourElemId').style.color ='red'; +</font></font></pre> + +<h2 id="Specifications">Specifications</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col"><font><font>规范</font></font></th> + <th scope="col"><font><font>状态</font></font></th> + <th scope="col"><font><font>评论</font></font></th> + </tr> + <tr> + <td><font><font>{{SpecName('ES6','#string.prototype.fontcolor', 'String.prototype.fontcolor')}}</font></font></td> + <td><font><font>{{Spec2('ES6')}}</font></font></td> + <td><font><font>初始定义。</font><font>实现在JavaScript中1.0。</font><font>定义为附加功能的ECMAScript针对Web浏览器（规范）附件B。</font></font></td> + </tr> + <tr> + <td><font><font>{{SpecName('ESDraft', '#string.prototype.fontcolor', 'String.prototype.fontcolor')}}</font></font></td> + <td><font><font>{{Spec2('ESDraft')}}</font></font></td> + <td><font><font>定义为附加功能的ECMAScript针对Web浏览器（规范）附件B。</font></font></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性"><font><font>浏览器兼容性</font></font></h2> + +<div><font><font>{{CompatibilityTable}}</font></font></div> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Chrome</th> + <th><font><font>Firefox(Gecko)</font></font></th> + <th>Internet Explorer</th> + <th>Opera</th> + <th><font><font>Safari</font></font></th> + </tr> + <tr> + <td>Basic Support</td> + <td><font><font>{{CompatVersionUnknown}}</font></font></td> + <td><font><font>{{CompatGeckoDesktop("1.0")}}</font></font></td> + <td><font><font>{{CompatVersionUnknown}}</font></font></td> + <td><font><font>{{CompatVersionUnknown}}</font></font></td> + <td><font><font>{{CompatVersionUnknown}}</font></font></td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th><font><font>Android</font></font></th> + <th><font><font>Chrome for Android</font></font></th> + <th><font><font>Firefox Mobile(Gecko)</font></font></th> + <th><font><font>IE Mobile</font></font></th> + <th><font><font>Opera Mobile</font></font></th> + <th><font><font>Safari Mobile</font></font></th> + </tr> + <tr> + <td>Basic Support</td> + <td><font><font>{{CompatVersionUnknown}}</font></font></td> + <td><font><font>{{CompatVersionUnknown}}</font></font></td> + <td><font><font>{{CompatGeckoMobile("1.0")}}</font></font></td> + <td><font><font>{{CompatVersionUnknown}}</font></font></td> + <td><font><font>{{CompatVersionUnknown}}</font></font></td> + <td><font><font>{{CompatVersionUnknown}}</font></font></td> + </tr> + </tbody> +</table> +</div> + +<h2 id="也可以看看"><font><font>也可以看看</font></font></h2> + +<ul> + <li><font><font>{{jsxref("String.prototype.fontsize()")}}</font></font></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/string/fontsize/index.html b/files/zh-cn/web/javascript/reference/global_objects/string/fontsize/index.html new file mode 100644 index 0000000000..676e1eff43 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/string/fontsize/index.html @@ -0,0 +1,130 @@ +--- +title: String.prototype.fontsize() +slug: Web/JavaScript/Reference/Global_Objects/String/fontsize +translation_of: Web/JavaScript/Reference/Global_Objects/String/fontsize +--- +<div>{{JSRef}} {{deprecated_header}}</div> + +<p>The <strong><code>fontsize()</code></strong> method creates a {{HTMLElement("font")}} HTML element that causes a string to be displayed in the specified font size.</p> + +<div class="note"> +<p><strong>Usage note:</strong> The <font> element has been removed in <a href="/en-US/docs/Web/Guide/HTML/HTML5">HTML5</a> and shouldn't be used anymore. Instead web developers should use <a href="/en-US/docs/Web/CSS">CSS</a> properties.</p> +</div> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><var>str</var>.fontsize(<var>size</var>)</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>size</code></dt> + <dd>An integer between 1 and 7, a string representing a signed integer between 1 and 7.</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>A string containing a {{HTMLElement("font")}} HTML element.</p> + +<h2 id="描述">描述</h2> + +<p>When you specify size as an integer, you set the font size of <code>str</code> to one of the 7 defined sizes. When you specify <code>size</code> as a string such as "-2", you adjust the font size of <code>str</code> relative to the size set in the {{HTMLElement("basefont")}} tag.</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用fontsize()方法"><code><font face="Open Sans, Arial, sans-serif">使用</font>fontsize()方法</code></h3> + +<p>The following example uses string methods to change the size of a string:</p> + +<pre class="brush: js">var worldString = 'Hello, world'; + +console.log(worldString.small()); // <small>Hello, world</small> +console.log(worldString.big()); // <big>Hello, world</big> +console.log(worldString.fontsize(7)); // <font size="7">Hello, world</fontsize> +</pre> + +<p>With the {{domxref("HTMLElement.style", "element.style")}} object you can get the element's <code>style</code> attribute and manipulate it more generically, for example:</p> + +<pre class="brush: js">document.getElementById('yourElemId').style.fontSize = '0.7em'; +</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('ES6', '#sec-string.prototype.fontsize', 'String.prototype.fontsize')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition. Implemented in JavaScript 1.0. Defined in the (normative) Annex B for Additional ECMAScript Features for Web Browsers.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.fontsize', 'String.prototype.fontsize')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td>Defined in the (normative) Annex B for Additional ECMAScript Features for Web Browsers.</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>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoDesktop("1.0")}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</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>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoMobile("1.0")}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("String.prototype.big()")}}</li> + <li>{{jsxref("String.prototype.small()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/string/fromcharcode/index.html b/files/zh-cn/web/javascript/reference/global_objects/string/fromcharcode/index.html new file mode 100644 index 0000000000..fd399adab7 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/string/fromcharcode/index.html @@ -0,0 +1,91 @@ +--- +title: String.fromCharCode() +slug: Web/JavaScript/Reference/Global_Objects/String/fromCharCode +tags: + - ASCII码变成字符串 + - fromCharCode +translation_of: Web/JavaScript/Reference/Global_Objects/String/fromCharCode +--- +<p>{{JSRef}}</p> + +<p>静态 <strong><code>String.fromCharCode()</code></strong> 方法返回由指定的 UTF-16 代码单元序列创建的字符串。</p> + +<div>{{EmbedInteractiveExample("pages/js/string-fromcharcode.html")}}</div> + + + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox notranslate"><code>String.fromCharCode(<var>num1</var>[, ...[, <var>numN</var>]])</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>num1, ..., num<em>N</em></code></dt> + <dd>一系列 UTF-16 代码单元的数字。范围介于 <code>0</code> 到 <code>65535</code>（<code>0xFFFF</code>）之间。大于 <code>0xFFFF</code> 的数字将被截断。不进行有效性检查。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>一个长度为 <code>N</code> 的字符串，由 <code>N</code> 个指定的 UTF-16 代码单元组成。</p> + +<h2 id="Description" name="Description">描述</h2> + +<p>该方法返回一个字符串，而不是一个 {{jsxref("String")}} 对象。</p> + +<p>由于 <code>fromCharCode()</code> 是 {{jsxref("String")}} 的静态方法，所以应该像这样使用：<code>String.fromCharCode()</code>，而不是作为你创建的 {{jsxref("String")}} 对象的方法。</p> + +<h3 id="返回补充字符">返回补充字符</h3> + +<p>在 UTF-16 中，绝大部分常用的字符可以用一个 16 位的值表示（即一个代码单元）。然而，有一类字符叫 Base Multilingual Plane (BMP)，是所有可寻址的 Unicode 码点的 <sup>1</sup>/<sub>17</sub><sup>th</sup>。剩下的码点，从范围 <code>65536</code> (<code>0x010000</code>) 到 <code>1114111</code> (<code>0x10FFFF</code>) 被称之为补充字符。在 UTF-16 中，补充字符也叫代理（surrogates），用两个 16 位代码单元表示，它是有目的被保留下来的。两个代理（surrogates）形成一个有效组合，也叫代理对，可以用来表示一个补充字符。</p> + +<p>因为 <code>fromCharCode()</code> 只作用于 16 位的值 (跟 <code>\u</code> 转义序列一样)，为了返回一个补充字符，一个代理对是必须的。例如，<code>String.fromCharCode(0xD83C, 0xDF03)</code> 和 <code>\uD83C\uDF03</code> 返回码点 <code>U+1F303</code> "Night with Stars"。</p> + +<p>While there is a mathematical relationship between the supplementary code point value (e.g. <code>0x1F303</code>) and both surrogate values that represent it (e.g., <code>0xD83C</code> and <code>0xDF03</code>), it does require an extra step to either calculate or look up the surrogate pair values every time a supplementary code point is to be used. 因此，使用 {{jsxref("String.fromCodePoint()")}} （ES2015 标准下的一个方法）更方便， 这个方法允许你基于真实的码点返回补充字符。例如 <code>String.fromCodePoint(0x1F303)</code> 返回码点 <code>U+1F303</code> "Night with Stars"。</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用_fromCharCode">使用 <code>fromCharCode()</code></h3> + +<p>在 UTF-16 中，BMP 字符使用一个代码单元：</p> + +<pre class="brush: js notranslate">String.fromCharCode(65, 66, 67); // 返回 "ABC" +String.fromCharCode(0x2014); // 返回 "—" +String.fromCharCode(0x12014); // 也是返回 "—"; 数字 1 被剔除并忽略 +String.fromCharCode(8212); // 也是返回 "—"; 8212 是 0x2014 的十进制表示 +</pre> + +<p><a href="https://asecuritysite.com/coding/asc2">完整的 UTF 16 表格</a>.<br> + 在 UTF-16 中，补充字符需要两个代码单元（即一个代理对）：</p> + +<pre class="brush: js notranslate">String.fromCharCode(0xD83C, 0xDF03); // Code Point U+1F303 "Night with +String.fromCharCode(55356, 57091); // Stars" == "\uD83C\uDF03" + +String.fromCharCode(0xD834, 0xDF06, 0x61, 0xD834, 0xDF07); // "\uD834\uDF06a\uD834\uDF07" +</pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Specification</th> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.fromcharcode', 'String.fromCharCode')}}</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{Compat("javascript.builtins.String.fromCharCode")}}</p> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("String.prototype.charCodeAt()")}}</li> + <li>{{jsxref("String.prototype.charAt()")}}</li> + <li>{{jsxref("String.fromCodePoint()")}}</li> + <li>{{jsxref("String.prototype.codePointAt()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/string/fromcodepoint/index.html b/files/zh-cn/web/javascript/reference/global_objects/string/fromcodepoint/index.html new file mode 100644 index 0000000000..786125e340 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/string/fromcodepoint/index.html @@ -0,0 +1,144 @@ +--- +title: String.fromCodePoint() +slug: Web/JavaScript/Reference/Global_Objects/String/fromCodePoint +translation_of: Web/JavaScript/Reference/Global_Objects/String/fromCodePoint +--- +<div>{{JSRef}}</div> + +<p><strong><code>String.fromCodePoint()</code> 静态方法返回使用指定的代码点序列创建的字符串。</strong></p> + +<div>{{EmbedInteractiveExample("pages/js/string-fromcodepoint.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code>String.fromCodePoint(<var>num1</var>[, ...[, <var>numN</var>]])</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>num1, ..., num<em>N</em></code></dt> + <dd>一串 Unicode 编码位置，即“代码点”。</dd> + <dt> + <h3 id="返回值">返回值</h3> + + <p>使用指定的 Unicode 编码位置创建的字符串。</p> + </dt> +</dl> + +<h3 id="异常">异常</h3> + +<dl> + <dt>{{jsxref("RangeError")}}</dt> + <dd>如果传入无效的 Unicode 编码，将会抛出一个{{jsxref("RangeError")}} (例如： "RangeError: NaN is not a valid code point")。</dd> +</dl> + +<h2 id="说明">说明</h2> + +<p>该方法返回一个字符串，而不是一个 {{jsxref("String")}} 对象。</p> + +<p>因为 <code>fromCodePoint()</code> 是 {{jsxref("String")}} 的一个静态方法，所以只能通过 <code>String.fromCodePoint()</code> 这样的方式来使用，不能在你创建的 {{jsxref("String")}} 对象实例上直接调用。</p> + +<h2 id="例子">例子</h2> + +<h3 id="使用_fromCodePoint()">使用 <code>fromCodePoint()</code></h3> + +<pre class="brush: js">String.fromCodePoint(42); // "*" +String.fromCodePoint(65, 90); // "AZ" +String.fromCodePoint(0x404); // "\u0404" +String.fromCodePoint(0x2F804); // "\uD87E\uDC04" +String.fromCodePoint(194564); // "\uD87E\uDC04" +String.fromCodePoint(0x1D306, 0x61, 0x1D307) // "\uD834\uDF06a\uD834\uDF07" + +String.fromCodePoint('_'); // RangeError +String.fromCodePoint(Infinity); // RangeError +String.fromCodePoint(-1); // RangeError +String.fromCodePoint(3.14); // RangeError +String.fromCodePoint(3e-2); // RangeError +String.fromCodePoint(NaN); // RangeError +</pre> + +<pre class="brush: js">// String.fromCharCode() 方法不能单独获取在高代码点位上的字符 +// 另一方面，下列的示例中，可以返回 4 字节，也可以返回 2 字节的字符 +// (也就是说，它可以返回单独的字符，使用长度 2 代替 1!） +console.log(String.fromCodePoint(0x2F804)); // or 194564 in decimal +</pre> + +<h2 id="Polyfill">Polyfill</h2> + +<p><code>String.fromCodePoint</code> 方法是 ECMAScript2015（ES6）新增加的特性，所以一些老的浏览器可能还不支持。可以通过使用下面的 polyfill 代码来保证浏览器的支持：</p> + +<pre class="brush: js">if (!String.fromCodePoint) (function(stringFromCharCode) { + var fromCodePoint = function(_) { + var codeUnits = [], codeLen = 0, result = ""; + for (var index=0, len = arguments.length; index !== len; ++index) { + var codePoint = +arguments[index]; + // correctly handles all cases including `NaN`, `-Infinity`, `+Infinity` + // The surrounding `!(...)` is required to correctly handle `NaN` cases + // The (codePoint>>>0) === codePoint clause handles decimals and negatives + if (!(codePoint < 0x10FFFF && (codePoint>>>0) === codePoint)) + throw RangeError("Invalid code point: " + codePoint); + if (codePoint <= 0xFFFF) { // BMP code point + codeLen = codeUnits.push(codePoint); + } else { // Astral code point; split in surrogate halves + // https://mathiasbynens.be/notes/javascript-encoding#surrogate-formulae + codePoint -= 0x10000; + codeLen = codeUnits.push( + (codePoint >> 10) + 0xD800, // highSurrogate + (codePoint % 0x400) + 0xDC00 // lowSurrogate + ); + } + if (codeLen >= 0x3fff) { + result += stringFromCharCode.apply(null, codeUnits); + codeUnits.length = 0; + } + } + return result + stringFromCharCode.apply(null, codeUnits); + }; + try { // IE 8 only supports `Object.defineProperty` on DOM elements + Object.defineProperty(String, "fromCodePoint", { + "value": fromCodePoint, "configurable": true, "writable": true + }); + } catch(e) { + String.fromCodePoint = fromCodePoint; + } +}(String.fromCharCode)); +</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>{{SpecName('ES2015', '#sec-string.fromcodepoint', 'String.fromCodePoint')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.fromcodepoint', 'String.fromCodePoint')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.String.fromCodePoint")}}</p> + +<h2 id="参见">参见</h2> + +<ul> + <li>{{jsxref("String.fromCharCode()")}}</li> + <li>{{jsxref("String.prototype.charAt()")}}</li> + <li>{{jsxref("String.prototype.codePointAt()")}}</li> + <li>{{jsxref("String.prototype.charCodeAt()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/string/includes/index.html b/files/zh-cn/web/javascript/reference/global_objects/string/includes/index.html new file mode 100644 index 0000000000..83ced4b38a --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/string/includes/index.html @@ -0,0 +1,111 @@ +--- +title: String.prototype.includes() +slug: Web/JavaScript/Reference/Global_Objects/String/includes +tags: + - JavaScript + - Method + - Monkey patching + - Prototype + - String + - String.prototype.includes() +translation_of: Web/JavaScript/Reference/Global_Objects/String/includes +--- +<div>{{JSRef}}</div> + +<p><strong><code>includes()</code> </strong>方法用于判断一个字符串是否包含在另一个字符串中，根据情况返回 true 或 false。</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox notranslate"><var>str</var>.includes(<var>searchString</var>[, <var>position</var>])</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>searchString</code></dt> + <dd>要在此字符串中搜索的字符串。</dd> + <dt><code><var>position</var></code> {{optional_inline}}</dt> + <dd>从当前字符串的哪个索引位置开始搜寻子字符串，默认值为 <code>0</code>。</dd> + <dt> + <h3 id="返回值">返回值</h3> + </dt> + <dd>如果当前字符串包含被搜寻的字符串，就返回 <strong><code>true</code></strong>；否则返回 <strong><code>false</code></strong>。</dd> +</dl> + +<h2 id="描述">描述</h2> + +<p>这个方法可以帮你判断一个字符串是否包含另外一个字符串。</p> + +<h3 id="区分大小写">区分大小写</h3> + +<p><code>includes()</code> 方法是区分大小写的。例如，下面的表达式会返回 <strong><code>false</code></strong> ：</p> + +<pre class="notranslate"><code>'Blue Whale'.includes('blue'); // returns false</code></pre> + +<h2 id="兼容补丁">兼容补丁</h2> + +<p>这个方法已经被加入到 ECMAScript 6 标准中，但未必在所有的 JavaScript 实现中都可以使用。然而，你可以轻松地 polyfill 这个方法：</p> + +<pre class="notranslate"><code>if (!String.prototype.includes) { + String.prototype.includes = function(search, start) { + 'use strict'; + if (typeof start !== 'number') { + start = 0; + } + + if (start + search.length > this.length) { + return false; + } else { + return this.indexOf(search, start) !== -1; + } + }; +}</code></pre> + +<h2 id="Examples" name="Examples">示例</h2> + +<h3 id="使用_includes">使用 includes()</h3> + +<pre class="notranslate"><code>var str = 'To be, or not to be, that is the question.'; + +console.log(str.includes('To be')); // true +console.log(str.includes('question')); // true +console.log(str.includes('nonexistent')); // false +console.log(str.includes('To be', 1)); // false +console.log(str.includes('TO BE')); // false</code></pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Specification</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.includes', 'String.prototype.includes')}}</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{Compat("javascript.builtins.String.includes")}}</p> + +<h2 id="String.prototype.contains">String.prototype.contains()</h2> + +<p>在 Firefox 18 - 39中，这个方法的名称叫 <code>contains()</code>。由于下面的理由，在{{bug(1102219)}}中，它被重命名为 <code>includes()</code> ：</p> + +<p>据报道，在Firefox 17上，一些使用 <a href="http://mootools.net/">MooTools</a> 1.2的网站会崩溃掉。这个版本的MooTools会检查函数 <code>String.prototype.contains()</code> 是否存在，如果不存在的话，MooTools就添加它自己的函数。通过在Firefox 17中引入这个函数，检查更改的行为在一定程度上导致了基于MooTools的 <code>String.prototype.contains() </code>函数的代码实现中断。结果是，当 <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=789036#c32">MooTools的拓展</a> 导致 <a href="http://mootools.net/blog/2013/02/19/mootools-1-2-6-released">MooTools 1.2.6</a> 版本的发布，此实现在Firefox 17中不可用和 <code>String.prototype.contains()</code> 在随后一个版本Firefox 18上是可用的。</p> + +<p>MooTools 1.3会强制使用它自己版本的函数 <code>String.prototype.contains()</code>，因此，依赖它的网站不会崩溃掉。然而，你应该注意此方法在 <a href="http://mootools.net/core/docs/1.3.2/Types/String#String-method:-contains">MooTools 1.3 </a>签名和ECMAScript 6 签名中的不同（在第二个参数）。后来，<a href="https://github.com/mootools/mootools-core/blob/master/Docs/Types/String.md#note">为了与ES6标准一致在MooTools 1.5版本及以上更改了签名</a>。</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Array.prototype.includes()")}} {{experimental_inline}}</li> + <li>{{jsxref("TypedArray.prototype.includes()")}} {{experimental_inline}}</li> + <li>{{jsxref("String.prototype.indexOf()")}}</li> + <li>{{jsxref("String.prototype.lastIndexOf()")}}</li> + <li>{{jsxref("String.prototype.startsWith()")}}</li> + <li>{{jsxref("String.prototype.endsWith()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/string/index.html b/files/zh-cn/web/javascript/reference/global_objects/string/index.html new file mode 100644 index 0000000000..d8b23c0904 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/string/index.html @@ -0,0 +1,357 @@ +--- +title: String +slug: Web/JavaScript/Reference/Global_Objects/String +tags: + - JavaScript + - String + - 参考 + - 字符串 +translation_of: Web/JavaScript/Reference/Global_Objects/String +--- +<div>{{JSRef}}</div> + +<p><strong><code>String</code></strong> 全局对象是一个用于字符串或一个字符序列的构造函数。</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<p>字符串字面量采取以下形式：</p> + +<pre class="syntaxbox">'string text' +"string text" +"中文/汉语" +"español" +"English " +"हिन्दी" +"العربية" +"português" +"বাংলা" +"русский" +"日本語" +"ਪੰਜਾਬੀ" +"한국어"</pre> + +<p>你也能使用 <code>String</code> 函数将其他值生成或转换成字符串：</p> + +<pre class="syntaxbox">String(thing) +new String(thing)</pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>thing</code></dt> + <dd>任何可以被转换成字符串的值。</dd> +</dl> + +<h3 id="Parameters" name="Parameters">模板字面量</h3> + +<p>从 ECMAScript 2015 开始，字符串字面量也可以称为<a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals">模板字面量</a>：</p> + +<pre>`hello world` `hello! world!` `hello ${who}` escape `<a>${who}</a>`</pre> + +<h3 id="Parameters" name="Parameters">转义字符</h3> + +<dl> +</dl> + +<p>除了普通的可打印字符以外，一些有特殊功能的字符可以通过转义字符的形式放入字符串中：</p> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Code</th> + <th scope="col">Output</th> + </tr> + </thead> + <tbody> + <tr> + <td><code>\0</code></td> + <td>空字符</td> + </tr> + <tr> + <td><code>\'</code></td> + <td>单引号</td> + </tr> + <tr> + <td><code>\"</code></td> + <td><code>双引号</code></td> + </tr> + <tr> + <td><code>\\</code></td> + <td>反斜杠</td> + </tr> + <tr> + <td><code>\n</code></td> + <td>换行</td> + </tr> + <tr> + <td><code>\r</code></td> + <td><code>回车</code></td> + </tr> + <tr> + <td><code>\v</code></td> + <td>垂直制表符</td> + </tr> + <tr> + <td><code>\t</code></td> + <td>水平制表符</td> + </tr> + <tr> + <td><code>\b</code></td> + <td>退格</td> + </tr> + <tr> + <td><code>\f</code></td> + <td>换页</td> + </tr> + <tr> + <td><code>\uXXXX</code></td> + <td>unicode 码</td> + </tr> + <tr> + <td><code>\u{X}</code> ... <code>\u{XXXXXX}</code></td> + <td>unicode codepoint {{experimental_inline}}</td> + </tr> + <tr> + <td><code>\xXX</code></td> + <td>Latin-1 字符(x小写)</td> + </tr> + </tbody> +</table> + +<div class="note">和其他语言不同，javascript 的字符串不区分单引号和双引号，所以不论是单引号还是双引号的字符串，上面的转义字符都能运行 。</div> + +<h3 id="长字符串">长字符串</h3> + +<p>有时，你的代码可能含有很长的字符串。你可能想将这样的字符串写成多行，而不是让这一行无限延长或着被编辑器折叠。有两种方法可以做到这一点。</p> + +<p>其一，可以使用 + 运算符将多个字符串连接起来，如下所示：</p> + +<pre><code>let longString = "This is a very long string which needs " + + "to wrap across multiple lines because " + + "otherwise my code is unreadable.";</code></pre> + +<p>其二，可以在每行末尾使用反斜杠字符（“\”），以指示字符串将在下一行继续。确保反斜杠后面没有空格或任何除换行符之外的字符或缩进; 否则反斜杠将不会工作。 如下所示：</p> + +<pre><code>let longString = "This is a very long string which needs \ +to wrap across multiple lines because \ +otherwise my code is unreadable.";</code></pre> + +<p>使用这两种方式会创建相同的字符串。</p> + +<dl> +</dl> + +<h2 id="Description" name="Description">描述</h2> + +<p>字符串对于保存可以以文本形式表示的数据非常有用。 一些常用的字符串操作有：查询<a href="/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/String/length">字符串长度</a>，使用<a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/String_Operators"> + 和 += </a>运算符来构建和连接字符串，使用 <a href="/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/String/indexOf">indexOf</a> 方法检查某一子字符串在父字符串中的位置，又或是使用 <a href="/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/String/substring">substring</a> 方法提取从父字符串中提取子字符串。</p> + +<h3 id="Character_access" name="Character_access">从字符串中获取单个字符</h3> + +<p>获取字符串的某个字符有两种方法。 第一种是使用 {{jsxref("String.charAt", "charAt")}} 方法：</p> + +<pre class="brush: js">return 'cat'.charAt(1); // returns "a" +</pre> + +<p>另一种 (在ECMAScript 5中有所介绍) 是把字符串当作一个类似数组的对象，其中的每个字符对应一个数值索引：</p> + +<pre class="brush: js">return 'cat'[1]; // returns "a" +</pre> + +<p>使用括号访问字符串不可以对其进行删除或添加，因为字符串对应未知的属性并不是可读或配置的。 (更多的信息请参阅 {{jsxref("Object.defineProperty")}}。 )</p> + +<h3 id="Comparing_strings" name="Comparing_strings">字符串比较</h3> + +<p>熟练使用 C 语言的开发者经常使用 <code>strcmp</code> 函数来比较字符串，但在 JavaScript 中，你只需要使用<a href="/zh-CN/docs/Web/JavaScript/Reference/Operators/Comparison_Operators">比较操作符(>/</>=/<=)</a>：</p> + +<pre class="brush: js">var a = "a"; +var b = "b"; +if (a < b) // true + print(a + " is less than " + b); +else if (a > b) + print(a + " is greater than " + b); +else + print(a + " and " + b + " are equal."); +</pre> + +<p>使用从字符串实例继承而来的 {{jsxref("String.localeCompare", "localeCompare")}} 方法也能达到同样的效果。 </p> + +<h3 id="基本字符串和字符串对象的区别">基本字符串和<font face="Consolas, Liberation Mono, Courier, monospace">字符串</font>对象的区别</h3> + +<p>请注意区分 JavaScript 字符串对象和基本字符串值 . ( 对于 {{jsxref("Global_Objects/Boolean", "Boolean")}} 和{{jsxref("Global_Objects/Number", "Numbers")}} 也同样如此.)</p> + +<p>字符串字面量 (通过单引号或双引号定义) 和 直接调用 String 方法(没有通过 new 生成字符串对象实例)的字符串都是基本字符串。JavaScript会自动将基本字符串转换为字符串对象，只有将基本字符串转化为字符串对象之后才可以使用字符串对象的方法。当基本字符串需要调用一个字符串对象才有的方法或者查询值的时候(基本字符串是没有这些方法的)，JavaScript 会自动将基本字符串转化为字符串对象并且调用相应的方法或者执行查询。</p> + +<pre class="brush: js">var s_prim = "foo"; +var s_obj = new String(s_prim); + +console.log(typeof s_prim); // Logs "string" +console.log(typeof s_obj); // Logs "object" +</pre> + +<p>当使用 {{jsxref("Global_Objects/eval", "eval")}}时，基本字符串和<font face="Consolas, Liberation Mono, Courier, monospace">字符串</font>对象也会产生不同的结果。<code>eval</code> 会将基本字符串作为源代码处理; 而<font face="Consolas, Liberation Mono, Courier, monospace">字符串</font>对象则被看作对象处理, 返回对象。 例如：</p> + +<pre class="brush: js">s1 = "2 + 2"; // creates a string primitive +s2 = new String("2 + 2"); // creates a String object +console.log(eval(s1)); // returns the number 4 +console.log(eval(s2)); // returns the string "2 + 2" +</pre> + +<p>由于上述原因, 当一段代码在需要使用基本字符串的时候却使用了字符串对象就会导致执行失败(虽然一般情况下程序员们并不需要考虑这样的问题)。</p> + +<p>利用 {{jsxref("String.valueOf", "valueOf")}} 方法，我们可以将字符串对象转换为其对应的基本字符串。</p> + +<pre class="brush: js">console.log(eval(s2.valueOf())); // returns the number 4 +</pre> + +<div class="note"><strong>注意:</strong> 其他的将字符串对象转换成基本字符串的方法可以及参考 <a href="/zh-CN/docs/Web/JavaScript/Typed_arrays/StringView" title="/zh-CN/docs/Web/JavaScript/Typed_arrays/StringView"><code>StringView</code> – a C-like representation of strings based on typed arrays</a>.</div> + +<h2 id="属性">属性</h2> + +<dl> + <dt>{{jsxref("String.prototype")}}</dt> + <dd>可以为 String 对象增加新的属性。</dd> +</dl> + +<h2 id="Methods" name="Methods">方法</h2> + +<dl> + <dt>{{jsxref("String.fromCharCode()")}} </dt> + <dd> <strong>通过一串 Unicode 创建字符串。</strong></dd> +</dl> + +<dl> + <dt>{{jsxref("String.fromCodePoint()")}} {{experimental_inline}}</dt> + <dd>通过一串 码点 创建字符串。</dd> +</dl> + +<div> +<dl> + <dt>{{jsxref("String.raw()")}} {{experimental_inline}}</dt> + <dd>通过模板字符串创建字符串。</dd> +</dl> +</div> + +<h2 id="字符串泛型方法">字符串泛型方法</h2> + +<div class="warning"> +<p>字符串泛型是<strong>非标准的</strong>，<strong>已弃用</strong>，<strong>并且会在不远的</strong><strong>将来删除</strong>。注意，你不能依靠他们的跨浏览器，而不使用下面提供的垫片。</p> +</div> + +<p>应该避免在 Javascript 1.6 （Firefox 浏览器的 JS 引擎）中使用（虽然也支持）将其他对象转化为字符的方法，因为方法并没有成为 ECMA 标准：</p> + +<pre class="brush: js">let num = 15; +console.log(String.replace(num, /5/, '2')); +</pre> + +<p class="brush: js">移除字符串泛型的措施，参见 <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Errors/Deprecated_string_generics">Warning: String.x is deprecated; use String.prototype.x instead</a>.</p> + +<p class="brush: js"><span style="background-color: #ffffff; color: #4d4e53; font-family: open sans,arial,sans-serif; font-size: 14px; line-height: 21px;">{{jsxref("Global_Objects/Array", "Generics", "#Array_generic_methods", 1)}} 在 Javascript 1.6 中同样支持{{jsxref("Global_Objects/Array", "Array")}}。</span></p> + +<h2 id="String_instances" name="String_instances"><code>String</code> 实例</h2> + +<h3 id="属性_2">属性</h3> + +<p>{{page('zh-CN/docs/Web/JavaScript/Reference/Global_Objects/String/prototype', 'Properties')}}</p> + +<p><span style="line-height: 1.5;">{{page('zh-CN/docs/Web/JavaScript/Reference/Global_Objects/String/prototype', 'Methods')}}</span></p> + +<h2 id="示例">示例 </h2> + +<h3 id="将其他值转换成字符串">将其他值转换成字符串</h3> + +<p>使用 String() 方法将其它对象转化为字符串可以被认为是一种更加安全的做法，虽然该方法底层使用的也是 toString() 方法，但是针对 null/undefined/symbols，String() 方法会有特殊的处理：</p> + +<pre class="brush: js">var outputStrings = []; +for (let i = 0, n = inputValues.length; i < n; ++i) { + outputStrings.push(String(inputValues[i])); +} +</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>ECMAScript 1st Edition.</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.5', 'String')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-string-objects', 'String')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{ CompatibilityTable() }}</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>0.2</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="sect1"></h2> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{domxref("DOMString")}}</li> + <li><a href="/zh-CN/docs/Web/JavaScript/Typed_arrays/StringView" title="/zh-CN/docs/Web/JavaScript/Typed_arrays/StringView"><code>StringView</code> – a C-like representation of strings based on typed arrays</a></li> + <li><a href="https://developer.mozilla.org/zh-CN/docs/Web/API/DOMString/Binary">Binary strings</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/string/indexof/index.html b/files/zh-cn/web/javascript/reference/global_objects/string/indexof/index.html new file mode 100644 index 0000000000..5bb7b532fc --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/string/indexof/index.html @@ -0,0 +1,181 @@ +--- +title: String.prototype.indexOf() +slug: Web/JavaScript/Reference/Global_Objects/String/indexOf +tags: + - JavaScript + - String + - 原型 + - 参考 + - 字符串 + - 方法 +translation_of: Web/JavaScript/Reference/Global_Objects/String/indexOf +--- +<div>{{JSRef}}</div> + +<p><code><strong>indexOf()</strong></code> 方法返回调用它的 {{jsxref("String")}} 对象中第一次出现的指定值的索引，从 <code>fromIndex</code> 处进行搜索。如果未找到该值，则返回 -1。</p> + +<div>{{EmbedInteractiveExample("pages/js/string-indexof.html")}}</div> + + + +<div class="note"><strong>Note:</strong> For the Array method, see {{jsxref("Array.prototype.indexOf()")}}.</div> + +<h2 id="语法">语法</h2> + +<pre class="notranslate"><var>str</var>.indexOf(<var>searchValue [</var>, <var>fromIndex]</var>)</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>searchValue</code></dt> + <dd>要被查找的字符串值。</dd> + <dd>如果没有提供确切地提供字符串，<a href="https://tc39.github.io/ecma262/#sec-tostring"><var>searchValue</var> 会被强制设置为 <code>"undefined"</code></a>， 然后在当前字符串中查找这个值。</dd> + <dd>举个例子：<code>'undefined'.indexOf()</code> 将会返回0，因为 <code>undefined</code> 在位置0处被找到，但是 <code>'undefine'.indexOf()</code> 将会返回 -1 ，因为字符串 <code>'undefined'</code> 未被找到。</dd> + <dt><code>fromIndex</code> {{optional_inline}}</dt> + <dd>数字表示开始查找的位置。可以是任意整数，默认值为 <code>0</code>。</dd> + <dd>如果 <code>fromIndex</code> 的值小于 <code>0</code>，或者大于 <code><var>str</var>.length</code> ，那么查找分别从 <code>0</code> 和<code><var>str</var>.length</code> 开始。（译者注： <code>fromIndex</code> 的值小于 <code>0</code>，等同于为空情况； <code>fromIndex</code> 的值大于或等于 <code><var>str</var>.length</code> ，那么结果会直接返回 <code>-1</code> 。）</dd> + <dd>举个例子，<code>'hello world'.indexOf('o', -5)</code> 返回 <code>4</code> ，因为它是从位置<code>0</code>处开始查找，然后 <code>o</code> 在位置<code>4</code>处被找到。另一方面，<code>'hello world'.indexOf('o', 11)</code> （或 <code>fromIndex</code> 填入任何大于<code>11</code>的值）将会返回 <code>-1</code> ，因为开始查找的位置<code>11</code>处，已经是这个字符串的结尾了。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>查找的字符串 <code><var>searchValue</var></code><var> </var>的第一次出现的索引，如果没有找到，则返回 <code>-1</code>。</p> + +<p>若被查找的字符串 <code><var>searchValue</var></code><var> </var>是一个空字符串，将会产生“奇怪”的结果。如果 <code>fromIndex</code> 值为空，或者 <code>fromIndex</code> 值小于被查找的字符串的长度，返回值和以下的 <code>fromIndex</code> 值一样：</p> + +<pre class="brush: js notranslate">'hello world'.indexOf('') // 返回 0 +'hello world'.indexOf('', 0) // 返回 0 +'hello world'.indexOf('', 3) // 返回 3 +'hello world'.indexOf('', 8) // 返回 8</pre> + +<p>另外，如果 <code>fromIndex</code> 值大于等于字符串的长度，将会直接返回字符串的长度（<code>str.length</code>）：</p> + +<pre class="brush: js notranslate">'hello world'.indexOf('', 11) // 返回 11 +'hello world'.indexOf('', 13) // 返回 11 +'hello world'.indexOf('', 22) // 返回 11</pre> + +<p>从前面一个例子可以看出，被查找的值是空值时，Javascript将直接返回指定的索引值。从后面一个例子可以看出，被查找的值是空值时，Javascript将直接返回字符串的长度。</p> + +<h2 id="描述">描述</h2> + +<p>字符串中的字符被从左向右索引。第一个字符的索引（index）是 <code>0</code>，变量名为 <code>stringName</code> 的字符串的最后一个字符的索引是 <code>stringName.length - 1</code> 。</p> + +<pre class="brush: js notranslate">"Blue Whale".indexOf("Blue") // 返回 0 +"Blue Whale".indexOf("Blute") // 返回 -1 +"Blue Whale".indexOf("Whale", 0) // 返回 5 +"Blue Whale".indexOf("Whale", 5) // 返回 5 +"Blue Whale".indexOf("", -1) // 返回 0 +"Blue Whale".indexOf("", 9) // 返回 9 +"Blue Whale".indexOf("", 10) // 返回 10 +"Blue Whale".indexOf("", 11) // 返回 10</pre> + +<p id="Example_indexOf_and_case-sensitivity"><code>indexOf</code> 方法是区分大小写的。例如，下面的表达式将返回 <code>-1</code>：</p> + +<pre class="brush: js notranslate">"Blue Whale".indexOf("blue") // 返回 -1 +</pre> + +<h3 id="检测是否存在某字符串">检测是否存在某字符串</h3> + +<p>注意 <code>0</code> 并不会被当成 <code>true</code> ，<code>-1</code> 不会被当成 <code>false</code> 。所以当检测某个字符串是否存在于另一个字符串中时，可使用下面的方法：</p> + +<pre class="notranslate">'Blue Whale'.indexOf('Blue') !== -1 // true +'Blue Whale'.indexOf('Bloe') !== -1 // false +~('Blue Whale'.indexOf('Bloe')) // 0, 这是一种错误用法</pre> + +<h2 id="示例">示例</h2> + +<h3 id="Example_Using_indexOf_and_lastIndexOf" name="Example:_Using_indexOf_and_lastIndexOf">使用<code>indexOf()</code> 和 <code>lastIndexOf()</code></h3> + +<p>下例使用 <code>indexOf()</code> 和 <code>lastIndexOf()</code> 方法定位字符串中 "<code>Brave new world</code>" 的值。</p> + +<pre class="brush: js notranslate">var anyString = "Brave new world"; + +console.log("The index of the first w from the beginning is " + anyString.indexOf("w")); +// logs 8 +console.log("The index of the first w from the end is " + anyString.lastIndexOf("w")); +// logs 10 + +console.log("The index of 'new' from the beginning is " + anyString.indexOf("new")); +// logs 6 +console.log("The index of 'new' from the end is " + anyString.lastIndexOf("new")); +// logs 6 +</pre> + +<h3 id="indexOf_和区分大小写"><code>indexOf</code> 和区分大小写</h3> + +<p>下例定义了两个字符串变量。两个变量包含相同的字符串，除了第二个字符串中的某些字符为大写。第一个 <code>log</code> 方法输出 19。但是由于 <code>indexOf</code> 方法区分大小写，因此不会在 <code>myCapString</code> 中发现字符串 <code>“cheddar"</code>，所以，第二个 <code>log</code> 方法会输出 -1。</p> + +<pre class="brush: js notranslate">var myString = "brie, pepper jack, cheddar"; +var myCapString = "Brie, Pepper Jack, Cheddar"; + +console.log('myString.indexOf("cheddar") is ' + myString.indexOf("cheddar")); +// logs 19 +console.log('myCapString.indexOf("cheddar") is ' + myCapString.indexOf("cheddar")); +// logs -1</pre> + +<h3 id="使用_indexOf_统计一个字符串中某个字母出现的次数">使用 <code>indexOf</code> 统计一个字符串中某个字母出现的次数</h3> + +<p>在下例中，设置了 <code>count</code> 来记录字母 <code><font face="Consolas, Liberation Mono, Courier, monospace">e</font></code> 在字符串 <code>str</code> 中出现的次数：</p> + +<pre class="brush: js notranslate">// 翻译：生存还是毁灭？这是个问题。（莎士比亚《哈姆雷特》） +var str = 'To be, or not to be, that is the question.'; +var count = 0; +var pos = str.indexOf('e'); + +while (pos !== -1) { + count++; + pos = str.indexOf('e', pos + 1); +} + +console.log(count); // displays 4 +</pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">规范</th> + <th scope="col">状态</th> + <th scope="col">说明</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ES1')}}</td> + <td>{{Spec2('ES1')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.5.4.7', 'String.prototype.indexOf')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-string.prototype.indexof', 'String.prototype.indexOf')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.indexof', 'String.prototype.indexOf')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.String.indexOf")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("String.prototype.charAt()")}}</li> + <li>{{jsxref("String.prototype.lastIndexOf()")}}</li> + <li>{{jsxref("String.prototype.includes()")}}</li> + <li>{{jsxref("String.prototype.split()")}}</li> + <li>{{jsxref("Array.prototype.indexOf()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/string/italics/index.html b/files/zh-cn/web/javascript/reference/global_objects/string/italics/index.html new file mode 100644 index 0000000000..80ee07eabc --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/string/italics/index.html @@ -0,0 +1,109 @@ +--- +title: String.prototype.italics() +slug: Web/JavaScript/Reference/Global_Objects/String/italics +translation_of: Web/JavaScript/Reference/Global_Objects/String/italics +--- +<div>{{JSRef}} {{deprecated_header}}</div> + +<p>The <strong><code>italics()</code></strong> method creates an {{HTMLElement("i")}} HTML element that causes a string to be italic.</p> + +<h2 id="Syntax">Syntax</h2> + +<pre class="syntaxbox"><code><var>str</var>.italics()</code></pre> + +<h2 id="Description">Description</h2> + +<p>The <code>italics()</code> method embeds a string in an <code><i></code> tag: <code>"<i>str</i>"</code>.</p> + +<h2 id="Examples">Examples</h2> + +<h3 id="Using_italics()">Using <code>italics()</code></h3> + +<p>The following example uses string methods to change the formatting of a string:</p> + +<pre class="brush: js">var worldString = 'Hello, world'; console.log(worldString.blink()); // Hello, world +console.log(worldString.bold()); // <strong>Hello, world</strong> +console.log(worldString.italics()); //<em>Hello, world</em> +console.log(worldString.strike()); // <s>Hello, world</s></pre> + +<h2 id="Specifications">Specifications</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('ES6', '#sec-string.prototype.italics', 'String.prototype.italics')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition. Implemented in JavaScript 1.0. Defined in the (normative) Annex B for Additional ECMAScript Features for Web Browsers.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.italics', 'String.prototype.italics')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td>Defined in the (normative) Annex B for Additional ECMAScript Features for Web Browsers.</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility">Browser compatibility</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>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoDesktop("1.0")}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</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>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoMobile("1.0")}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="See_also">See also</h2> + +<ul> + <li>{{jsxref("String.prototype.blink()")}}</li> + <li>{{jsxref("String.prototype.bold()")}}</li> + <li>{{jsxref("String.prototype.strike()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/string/lastindexof/index.html b/files/zh-cn/web/javascript/reference/global_objects/string/lastindexof/index.html new file mode 100644 index 0000000000..5dca3e48d4 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/string/lastindexof/index.html @@ -0,0 +1,162 @@ +--- +title: String.prototype.lastIndexOf() +slug: Web/JavaScript/Reference/Global_Objects/String/lastIndexOf +translation_of: Web/JavaScript/Reference/Global_Objects/String/lastIndexOf +--- +<p><span style="display: none;"> </span>{{JSRef}}</p> + +<p> <strong><code>lastIndexOf()</code></strong> 方法返回调用{{jsxref("String")}} 对象的指定值最后一次出现的索引，在一个字符串中的指定位置 <code>fromIndex</code>处从后向前搜索。如果没找到这个特定值则返回-1 。</p> + +<p>该方法将从尾到头地检索字符串 <em>str</em>，看它是否含有子串 <em>searchValue</em>。开始检索的位置在字符串的 <em>fromIndex</em> 处或字符串的结尾（没有指定 <em>fromIndex</em> 时）。如果找到一个 <em>searchValue</em>，则返回 <em>searchValue</em> 的第一个字符在 <em>str</em> 中的位置。<em>str</em>中的字符位置是从 0 开始的。</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code><em>str</em>.lastIndexOf(<em>searchValue</em>[, fromIndex])</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>searchValue</code></dt> + <dd>一个字符串，表示被查找的值。如果<code>searchValue</code>是空字符串，则返回<code>fromIndex</code>。</dd> + <dt><code>fromIndex</code>{{optional_inline}}</dt> + <dd>待匹配字符串searchValue的开头一位字符从 str的第fromIndex位开始向左回向查找。<code>fromIndex</code>默认值是 <code>+Infinity</code>。如果 <code>fromIndex >= str.length</code> ，则会搜索整个字符串。如果 <code>fromIndex < 0</code> ，则等同于 <code>fromIndex == 0</code>。</dd> + <dt> + <h3 id="返回值">返回值</h3> + </dt> +</dl> + +<p>返回指定值最后一次出现的索引(该索引仍是以从左至右0开始记数的)，如果没找到则返回-1。</p> + +<h2 id="Description" name="Description">描述</h2> + +<p>字符串中的字符被从左向右索引。首字符的索引（index）是 0，最后一个字符的索引是 <code>stringName.length - 1</code>。</p> + +<pre><code>'canal'.lastIndexOf('a'); // returns 3 （没有指明fromIndex则从末尾l处开始反向检索到的第一个a出现在l的后面，即index为3的位置） +'canal'.lastIndexOf('a', 2); // returns 1（指明fromIndex为2则从n处反向向回检索到其后面就是a，即index为1的位置） +'canal'.lastIndexOf('a', 0); // returns -1(指明fromIndex为0则从c处向左回向检索a发现没有，故返回-1) +'canal'.lastIndexOf('x'); // returns -1 +'canal'.lastIndexOf('c', -5); // returns 0（指明fromIndex为-5则视同0，从c处向左回向查找发现自己就是，故返回0） +'canal'.lastIndexOf('c', 0); // returns 0（指明fromIndex为0则从c处向左回向查找c发现自己就是，故返回自己的索引0） +'canal'.lastIndexOf(''); // returns 5 +'canal'.lastIndexOf('', 2); // returns 2</code> +</pre> + +<div class="blockIndicator note"> +<p>Note: <code>'abab'.lastIndexOf('ab', 2)</code> 将返回 2 而不是 0, 因为fromIndex只限制待匹配字符串的开头。</p> +</div> + +<p>(例如'abadefgabm'.lastIndexOf('ab', 7) 返回7，虽然查找的'ab'中的b已经在 index=8的位置了从index=7的a处向左查找仍是能找到自身a加上其后连成ab，因为fromIndex指的是待匹配字符串的开头那一个)</p> + +<h3 id="Example_indexOf_and_case-sensitivity" name="Example:_indexOf_and_case-sensitivity">区分大小写</h3> + +<p><code>lastIndexOf</code> 方法区分大小写。例如，下面的表达式返回 -1：</p> + +<pre class="brush:js">"Blue Whale, Killer Whale".lastIndexOf("blue"); // returns -1</pre> + +<h2 id="Examples" name="Examples">示例</h2> + +<h3 id="Example_Using_indexOf_and_lastIndexOf" name="Example:_Using_indexOf_and_lastIndexOf">例子：使用 <code>indexOf</code> 和 <code>lastIndexOf</code></h3> + +<p>下例使用 <code>indexOf</code> 和 <code>lastIndexOf</code> 方法来定位字符串 "<code>Brave new world</code>" 中的值。</p> + +<pre class="brush:js">var anyString = "Brave new world"; + +console.log("The index of the first w from the beginning is " + anyString.indexOf("w")); +// Displays 8 +console.log("The index of the first w from the end is " + anyString.lastIndexOf("w")); +// Displays 10 + +console.log("The index of 'new' from the beginning is " + anyString.indexOf("new")); +// Displays 6 +console.log("The index of 'new' from the end is " + anyString.lastIndexOf("new")); +// Displays 6 +</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('ES1')}}</td> + <td>{{Spec2('ES1')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.5.4.8', 'String.prototype.lastIndexOf')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-string.prototype.lastindexof', 'String.prototype.lastIndexOf')}}</td> + <td>{{Spec2('ES6')}}</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>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</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>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("String.prototype.charAt()")}}</li> + <li>{{jsxref("String.prototype.indexOf()")}}</li> + <li>{{jsxref("String.prototype.split()")}}</li> + <li>{{jsxref("Array.prototype.indexOf()")}}</li> + <li>{{jsxref("Array.prototype.lastIndexOf()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/string/length/index.html b/files/zh-cn/web/javascript/reference/global_objects/string/length/index.html new file mode 100644 index 0000000000..c51f812f6d --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/string/length/index.html @@ -0,0 +1,135 @@ +--- +title: String.length +slug: Web/JavaScript/Reference/Global_Objects/String/length +tags: + - JavaScript + - Property + - Prototype + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/length +--- +<p>{{JSRef("Global_Objects", "String")}}</p> + +<h2 id="Summary" name="Summary" style="margin-bottom: 20px; line-height: 30px;">概述</h2> + +<p><strong>length</strong> 属性表示一个字符串的长度。</p> + +<h2 id="Description" name="Description" style="margin-bottom: 20px; line-height: 30px;">描述</h2> + +<p>该属性返回字符串中字符编码单元的数量。JavaScript 使用 {{ interwiki("wikipedia", "UTF-16") }} 编码，该编码使用一个 16 比特的编码单元来表示大部分常见的字符，使用两个代码单元表示不常用的字符。因此 length 返回值可能与字符串中实际的字符数量不相同。</p> + +<p>空字符串的 <code>length</code> 为 0。</p> + +<p>静态属性 <strong>String.length</strong> 返回 1。</p> + +<h2 id="Examples" name="Examples" style="margin-bottom: 20px; line-height: 30px;">示例</h2> + +<pre class="brush: js">var x = "Mozilla"; +var empty = ""; + +console.log("Mozilla is " + x.length + " code units long"); +/* "Mozilla is 7 code units long" */ + +console.log("The empty string is has a length of " + empty.length); +/* "The empty string is has a length of 0" */</pre> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 0px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 19px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 38px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 57px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 76px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 95px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 114px; background: 0px 0px;"> </div> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 133px; background: 0px 0px;"> </div> + +<h2 id="规范" style="margin-bottom: 20px; line-height: 30px;">规范</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('ES1')}}</td> + <td>{{Spec2('ES1')}}</td> + <td>Initial definition. Implemented in JavaScript 1.0.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.5.5.1', 'String.prototype.length')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-properties-of-string-instances-length', 'String.prototype.length')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性" style="margin-bottom: 20px; line-height: 30px;">浏览器兼容性</h2> + +<p>{{ CompatibilityTable() }}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th style="line-height: 16px;">Feature</th> + <th style="line-height: 16px;">Chrome</th> + <th style="line-height: 16px;">Firefox (Gecko)</th> + <th style="line-height: 16px;">Internet Explorer</th> + <th style="line-height: 16px;">Opera</th> + <th style="line-height: 16px;">Safari</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th style="line-height: 16px;">Feature</th> + <th style="line-height: 16px;">Android</th> + <th style="line-height: 16px;">Chrome for Android</th> + <th style="line-height: 16px;">Firefox Mobile (Gecko)</th> + <th style="line-height: 16px;">IE Mobile</th> + <th style="line-height: 16px;">Opera Mobile</th> + <th style="line-height: 16px;">Safari Mobile</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="See_also" name="See_also" style="margin-bottom: 20px; line-height: 30px;">相关链接</h2> + +<ul> + <li><a class="external external-icon" href="http://developer.teradata.com/blog/jasonstrimpel/2011/11/javascript-string-length-and-internationalizing-web-applications" style="white-space: pre-line;">JavaScript String.length and Internationalizing Web Applications</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/string/link/index.html b/files/zh-cn/web/javascript/reference/global_objects/string/link/index.html new file mode 100644 index 0000000000..a3956f9ba7 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/string/link/index.html @@ -0,0 +1,76 @@ +--- +title: String.prototype.link() +slug: Web/JavaScript/Reference/Global_Objects/String/link +translation_of: Web/JavaScript/Reference/Global_Objects/String/link +--- +<div>{{JSRef}} {{deprecated_header}}</div> + +<p><strong><code>link()</code></strong> 方法创建一个 HTML 元素 {{HTMLElement("a")}} ，用该字符串作为超链接的显示文本，参数作为指向另一个 URL 的超链接。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><var>str</var>.link(<var>url</var>)</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>url</code></dt> + <dd>任何能够指定 <code>a</code> 标签的 <code>href</code> 属性的字符串；它应当是有效的 URL（相对或绝对），任何 <code>&</code> 字符将会被转义为 <code>&amp;</code>，任何 <code>"</code> 字符将会被转义为 <code>&quot;</code>。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>一个带有一个 HTML 元素 {{HTMLElement("a")}} 的字符串。</p> + +<h2 id="描述">描述</h2> + +<p>使用 <code>link</code> 方法创建一个超链接 HTML 片段。返回的字符串可以通过 {{ Domxref("document.write") }} 或 {{ Domxref("element.innerHTML") }} 方法添加到文档中。</p> + +<p>使用 <code>link</code> 方法创建的链接将会成为 document.links 数组中的元素。查看 {{ Domxref("document.links") }}。</p> + +<h2 id="Examples" name="Examples">示例</h2> + +<h3 id="例子：使用_link">例子：使用 <code>link</code></h3> + +<p>下例显示一个单词 "MDN" 作为超链接，指向 Mozilla Developer Network。</p> + +<pre class="brush:js">var hotText = 'MDN'; +var URL = 'https://developer.mozilla.org/'; + +document.write('Click to return to ' + hotText.link(URL)); +// Click to return to <a href="https://developer.mozilla.org/">MDN</a> +</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('ES6', '#sec-string.prototype.link', 'String.prototype.link')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition. Implemented in JavaScript 1.0. Defined in the (normative) Annex B for Additional ECMAScript Features for Web Browsers.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.link', 'String.prototype.link')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td>Defined in the (normative) Annex B for Additional ECMAScript Features for Web Browsers.</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.String.link")}}</p> + +<h2 id="参见">参见</h2> + +<ul> + <li>{{jsxref("String.prototype.anchor()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/string/localecompare/index.html b/files/zh-cn/web/javascript/reference/global_objects/string/localecompare/index.html new file mode 100644 index 0000000000..b3607222de --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/string/localecompare/index.html @@ -0,0 +1,185 @@ +--- +title: String.prototype.localeCompare() +slug: Web/JavaScript/Reference/Global_Objects/String/localeCompare +tags: + - Internationalization + - JavaScript + - String.prototype.localeCompare() + - 原型 + - 参考 + - 字符串 + - 方法 +translation_of: Web/JavaScript/Reference/Global_Objects/String/localeCompare +--- +<div>{{JSRef}}</div> + +<p><strong><code>localeCompare()</code></strong> 方法返回一个数字来指示一个参考字符串是否在排序顺序前面或之后或与给定字符串相同。</p> + +<p><code>新的 locales 、</code> <code>options</code> 参数能让应用程序定制函数的行为即指定用来排序的语言。 <code>locales</code> 和 <code>options</code> 参数是依赖于具体实现的，在旧的实现中这两个参数是完全被忽略的。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox notranslate"><code><var>referenceStr</var>.localeCompare(<var>compareString</var>[, <var>locales</var>[, <var>options</var>]])</code></pre> + +<h3 id="参数">参数</h3> + +<p>查阅<a href="#浏览器支持">浏览器支持</a>部分来确定哪些浏览器支持 <code>locales</code> 参数和 <code>options</code> 参数， <a href="检查浏览器对扩展参数的支持">在功能检测中检查对 <code>locales</code> 、<code>options </code>参数的支持</a>。</p> + +<dl> + <dt><code>compareString</code></dt> + <dd>用来比较的字符串</dd> + <dt><strong><code><font face="consolas, Liberation Mono, courier, monospace"><span style="background-color: #eeeeee;">locales</span></font></code></strong></dt> + <dd>可选。 用来表示一种或多种语言或区域的一个符合 <a href="https://tools.ietf.org/html/rfc5646">BCP 47</a> 标准的字符串或一个字符串数组。 <code>locales</code>参数的一般形式与解释， 详情请参考 <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl#Locale_identification_and_negotiation">Intl page</a>。 下列的 Unicode 扩展关键词是允许的：</dd> + <dd><code><strong>co</strong></code></dd> + <dd>为了某些地域多样的排序规则。可能的值包括： <code>"big5han"</code>, <code>"dict"</code>, <code>"direct"</code>, <code>"ducet"</code>, <code>"gb2312"</code>, <code>"phonebk"</code>, <code>"phonetic"</code>, <code>"pinyin"</code>, <code>"reformed"</code>, <code>"searchjl"</code>, <code>"stroke"</code>, <code>"trad"</code>, <code>"unihan"</code>。 <code>"standard"</code> 和<code>"search"</code> 这两个值是被忽略的; 它们被 <code>options</code> 的属性 <code>usage</code> 代替(往下看)。</dd> + <dd><strong><code>kn</code></strong></dd> + <dd>指定数值排序是否应该被使用， 像是这样 "1" < "2" < "10"。 可能的值是 <code>"true"</code> 和 <code>"false"</code>。 这个选项能被通过<code>options</code> 属性设置或通过 Unicode 扩展。 假如两个都被设置了， 则 <code>options</code> 优先。（<em>"<em>language</em>-<em>region</em>-u-kn-true|false"）</em></dd> + <dd><strong><code>kf</code></strong></dd> + <dd>指定是否优先对大写字母或小写字母排序。 可能的值有 <code>"upper"</code>, <code>"lower"</code>, 或 <code>"false"</code> (use the locale's default)。这个选项能被通过<code>options</code> 属性设置或通过 Unicode 扩展。假如两个都被设置了， 则 <code>options</code> 优先。<em>（"<em>language</em>-<em>region</em>-u-kf-upper|lower|false"）</em></dd> + <dt><code>options</code></dt> + <dd> + <p>可选。 支持下列的一些或全部属性的一个对象:</p> + + <dl> + <dt><code>localeMatcher</code></dt> + <dd>地域匹配算法的使用. 可能的值是 <code>"lookup"</code> 和 <code>"best fit"</code>; 默认的值是 <code>"best fit"</code>。更多相关的资料, 请参考 <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl#Locale_negotiation" title="The Intl object is the namespace for the ECMAScript Internationalization API, which provides language sensitive string comparison, number formatting, and date and time formatting. The constructors for Collator, NumberFormat, and DateTimeFormat objects are properties of the Intl object. This page documents these properties as well as functionality common to the internationalization constructors and other language sensitive functions.">Intl page</a>.</dd> + <dt><code>usage</code></dt> + <dd>指定比较的目标是排序或者是搜索. 可能的值是 <code>"sort"</code> 和 <code>"search"</code>; 默认是 <code>"sort"</code>.</dd> + <dt><code>sensitivity</code></dt> + <dd> + <p>指定排序程序的敏感度（Which differences in the strings should lead to non-zero result values.） 可能的有:</p> + + <ul> + <li><code>"base"</code>: 只有不同的字母字符串比较是不相等的. 举个例子: <code>a ≠ b</code>, <code>a = á</code>, <code>a = A</code>.</li> + <li><code>"accent"</code>: 只有不同的字母或读音比较是不相等的. 举个例子: <code>a ≠ b</code>, <code>a ≠ á</code>, <code>a = A</code>.</li> + <li><code>"case"</code>: 只有不同的字母或大小写比较是不相等的. 举个例子: <code>a ≠ b</code>, <code>a = á</code>, <code>a ≠ A</code>.</li> + <li><code>"variant"</code>: 不同的字母或读音及其它有区别的标志或大小写都是不相等的， 还有其它的差异可能也会考虑到. 举个例子: <code>a ≠ b</code>, <code>a ≠ á</code>, <code>a ≠ A</code>.</li> + </ul> + + <p>The default is <code>"variant"</code> for usage <code>"sort"</code>; it's locale dependent for usage <code>"search"</code>.</p> + </dd> + <dt><code>ignorePunctuation</code></dt> + <dd>指定是否忽略标点. 可能的值是 <code>true</code> and <code>false</code>; 默认为 <code>false</code>.</dd> + <dt><code>numeric</code></dt> + <dd>是否指定使用数字排序, 像这样 "1" < "2" < "10". 可能的值是 <code>true</code> 和 <code>false</code>; 默认为 <code>false</code>. 这个选项能被通过<code>options</code> 属性设置或通过 Unicode 扩展。假如两个都被设置了， 则 <code>options</code> 优先。 实现不用必须支持这个属性.</dd> + <dt><code>caseFirst</code></dt> + <dd>指定大小写有限排序. 可能的值有 <code>"upper"</code>, <code>"lower"</code>, or <code>"false"</code> (use the locale's default); 默认为 <code>"false"</code>. 这个选项能被通过<code>options</code> 属性设置或通过 Unicode 扩展。假如两个都被设置了， 则 <code>options</code> 优先。 实现不用必须支持这个属性.</dd> + </dl> + </dd> + <dd> + <h3 id="返回值"><strong>返回值</strong></h3> + + <p>如果引用字符存在于比较字符之前则为<strong>负数</strong>; 如果引用字符存在于比较字符之后则为<strong>正数</strong>; 相等的时候返回 <strong>0</strong> .</p> + </dd> + <dd>page('/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Collator', 'Parameters')}}</dd> +</dl> + +<h2 id="描述">描述</h2> + +<p>返回一个数字表示是否 <strong>引用字符串</strong> 在排序中位于 <strong>比较字符串</strong> 的前面，后面，或者二者相同。</p> + +<ul> + <li>当 <strong>引用字符串 </strong>在 <strong>比较字符串 </strong>前面时返回 -1</li> + <li>当 <strong>引用字符串</strong> 在 <strong>比较字符串 </strong>后面时返回 1</li> + <li>相同位置时返回 0</li> +</ul> + +<p><strong>切勿依赖于 -1 或 1 这样特定的返回值。</strong>不同浏览器之间（以及不同浏览器版本之间）<strong> </strong>返回的正负数的值各有不同，因为W3C规范中只要求返回值是正值和负值，而没有规定具体的值。一些浏览器可能返回-2或2或其他一些负的、正的值。</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用_localeCompare">使用 <code>localeCompare()</code></h3> + +<pre class="brush: js notranslate">// The letter "a" is before "c" yielding a negative value +'a'.localeCompare('c'); +// -2 or -1 (or some other negative value) + +// Alphabetically the word "check" comes after "against" yielding a positive value +'check'.localeCompare('against'); +// 2 or 1 (or some other positive value) + +// "a" and "a" are equivalent yielding a neutral value of zero +'a'.localeCompare('a'); +// 0 +</pre> + +<h3 id="检查浏览器对扩展参数的支持">检查浏览器对扩展参数的支持</h3> + +<p><code>locales</code> 和 <code>options</code> 参数还没有被所有浏览器所支持。检查是否被支持， 使用 "i" 参数 (a requirement that illegal language tags are rejected) 判断是否有异常 {{jsxref("RangeError")}}抛出:</p> + +<pre class="brush: js notranslate">function localeCompareSupportsLocales() { + try { + 'foo'.localeCompare('bar', 'i'); + } catch (e) { + return e.name === 'RangeError'; + } + return false; +} +</pre> + +<h3 id="使用_locales_参数">使用 <code>locales 参数</code></h3> + +<p>在不同的语言下 <code>localeCompare()</code> 所提供的结果是不一致的。 为了能让用户得到正确的比较值， 通过使用 <code>locales</code> 参数来提供要比较的语言 (and possibly some fallback languages) :</p> + +<pre class="brush: js notranslate">console.log('ä'.localeCompare('z', 'de')); // a negative value: in German, ä sorts with a +console.log('ä'.localeCompare('z', 'sv')); // a positive value: in Swedish, ä sorts after z +</pre> + +<h3 id="使用_options_参数">使用 <code>options 参数</code></h3> + +<p><code>localeCompare()</code> 所提供的结果可以通过 <code>options</code> 参数来制定:</p> + +<pre class="brush: js notranslate">// in German, ä has a as the base letter +console.log('ä'.localeCompare('a', 'de', { sensitivity: 'base' })); // 0 + +// in Swedish, ä and a are separate base letters +console.log('ä'.localeCompare('a', 'sv', { sensitivity: 'base' })); // a positive value +</pre> + +<h2 id="性能相关">性能相关</h2> + +<p>当比较大量字符串时， 比如比较大量数组时， 最好创建一个{{jsxref("Global_Objects/Collator", "Intl.Collator")}} 对象并使用{{jsxref("Collator.prototype.compare", "compare")}} 属性所提供的函数。</p> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范</th> + <th scope="col">状态</th> + <th scope="col">备注</th> + </tr> + <tr> + <td>{{SpecName('ES3')}}</td> + <td>{{Spec2('ES3')}}</td> + <td>Initial definition. Implemented in JavaScript 1.2.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.5.4.9', 'String.prototype.localeCompare')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-string.prototype.localecompare', 'String.prototype.localeCompare')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES Int 1.0', '#sec-13.1.1', 'String.prototype.localeCompare')}}</td> + <td>{{Spec2('ES Int 1.0')}}</td> + <td><code>locale</code> and <code>option</code> parameter definitions.</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.String.localeCompare")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Global_Objects/Collator", "Intl.Collator")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/string/match/index.html b/files/zh-cn/web/javascript/reference/global_objects/string/match/index.html new file mode 100644 index 0000000000..9922ea3291 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/string/match/index.html @@ -0,0 +1,215 @@ +--- +title: String.prototype.match() +slug: Web/JavaScript/Reference/Global_Objects/String/match +translation_of: Web/JavaScript/Reference/Global_Objects/String/match +--- +<p>{{JSRef}}</p> + +<p> <strong><code>match()</code> </strong>方法检索返回一个字符串匹配正则表达式的结果。</p> + + +<div>{{EmbedInteractiveExample("pages/js/string-match.html", "shorter")}}</div> + +<div class="hidden">The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> and send us a pull request.</div> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox notranslate"><code><em>str</em>.match(regexp)</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>regexp</code></dt> + <dd>一个<a href="/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/RegExp" title="JavaScript/Reference/Global Objects/RegExp">正则表达式</a>对象。如果传入一个非正则表达式对象，则会隐式地使用 <code>new RegExp(obj)</code> 将其转换为一个 {{jsxref("RegExp")}} 。如果你没有给出任何参数并直接使用match() 方法 ，你将会得到一 个包含空字符串的 {{jsxref("Array")}} ：[""] 。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<ul> + <li><span style="line-height: 1.572;">如果使用g标志，则将返回与完整正则表达式匹配的所有结果，但不会返回捕获组。</span></li> + <li>如果未使用g标志，则仅返回第一个完整匹配及其相关的捕获组<span style="line-height: 1.572;">（<code>Array</code>）</span>。 在这种情况下，返回的项目将具有如下所述的其他属性。</li> +</ul> + +<h4 id="附加属性">附加属性</h4> + +<p>如上所述，匹配的结果包含如下所述的附加特性。</p> + +<ul> + <li><code>groups</code>: 一个捕获组数组 或 {{jsxref("undefined")}}（如果没有定义命名捕获组）。</li> + <li><code>index</code>: 匹配的结果的开始位置</li> + <li><code>input</code>: 搜索的字符串.</li> +</ul> + +<dl> + <dd>一个{{jsxref("Array")}}，其内容取决于global（<code>g</code>）标志的存在与否，如果未找到匹配则为{{jsxref("null")}}。</dd> +</dl> + +<h2 id="Description" name="Description">描述</h2> + +<p>如果正则表达式不包含 <code>g </code>标志，<code>str.match()</code> 将返回与 {{jsxref("RegExp.prototype.exec()", "RegExp.exec()")}}. 相同的结果。</p> + +<h3 id="Notes" name="Notes">参看：<code>RegExp</code> 方法</h3> + +<ul> + <li>如果你需要知道一个字符串是否与一个正则表达式匹配 {{jsxref("RegExp")}} ，可使用 {{jsxref("RegExp.prototype.test()", "RegExp.test()")}} 。</li> + <li>如果你只是需要第一个匹配结果，你也可以使用 {{jsxref("RegExp.prototype.exec()", "RegExp.exec()")}} 。</li> + <li>如果你想要获得捕获组，并且设置了全局标志，你需要用 {{jsxref("RegExp.prototype.exec()", "RegExp.exec()")}} 或者 {{jsxref("String.prototype.matchAll()", " String.prototype.matchAll()")}}</li> +</ul> + +<h2 id="Examples" name="Examples">示例</h2> + +<h3 id="Example_Using_match" name="Example:_Using_match">例子：使用 <code>match</code></h3> + +<p>在下例中，使用 <code>match</code> 查找 "<code>Chapter</code>" 紧跟着 1 个或多个数值字符，再紧跟着一个小数点和数值字符 0 次或多次。正则表达式包含 <code>i</code> 标志，因此大小写会被忽略。</p> + +<pre class="brush: js line-numbers language-js notranslate"><code class="language-js"><span class="keyword token">var</span> str <span class="operator token">=</span> <span class="string token">'For more information, see Chapter 3.4.5.1'</span><span class="punctuation token">;</span> +<span class="keyword token">var</span> re <span class="operator token">=</span> <span class="regex token">/see (chapter \d+(\.\d)*)/i</span><span class="punctuation token">;</span> +<span class="keyword token">var</span> found <span class="operator token">=</span> str<span class="punctuation token">.</span><span class="function token">match</span><span class="punctuation token">(</span>re<span class="punctuation token">)</span><span class="punctuation token">;</span> + +console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>found<span class="punctuation token">)</span><span class="punctuation token">;</span> + +<span class="comment token">// logs [ 'see Chapter 3.4.5.1',</span> +<span class="comment token">// 'Chapter 3.4.5.1',</span> +<span class="comment token">// '.1',</span> +<span class="comment token">// index: 22,</span> +<span class="comment token">// input: 'For more information, see Chapter 3.4.5.1' ]</span> + +<span class="comment token">// 'see Chapter 3.4.5.1' 是整个匹配。</span> +<span class="comment token">// 'Chapter 3.4.5.1' 被'(chapter \d+(\.\d)*)'捕获。</span> +<span class="comment token">// '.1' 是被'(\.\d)'捕获的最后一个值。</span> +<span class="comment token">// 'index' 属性(22) 是整个匹配从零开始的索引。</span> +<span class="comment token">// 'input' 属性是被解析的原始字符串。</span></code></pre> + +<h3 id="Example_Using_global_and_ignore_case_flags_with_match" name="Example:_Using_global_and_ignore_case_flags_with_match">例子：<code>match</code> 使用全局（global）和忽略大小写（ignore case）标志</h3> + +<p>下例展示了 <code>match</code> 使用 global 和 ignore case 标志。A-E、a-e 的所有字母将会作为一个数组的元素返回。</p> + +<pre class="brush: js line-numbers language-js notranslate"><code class="language-js"><span class="keyword token">var</span> str <span class="operator token">=</span> <span class="string token">'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz'</span><span class="punctuation token">;</span> +<span class="keyword token">var</span> regexp <span class="operator token">=</span> <span class="regex token">/[A-E]/gi</span><span class="punctuation token">;</span> +<span class="keyword token">var</span> matches_array <span class="operator token">=</span> str<span class="punctuation token">.</span><span class="function token">match</span><span class="punctuation token">(</span>regexp<span class="punctuation token">)</span><span class="punctuation token">;</span> + +console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>matches_array<span class="punctuation token">)</span><span class="punctuation token">;</span> +<span class="comment token">// ['A', 'B', 'C', 'D', 'E', 'a', 'b', 'c', 'd', 'e']</span></code></pre> + +<h3 id="使用match，不传参数"><code>使用match()，不传参数 </code></h3> + +<pre class="brush: js line-numbers language-js notranslate"><code class="language-js"><span class="keyword token">var</span> str <span class="operator token">=</span> <span class="string token">"Nothing will come of nothing."</span><span class="punctuation token">;</span> + +str<span class="punctuation token">.</span><span class="function token">match</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// returns [""]</span></code></pre> + +<h3 id="一个非正则表达式对象作为参数">一个非正则表达式对象作为参数</h3> + +<p>当参数是一个字符串或一个数字，它会使用new RegExp(obj)来隐式转换成一个 {{jsxref("RegExp")}}。如果它是一个有正号的正数，RegExp() 方法将忽略正号。</p> + +<pre class="brush: js line-numbers language-js notranslate"><code class="language-js"><span class="keyword token">var</span> str1 <span class="operator token">=</span> <span class="string token">"NaN means not a number. Infinity contains -Infinity and +Infinity in JavaScript."</span><span class="punctuation token">,</span> + str2 <span class="operator token">=</span> <span class="string token">"My grandfather is 65 years old and My grandmother is 63 years old."</span><span class="punctuation token">,</span> + str3 <span class="operator token">=</span> <span class="string token">"The contract was declared null and void."</span><span class="punctuation token">;</span> +str1<span class="punctuation token">.</span><span class="function token">match</span><span class="punctuation token">(</span><span class="string token">"number"</span><span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// "number" 是字符串。返回["number"]</span> +str1<span class="punctuation token">.</span><span class="function token">match</span><span class="punctuation token">(</span><span class="number token">NaN</span><span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// NaN的类型是number。返回["NaN"]</span> +str1<span class="punctuation token">.</span><span class="function token">match</span><span class="punctuation token">(</span><span class="number token">Infinity</span><span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// Infinity的类型是number。返回["Infinity"]</span> +str1<span class="punctuation token">.</span><span class="function token">match</span><span class="punctuation token">(</span><span class="operator token">+</span><span class="number token">Infinity</span><span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// 返回["Infinity"]</span> +str1<span class="punctuation token">.</span><span class="function token">match</span><span class="punctuation token">(</span><span class="operator token">-</span><span class="number token">Infinity</span><span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// 返回["-Infinity"]</span> +str2<span class="punctuation token">.</span><span class="function token">match</span><span class="punctuation token">(</span><span class="number token">65</span><span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// 返回["65"]</span> +str2<span class="punctuation token">.</span><span class="function token">match</span><span class="punctuation token">(</span><span class="operator token">+</span><span class="number token">65</span><span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// 有正号的number。返回["65"]</span> +str3<span class="punctuation token">.</span><span class="function token">match</span><span class="punctuation token">(</span><span class="keyword token">null</span><span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// 返回["null"]</span></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>{{SpecName('ES3')}}</td> + <td>{{Spec2('ES3')}}</td> + <td>Initial definition. Implemented in JavaScript 1.2.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.5.4.10', 'String.prototype.match')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-string.prototype.match', 'String.prototype.match')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.match', 'String.prototype.match')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{ CompatibilityTable() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="Firefox_特殊注意">Firefox 特殊注意</h2> + +<ul> + <li>从Gecko 27 {{geckoRelease(27)}}开始，此方法遵守ECMAScript 规范。当使用全局正则表达式调用 <code>match()时，</code>{{jsxref("RegExp.lastIndex")}} 属性(如果指定)会重置为 <code>0</code> ({{bug(501739)}})。</li> + <li>从 Gecko 39 {{geckoRelease(39)}}开始，不赞成使用非标准的标志参数，并抛出一个控制台警告({{bug(1142351)}})。</li> + <li>从 Gecko 47 {{geckoRelease(47)}} 开始 ， non-release builds不再支持非标准的标志参数，并且将完全移除({{bug(1245801)}})。</li> + <li>从 Gecko 49 {{geckoRelease(49)}} 开始 ， 不再支持非标准的标志参数 ({{bug(1108382)}}).</li> +</ul> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("RegExp")}}</li> + <li>{{jsxref("RegExp.prototype.exec()")}}</li> + <li>{{jsxref("RegExp.prototype.test()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/string/matchall/index.html b/files/zh-cn/web/javascript/reference/global_objects/string/matchall/index.html new file mode 100644 index 0000000000..5fd54c46aa --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/string/matchall/index.html @@ -0,0 +1,135 @@ +--- +title: String.prototype.matchAll() +slug: Web/JavaScript/Reference/Global_Objects/String/matchAll +tags: + - JavaScript + - Method + - Prototype + - Reference + - Regular Expressions + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/matchAll +--- +<div>{{JSRef}}</div> + +<p><strong><code>matchAll()</code></strong> 方法返回一个包含所有匹配正则表达式的结果及分组捕获组的迭代器。</p> + +<div>{{EmbedInteractiveExample("pages/js/string-matchall.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox notranslate"><var>str</var>.matchAll(<var>regexp</var>)</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>regexp</code></dt> +</dl> + +<p> 正则表达式对象。如果所传参数不是一个正则表达式对象，则会隐式地使用 <code>new RegExp(obj)</code> 将其转换为一个 <a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/RegExp" title="此页面仍未被本地化, 期待您的翻译!"><code>RegExp</code></a> 。</p> + +<p> <code>RegExp</code>必须是设置了全局模式<code>g</code>的形式，否则会抛出异常<code>TypeError</code>。</p> + +<h3 id="返回值">返回值</h3> + +<p>一个迭代器（不可重用，结果耗尽需要再次调用方法，获取一个新的迭代器）。</p> + +<h2 id="例子">例子</h2> + +<h3 id="Regexp.exec_和_matchAll">Regexp.exec() 和 matchAll()</h3> + +<p>在 <code>matchAll</code> 出现之前，通过在循环中调用 <code>regexp.exec()</code> 来获取所有匹配项信息（regexp 需使用 <code>/g</code> 标志）：</p> + +<pre class="brush: js notranslate">const regexp = RegExp('foo[a-z]*','g'); +const str = 'table football, foosball'; +let match; + +while ((match = regexp.exec(str)) !== null) { + console.log(`Found ${match[0]} start=${match.index} end=${regexp.lastIndex}.`); + // expected output: "Found football start=6 end=14." + // expected output: "Found foosball start=16 end=24." +}</pre> + +<p>如果使用 <code>matchAll</code> ，就可以不必使用 while 循环加 exec 方式（且正则表达式需使用 <code>/g</code> 标志）。使用 <code>matchAll</code> 会得到一个迭代器的返回值，配合 <code><a href="/en-US/docs/Web/JavaScript/Reference/Statements/for...of">for...of</a></code>, <a href="/en-US/docs/Web/JavaScript/Reference/Operators/Spread_syntax">array spread</a>, 或者 {{jsxref("Array.from()")}} 可以更方便实现功能：</p> + +<pre class="brush: js notranslate">const regexp = RegExp('foo[a-z]*','g'); +const str = 'table football, foosball'; +const matches = str.matchAll(regexp); + +for (const match of matches) { + console.log(`Found ${match[0]} start=${match.index} end=${match.index + match[0].length}.`); +} +// expected output: "Found football start=6 end=14." +// expected output: "Found foosball start=16 end=24." + +// matches iterator is exhausted after the for..of iteration +// Call matchAll again to create a new iterator +Array.from(str.matchAll(regexp), m => m[0]); +// Array [ "football", "foosball" ]</pre> + +<p>如果没有 <code>/g</code> 标志，<code>matchAll</code> 会抛出异常。</p> + +<pre class="brush: js notranslate">const regexp = RegExp('[a-c]',''); +const str = 'abc'; +Array.from(str.matchAll(regexp), m => m[0]); +// TypeError: String.prototype.matchAll called with a non-global RegExp argument</pre> + +<p><code>matchAll</code> 内部做了一个 regexp 的复制，所以不像 <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp/exec">regexp.exec</a>, <code>lastIndex</code> 在字符串扫描时不会改变。</p> + +<pre class="brush: js notranslate">const regexp = RegExp('[a-c]','g'); +regexp.lastIndex = 1; +const str = 'abc'; +Array.from(str.matchAll(regexp), m => `${regexp.lastIndex} ${m[0]}`); +// Array [ "1 b", "1 c" ] +</pre> + +<h3 id="捕获组的更佳途径">捕获组的更佳途径</h3> + +<p><code>matchAll</code> 的另外一个亮点是更好地获取捕获组。因为当使用 <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/match">match()</a></code> 和 <code>/g</code> 标志方式获取匹配信息时，捕获组会被忽略：</p> + +<pre class="brush: js notranslate">var regexp = /t(e)(st(\d?))/g; +var str = 'test1test2'; + +str.match(regexp); +// Array ['test1', 'test2']</pre> + +<p>使用 <code>matchAll</code> 可以通过如下方式获取分组捕获:</p> + +<pre class="brush: js notranslate">let array = [...str.matchAll(regexp)]; + +array[0]; +// ['test1', 'e', 'st1', '1', index: 0, input: 'test1test2', length: 4] +array[1]; +// ['test2', 'e', 'st2', '2', index: 5, input: 'test1test2', length: 4] +</pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.matchall', 'String.prototype.matchAll')}}</td> + <td>{{Spec2('ESDraft')}}</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p class="hidden">The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.String.matchAll")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("RegExp")}}</li> + <li>{{jsxref("RegExp.prototype.exec()")}}</li> + <li>{{jsxref("RegExp.prototype.test()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/string/normalize/index.html b/files/zh-cn/web/javascript/reference/global_objects/string/normalize/index.html new file mode 100644 index 0000000000..3a054a9172 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/string/normalize/index.html @@ -0,0 +1,231 @@ +--- +title: String.prototype.normalize() +slug: Web/JavaScript/Reference/Global_Objects/String/normalize +tags: + - ECMAScript 2015 + - JavaScript + - Method + - String + - Unicode + - 参考 + - 字符串 + - 方法 +translation_of: Web/JavaScript/Reference/Global_Objects/String/normalize +--- +<p>{{JSRef}}</p> + +<p><strong>normalize()</strong> 方法会按照指定的一种 Unicode 正规形式将当前字符串正规化。（如果该值不是字符串，则首先将其转换为一个字符串）。</p> + +<div>{{EmbedInteractiveExample("pages/js/string-normalize.html", "taller")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><var>str</var>.normalize([<var>form</var>])</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code><var>form</var></code> {{optional_inline}}</dt> + <dd> + <p>四种 Unicode 正规形式（Unicode Normalization Form）<code>"NFC"</code>、<code>"NFD"</code>、<code>"NFKC"</code>，或 <code>"NFKD"</code> 其中的一个, 默认值为 <code>"NFC"</code>。</p> + + <p>这四个值的含义分别如下：</p> + + <dl> + <dt><code>"NFC"</code></dt> + <dd>Canonical Decomposition, followed by Canonical Composition.</dd> + <dt><code>"NFD"</code></dt> + <dd>Canonical Decomposition.</dd> + <dt><code>"NFKC"</code></dt> + <dd>Compatibility Decomposition, followed by Canonical Composition.</dd> + <dt><code>"NFKD"</code></dt> + <dd>Compatibility Decomposition.</dd> + </dl> + </dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>含有给定字符串的 Unicode 规范化形式的字符串。</p> + +<h3 id="可能出现的异常">可能出现的异常</h3> + +<dl> + <dt>{{jsxref("RangeError")}}</dt> + <dd>如果给 <code>form</code> 传入了上述四个字符串以外的参数，则会抛出 <span><code>RangeError</code> 异常。</span></dd> +</dl> + +<h2 id="描述">描述</h2> + +<p>Unicode assigns a unique numerical value, called a <em>code point</em>, to each character. For example, the code point for <code>"A"</code> is given as U+0041. However, sometimes more than one code point, or sequence of code points, can represent the same abstract character — the character <code>"ñ"</code> for example can be represented by either of:</p> + +<ul> + <li>The single code point U+00F1.</li> + <li>The code point for <code>"n"</code> (U+006E) followed by the code point for the combining tilde (U+0303).</li> +</ul> + +<pre class="brush: js">let string1 = '\u00F1'; +let string2 = '\u006E\u0303'; + +console.log(string1); // ñ +console.log(string2); // ñ +</pre> + +<p>However, since the code points are different, string comparison will not treat them as equal. And since the number of code points in each version is different, they even have different lengths.</p> + +<pre class="brush: js">let string1 = '\u00F1'; // ñ +let string2 = '\u006E\u0303'; // ñ + +console.log(string1 === string2); // false +console.log(string1.length); // 1 +console.log(string2.length); // 2 +</pre> + +<p>The <code>normalize()</code> method helps solve this problem by converting a string into a normalized form common for all sequences of code points that represent the same characters. There are two main normalization forms, one based on <strong>canonical equivalence</strong> and the other based on <strong>compatibility</strong>.</p> + +<h3 id="Canonical_equivalence_normalization">Canonical equivalence normalization</h3> + +<p>In Unicode, two sequences of code points have canonical equivalence if they represent the same abstract characters, and should always have the same visual appearance and behavior (for example, they should always be sorted in the same way).</p> + +<p>You can use <code>normalize()</code> using the <code>"NFD"</code> or <code>"NFC"</code> arguments to produce a form of the string that will be the same for all canonically equivalent strings. In the example below we normalize two representations of the character <code>"ñ"</code>:</p> + +<pre class="brush: js">let string1 = '\u00F1'; // ñ +let string2 = '\u006E\u0303'; // ñ + +string1 = string1.normalize('NFD'); +string2 = string2.normalize('NFD'); + +console.log(string1 === string2); // true +console.log(string1.length); // 2 +console.log(string2.length); // 2 +</pre> + +<h4 id="Composed_and_decomposed_forms">Composed and decomposed forms</h4> + +<p>Note that the length of the normalized form under <code>"NFD"</code> is <code>2</code>. That's because <code>"NFD"</code> gives you the <strong>decomposed</strong> version of the canonical form, in which single code points are split into multiple combining ones. The decomposed canonical form for <code>"ñ"</code> is <code>"\u006E\u0303"</code>.</p> + +<p>You can specify <code>"NFC"</code> to get the <strong>composed</strong> canonical form, in which multiple code points are replaced with single code points where possible. The composed canonical form for <code>"ñ"</code> is <code>"\u00F1"</code>:</p> + +<pre class="brush: js">let string1 = '\u00F1'; // ñ +let string2 = '\u006E\u0303'; // ñ + +string1 = string1.normalize('NFC'); +string2 = string2.normalize('NFC'); + +console.log(string1 === string2); // true +console.log(string1.length); // 1 +console.log(string2.length); // 1 +console.log(string2.codePointAt(0).toString(16)); // f1</pre> + +<h3 id="Compatibility_normalization">Compatibility normalization</h3> + +<p>In Unicode, two sequences of code points are compatible if they represent the same abstract characters, and should be treated alike in some — but not necessarily all — applications.</p> + +<p>All canonically equivalent sequences are also compatible, but not vice versa.</p> + +<p>For example, the code point U+FB00 represents the <a href="/en-US/docs/Glossary/Ligature">ligature</a> <code>"ff"</code>. It is compatible with two consecutive U+0066 code points (<code>"ff"</code>).</p> + +<p>In some respects (such as sorting) they should be treated as equivalent—and in some (such as visual appearance) they should not, so they are not canonically equivalent.</p> + +<p>You can use <code>normalize()</code> using the <code>"NFKD"</code> or <code>"NFKC"</code> arguments to produce a form of the string that will be the same for all compatible strings:</p> + +<pre class="brush: js">let string1 = '\uFB00'; +let string2 = '\u0066\u0066'; + +console.log(string1); // ff +console.log(string2); // ff +console.log(string1 === string2); // false +console.log(string1.length); // 1 +console.log(string2.length); // 2 + +string1 = string1.normalize('NFKD'); +string2 = string2.normalize('NFKD'); + +console.log(string1); // ff <- visual appearance changed +console.log(string2); // ff +console.log(string1 === string2); // true +console.log(string1.length); // 2 +console.log(string2.length); // 2 +</pre> + +<p>When applying compatibility normalization it's important to consider what you intend to do with the strings, since the normalized form may not be appropriate for all applications. In the example above the normalization is appropriate for search, because it enables a user to find the string by searching for <code>"f"</code>. But it may not be appropriate for display, because the visual representation is different.</p> + +<p>As with canonical normalization, you can ask for decomposed or composed compatible forms by passing <code>"NFKD"</code> or <code>"NFKC"</code>, respectively.</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用_normalize">使用 <code>normalize()</code></h3> + +<pre class="brush:js;">// Initial string + +// U+1E9B: LATIN SMALL LETTER LONG S WITH DOT ABOVE +// U+0323: COMBINING DOT BELOW +var str = "\u1E9B\u0323"; + + +// Canonically-composed form (NFC) + +// U+1E9B: LATIN SMALL LETTER LONG S WITH DOT ABOVE +// U+0323: COMBINING DOT BELOW +str.normalize("NFC"); // "\u1E9B\u0323" +str.normalize(); // same as above + + +// Canonically-decomposed form (NFD) + +// U+017F: LATIN SMALL LETTER LONG S +// U+0323: COMBINING DOT BELOW +// U+0307: COMBINING DOT ABOVE +str.normalize("NFD"); // "\u017F\u0323\u0307" + + +// Compatibly-composed (NFKC) + +// U+1E69: LATIN SMALL LETTER S WITH DOT BELOW AND DOT ABOVE +str.normalize("NFKC"); // "\u1E69" + + +// Compatibly-decomposed (NFKD) + +// U+0073: LATIN SMALL LETTER S +// U+0323: COMBINING DOT BELOW +// U+0307: COMBINING DOT ABOVE +str.normalize("NFKD"); // "\u0073\u0323\u0307" +</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>{{SpecName('ESDraft', '#sec-string.prototype.normalize', 'String.prototype.normalize')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES2015', '#sec-string.prototype.normalize', 'String.prototype.normalize')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>Initial definition.</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.String.normalize")}}</p> + +<h2 id="参见">参见</h2> + +<ul> + <li><a href="http://www.unicode.org/reports/tr15/">Unicode Standard Annex #15, Unicode Normalizatoin Forms</a></li> + <li><a href="http://zh.wikipedia.org/zh-cn/Unicode%E7%AD%89%E5%83%B9%E6%80%A7">Unicode 等价性</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/string/padend/index.html b/files/zh-cn/web/javascript/reference/global_objects/string/padend/index.html new file mode 100644 index 0000000000..4b06856b03 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/string/padend/index.html @@ -0,0 +1,100 @@ +--- +title: String.prototype.padEnd() +slug: Web/JavaScript/Reference/Global_Objects/String/padEnd +tags: + - JavaScript + - Method + - Reference + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/padEnd +--- +<div>{{JSRef}}</div> + +<p><strong><code>padEnd()</code></strong> 方法会用一个字符串填充当前字符串（如果需要的话则重复填充），返回填充后达到指定长度的字符串。从当前字符串的末尾（右侧）开始填充。</p> + +<div>{{EmbedInteractiveExample("pages/js/string-padend.html")}}</div> + +<div class="hidden">The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> and send us a pull request.</div> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox notranslate"><var>str</var>.padEnd(<var>targetLength</var> [, <var>padString</var>])</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>targetLength</code></dt> + <dd>当前字符串需要填充到的目标长度。如果这个数值小于当前字符串的长度，则返回当前字符串本身。</dd> + <dt><code>padString</code> {{optional_inline}}</dt> + <dd>填充字符串。如果字符串太长，使填充后的字符串长度超过了目标长度，则只保留最左侧的部分，其他部分会被截断。此参数的缺省值为 " "（U+0020）。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>在原字符串末尾填充指定的填充字符串直到目标长度所形成的新字符串。</p> + +<h2 id="示例">示例</h2> + +<pre class="brush: js notranslate">'abc'.padEnd(10); // "abc " +'abc'.padEnd(10, "foo"); // "abcfoofoof" +'abc'.padEnd(6, "123456"); // "abc123" +'abc'.padEnd(1); // "abc" +</pre> + +<h2 id="Polyfill">Polyfill</h2> + +<p>如果原生环境不支持该方法，在其他代码之前先运行下面的代码，将创建 <code>String.prototype.padEnd()</code> 方法。</p> + +<pre class="brush: js notranslate">// https://github.com/uxitten/polyfill/blob/master/string.polyfill.js +// https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/padEnd +if (!String.prototype.padEnd) { + String.prototype.padEnd = function padEnd(targetLength,padString) { + targetLength = targetLength>>0; //floor if number or convert non-number to 0; + padString = String((typeof padString !== 'undefined' ? padString: '')); + if (this.length > targetLength) { + return String(this); + } + else { + targetLength = targetLength-this.length; + if (targetLength > padString.length) { + padString += padString.repeat(targetLength/padString.length); //append to original to ensure we are longer than needed + } + return String(this) + padString.slice(0,targetLength); + } + }; +} +</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('ESDraft', '#sec-string.prototype.padend', 'String.prototype.padEnd')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td>在 ECMAScript 2017 中首次被定义。</td> + </tr> + <tr> + <td>{{SpecName('ES8', '#sec-string.prototype.padend', 'String.prototype.padEnd')}}</td> + <td>{{Spec2('ES8')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.String.padEnd")}}</p> + +<h2 id="另请参阅">另请参阅</h2> + +<ul> + <li>{{jsxref("String.prototype.padStart()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/string/padstart/index.html b/files/zh-cn/web/javascript/reference/global_objects/string/padstart/index.html new file mode 100644 index 0000000000..24431715d0 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/string/padstart/index.html @@ -0,0 +1,102 @@ +--- +title: String.prototype.padStart() +slug: Web/JavaScript/Reference/Global_Objects/String/padStart +tags: + - ECMAScript 2017 + - JavaScript + - Method + - Reference + - String + - String.padStart() +translation_of: Web/JavaScript/Reference/Global_Objects/String/padStart +--- +<div>{{JSRef}}</div> + +<p><strong><code>padStart()</code></strong> 方法用另一个字符串填充当前字符串(如果需要的话，会重复多次)，以便产生的字符串达到给定的长度。从当前字符串的左侧开始填充。</p> + +<div>{{EmbedInteractiveExample("pages/js/string-padstart.html")}}</div> + +<div class="hidden">The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> and send us a pull request.</div> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox notranslate"><var>str</var>.padStart(<var>targetLength</var> [, <var>padString</var>])</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>targetLength</code></dt> + <dd>当前字符串需要填充到的目标长度。如果这个数值小于当前字符串的长度，则返回当前字符串本身。</dd> + <dt><code>padString</code> {{optional_inline}}</dt> + <dd>填充字符串。如果字符串太长，使填充后的字符串长度超过了目标长度，则只保留最左侧的部分，其他部分会被截断。此参数的默认值为 " "（U+0020）。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>在原字符串开头填充指定的填充字符串直到目标长度所形成的新字符串。</p> + +<h2 id="示例">示例</h2> + +<pre class="brush: js line-numbers language-js notranslate"><code class="language-js">'abc'.padStart(10); // " abc" +'abc'.padStart(10, "foo"); // "foofoofabc" +'abc'.padStart(6,"123465"); // "123abc" +'abc'.padStart(8, "0"); // "00000abc" +'abc'.padStart(1); // "abc"</code></pre> + +<h2 id="Polyfill">Polyfill</h2> + +<p>如果原生环境不支持该方法，在其他代码之前先运行下面的代码，将创建 <code>String.prototype.padStart()</code> 方法。</p> + +<pre class="brush: js line-numbers language-js notranslate"><code class="language-js">// https://github.com/uxitten/polyfill/blob/master/string.polyfill.js +// https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/padStart +if (!String.prototype.padStart) { + String.prototype.padStart = function padStart(targetLength,padString) { + targetLength = targetLength>>0; //floor if number or convert non-number to 0; + padString = String((typeof padString !== 'undefined' ? padString : ' ')); + if (this.length > targetLength) { + return String(this); + } + else { + targetLength = targetLength-this.length; + if (targetLength > padString.length) { + padString += padString.repeat(targetLength/padString.length); //append to original to ensure we are longer than needed + } + return padString.slice(0,targetLength) + String(this); + } + }; +}</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>{{SpecName('ESDraft', '#sec-string.prototype.padstart', 'String.prototype.padStart')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td>在 ECMAScript 2017 中首次被定义。</td> + </tr> + <tr> + <td>{{SpecName('ES8', '#sec-string.prototype.padstart', 'String.prototype.padStart')}}</td> + <td>{{Spec2('ES8')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.String.padStart")}}</p> + +<h2 id="另请参阅">另请参阅</h2> + +<ul> + <li>{{jsxref("String.prototype.padEnd()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/string/prototype/index.html b/files/zh-cn/web/javascript/reference/global_objects/string/prototype/index.html new file mode 100644 index 0000000000..88b792052b --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/string/prototype/index.html @@ -0,0 +1,186 @@ +--- +title: String.prototype +slug: Web/JavaScript/Reference/Global_Objects/String/prototype +tags: + - JavaScript + - 原型 + - 参考 + - 字符串 + - 属性 +translation_of: Web/JavaScript/Reference/Global_Objects/String +--- +<div>{{JSRef}}</div> + +<p> <code><strong>String.prototype</strong></code> 属性表示 {{jsxref("String")}}原型对象。</p> + +<div>{{js_property_attributes(0,0,0)}}</div> + +<h2 id="Description" name="Description">描述</h2> + +<p>所有 {{jsxref("String")}} 的实例都继承自 <code>String.prototype</code>. 任何String.prototype上的改变都会影响到所有的 {{jsxref("String")}} <code>实例。</code></p> + +<h2 id="Properties" name="Properties">属性</h2> + +<dl> + <dt><code>String.prototype.constructor</code></dt> + <dd>用于创造对象的原型对象的特定的函数。</dd> + <dt>{{jsxref("String.prototype.length")}}</dt> + <dd>返回了字符串的长度。</dd> + <dt><em>N</em></dt> + <dd>用于访问第N个位置的字符，其中N是小于 {{jsxref("String.length", "length")}} 和 0之间的正整数。这些属性都是“只读”性质，不能编辑。</dd> +</dl> + +<h2 id="Methods" name="Methods">方法</h2> + +<h3 id="Methods_unrelated_to_HTML" name="Methods_unrelated_to_HTML">跟HTML无关的方法</h3> + +<dl> + <dt>{{jsxref("String.prototype.charAt()")}}</dt> + <dd>返回特定位置的字符。</dd> + <dt>{{jsxref("String.prototype.charCodeAt()")}}</dt> + <dd>返回表示给定索引的字符的Unicode的值。</dd> + <dt>{{jsxref("String.prototype.codePointAt()")}}</dt> + <dd>返回使用UTF-16编码的给定位置的值的非负整数。</dd> + <dt>{{jsxref("String.prototype.concat()")}}</dt> + <dd>连接两个字符串文本，并返回一个新的字符串。</dd> + <dt>{{jsxref("String.prototype.includes()")}}</dt> + <dd>判断一个字符串里是否包含其他字符串。</dd> + <dt>{{jsxref("String.prototype.endsWith()")}}</dt> + <dd>判断一个字符串的是否以给定字符串结尾，结果返回布尔值。</dd> + <dt>{{jsxref("String.prototype.indexOf()")}}</dt> + <dd>从字符串对象中返回首个被发现的给定值的索引值，如果没有找到则返回-1。</dd> + <dt>{{jsxref("String.prototype.lastIndexOf()")}}</dt> + <dd>从字符串对象中返回最后一个被发现的给定值的索引值，如果没有找到则返回-1。</dd> + <dt>{{jsxref("String.prototype.localeCompare()")}}</dt> + <dd>返回一个数字表示是否引用字符串在排序中位于比较字符串的前面，后面，或者二者相同。</dd> + <dt>{{jsxref("String.prototype.match()")}}</dt> + <dd>使用正则表达式与字符串相比较。</dd> + <dt>{{jsxref("String.prototype.normalize()")}}</dt> + <dd>返回调用字符串值的Unicode标准化形式。</dd> + <dt>{{jsxref("String.prototype.padEnd()")}}</dt> + <dd>在当前字符串尾部填充指定的字符串， 直到达到指定的长度。 返回一个新的字符串。</dd> + <dt>{{jsxref("String.prototype.padStart()")}}</dt> + <dd> + <p>在当前字符串头部填充指定的字符串， 直到达到指定的长度。 返回一个新的字符串。</p> + </dd> + <dt>{{jsxref("String.prototype.quote()")}} {{ obsolete_inline }}</dt> + <dd>设置嵌入引用的引号类型。</dd> + <dt>{{jsxref("String.prototype.repeat()")}}</dt> + <dd>返回指定重复次数的由元素组成的字符串对象。</dd> + <dt>{{jsxref("String.prototype.replace()")}}</dt> + <dd>被用来在正则表达式和字符串直接比较，然后用新的子串来替换被匹配的子串。</dd> + <dt>{{jsxref("String.prototype.search()")}}</dt> + <dd>对正则表达式和指定字符串进行匹配搜索，返回第一个出现的匹配项的下标。</dd> + <dt>{{jsxref("String.prototype.slice()")}}</dt> + <dd>摘取一个字符串区域，返回一个新的字符串。</dd> + <dt>{{jsxref("String.prototype.split()")}}</dt> + <dd>通过分离字符串成字串，将字符串对象分割成字符串数组。</dd> + <dt>{{jsxref("String.prototype.startsWith()")}}</dt> + <dd>判断字符串的起始位置是否匹配其他字符串中的字符。</dd> + <dt>{{jsxref("String.prototype.substr()")}}</dt> + <dd>通过指定字符数返回在指定位置开始的字符串中的字符。</dd> + <dt>{{jsxref("String.prototype.substring()")}}</dt> + <dd>返回在字符串中指定两个下标之间的字符。</dd> + <dt>{{jsxref("String.prototype.toLocaleLowerCase()")}}</dt> + <dd>根据当前区域设置，将符串中的字符转换成小写。对于大多数语言来说，{{jsxref("String.toLowerCase", "toLowerCase")}}的返回值是一致的。</dd> + <dt>{{jsxref("String.prototype.toLocaleUpperCase()")}}</dt> + <dd>根据当前区域设置，将字符串中的字符转换成大写，对于大多数语言来说，{{jsxref("String.toUpperCase", "toUpperCase")}}的返回值是一致的。</dd> + <dt>{{jsxref("String.prototype.toLowerCase()")}}</dt> + <dd>将字符串转换成小写并返回。</dd> + <dt>{{jsxref("String.prototype.toSource()")}} {{ Non-standard_inline() }}</dt> + <dd>返回一个对象文字代表着特定的对象。你可以使用这个返回值来创建新的对象。重写 {{jsxref("Object.prototype.toSource")}} 方法。</dd> + <dt>{{jsxref("String.prototype.toString()")}}</dt> + <dd>返回用字符串表示的特定对象。重写 {{jsxref("Object.prototype.toString")}} 方法。</dd> + <dt>{{jsxref("String.prototype.toUpperCase()")}}</dt> + <dd>将字符串转换成大写并返回。</dd> + <dt>{{jsxref("String.prototype.trim()")}}</dt> + <dd>从字符串的开始和结尾去除空格。参照部分 ECMAScript 5 标准。</dd> + <dt>{{jsxref("String.prototype.trimStart()")}}</dt> + <dt>{{jsxref("String.prototype.trimLeft()")}} {{ Non-standard_inline() }}</dt> + <dd>从字符串的左侧去除空格。</dd> + <dt>{{jsxref("String.prototype.trimEnd()")}}</dt> + <dt>{{jsxref("String.prototype.trimRight()")}} {{ Non-standard_inline() }}</dt> + <dd>从字符串的右侧去除空格。</dd> + <dt>{{jsxref("String.prototype.valueOf()")}}</dt> + <dd>返回特定对象的原始值。重写 {{jsxref("Object.prototype.valueOf")}} 方法。</dd> + <dt>{{jsxref("String.prototype.@@iterator()", "String.prototype[@@iterator]()")}}</dt> + <dd>返回一个新的迭代器对象，该对象遍历字符串值的索引位置，将每个索引值作为字符串值返回。</dd> +</dl> + +<h3 id="HTML_wrapper_methods" name="HTML_wrapper_methods">HTML wrapper methods</h3> + +<p>下面的方法被限制使用，因为只对可用的HTML标签和属性提供部分支持。</p> + +<dl> + <dt>{{jsxref("String.prototype.anchor()")}}</dt> + <dd><code><a href="https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/a#attr-name"><a name="name"></a></code> (hypertext target)</dd> + <dt>{{jsxref("String.prototype.big()")}} {{deprecated_inline}}</dt> + <dd>{{HTMLElement("big")}}</dd> + <dt>{{jsxref("String.prototype.blink()")}} {{deprecated_inline}}</dt> + <dd>{{HTMLElement("blink")}}</dd> + <dt>{{jsxref("String.prototype.bold()")}} {{deprecated_inline}}</dt> + <dd>{{HTMLElement("b")}}</dd> + <dt>{{jsxref("String.prototype.fixed()")}} {{deprecated_inline}}</dt> + <dd>{{HTMLElement("tt")}}</dd> + <dt>{{jsxref("String.prototype.fontcolor()")}} {{deprecated_inline}}</dt> + <dd><a href="https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/font#attr-color"><code><font color="<em>color</em>"></code></a></dd> + <dt>{{jsxref("String.prototype.fontsize()")}} {{deprecated_inline}}</dt> + <dd><a href="https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/font#attr-size"><code><font size="<em>size</em>"></code></a></dd> + <dt>{{jsxref("String.prototype.italics()")}} {{deprecated_inline}}</dt> + <dd>{{HTMLElement("i")}}</dd> + <dt>{{jsxref("String.prototype.link()")}}</dt> + <dd><a class="external" href="https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/a#attr-href"><code><a href="<em>url</em>"></code></a> (link to URL)</dd> + <dt>{{jsxref("String.prototype.small()")}} {{deprecated_inline}}</dt> + <dd>{{HTMLElement("small")}}</dd> + <dt>{{jsxref("String.prototype.strike()")}} {{deprecated_inline}}</dt> + <dd>{{HTMLElement("strike")}}</dd> + <dt>{{jsxref("String.prototype.sub()")}} {{deprecated_inline}}</dt> + <dd>{{HTMLElement("sub")}}</dd> + <dt>{{jsxref("String.prototype.sup()")}} {{deprecated_inline}}</dt> + <dd>{{HTMLElement("sup")}}</dd> +</dl> + +<h2 id="Specifications">Specifications</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范</th> + <th scope="col">状态</th> + <th scope="col">备注</th> + </tr> + <tr> + <td>ECMAScript 1st Edition.</td> + <td>Standard</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.5.3.1', 'String.prototype')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-string.prototype', 'String.prototype')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype', 'String.prototype')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.String.prototype")}}</p> + +<h2 id="更多">更多</h2> + +<ul> + <li>{{jsxref("Global_Objects/String", "String")}}</li> + <li>{{jsxref("Function.prototype")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/string/quote/index.html b/files/zh-cn/web/javascript/reference/global_objects/string/quote/index.html new file mode 100644 index 0000000000..3d8d197f46 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/string/quote/index.html @@ -0,0 +1,116 @@ +--- +title: String.prototype.quote() +slug: Web/JavaScript/Reference/Global_Objects/String/quote +tags: + - JavaScript + - Method + - Non-standard + - Obsolete + - Prototype + - String +translation_of: Archive/Web/JavaScript/String.quote +--- +<div>{{obsolete_header("37")}}</div> + +<div>{{JSRef("Global_Objects", "String")}}{{Non-standard_header}}</div> + +<h2 id="Summary" name="Summary">概述</h2> + +<p>将字符串中包含的特殊字符进行转义(反斜杠),然后在字符串两边各加上一个双引号(<code>"</code>)并返回,并不修改原字符串.</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code><em>str</em>.quote()</code></pre> + +<h2 id="Examples" name="Examples">示例</h2> + +<table class="fullwidth-table"> + <thead> + <tr> + <th class="header" scope="col"><code>str</code></th> + <th class="header" scope="col"><code>str.quote()</code></th> + <th class="header" scope="col"><code><a href="/zh-CN/docs/JavaScript/Reference/Global_Objects/eval" title="JavaScript/Reference/Global_Objects/eval">eval</a>(str.quote())</code></th> + </tr> + </thead> + <tbody> + <tr> + <td><code>Hello world!</code></td> + <td><code>"Hello world!"</code></td> + <td><code>Hello world!</code></td> + </tr> + <tr> + <td><code>Hello<br> + world!</code></td> + <td><code>"Hello\n\tworld!"</code></td> + <td><code>Hello<br> + world!</code></td> + </tr> + <tr> + <td><code>" \ — '</code></td> + <td><code>"\" \\ \u2014 '"</code></td> + <td><code>" \ — '</code></td> + </tr> + </tbody> +</table> + +<h2 id="Specifications" name="Specifications">规范</h2> + +<p>不在任何规范中。实现于 JavaScript 1.3.</p> + +<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>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</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>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li><code><a href="/zh-CN/docs/JavaScript/Reference/Global_Objects/JSON/stringify" title="JavaScript/Reference/Global_Objects/JSON/stringify">JSON.stringify</a></code></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/string/raw/index.html b/files/zh-cn/web/javascript/reference/global_objects/string/raw/index.html new file mode 100644 index 0000000000..89c4d568d5 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/string/raw/index.html @@ -0,0 +1,113 @@ +--- +title: String.raw() +slug: Web/JavaScript/Reference/Global_Objects/String/raw +tags: + - JavaScript + - Method + - Reference + - String + - 参考 + - 字符串 + - 方法 +translation_of: Web/JavaScript/Reference/Global_Objects/String/raw +--- +<div>{{JSRef()}}</div> + +<p><strong>String.raw()</strong> 是一个<a href="/zh-CN/docs/Web/JavaScript/Reference/template_strings">模板字符串</a>的标签函数，它的作用类似于 Python 中的字符串前缀 <code>r</code> 和 C# 中的字符串前缀 <code>@</code>（还是有点区别的，详见隔壁 Chromium 那边的<a href="https://bugs.chromium.org/p/v8/issues/detail?id=5016">这个 issue</a>），是用来获取一个模板字符串的原始字符串的，比如说，占位符（例如 <code>${foo}</code>）会被处理为它所代表的其他字符串，而转义字符（例如 <code>\n</code>）不会。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code>String.raw(<var>callSite</var>, <var>...substitutions</var>) + +String.raw`templateString` +</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>callSite</code></dt> + <dd>一个模板字符串的“调用点对象”。类似<code>{ raw: ['foo', 'bar', 'baz'] }</code>。</dd> + <dt><code>...substitutions</code></dt> + <dd>任意个可选的参数，表示任意个内插表达式对应的值。</dd> + <dt><code>templateString</code></dt> + <dd>模板字符串，可包含占位符（<code>${...}</code>）。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>给定模板字符串的原始字符串。</p> + +<h3 id="异常">异常</h3> + +<dl> + <dt><code>{{jsxref("TypeError")}}</code></dt> + <dd>如果第一个参数没有传入一个格式正确的对象，则会抛出 <code>TypeError</code> 异常。</dd> +</dl> + +<h2 id="描述">描述</h2> + +<p>在大多数情况下, <code>String.raw()</code>是用来处理模版字符串的. 不要被上面复杂的参数要求吓到，因为像所有的 <a href="/en-US/docs/Web/JavaScript/Reference/template_strings#Tagged_template_literals">tag functions</a>一样，你通常不需要把它看成一个普通函数，你只需要把它放在模板字符串前面就可以了，而不是在它后面加个括号和一堆参数来调用它，引擎会替你去调用它。</p> + +<p><code>String.raw()</code> 是唯一一个内置的模板字符串标签函数，因为它太常用了。不过它并没有什么特殊能力，你自己也可以实现一个和它功能一模一样的标签函数。</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用_String.raw">使用 <code>String.raw()</code></h3> + +<pre class="brush: js">String.raw`Hi\n${2+3}!`; +// 'Hi\n5!'，Hi 后面的字符不是换行符，\ 和 n 是两个不同的字符 + +String.raw `Hi\u000A!`; +// "Hi\u000A!"，同上，这里得到的会是 \、u、0、0、0、A 6个字符， +// 任何类型的转义形式都会失效，保留原样输出，不信你试试.length + +let name = "Bob"; +String.raw `Hi\n${name}!`; +// "Hi\nBob!"，内插表达式还可以正常运行 + + +// 正常情况下，你也许不需要将 String.raw() 当作函数调用。 +// 但是为了模拟 `t${0}e${1}s${2}t` 你可以这样做: +String.raw({ raw: 'test' }, 0, 1, 2); // 't0e1s2t' +// 注意这个测试, 传入一个 string, 和一个类似数组的对象 +// 下面这个函数和 `foo${2 + 3}bar${'Java' + 'Script'}baz` 是相等的. +String.raw({ + raw: ['foo', 'bar', 'baz'] +}, 2 + 3, 'Java' + 'Script'); // 'foo5barJavaScriptbaz' +</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>{{SpecName('ES2015', '#sec-string.raw', 'String.raw')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.raw', 'String.raw')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.String.raw")}}</p> + +<h2 id="参见">参见</h2> + +<ul> + <li><a href="/zh-CN/docs/Web/JavaScript/Reference/template_strings">模板字符串</a></li> + <li>{{jsxref("String")}}</li> + <li><a href="/zh-CN/docs/Web/JavaScript/Reference/Lexical_grammar">JavaScript 词法</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/string/repeat/index.html b/files/zh-cn/web/javascript/reference/global_objects/string/repeat/index.html new file mode 100644 index 0000000000..ce35065f1a --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/string/repeat/index.html @@ -0,0 +1,124 @@ +--- +title: String.prototype.repeat() +slug: Web/JavaScript/Reference/Global_Objects/String/repeat +tags: + - ECMAScript 2015 + - ES 6 + - JavaScript + - Method + - Prototype + - Reference + - String + - polyfill + - repeat() + - 填充 +translation_of: Web/JavaScript/Reference/Global_Objects/String/repeat +--- +<p>{{JSRef}}</p> + +<p><strong><code>repeat()</code></strong> 构造并返回一个新字符串，该字符串包含被连接在一起的指定数量的字符串的副本。</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox notranslate"><code><var>str</var>.repeat(<var>count</var>)</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>count</code></dt> + <dd>介于 <code>0</code> 和 {{jsxref("Global_Objects/Number/POSITIVE_INFINITY", "+Infinity")}} 之间的整数。表示在新构造的字符串中重复了多少遍原字符串。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p> 包含指定字符串的指定数量副本的新字符串。</p> + +<h3 id="Exceptions">Exceptions</h3> + +<ul> + <li>{{jsxref("Errors/Negative_repetition_count", "RangeError")}}: 重复次数不能为负数。</li> + <li>{{jsxref("Errors/Resulting_string_too_large", "RangeError")}}: 重复次数必须小于 infinity，且长度不会大于最长的字符串。</li> +</ul> + +<h2 id="兼容补丁Polyfill">兼容补丁(Polyfill)</h2> + +<p>此方法已添加到 ECMAScript 2015 规范中，并且可能尚未在所有 JavaScript 实现中可用。然而，你可以使用以下代码段对 String.prototype.repeat() 进行填充：</p> + +<pre class="brush: js language-js notranslate"><code class="language-js"><span class="keyword token">if</span> <span class="punctuation token">(</span><span class="operator token">!</span>String<span class="punctuation token">.</span>prototype<span class="punctuation token">.</span>repeat<span class="punctuation token">)</span> <span class="punctuation token">{</span> + String<span class="punctuation token">.</span>prototype<span class="punctuation token">.</span>repeat <span class="operator token">=</span> <span class="keyword token">function</span><span class="punctuation token">(</span>count<span class="punctuation token">)</span> <span class="punctuation token">{</span> + <span class="string token">'use strict'</span><span class="punctuation token">;</span> + <span class="keyword token">if</span> <span class="punctuation token">(</span><span class="keyword token">this</span> <span class="operator token">==</span> <span class="keyword token">null</span><span class="punctuation token">)</span> <span class="punctuation token">{</span> + <span class="keyword token">throw</span> <span class="keyword token">new</span> <span class="class-name token">TypeError</span><span class="punctuation token">(</span><span class="string token">'can\'t convert '</span> <span class="operator token">+</span> <span class="keyword token">this</span> <span class="operator token">+</span> <span class="string token">' to object'</span><span class="punctuation token">)</span><span class="punctuation token">;</span> + <span class="punctuation token">}</span> + <span class="keyword token">var</span> str <span class="operator token">=</span> <span class="string token">''</span> <span class="operator token">+</span> <span class="keyword token">this</span><span class="punctuation token">;</span> + count <span class="operator token">=</span> <span class="operator token">+</span>count<span class="punctuation token">;</span> + <span class="keyword token">if</span> <span class="punctuation token">(</span>count <span class="operator token">!</span><span class="operator token">=</span> count<span class="punctuation token">)</span> <span class="punctuation token">{</span> + count <span class="operator token">=</span> <span class="number token">0</span><span class="punctuation token">;</span> + <span class="punctuation token">}</span> + <span class="keyword token">if</span> <span class="punctuation token">(</span>count <span class="operator token"><</span> <span class="number token">0</span><span class="punctuation token">)</span> <span class="punctuation token">{</span> + <span class="keyword token">throw</span> <span class="keyword token">new</span> <span class="class-name token">RangeError</span><span class="punctuation token">(</span><span class="string token">'repeat count must be non-negative'</span><span class="punctuation token">)</span><span class="punctuation token">;</span> + <span class="punctuation token">}</span> + <span class="keyword token">if</span> <span class="punctuation token">(</span>count <span class="operator token">==</span> <span class="number token">Infinity</span><span class="punctuation token">)</span> <span class="punctuation token">{</span> + <span class="keyword token">throw</span> <span class="keyword token">new</span> <span class="class-name token">RangeError</span><span class="punctuation token">(</span><span class="string token">'repeat count must be less than infinity'</span><span class="punctuation token">)</span><span class="punctuation token">;</span> + <span class="punctuation token">}</span> + count <span class="operator token">=</span> Math<span class="punctuation token">.</span><span class="function token">floor<span class="punctuation token">(</span></span>count<span class="punctuation token">)</span><span class="punctuation token">;</span> + <span class="keyword token">if</span> <span class="punctuation token">(</span>str<span class="punctuation token">.</span>length <span class="operator token">==</span> <span class="number token">0</span> <span class="operator token">||</span> count <span class="operator token">==</span> <span class="number token">0</span><span class="punctuation token">)</span> <span class="punctuation token">{</span> + <span class="keyword token">return</span> <span class="string token">''</span><span class="punctuation token">;</span> + <span class="punctuation token">}</span> + <span class="comment token"> // 确保 count 是一个 31 位的整数。这样我们就可以使用如下优化的算法。 + // 当前（2014年8月），绝大多数浏览器都不能支持 1 << 28 长的字符串，所以：</span><span class="comment token"> +</span> <span class="keyword token">if</span> <span class="punctuation token">(</span>str<span class="punctuation token">.</span>length <span class="operator token">*</span> count <span class="operator token">>=</span> <span class="number token">1</span> <span class="operator token"><</span><span class="operator token"><</span> <span class="number token">28</span><span class="punctuation token">)</span> <span class="punctuation token">{</span> + <span class="keyword token">throw</span> <span class="keyword token">new</span> <span class="class-name token">RangeError</span><span class="punctuation token">(</span><span class="string token">'repeat count must not overflow maximum string size'</span><span class="punctuation token">)</span><span class="punctuation token">;</span> + <span class="punctuation token">}</span> + <span class="keyword token">var</span> rpt <span class="operator token">=</span> <span class="string token">''</span><span class="punctuation token">;</span> + <span class="keyword token">for</span> <span class="punctuation token">(</span><span class="punctuation token">;</span><span class="punctuation token">;</span><span class="punctuation token">)</span> <span class="punctuation token">{</span> + <span class="keyword token">if</span> <span class="punctuation token">(</span><span class="punctuation token">(</span>count <span class="operator token">&</span> <span class="number token">1</span><span class="punctuation token">)</span> <span class="operator token">==</span> <span class="number token">1</span><span class="punctuation token">)</span> <span class="punctuation token">{</span> + rpt <span class="operator token">+</span><span class="operator token">=</span> str<span class="punctuation token">;</span> + <span class="punctuation token">}</span> + count <span class="operator token">></span><span class="operator token">></span><span class="operator token">>=</span> <span class="number token">1</span><span class="punctuation token">;</span> + <span class="keyword token">if</span> <span class="punctuation token">(</span>count <span class="operator token">==</span> <span class="number token">0</span><span class="punctuation token">)</span> <span class="punctuation token">{</span> + <span class="keyword token">break</span><span class="punctuation token">;</span> + <span class="punctuation token">}</span> + str <span class="operator token">+</span><span class="operator token">=</span> str<span class="punctuation token">;</span> + <span class="punctuation token">}</span> + <span class="keyword token">return</span> rpt<span class="punctuation token">;</span> + <span class="punctuation token">}</span> +<span class="punctuation token">}</span></code></pre> + + +<h2 id="Examples" name="Examples">示例</h2> + +<pre class="brush:js notranslate"><span class="difflineplus">"abc".repeat(-1) // </span>RangeError: repeat count must be positive and less than inifinity +<span class="difflineplus">"abc".repeat(0) // ""</span> +<span class="difflineplus">"abc".repeat(1) // "abc"</span> +<span class="difflineplus">"abc".repeat(2) // "</span>abcabc<span class="difflineplus">" +</span>"abc".repeat(3.5)<span class="difflineplus"> // "abcabcabc" 参数count将会被自动转换成整数. +</span><span class="difflineplus">"abc".repeat(1/0) //</span> RangeError: repeat count must be positive and less than inifinity + +<span class="difflineplus">({toString : () => "abc", repeat : String.prototype.repeat}</span><span class="difflineplus">).repeat(2) +</span><span class="difflineplus">//"</span>abcabc<span class="difflineplus">",repeat是一个通用方法</span>,也就是它的调用者可以不是一个字符串对象.</pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">规范</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.repeat', 'String.prototype.repeat')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">浏览器兼容性</h2> + +<p>{{Compat("javascript.builtins.String.repeat")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("String.prototype.concat()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/string/replace/index.html b/files/zh-cn/web/javascript/reference/global_objects/string/replace/index.html new file mode 100644 index 0000000000..c4d8f758cb --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/string/replace/index.html @@ -0,0 +1,317 @@ +--- +title: String.prototype.replace() +slug: Web/JavaScript/Reference/Global_Objects/String/replace +tags: + - JavaScript + - Method + - Prototype + - Regular + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/replace +--- +<div>{{JSRef}}</div> + +<p><strong><code>replace()</code></strong> 方法返回一个由替换值（<code>replacement</code>）替换部分或所有的模式（<code>pattern</code>）匹配项后的新字符串。模式可以是一个字符串或者一个<a href="/zh-CN/docs/Web/JavaScript/Reference/RegExp">正则表达式</a>，替换值可以是一个字符串或者一个每次匹配都要调用的回调函数。<strong>如果<code>pattern</code>是字符串，则仅替换第一个匹配项。</strong></p> + +<p>原字符串不会改变。</p> + +<div>{{EmbedInteractiveExample("pages/js/string-replace.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox notranslate"><code><var>str</var>.replace(<var>regexp</var>|<var>substr</var>, <var>newSubStr</var>|<var>function</var>)</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>regexp </code>(pattern)</dt> + <dd>一个{{jsxref("RegExp")}} 对象或者其字面量。该正则所匹配的内容会被第二个参数的返回值替换掉。</dd> +</dl> + +<dl> + <dt><code>substr </code>(pattern)</dt> + <dd>一个将被 <code>newSubStr</code> 替换的 {{jsxref("String","字符串")}}。其被视为一整个字符串，而不是一个正则表达式。仅第一个匹配项会被替换。</dd> +</dl> + +<dl> + <dt><code>newSubStr</code> (replacement)</dt> + <dd>用于替换掉第一个参数在原字符串中的匹配部分的{{jsxref("String", "字符串")}}。该字符串中可以内插一些特殊的变量名。参考下面的<a href="#使用字符串作为参数">使用字符串作为参数</a>。</dd> +</dl> + +<dl> + <dt><code>function</code> (replacement)</dt> + <dd>一个用来创建新子字符串的函数，该函数的返回值将替换掉第一个参数匹配到的结果。参考下面的<a href="#指定一个函数作为参数">指定一个函数作为参数</a>。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>一个部分或全部匹配由替代模式所取代的新的字符串。</p> + +<h2 id="描述">描述</h2> + +<p>该方法并不改变调用它的字符串本身，而只是返回一个新的替换后的字符串。</p> + +<p>在进行全局的搜索替换时，正则表达式需包含 <code>g</code> 标志。</p> + +<h3 id="使用字符串作为参数">使用字符串作为参数</h3> + +<p>替换字符串可以插入下面的特殊变量名：</p> + +<table class="fullwidth-table"> + <tbody> + <tr> + <td class="header">变量名</td> + <td class="header">代表的值</td> + </tr> + <tr> + <td><code>$$</code></td> + <td>插入一个 "$"。</td> + </tr> + <tr> + <td><code>$&</code></td> + <td>插入匹配的子串。</td> + </tr> + <tr> + <td><code>$`</code></td> + <td>插入当前匹配的子串左边的内容。</td> + </tr> + <tr> + <td><code>$'</code></td> + <td>插入当前匹配的子串右边的内容。</td> + </tr> + <tr> + <td style="white-space: nowrap;"><code>$<em>n</em></code></td> + <td> + <p>假如第一个参数是 {{jsxref("RegExp")}}对象，并且 n 是个小于100的非负整数，那么插入第 n 个括号匹配的字符串。提示：索引是从1开始。如果不存在第 n个分组，那么将会把匹配到到内容替换为字面量。比如不存在第3个分组，就会用“$3”替换匹配到的内容。</p> + </td> + </tr> + <tr> + <td style="white-space: nowrap;"><code><em>$<Name></em></code></td> + <td> 这里<em><code>Name</code></em> 是一个分组名称。如果在正则表达式中并不存在分组（或者没有匹配），这个变量将被处理为空字符串。只有在支持命名分组捕获的浏览器中才能使用。</td> + </tr> + </tbody> +</table> + +<h3 id="指定一个函数作为参数">指定一个函数作为参数</h3> + +<p>你可以指定一个函数作为第二个参数。在这种情况下，当匹配执行后，该函数就会执行。 函数的返回值作为替换字符串。 (注意：上面提到的特殊替换参数在这里不能被使用。) 另外要注意的是，如果第一个参数是正则表达式，并且其为全局匹配模式，那么这个方法将被多次调用，每次匹配都会被调用。</p> + +<p>下面是该函数的参数：</p> + +<table class="fullwidth-table"> + <tbody> + <tr> + <td class="header">变量名</td> + <td class="header">代表的值</td> + </tr> + <tr> + <td><code>match</code></td> + <td>匹配的子串。（对应于上述的$&。）</td> + </tr> + <tr> + <td><code>p1,p2, ...</code></td> + <td> + <p>假如replace()方法的第一个参数是一个{{jsxref("RegExp")}} 对象，则代表第n个括号匹配的字符串。（对应于上述的$1，$2等。）例如，如果是用 <code>/(\a+)(\b+)/</code> 这个来匹配，<code>p1</code> 就是匹配的 <code>\a+</code>，<code>p2</code> 就是匹配的 <code>\b+</code>。</p> + </td> + </tr> + <tr> + <td><code>offset</code></td> + <td> + <p>匹配到的子字符串在原字符串中的偏移量。（比如，如果原字符串是 <code>'abcd'</code>，匹配到的子字符串是 <code>'bc'</code>，那么这个参数将会是 1）</p> + </td> + </tr> + <tr> + <td><code>string</code></td> + <td>被匹配的原字符串。</td> + </tr> + <tr> + <td>NamedCaptureGroup</td> + <td>命名捕获组匹配的对象</td> + </tr> + </tbody> +</table> + +<p>(精确的参数个数依赖于 <code>replace()</code> 的第一个参数是否是一个正则表达式（{{jsxref("RegExp")}}）对象，以及这个正则表达式中指定了多少个括号子串，如果这个正则表达式里使用了命名捕获， 还会添加一个命名捕获的对象)</p> + +<p>下面的例子将会使 <code>newString</code> 变成 <code>'abc - 12345 - #$*%'</code>：</p> + +<pre class="brush: js notranslate">function replacer(match, p1, p2, p3, offset, string) { + // p1 is nondigits, p2 digits, and p3 non-alphanumerics + return [p1, p2, p3].join(' - '); +} +var newString = 'abc12345#$*%'.replace(/([^\d]*)(\d*)([^\w]*)/, replacer); +console.log(newString); // abc - 12345 - #$*% +</pre> + +<h2 id="Examples" name="Examples">示例</h2> + +<h3 id="在_replace_中使用正则表达式">在 <code>replace()</code> 中使用正则表达式</h3> + +<p>在下面的例子中，<code>replace()</code> 中使用了正则表达式及忽略大小写标示。</p> + +<pre class="brush: js notranslate">var str = 'Twas the night before Xmas...'; +var newstr = str.replace(/xmas/i, 'Christmas'); +console.log(newstr); // Twas the night before Christmas... +</pre> + +<h3 id="在_replace_中使用_global_和_ignore_选项">在 <code>replace()</code> 中使用 <code>global</code> 和 <code>ignore</code> 选项</h3> + +<p>下面的例子中,正则表达式包含有全局替换(g)和忽略大小写(i)的选项,这使得replace方法用'oranges'替换掉了所有出现的"apples".</p> + +<pre class="brush: js notranslate">var re = /apples/gi; +var str = "Apples are round, and apples are juicy."; +var newstr = str.replace(re, "oranges"); + +// oranges are round, and oranges are juicy. +console.log(newstr); +</pre> + +<h3 id="交换字符串中的两个单词">交换字符串中的两个单词</h3> + +<p>下面的例子演示了如何交换一个字符串中两个单词的位置，这个脚本使用$1 和 $2 代替替换文本。</p> + +<pre class="brush: js notranslate">var re = /(\w+)\s(\w+)/; +var str = "John Smith"; +var newstr = str.replace(re, "$2, $1"); +// Smith, John +console.log(newstr); +</pre> + +<h3 id="使用行内函数来修改匹配到的字符。">使用行内函数来修改匹配到的字符。</h3> + +<p>在这个例子中，所有出现的大写字母转换为小写，并且在匹配位置前加一个连字符。重要的是，在返回一个替换了的字符串前，在匹配元素前进行添加操作是必要的。</p> + +<p>在返回前，替换函数允许匹配片段作为参数，并且将它和连字符进行连接作为新的片段。</p> + +<pre class="brush: js notranslate">function styleHyphenFormat(propertyName) { + function upperToHyphenLower(match) { + return '-' + match.toLowerCase(); + } + return propertyName.replace(/[A-Z]/g, upperToHyphenLower); +} +</pre> + +<p>运行 <code>styleHyphenFormat('borderTop')</code><code>，</code><span>将</span><span>返回 'border-top'。</span></p> + +<p>因为我们想在最终的替换中进一步转变匹配结果，所以我们必须使用一个函数。这迫使我们在使用{{jsxref("String.prototype.toLowerCase()", "toLowerCase()")}}方法前进行评估。如果我们尝试不用一个函数进行匹配，那么使用{{jsxref("String.prototype.toLowerCase()", "toLowerCase()")}} 方法将不会有效。</p> + +<pre class="brush: js notranslate">var newString = propertyName.replace(/[A-Z]/g, '-' + '$&'.toLowerCase()); // won't work +</pre> + +<p>这是因为 <code>'$&'.toLowerCase()</code> 会先被解析成字符串字面量（这会导致相同的'$&')而不是当作一个模式。</p> + +<h3 id="将华氏温度转换为对等的摄氏温度">将华氏温度转换为对等的摄氏温度</h3> + +<p>下面的例子演示如何将华氏温度转换为对等的摄氏温度。华氏温度用一个数字加一个"F"来表示，这个函数将返回一个数字加"C"来表示的摄氏温度。例如，如果输入是 212F，这个函数将返回 100C。如果输入的数字是 0F，这个方法将返回 "-17.77777777777778C"。</p> + +<p>正则表达式test检查任何数字是否以 F 结尾。华氏温度通过第二个参数p1进入函数。这个函数基于华氏温度作为字符串传递给f2c函数设置成摄氏温度。然后f2c()返回摄氏温度。这个函数与Perl的 s///e 标志相似。</p> + +<pre class="brush: js notranslate">function f2c(x) +{ + function convert(str, p1, offset, s) + { + return ((p1-32) * 5/9) + "C"; + } + var s = String(x); + var test = /(\d+(?:\.\d*)?)F\b/g; + return s.replace(test, convert); +} +</pre> + +<h3 id="使用行内函数和正则来避免循环">使用行内函数和正则来避免循环</h3> + +<p>下例把某种模式的字符串转换为一个对象数组（其元素为对象）。</p> + +<p><strong>输入：</strong><br> + 一个由 x，- 和 _ 组成的字符串。</p> + +<pre class="notranslate">x-x_ + +---x---x---x--- + +-xxx-xx-x- + +_x_x___x___x___ +</pre> + +<p><strong>输出：</strong></p> + +<p>一个数组对象。'x' 产生一个 'on' 状态，'-'（连接符）产生一个 'off' 状态，而 '_' （下划线）表示 'on' 状态的长度。</p> + +<pre class="brush: js notranslate">[ + { on: true, length: 1 }, + { on: false, length: 1 }, + { on: true, length: 2 } + ... +]</pre> + +<p>代码片段：</p> + +<pre class="brush: js notranslate">var str = 'x-x_'; +var retArr = []; +str.replace(/(x_*)|(-)/g, function(match, p1, p2) { + if (p1) { retArr.push({ on: true, length: p1.length }); } + if (p2) { retArr.push({ on: false, length: 1 }); } +}); + +console.log(retArr);</pre> + +<p>该代码片段生成了一个数组，包含三个期望格式的对象，避免了使用 for 循环语句。</p> + +<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('ES3')}}</td> + <td>{{Spec2('ES3')}}</td> + <td>Initial definition. Implemented in JavaScript 1.2.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.5.4.11', 'String.prototype.replace')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-string.prototype.replace', 'String.prototype.replace')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.replace', 'String.prototype.replace')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.String.replace")}}</p> + +<h3 id="Firefox_备注">Firefox 备注</h3> + +<ul> + <li><code>flags</code> 是一个仅在 Gecko 中可用的非标准的第三方参数：<code><var>str</var>.replace(<var>regexp</var>|<var>substr</var>, <var>newSubStr</var>|<var>function, flags</var>)</code></li> + <li>从 Gecko 27 {{geckoRelease(27)}} 开始，这个方法就被整合到了ECMAScript规范中。当 replace() 被使用全局 g 标志的正则表达式调用时，{{jsxref("RegExp.lastIndex")}} 属性将被重置为 0（{{bug(501739)}}）。</li> + <li>从 Gecko 39 {{geckoRelease(39)}} 开始，<code>flags</code> 参数便被弃用，且在调用时会抛出一个控制台警告（{{bug(1142351)}}）。</li> + <li>从 Gecko 47 {{geckoRelease(47)}} 开始，在非发行版本中已不再支持非标准的 <code>flags</code> 参数，并且不久后会完全移除该参数（{{bug(1245801)}}）。</li> + <li>从 Gecko 49 {{geckoRelease(49)}} 开始，不再支持非标准的 <code>flags</code> 参数（{{bug(1108382)}}）。</li> +</ul> + +<h2 id="参见">参见</h2> + +<ul> + <li>{{jsxref("String.prototype.match()")}}</li> + <li>{{jsxref("RegExp.prototype.exec()")}}</li> + <li>{{jsxref("RegExp.prototype.test()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/string/replaceall/index.html b/files/zh-cn/web/javascript/reference/global_objects/string/replaceall/index.html new file mode 100644 index 0000000000..b79277e488 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/string/replaceall/index.html @@ -0,0 +1,171 @@ +--- +title: String.prototype.replaceAll() +slug: Web/JavaScript/Reference/Global_Objects/String/replaceAll +tags: + - global flag / g + - replace + - replaceAll +translation_of: Web/JavaScript/Reference/Global_Objects/String/replaceAll +--- +<div>{{JSRef}}</div> + +<p><span class="seoSummary"><strong><code>replaceAll()</code></strong> 方法返回一个新字符串，新字符串所有满足 <code>pattern</code> 的部分都已被<code>replacement</code> 替换。</span><span class="seoSummary"><code>pattern</code></span>可以是一个字符串或一个 {{jsxref("RegExp")}}， <code>replacement</code>可以是一个字符串或一个在每次匹配被调用的函数。</p> + +<p>原始字符串保持不变。</p> + +<div>{{EmbedInteractiveExample("pages/js/string-replaceall.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox notranslate">const newStr = <var>str</var>.replaceAll(<var>regexp</var>|<var>substr</var>, <var>newSubstr</var>|<var>function</var>)</pre> + +<div class="blockIndicator note"> +<p>当使用一个 `regex`时，您必须设置全局（“ g”）标志，<br> + 否则，它将引发 <code>TypeError</code>：“必须使用全局 RegExp 调用 replaceAll”。</p> +</div> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code><var>regexp</var></code> (pattern)</dt> + <dd>A {{jsxref("RegExp")}} object or literal with the global flag. The matches are replaced with <code><var>newSubstr</var></code> or the value returned by the specified <code><var>function</var></code>. A RegExp without the global ("g") flag will throw a <code>TypeError</code>: "replaceAll must be called with a global RegExp".</dd> + <dt><code><var>substr</var></code></dt> + <dd>A {{jsxref("String")}} that is to be replaced by <code><var>newSubstr</var></code>. It is treated as a literal string and is <em>not</em> interpreted as a regular expression.</dd> + <dt><code><var>newSubstr</var></code> (replacement)</dt> + <dd>The {{jsxref("String")}} that replaces the substring specified by the specified <code><var>regexp</var></code> or <code><var>substr</var></code> parameter. A number of special replacement patterns are supported; see the "<a href="#Specifying_a_string_as_a_parameter">Specifying a string as a parameter</a>" section below.</dd> + <dt><code><var>function</var></code> (replacement)</dt> + <dd>A function to be invoked to create the new substring to be used to replace the matches to the given <code><var>regexp</var></code> or <code><var>substr</var></code>. The arguments supplied to this function are described in the "<a href="#Specifying_a_function_as_a_parameter">Specifying a function as a parameter</a>" section below.</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>A new string, with all matches of a pattern replaced by a replacement.</p> + +<h2 id="描述">描述</h2> + +<p>此方法不会更改调用 {{jsxref("String")}} 对象。它只是返回一个新字符串。</p> + +<h3 id="将一个字符串作为一个参数">将一个字符串作为一个参数</h3> + +<p>The replacement string can include the following special replacement patterns:</p> + +<table class="standard-table"> + <thead> + <tr> + <th class="header" scope="col">Pattern</th> + <th class="header" scope="col">Inserts</th> + </tr> + </thead> + <tbody> + <tr> + <td><code>$$</code></td> + <td>Inserts a <code>"$"</code>.</td> + </tr> + <tr> + <td><code>$&</code></td> + <td>Inserts the matched substring.</td> + </tr> + <tr> + <td><code>$`</code></td> + <td>Inserts the portion of the string that precedes the matched substring.</td> + </tr> + <tr> + <td><code>$'</code></td> + <td>Inserts the portion of the string that follows the matched substring.</td> + </tr> + <tr> + <td><code>$<var>n</var></code></td> + <td>Where <code><var>n</var></code> is a positive integer less than 100, inserts the <code><var>n</var></code>th parenthesized submatch string, provided the first argument was a {{jsxref("RegExp")}} object. Note that this is <code>1</code>-indexed.</td> + </tr> + </tbody> +</table> + +<h3 id="将一个函数指定为一个参数">将一个函数指定为一个参数</h3> + +<p>你可以指定一个函数作为第二个参数，在这种情况下，函数只有在匹配发生之后才会被调用。The function's result (return value) will be used as the replacement string. (<strong>Note:</strong> The above-mentioned special replacement patterns do <em>not</em> apply in this case.)</p> + +<p>Note that the function will be invoked multiple times for each full match to be replaced if the regular expression in the first parameter is global.</p> + +<p>The arguments to the function are as follows:</p> + +<table class="standard-table"> + <thead> + <tr> + <th class="header" scope="col">Possible name</th> + <th class="header" scope="col">Supplied value</th> + </tr> + </thead> + <tbody> + <tr> + <td><code>match</code></td> + <td>The matched substring. (Corresponds to <code>$&</code> above.)</td> + </tr> + <tr> + <td><code>p1, p2, ...</code></td> + <td>The <var>n</var>th string found by a parenthesized capture group, provided the first argument to <code>replace()</code> was a {{jsxref("RegExp")}} object. (Corresponds to <code>$1</code>, <code>$2</code>, etc. above.) For example, if <code>/(\a+)(\b+)/</code>, was given, <code>p1</code> is the match for <code>\a+</code>, and <code>p2</code> for <code>\b+</code>.</td> + </tr> + <tr> + <td><code>offset</code></td> + <td>The offset of the matched substring within the whole string being examined. (For example, if the whole string was <code>'abcd'</code>, and the matched substring was <code>'bc'</code>, then this argument will be <code>1</code>.)</td> + </tr> + <tr> + <td><code>string</code></td> + <td>The whole string being examined.</td> + </tr> + </tbody> +</table> + +<p>(The exact number of arguments depends on whether the first argument is a {{jsxref("RegExp")}} object—and, if so, how many parenthesized submatches it specifies.)</p> + +<h2 id="例子">例子</h2> + +<h3 id="使用_replaceAll">使用 replaceAll</h3> + +<pre class="brush: js notranslate">'aabbcc'.replaceAll('b', '.'); +// 'aa..cc'</pre> + +<h3 id="非全局_regex_抛出">非全局 regex 抛出</h3> + +<p>使用正则表达式搜索值时，它必须是全局的。这将行不通：</p> + +<pre class="brush: js; example-bad notranslate">'aabbcc'.replaceAll(/b/, '.'); +TypeError: replaceAll must be called with a global RegExp +</pre> + +<p>这将可以正常运行:</p> + +<pre class="brush: js; example-good notranslate">'aabbcc'.replaceAll(/b/g, '.'); +"aa..cc" +</pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Specification</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.replaceall', 'String.prototype.replaceAll')}}</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.String.replaceAll")}}</p> + +<h2 id="了解更多">了解更多</h2> + +<ul> + <li>{{jsxref("String.prototype.replace", "String.prototype.replace()")}}</li> + <li>{{jsxref("String.prototype.match", "String.prototype.match()")}}</li> + <li>{{jsxref("RegExp.prototype.exec", "RegExp.prototype.exec()")}}</li> + <li>{{jsxref("RegExp.prototype.test", "RegExp.prototype.test()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/string/search/index.html b/files/zh-cn/web/javascript/reference/global_objects/string/search/index.html new file mode 100644 index 0000000000..66ab981508 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/string/search/index.html @@ -0,0 +1,87 @@ +--- +title: String.prototype.search() +slug: Web/JavaScript/Reference/Global_Objects/String/search +tags: + - JavaScript + - 原型 + - 参考 + - 字符串 + - 方法 + - 正则表达式 +translation_of: Web/JavaScript/Reference/Global_Objects/String/search +--- +<div>{{JSRef}}</div> + +<p><strong><code>search()</code></strong> 方法执行正则表达式和 {{jsxref("String")}} 对象之间的一个搜索匹配。</p> + +<div>{{EmbedInteractiveExample("pages/js/string-search.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox notranslate"><var>str</var>.search(<var>regexp</var>)</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>regexp</code></dt> + <dd>一个{{jsxref("RegExp", "正则表达式（regular expression）")}}对象</dd> + <dd>如果传入一个非正则表达式对象 <code>regexp</code>，则会使用 <code>new RegExp(regexp)</code> 隐式地将其转换为正则表达式对象。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>如果匹配成功，则 <code>search()</code> 返回正则表达式在字符串中首次匹配项的索引;否则，返回 <code>-1</code>。</p> + +<h2 id="描述">描述</h2> + +<p>当你想要知道字符串中是否存在某个模式（pattern）时可使用 <code>search()</code>，类似于正则表达式的 {{jsxref("RegExp.test", "test()")}} 方法。当要了解更多匹配信息时，可使用 {{jsxref("String.match", "match()")}}（但会更慢一些），该方法类似于正则表达式的 {{jsxref("RegExp.exec", "exec()")}} 方法。</p> + +<h2 id="示例">示例</h2> + +<h3 id="例子：使用_search">例子：使用 <code>search()</code></h3> + +<p>下面的例子中用两个不同的正则表达式对同一个字符串执行搜索匹配，得到一个成功匹配（正数返回值）和一个失败匹配（-1）。</p> + +<pre class="brush: js notranslate">var str = "hey JudE"; +var re = /[A-Z]/g; +var re2 = /[.]/g; +console.log(str.search(re)); // returns 4, which is the index of the first capital letter "J" +console.log(str.search(re2)); // returns -1 cannot find '.' dot punctuation</pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Specification</th> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.search', 'String.prototype.search')}}</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.String.search")}}</p> + +<h2 id="Gecko_注意事项">Gecko 注意事项</h2> + +<ul> + <li>在 {{Gecko("8.0")}} 及之前的版本，<code>search()</code> 的实现有问题：在调用该方法时，若不传递参数或者参数为 {{jsxref("undefined")}}，该方法将不会匹配空字符串，而是匹配字符串 "undefined"。这个问题已被修复，现在，<code>"a".search()</code> 和 <code>"a".search(undefined)</code> 都能正确返回 0。</li> + <li>Starting with Gecko 39 {{geckoRelease(39)}}, the non-standard <code>flags</code> argument is deprecated and throws a console warning ({{bug(1142351)}}).</li> + <li>Starting with Gecko 47 {{geckoRelease(47)}}, the non-standard <code>flags</code> argument is no longer supported in non-release builds and will soon be removed entirely ({{bug(1245801)}}).</li> + <li>Starting with Gecko 49 {{geckoRelease(49)}}, the non-standard <code>flags</code> argument is no longer supported ({{bug(1108382)}}).</li> +</ul> + +<h2 id="参见">参见</h2> + +<ul> +<li><a href="/zh-CN/docs/Web/JavaScript/Guide/Regular_Expressions">在 JavaScript 中使用正则表达式</a></li> + <li>{{jsxref("String.prototype.match()")}}</li> + <li>{{jsxref("RegExp.prototype.exec()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/string/slice/index.html b/files/zh-cn/web/javascript/reference/global_objects/string/slice/index.html new file mode 100644 index 0000000000..df8f398983 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/string/slice/index.html @@ -0,0 +1,122 @@ +--- +title: String.prototype.slice() +slug: Web/JavaScript/Reference/Global_Objects/String/slice +tags: + - JavaScript + - Method + - Prototype + - String + - 原型 + - 字符串 + - 方法 +translation_of: Web/JavaScript/Reference/Global_Objects/String/slice +--- +<div>{{JSRef}}</div> + +<p><strong><code>slice()</code></strong> 方法提取某个字符串的一部分，并返回一个新的字符串，且不会改动原字符串。</p> + +<div>{{EmbedInteractiveExample("pages/js/string-slice.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>str</var>.slice(<var>beginIndex</var>[, <var>endIndex</var>])</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>beginIndex</code></dt> + <dd>从该索引（以 0 为基数）处开始提取原字符串中的字符。如果值为负数，会被当做 <code>strLength + beginIndex</code> 看待，这里的<code>strLength</code> 是字符串的长度（例如， 如果 <code>beginIndex</code> 是 -3 则看作是：<code>strLength - 3</code>）</dd> + <dt><code>endIndex</code></dt> + <dd>可选。在该索引（以 0 为基数）处结束提取字符串。如果省略该参数，<code style="font-style: normal;">slice()</code> 会一直提取到字符串末尾。<span style="line-height: 1.5;">如果该参数为负数，则被看作是 strLength + endIndex，这里的 strLength 就是字符串的长度(例如，如果 endIndex 是 -3，则是, strLength - 3)。</span></dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>返回一个从原字符串中提取出来的新字符串</p> + +<h2 id="描述">描述</h2> + +<p><code>slice()</code> 从一个字符串中提取字符串并返回新字符串。在一个字符串中的改变不会影响另一个字符串。也就是说，<code>slice</code> 不会修改原字符串（只会返回一个包含了原字符串中部分字符的新字符串）。</p> + +<p><code>slice()</code> 提取的新字符串包括<code>beginIndex</code>但不包括 <code>endIndex</code>。下面有两个例子。</p> + +<p>例 1：<code>str.slice(1, 4)</code> 提取第二个字符到第四个字符（被提取字符的索引值（index）依次为 1、2，和 3）。</p> + +<p>例 2：<code>str.slice(2, -1)</code> 提取第三个字符到倒数第一个字符。</p> + +<h2 id="Examples" name="Examples" style="margin-bottom: 20px; font-size: 2.14285714285714rem;">例子</h2> + +<h3 id="使用_slice()_创建一个新的字符串">使用 <code>slice()</code> 创建一个新的字符串</h3> + +<p>下面例子使用 <code>slice()</code> 创建了一个新字符串。</p> + +<pre class="brush: js">var str1 = 'The morning is upon us.', // str1 的长度 length 是 23。 + str2 = str1.slice(1, 8), + str3 = str1.slice(4, -2), + str4 = str1.slice(12), + str5 = str1.slice(30); +console.log(str2); // 输出：he morn +console.log(str3); // 输出：morning is upon u +console.log(str4); // 输出：is upon us. +console.log(str5); // 输出："" +</pre> + +<h3 id="给_slice()_传入负值索引">给 <code>slice()</code> 传入负值索引</h3> + +<p>下面的例子在使用 <code>slice()</code> 时传入了负值作为索引。</p> + +<pre class="brush: js">var str = 'The morning is upon us.'; +str.slice(-3); // 返回 'us.' +str.slice(-3, -1); // 返回 'us' +str.slice(0, -1); // 返回 'The morning is upon us' +</pre> + +<h2 id="规范" style="margin-bottom: 20px; font-size: 2.14285714285714rem;">规范</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">规范</th> + <th scope="col">状态</th> + <th scope="col">备注</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.slice', 'String.prototype.slice')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-string.prototype.slice', 'String.prototype.slice')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.5.4.13', 'String.prototype.slice')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES3')}}</td> + <td>{{Spec2('ES3')}}</td> + <td>Initial definition. Implemented in JavaScript 1.2.</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.String.slice")}}</p> + +<h2 id="参见">参见</h2> + +<ul> + <li>{{jsxref("String.prototype.substr()")}} {{deprecated_inline}}</li> + <li>{{jsxref("String.prototype.substring()")}}</li> + <li>{{jsxref("Array.prototype.slice()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/string/small/index.html b/files/zh-cn/web/javascript/reference/global_objects/string/small/index.html new file mode 100644 index 0000000000..7b55c68248 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/string/small/index.html @@ -0,0 +1,119 @@ +--- +title: String.prototype.small() +slug: Web/JavaScript/Reference/Global_Objects/String/small +translation_of: Web/JavaScript/Reference/Global_Objects/String/small +--- +<div>{{JSRef}} {{deprecated_header}}</div> + +<p><strong><code>small()</code></strong> 方法的作用是创建一个使字符串显示小号字体的 {{HTMLElement("small")}} 标签。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><var>str</var>.small()</code></pre> + +<h3 id="返回值">返回值</h3> + +<p>带有 {{HTMLElement("small")}} 标签的字符串。</p> + +<h2 id="描述">描述</h2> + +<p><code>small()</code> 方法会 将一个字符串嵌入到<code><small></code> 标签中： <code>"<small>str</small>"。</code></p> + +<h2 id="示例">示例</h2> + +<h3 id="使用small()函数"><code>使用small()函数</code></h3> + +<p>为了改变一个字符串的字体大小，下面的例子使用了字符串中的方法：</p> + +<pre class="brush: js">var worldString = 'Hello, world'; + +console.log(worldString.small()); // <small>Hello, world</small> +console.log(worldString.big()); // <big>Hello, world</big> +console.log(worldString.fontsize(7)); // <font size="7">Hello, world</fontsize> +</pre> + +<p>使用{{domxref("HTMLElement.style", "element.style")}}对象，你能更加一般地获得和操作该元素的属性，比如：</p> + +<pre class="brush: js">document.getElementById('yourElemId').style.fontSize = '0.7em'; +</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('ES6', '#sec-string.prototype.small', 'String.prototype.small')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>初始定义。 在JavaScript 1.0中实现。在（规范性）附件B中定义了用于Web浏览器的附加ECMAScript 特性。</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.small', 'String.prototype.small')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td>在（规范性）附件B中定义了用于Web浏览器的附加ECMAScript 特性。</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>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoDesktop("1.0")}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</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>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoMobile("1.0")}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("String.prototype.fontsize()")}}</li> + <li>{{jsxref("String.prototype.big()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/string/split/index.html b/files/zh-cn/web/javascript/reference/global_objects/string/split/index.html new file mode 100644 index 0000000000..c1dee44c87 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/string/split/index.html @@ -0,0 +1,213 @@ +--- +title: String.prototype.split() +slug: Web/JavaScript/Reference/Global_Objects/String/split +tags: + - JavaScript + - Method + - Prototype + - Reference + - Regular Expressions + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/split +--- +<p>{{JSRef}}</p> + +<p><code><strong>split() </strong></code>方法使用指定的分隔符字符串将一个{{jsxref("String")}}对象分割成子字符串数组，以一个指定的分割字串来决定每个拆分的位置。 </p> + +<div>{{EmbedInteractiveExample("pages/js/string-split.html")}}</div> + + + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code><em>str.split([separator[, limit]])</em></code> +</pre> + +<div class="blockIndicator warning"> +<p>注意：如果使用空字符串(“)作为分隔符，则字符串不是在每个用户感知的字符(图形素集群)之间，也不是在每个Unicode字符(代码点)之间，而是在每个UTF-16代码单元之间。这会摧毁代理对。还请参见<a href="https://stackoverflow.com/questions/4547609/how-do-you-get-a-string-to-a-character-array-in-javascript/34717402#34717402">how do you get a string to a character array in javascript</a></p> +</div> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>separator</code></dt> + <dd>指定表示每个拆分应发生的点的字符串。<code>separator</code> 可以是一个字符串或<a href="/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/RegExp" title="JavaScript/Reference/Global_Objects/RegExp">正则表达式</a>。 如果纯文本分隔符包含多个字符，则必须找到整个字符串来表示分割点。如果在str中省略或不出现分隔符，则返回的数组包含一个由整个字符串组成的元素。如果分隔符为空字符串，则将str原字符串中每个字符的数组形式返回。</dd> + <dt><code>limit</code></dt> + <dd>一个整数，限定返回的分割片段数量。当提供此参数时，split 方法会在指定分隔符的每次出现时分割该字符串，但在限制条目已放入数组时停止。如果在达到指定限制之前达到字符串的末尾，它可能仍然包含少于限制的条目。新数组中不返回剩下的文本。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>返回源字符串以分隔符出现位置分隔而成的一个 {{jsxref("Array")}} </p> + +<h2 id="Description" name="Description">描述</h2> + +<p>找到分隔符后，将其从字符串中删除，并将子字符串的数组返回。如果没有找到或者省略了分隔符，则该数组包含一个由整个字符串组成的元素。如果分隔符为空字符串，则将str转换为字符数组。如果分隔符出现在字符串的开始或结尾，或两者都分开，分别以空字符串开头，结尾或两者开始和结束。因此，如果字符串仅由一个分隔符实例组成，则该数组由两个空字符串组成。</p> + +<p>如果分隔符是包含捕获括号的正则表达式，则每次分隔符匹配时，捕获括号的结果（包括任何未定义的结果）将被拼接到输出数组中。但是，并不是所有浏览器都支持此功能。</p> + +<p>{{Note("当字符串为空时，split（）返回一个包含一个空字符串的数组，而不是一个空数组，如果字符串和分隔符都是空字符串，则返回一个空数组。")}}</p> + +<h2 id="Examples" name="Examples">示例</h2> + +<h3 id="Example_Using_split" name="Example:_Using_split">使用 <code>split()</code></h3> + +<p>下例定义了一个函数：根据指定的分隔符将一个字符串分割成一个字符串数组。分隔字符串后，该函数依次输出原始字符串信息，被使用的分隔符，返回数组元素的个数，以及返回数组中所有的元素。</p> + +<pre class="brush: js">function splitString(stringToSplit, separator) { + var arrayOfStrings = stringToSplit.split(separator); + + console.log('The original string is: "' + stringToSplit + '"'); + console.log('The separator is: "' + separator + '"'); + console.log("The array has " + arrayOfStrings.length + " elements: "); + + for (var i=0; i < arrayOfStrings.length; i++) + console.log(arrayOfStrings[i] + " / "); +} + +var tempestString = "Oh brave new world that has such people in it."; +var monthString = "Jan,Feb,Mar,Apr,May,Jun,Jul,Aug,Sep,Oct,Nov,Dec"; + +var space = " "; +var comma = ","; + +splitString(tempestString, space); +splitString(tempestString); +splitString(monthString, comma); +</pre> + +<p>上例输出下面结果：</p> + +<pre>The original string is: "Oh brave new world that has such people in it." +The separator is: " " +The array has 10 elements: Oh / brave / new / world / that / has / such / people / in / it. / + +The original string is: "Oh brave new world that has such people in it." +The separator is: "undefined" +The array has 1 elements: Oh brave new world that has such people in it. / + +The original string is: "Jan,Feb,Mar,Apr,May,Jun,Jul,Aug,Sep,Oct,Nov,Dec" +The separator is: "," +The array has 12 elements: Jan / Feb / Mar / Apr / May / Jun / Jul / Aug / Sep / Oct / Nov / Dec / +</pre> + +<h3 id="Example_Removing_spaces_from_a_string" name="Example:_Removing_spaces_from_a_string">移出字符串中的空格</h3> + +<p>下例中，<code>split()</code> 方法会查找“0 或多个空白符接着的分号，再接着 0 或多个空白符”模式的字符串，找到后，就将空白符从字符串中移除，<code>nameList</code> 是 <code>split</code> 的返回数组。</p> + +<pre class="brush: js">var names = "Harry Trump ;Fred Barney; Helen Rigby ; Bill Abel ;Chris Hand "; + +console.log(names); + +var re = /\s*(?:;|$)\s*/; +var nameList = names.split(re); + +console.log(nameList); +</pre> + +<p>上例输出两行，第一行输出原始字符串，第二行输出结果数组。</p> + +<pre><code>Harry Trump ;Fred Barney; Helen Rigby ; Bill Abel ;Chris Hand +[ "Harry Trump", "Fred Barney", "Helen Rigby", "Bill Abel", "Chris Hand", "" ]</code> +</pre> + +<h3 id="Example_Returning_a_limited_number_of_splits" name="Example:_Returning_a_limited_number_of_splits">限制返回值中分割元素数量</h3> + +<p>下例中，<code>split</code> 查找字符串中的 0 或多个空格，并返回找到的前 3 个分割元素（splits）。</p> + +<pre class="brush: js">var myString = "Hello World. How are you doing?"; +var splits = myString.split(" ", 3); + +console.log(splits); +</pre> + +<p>上例输出：</p> + +<pre><code>["Hello", "World.", "How"]</code></pre> + +<h3 id="Example_Capturing_parentheses" name="Example:_Capturing_parentheses">靠正则来分割使结果中包含分隔块</h3> + +<p>如果 <code>separator</code> 包含捕获括号（capturing parentheses），则其匹配结果将会包含在返回的数组中。</p> + +<pre class="brush: js">var myString = "Hello 1 word. Sentence number 2."; +var splits = myString.split(/(\d)/); + +console.log(splits); +</pre> + +<p>上例输出：</p> + +<pre><code>[ "Hello ", "1", " word. Sentence number ", "2", "." ]</code></pre> + +<h3 id="使用一个数组来作为分隔符">使用一个数组来作为分隔符</h3> + +<pre><code>const myString = 'this|is|a|Test'; +const splits = myString.split(['|']); + +console.log(splits); //["this", "is", "a", "Test"] + +const myString = 'ca,bc,a,bca,bca,bc'; + +const splits = myString.split(['a','b']); +// myString.split(['a','b']) is same as myString.split(String(['a','b'])) + +console.log(splits); //["c", "c,", "c", "c", "c"]</code></pre> + +<h3 id="用split来颠倒字符串顺序">用split()来颠倒字符串顺序</h3> + +<div class="blockIndicator warning"> +<p>注意这并非一种很健壮的逆转字符串的方法:</p> + +<pre><code>const str = 'asdfghjkl'; +const strReverse = str.split('').reverse().join(''); // 'lkjhgfdsa' +// split() returns an array on which reverse() and join() can be applied</code></pre> + +<p>如果字符串包含图形素集群，即使使用Unicode感知的拆分(use for example <a href="https://github.com/mathiasbynens/esrever">esrever</a> instead)，也不能工作。</p> + +<pre><code>const str = 'résumé'; +const strReverse = str.split(/(?:)/u).reverse().join(''); +// => "́emuśer"</code></pre> + +<p>Bonus: use {{jsxref("Operators/Comparison_Operators", "===", "#Identity_strict_equality_(===)")}} operator to test if the original string was palindrome.</p> +</div> + +<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>ECMAScript 3rd Edition.</td> + <td>Standard</td> + <td>Initial definition.<br> + Implemented in JavaScript 1.1</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.5.4.14', 'String.prototype.split')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-string.prototype.split', 'String.prototype.split')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{Compat("javascript.builtins.String.split")}}</p> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("String.prototype.charAt()")}}</li> + <li>{{jsxref("String.prototype.indexOf()")}}</li> + <li>{{jsxref("String.prototype.lastIndexOf()")}}</li> + <li>{{jsxref("Array.prototype.join()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/string/startswith/index.html b/files/zh-cn/web/javascript/reference/global_objects/string/startswith/index.html new file mode 100644 index 0000000000..2aaef9b688 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/string/startswith/index.html @@ -0,0 +1,97 @@ +--- +title: String.prototype.startsWith() +slug: Web/JavaScript/Reference/Global_Objects/String/startsWith +tags: + - JavaScript + - Prototype + - String + - 原型 + - 参考 + - 字符串 + - 方法 +translation_of: Web/JavaScript/Reference/Global_Objects/String/startsWith +--- +<div>{{JSRef}}</div> + +<p><span class="seoSummary"><code><strong>startsWith()</strong></code> 方法用来判断当前字符串是否以另外一个给定的子字符串开头，并根据判断结果返回 <code>true</code> 或 <code>false</code>。</span></p> + +<div>{{EmbedInteractiveExample("pages/js/string-startswith.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox notranslate"><var>str</var>.startsWith(<var>searchString</var>[, <var>position</var>])</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>searchString</code></dt> + <dd>要搜索的子字符串。</dd> + <dt><code>position</code> {{optional_inline}}</dt> + <dd>在 <code>str</code> 中搜索 <code><var>searchString</var></code> 的开始位置，默认值为 0。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>如果在字符串的开头找到了给定的字符则返回<strong><code>true</code></strong>；否则返回<strong><code>false</code></strong>。</p> + +<h2 id="描述">描述</h2> + +<p>这个方法能够让你确定一个字符串是否以另一个字符串开头。这个方法区分大小写。</p> + +<h2 id="Polyfill">Polyfill</h2> + +<p>此方法已被添加至 ECMAScript 2015 规范之中，但可能不能在所有的现行 JavaScript 实现中使用。不过，你可以用以下的代码段为 <code>String.prototype.startsWith()</code> 制作 Polyfill：</p> + +<pre class="brush: js notranslate">if (!String.prototype.startsWith) { + Object.defineProperty(String.prototype, 'startsWith', { + value: function(search, pos) { + pos = !pos || pos < 0 ? 0 : +pos; + return this.substring(pos, pos + search.length) === search; + } + }); +} +</pre> + +<p>Mathias Bynens 在 Github 上提供了<a href="https://github.com/mathiasbynens/String.prototype.startsWith">一份更为稳定有效（完全符合 ES2015 规范），但性能略差、代码紧凑性微减的 PolyFill</a>。</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用_startsWith">使用 <code>startsWith()</code></h3> + +<pre class="brush:js; notranslate">var str = "To be, or not to be, that is the question."; + +alert(str.startsWith("To be")); // true +alert(str.startsWith("not to be")); // false +alert(str.startsWith("not to be", 10)); // true</pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Specification</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.startswith', 'String.prototype.startsWith')}}</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.String.startsWith")}}</p> + +<h2 id="参见">参见</h2> + +<ul> + <li>{{jsxref("String.prototype.endsWith()")}}</li> + <li>{{jsxref("String.prototype.includes()")}}</li> + <li>{{jsxref("String.prototype.indexOf()")}}</li> + <li>{{jsxref("String.prototype.lastIndexOf()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/string/strike/index.html b/files/zh-cn/web/javascript/reference/global_objects/string/strike/index.html new file mode 100644 index 0000000000..3e904a9651 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/string/strike/index.html @@ -0,0 +1,116 @@ +--- +title: String.prototype.strike() +slug: Web/JavaScript/Reference/Global_Objects/String/strike +translation_of: Web/JavaScript/Reference/Global_Objects/String/strike +--- +<div>{{JSRef}} {{deprecated_header}}</div> + +<p><strong><code>strike()</code></strong>方法创建{{HTMLElement("strike")}} HTML 元素，使字符串展示为被删除的文本。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><var>str</var>.strike()</code></pre> + +<h3 id="返回值">返回值</h3> + +<p>包含{{HTMLElement("strike")}} HTML 元素的字符串。</p> + +<h2 id="描述">描述</h2> + +<p><code>strike()</code>方法将字符串嵌入<code><strike></code>标签： <code>"<strike>str</strike>"</code>.</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用strike()">使用<code>strike()</code></h3> + +<p>下面的示例使用字符串方法来修改字符串的格式：</p> + +<pre class="brush: js">var worldString = 'Hello, world'; + +console.log(worldString.blink()); // <blink>Hello, world</blink> +console.log(worldString.bold()); // <b>Hello, world</b> +console.log(worldString.italics()); // <i>Hello, world</i> +console.log(worldString.strike()); // <strike>Hello, world</strike> +</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('ES6', '#sec-string.prototype.strike', 'String.prototype.strike')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>初始定义。在 JavaScript 1.0 中实现。 在（规范性）附件 B 中定义为用于 Web 浏览器的 ECMAScript 附加特性。</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.strike', 'String.prototype.strike')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td>在（规范性）附件 B 中定义为用于 Web 浏览器的 ECMAScript 附加特性。</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>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoDesktop("1.0")}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</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>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoMobile("1.0")}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="另见">另见</h2> + +<ul> + <li>{{jsxref("String.prototype.blink()")}}</li> + <li>{{jsxref("String.prototype.bold()")}}</li> + <li>{{jsxref("String.prototype.italics()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/string/sub/index.html b/files/zh-cn/web/javascript/reference/global_objects/string/sub/index.html new file mode 100644 index 0000000000..8c47471d25 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/string/sub/index.html @@ -0,0 +1,119 @@ +--- +title: String.prototype.sub() +slug: Web/JavaScript/Reference/Global_Objects/String/sub +tags: + - String.sub() + - 已废弃 +translation_of: Web/JavaScript/Reference/Global_Objects/String/sub +--- +<div>{{JSRef}} {{deprecated_header}}</div> + +<p><strong><code>sub()</code></strong>方法创建一个 {{HTMLElement("sub")}} HTML 元素，使字符串展示为下标。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><var>str</var>.sub()</code></pre> + +<h3 id="返回值">返回值</h3> + +<p>包含{{HTMLElement("sub")}} HTML 元素的字符串。</p> + +<h2 id="描述">描述</h2> + +<p><code>sub()</code>方法将字符串嵌入<code><sub></code>标签： <code>"<sub>str</sub>"</code>.</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用sub()和sup()方法">使用<code>sub()</code>和<code>sup()</code>方法</h3> + +<p>下面的示例使用了<code>sub()</code>和{{jsxref("String.prototype.sup()", "sup()")}}方法来格式化字符串：</p> + +<pre class="brush: js">var superText = 'superscript'; +var subText = 'subscript'; + +console.log('This is what a ' + superText.sup() + ' looks like.'); +// 这就是<sup>superscript</sup>的样子。 + +console.log('This is what a ' + subText.sub() + ' looks like.'); +// 这就是<sub>subscript</sub>的样子。 +</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('ES6', '#sec-string.prototype.sub', 'String.prototype.sub')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>初始定义。在 JavaScript 1.0 中实现。在（规范性）附件 B 中定义为用于 Web 浏览器的 ECMAScript 附加特性。</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.sub', 'String.prototype.sub')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td>在（规范性）附件 B 中定义为用于 Web 浏览器的 ECMAScript 附加特性。</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>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoDesktop("1.0")}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</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>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoMobile("1.0")}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="另见">另见</h2> + +<ul> + <li>{{jsxref("String.prototype.sup()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/string/substr/index.html b/files/zh-cn/web/javascript/reference/global_objects/string/substr/index.html new file mode 100644 index 0000000000..8faa458218 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/string/substr/index.html @@ -0,0 +1,166 @@ +--- +title: String.prototype.substr() +slug: Web/JavaScript/Reference/Global_Objects/String/substr +tags: + - String.prototype.substr() +translation_of: Web/JavaScript/Reference/Global_Objects/String/substr +--- +<p>{{JSRef}}</p> + +<div class="warning">警告： 尽管 <code>String.prototype.substr(…)</code> 没有严格被废弃 (as in "removed from the Web standards"), 但它被认作是遗留的函数并且可以的话应该避免使用。它并非JavaScript核心语言的一部分，未来将可能会被移除掉。如果可以的话，使用 <code><a href="/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/String/substring">substring()</a></code> 替代它.</div> + +<p><code><strong>substr()</strong></code> 方法返回一个字符串中从指定位置开始到指定字符数的字符。</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code><em>str</em>.substr(<em>start</em>[, <em>length</em>])</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>start</code></dt> + <dd>开始提取字符的位置。如果为负值，则被看作 <code style="font-style: normal; line-height: 1.5;">strLength + </code><code style="font-style: normal; line-height: 1.5;">start，其中</code><span style="line-height: 1.5;"> </span><code style="font-style: normal; line-height: 1.5;">strLength</code><span style="line-height: 1.5;"> 为字符串的长度（例如，如果 <code>start</code> 为 <code>-3，则被看作</code> <code>strLength + (-3)）。</code></span></dd> +</dl> + +<dl> + <dt><code>length</code></dt> + <dd>可选。提取的字符数。</dd> +</dl> + +<h2 id="Description" name="Description">描述</h2> + +<p><code>start</code> 是一个字符的索引。首字符的索引为 0，最后一个字符的索引为 字符串的长度减去1。<code>substr</code> 从 <code>start</code> 位置开始提取字符，提取 <code>length</code> 个字符（或直到字符串的末尾）。</p> + +<p>如果 <code>start</code> 为正值，且大于或等于字符串的长度，则 <code>substr</code> 返回一个空字符串。</p> + +<p>如果 <code>start</code> 为负值，则 <code>substr</code> 把它作为从字符串末尾开始的一个字符索引。如果 <code>start</code> 为负值且 <code>abs(start)</code> 大于字符串的长度，则 <code>substr</code> 使用 0 作为开始提取的索引。注意负的 <code>start</code> 参数不被 Microsoft JScript 所支持。</p> + +<p>如果 <code>length</code> 为 0 或负值，则 <code>substr</code> 返回一个空字符串。如果忽略 <code>length</code>，则 <code>substr</code> 提取字符，直到字符串末尾。</p> + +<h2 id="示例">示例</h2> + +<h3 id="Example:_Using_substr" name="Example:_Using_substr">例子：使用 <code>substr</code></h3> + +<pre class="brush: js">var str = "abcdefghij"; + +console.log("(1,2): " + str.substr(1,2)); // (1,2): bc +console.log("(-3,2): " + str.substr(-3,2)); // (-3,2): hi +console.log("(-3): " + str.substr(-3)); // (-3): hij +console.log("(1): " + str.substr(1)); // (1): bcdefghij +console.log("(-20, 2): " + str.substr(-20,2)); // (-20, 2): ab +console.log("(20, 2): " + str.substr(20,2)); // (20, 2): +</pre> + +<h2 id="Description" name="Description">兼容旧环境（Polyfill）</h2> + +<p>Microsoft's JScript 不支持负的 start 索引。如果你想充分利用该方法的功能，则需要使用下面的兼容性代码修复此 bug：</p> + +<pre class="brush: js">// only run when the substr function is broken +if ('ab'.substr(-1) != 'b') +{ + /** + * Get the substring of a string + * @param {integer} start where to start the substring + * @param {integer} length how many characters to return + * @return {string} + */ + String.prototype.substr = function(substr) { + return function(start, length) { + // did we get a negative start, calculate how much it is + // from the beginning of the string + if (start < 0) start = this.length + start; + + // call the original function + return substr.call(this, start, length); + } + }(String.prototype.substr); +}</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>ECMAScript 3rd Edition.</td> + <td>Standard</td> + <td>Defined in the (informative) Compatibility Annex B.<br> + Implemented in JavaScript 1.0</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-B.2.3', 'String.prototype.substr')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td>Defined in the (informative) Compatibility Annex B</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-string.prototype.substr', 'String.prototype.substr')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Defined in the (normative) Annex B for Additional ECMAScript Features for Web Browsers</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{ CompatibilityTable() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<p><strong>Note</strong>: Up to version 3.6, Firefox had a bug which caused <code>substr</code> to return empty result when an explicit <code>undefined</code> value was passed in as the <code>length</code>.</p> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("String.prototype.slice()")}}</li> + <li>{{jsxref("String.prototype.substring()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/string/substring/index.html b/files/zh-cn/web/javascript/reference/global_objects/string/substring/index.html new file mode 100644 index 0000000000..9a2d97f935 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/string/substring/index.html @@ -0,0 +1,194 @@ +--- +title: String.prototype.substring() +slug: Web/JavaScript/Reference/Global_Objects/String/substring +tags: + - String.prototype.substring() +translation_of: Web/JavaScript/Reference/Global_Objects/String/substring +--- +<p>{{JSRef}}</p> + +<p><strong><code>substring() </code></strong>方法返回一个字符串在开始索引到结束索引之间的一个子集, 或从开始索引直到字符串的末尾的一个子集。</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox notranslate"><code><var>str</var>.substring(<var>indexStart</var>[, <var>indexEnd</var>])</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>indexStart</code></dt> + <dd>需要截取的第一个字符的索引，该索引位置的字符作为返回的字符串的首字母。</dd> + <dt><code>indexEnd</code></dt> + <dd>可选。一个 0 到字符串长度之间的整数，以该数字为索引的字符不包含在截取的字符串内。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>包含给定字符串的指定部分的新字符串。</p> + +<h2 id="Description" name="Description">描述</h2> + +<p><code>substring</code> 提取从 <code>indexStart</code> 到 <code>indexEnd</code>（不包括）之间的字符。特别地：</p> + +<ul> + <li>如果 <code>indexStart</code> 等于 <code>indexEnd</code>，<code>substring</code> 返回一个空字符串。</li> + <li>如果省略 <code>indexEnd</code>，<code>substring</code> 提取字符一直到字符串末尾。</li> + <li>如果任一参数小于 0 或为 {{jsxref("NaN")}}，则被当作 0。</li> + <li>如果任一参数大于 <code>stringName.length</code>，则被当作 <code>stringName.length</code>。</li> + <li>如果 <code>indexStart</code> 大于 <code>indexEnd</code>，则 <code>substring</code> 的执行效果就像两个参数调换了一样。见下面的例子。</li> +</ul> + +<h2 id="Examples" name="Examples">示例</h2> + +<h3 id="Example_Using_substring" name="Example:_Using_substring">例子：使用 <code>substring</code></h3> + +<p>下例使用 <code>substring</code> 输出字符串 "<code>Mozilla</code>" 中的字符：</p> + +<pre class="brush:js notranslate">var anyString = "Mozilla"; + +// 输出 "Moz" +console.log(anyString.substring(0,3)); +console.log(anyString.substring(3,0)); +console.log(anyString.substring(3,-3)); +console.log(anyString.substring(3,NaN)); +console.log(anyString.substring(-2,3)); +console.log(anyString.substring(NaN,3)); + +// 输出 "lla" +console.log(anyString.substring(4,7)); +console.log(anyString.substring(7,4)); + +// 输出 "" +console.log(anyString.substring(4,4)); + +// 输出 "Mozill" +console.log(anyString.substring(0,6)); + +// 输出 "Mozilla" +console.log(anyString.substring(0,7)); +console.log(anyString.substring(0,10)); +</pre> + +<h3 id="运用_length_属性来使用_substring"><strong>运用 length 属性来使用 substring()</strong></h3> + +<p>下面一个例子运用了 String.length 属性去获取指定字符串的倒数元素。显然这个办法更容易记住，因为你不再像上面那个例子那样去记住起始位置和最终位置。</p> + +<pre class="brush: js notranslate"><code>// Displays 'illa' the last 4 characters +var anyString = 'Mozilla'; +var anyString4 = anyString.substring(anyString.length - 4); +console.log(anyString4);</code> + +// Displays 'zilla' the last 5 characters +var anyString = 'Mozilla'; +var anyString5 = anyString.substring(anyString.length - 5); +console.log(anyString5);</pre> + +<h3 id="Example_Replacing_a_substring_within_a_string" name="Example:_Replacing_a_substring_within_a_string">例子：替换一个字符串的子字符串</h3> + +<p>下例替换了一个字符串中的子字符串。可以替换单个字符和子字符串。该例结尾调用的函数将 "<code>Brave New World</code>" 变成了 "<code>Brave New Web</code>"。</p> + +<pre class="brush:js notranslate">function replaceString(oldS, newS, fullS) { +// Replaces oldS with newS in the string fullS + for (var i = 0; i < fullS.length; i++) { + if (fullS.substring(i, i + oldS.length) == oldS) { + fullS = fullS.substring(0, i) + newS + fullS.substring(i + oldS.length, fullS.length); + } + } + return fullS; +} + +replaceString("World", "Web", "Brave New World");</pre> + +<p>需要注意的是，如果 <code>oldS</code> 是 <code>newS</code> 的子字符串将会导致死循环。例如，尝试把 "Web" 替换成 "OtherWorld"。一个更好的方法如下：</p> + +<pre class="brush:js notranslate">function replaceString(oldS, newS,fullS){ + return fullS.split(oldS).join(newS); +}</pre> + +<p><span style="line-height: 1.5;">上面的代码只是子字符串操作的一个例子。如果你需要替换子字符串，更多时候会用到 </span><span style="line-height: 1.5em;">{{jsxref("String.prototype.replace()")}}。</span></p> + +<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>ECMAScript 1st Edition.</td> + <td>Standard</td> + <td>Implemented in JavaScript 1.0</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.5.4.15', 'String.prototype.substring')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-string.prototype.substring', 'String.prototype.substring')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{ CompatibilityTable() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("String.prototype.substr()")}}</li> + <li>{{jsxref("String.prototype.slice()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/string/sup/index.html b/files/zh-cn/web/javascript/reference/global_objects/string/sup/index.html new file mode 100644 index 0000000000..118bbd1f2e --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/string/sup/index.html @@ -0,0 +1,118 @@ +--- +title: String.prototype.sup() +slug: Web/JavaScript/Reference/Global_Objects/String/sup +tags: + - String.prototype.sup() +translation_of: Web/JavaScript/Reference/Global_Objects/String/sup +--- +<div>{{JSRef}} {{deprecated_header}}</div> + +<p><strong><code>sup()</code></strong>方法创建 一个{{HTMLElement("sup")}}HTML 元素，使字符串显示为上标。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><var>str</var>.sup()</code></pre> + +<h3 id="返回值">返回值</h3> + +<p>包含{{HTMLElement("sup")}} HTML 元素的字符串。</p> + +<h2 id="描述">描述</h2> + +<p><code>sup()</code> 方法将字符串嵌入 <code><sup></code> 标签中：<code>"<sup>str</sup>"</code>.</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用sub()和sup()方法">使用<code>sub()</code>和<code>sup()</code>方法</h3> + +<p>下面的示例使用了{{jsxref("String.prototype.sub()", "sub()")}}和<code>sup()</code>方法来格式化字符串：</p> + +<pre class="brush: js">var superText = 'superscript'; +var subText = 'subscript'; + +console.log('This is what a ' + superText.sup() + ' looks like.'); +// "这就是<sup>superscript</sup>的样子。" + +console.log('This is what a ' + subText.sub() + ' looks like.'); +// "这就是<sub>subscript</sub>的样子。" +</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('ES6', '#sec-string.prototype.sup', 'String.prototype.sup')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>初始定义。在 JavaScript 1.0 中实现。在（规范性）附件 B 中定义为用于 Web 浏览器的 ECMAScript 附加特性。</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.sup', 'String.prototype.sup')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td>在（规范性）附件 B 中定义为用于 Web 浏览器的 ECMAScript 附加特性。</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>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoDesktop("1.0")}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</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>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoMobile("1.0")}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="另见">另见</h2> + +<ul> + <li>{{jsxref("String.prototype.sub()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/string/tolocalelowercase/index.html b/files/zh-cn/web/javascript/reference/global_objects/string/tolocalelowercase/index.html new file mode 100644 index 0000000000..a9709187a7 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/string/tolocalelowercase/index.html @@ -0,0 +1,145 @@ +--- +title: String.prototype.toLocaleLowerCase() +slug: Web/JavaScript/Reference/Global_Objects/String/toLocaleLowerCase +translation_of: Web/JavaScript/Reference/Global_Objects/String/toLocaleLowerCase +--- +<div>{{JSRef}}</div> + +<p><strong><code>toLocaleLowerCase()</code></strong>方法根据任何指定区域语言环境设置的大小写映射，返回调用字符串被转换为小写的格式。</p> + +<h2 id="语法">语法</h2> + +<pre><var>str</var>.toLocaleLowerCase() +<var>str</var>.toLocaleLowerCase(locale) +<var>str</var>.toLocaleLowerCase([locale, locale, ...])</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>locale</code> {{optional_inline}}</dt> + <dd>参数 <code>locale</code> 指明要转换成小写格式的特定语言区域。 如果以一个数组 {{jsxref("Array")}}形式给出多个locales, 最合适的地区将被选出来应用（参见<a href="https://tc39.github.io/ecma402/#sec-bestavailablelocale">best available locale</a>）。默认的locale是主机环境的当前区域(locale)设置。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>根据任何特定于语言环境的案例映射规则将被调用字串转换成小写格式的一个新字符串。</p> + +<h3 id="Exceptions">Exceptions</h3> + +<ul> + <li>A {{jsxref("RangeError")}} ("invalid language tag: xx_yy") is thrown if a <code>locale</code> argument isn't a valid language tag.</li> + <li>A {{jsxref("TypeError")}} ("invalid element in locales argument") is thrown if an array element isn't of type string.</li> +</ul> + +<h2 id="描述">描述</h2> + +<p><code>toLocaleLowerCase()</code> 方法返回根据任意区域语言大小写映射集而转换成小写格式的字符串。<code>toLocaleLowerCase()</code> 并不会影响字符串原本的值。在大多数情况下，该方法和调用 {{jsxref("String.prototype.toLowerCase()", "toLowerCase()")}}的结果相同，但是在某些区域环境中，比如土耳其语，它的大小写映射并不遵循在Unicode中的默认的大小写映射，因此会有一个不同的结果。</p> + +<h2 id="例子">例子</h2> + +<h3 id="使用toLocaleLowerCase"><code><font face="Open Sans, Arial, sans-serif">使用</font>toLocaleLowerCase()</code></h3> + +<pre><code>'ALPHABET'.toLocaleLowerCase(); // 'alphabet' + +'\u0130'.toLocaleLowerCase('tr') === 'i'; // true +'\u0130'.toLocaleLowerCase('en-US') === 'i'; // false + +let locales = ['tr', 'TR', 'tr-TR', 'tr-u-co-search', 'tr-x-turkish']; +'\u0130'.toLocaleLowerCase(locales) === 'i'; // true</code></pre> + +<h2 id="规范">规范</h2> + +<table> + <tbody> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + <tr> + <td>{{SpecName('ES3')}}</td> + <td>{{Spec2('ES3')}}</td> + <td>Initial definition. Implemented in JavaScript 1.2.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.5.4.17', 'String.prototype.toLocaleLowerCase')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-string.prototype.tolocalelowercase', 'String.prototype.toLocaleLowerCase')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.tolocalelowercase', 'String.prototype.toLocaleLowerCase')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES Int Draft', '#sup-string.prototype.tolocalelowercase', 'String.prototype.toLocaleLowerCase')}}</td> + <td>{{Spec2('ES Int Draft')}}</td> + <td>ES Intl 2017 added the <code>locale</code>parameter.</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>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</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>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="参阅">参阅</h2> + +<ul> + <li>{{jsxref("String.prototype.toLocaleUpperCase()")}}</li> + <li>{{jsxref("String.prototype.toLowerCase()")}}</li> + <li>{{jsxref("String.prototype.toUpperCase()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/string/tolocaleuppercase/index.html b/files/zh-cn/web/javascript/reference/global_objects/string/tolocaleuppercase/index.html new file mode 100644 index 0000000000..9043db95c5 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/string/tolocaleuppercase/index.html @@ -0,0 +1,91 @@ +--- +title: String.prototype.toLocaleUpperCase() +slug: Web/JavaScript/Reference/Global_Objects/String/toLocaleUpperCase +translation_of: Web/JavaScript/Reference/Global_Objects/String/toLocaleUpperCase +--- +<div>{{JSRef}}</div> + +<p><strong><code>toLocaleUpperCase()</code></strong> 方法根据本地主机语言环境把字符串转换为大写格式，并返回转换后的字符串。</p> + +<div>{{EmbedInteractiveExample("pages/js/string-tolocaleuppercase.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>str</var>.toLocaleUpperCase() +<var>str</var>.toLocaleUpperCase(locale) +<var>str</var>.toLocaleUpperCase([locale, locale, ...]) +</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>locale</code> {{optional_inline}}</dt> + <dd>The <code>locale</code> parameter indicates the locale to be used to convert to upper case according to any locale-specific case mappings. If multiple locales are given in an {{jsxref("Array")}}, the <a href="https://tc39.github.io/ecma402/#sec-bestavailablelocale">best available locale</a> is used. The default locale is the host environment’s current locale.</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>A new string representing the calling string converted to upper case, according to any locale-specific case mappings.</p> + +<h3 id="Exceptions">Exceptions</h3> + +<ul> + <li>A {{jsxref("RangeError")}} ("invalid language tag: xx_yy") is thrown if a <code>locale</code> argument isn't a valid language tag.</li> + <li>A {{jsxref("TypeError")}} ("invalid element in locales argument") is thrown if an array element isn't of type string.</li> +</ul> + +<h2 id="描述">描述</h2> + +<p>The <code>toLocaleUpperCase()</code> method returns the value of the string converted to upper case according to any locale-specific case mappings. <code>toLocaleUpperCase()</code> does not affect the value of the string itself. In most cases, this will produce the same result as {{jsxref("String.prototype.toUpperCase()", "toUpperCase()")}}, but for some locales, such as Turkish, whose case mappings do not follow the default case mappings in Unicode, there may be a different result.</p> + +<p>Also notice that conversion is not necessarily a 1:1 character mapping, as some characters might result in two (or even more) characters when transformed to upper-case. Therefore the length of the result string can differ from the input length. This also implies that the conversion is not stable, so i.E. the following can return <code>false</code>:<br> + <code>x.toLocaleLowerCase() === x.toLocaleUpperCase().toLocaleLowerCase()</code></p> + +<h2 id="例子">例子</h2> + +<h3 id="使用_toLocaleUpperCase">使用 <code>toLocaleUpperCase()</code></h3> + +<pre class="brush: js">'alphabet'.toLocaleUpperCase(); // 'ALPHABET' + +'Gesäß'.toLocaleUpperCase(); // 'GESÄSS' + +'i\u0307'.toLocaleUpperCase('lt-LT'); // 'I' + +let locales = ['lt', 'LT', 'lt-LT', 'lt-u-co-phonebk', 'lt-x-lietuva']; +'i\u0307'.toLocaleUpperCase(locales); // 'I'</pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范</th> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.tolocaleuppercase', 'String.prototype.toLocaleUpperCase')}}</td> + </tr> + <tr> + <td>{{SpecName('ES Int Draft', '#sup-string.prototype.tolocaleuppercase', 'String.prototype.toLocaleUpperCase')}}</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.String.toLocaleUpperCase")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("String.prototype.toLocaleLowerCase()")}}</li> + <li>{{jsxref("String.prototype.toLowerCase()")}}</li> + <li>{{jsxref("String.prototype.toUpperCase()")}}</li> +</ul> + +<div id="gtx-trans" style="position: absolute; left: 11px; top: 96px;"> +<div class="gtx-trans-icon"></div> +</div> diff --git a/files/zh-cn/web/javascript/reference/global_objects/string/tolowercase/index.html b/files/zh-cn/web/javascript/reference/global_objects/string/tolowercase/index.html new file mode 100644 index 0000000000..e08a47bb55 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/string/tolowercase/index.html @@ -0,0 +1,136 @@ +--- +title: String.prototype.toLowerCase() +slug: Web/JavaScript/Reference/Global_Objects/String/toLowerCase +tags: + - JavaScript + - Method + - Prototype + - String + - toLowerCase() +translation_of: Web/JavaScript/Reference/Global_Objects/String/toLowerCase +--- +<div>{{JSRef}}</div> + +<p><code><strong>toLowerCase()</strong></code> 会将调用该方法的字符串值转为小写形式，并返回。</p> + +<h2 id="语法" style="margin-bottom: 20px; line-height: 30px;">语法</h2> + +<pre class="syntaxbox language-html notranslate" style="margin-bottom: 0px; padding: 1em; border-left-width: 6px; border-left-style: solid; font-family: Consolas, Monaco, 'Andale Mono', monospace; font-size: 14px; direction: ltr; white-space: normal; text-shadow: none; background-color: rgba(212, 221, 228, 0.498039);"><code class="language-html" style="font-family: Consolas, Monaco, 'Andale Mono', monospace; direction: ltr; color: inherit; text-shadow: none;">str.toLowerCase()</code> +</pre> + +<p id="sect1"></p> + +<h3 id="返回值">返回值</h3> + +<p>一个新的字符串，表示转换为小写的调用字符串。</p> + +<h2 id="描述" style="margin-bottom: 20px; line-height: 30px;">描述</h2> + +<p><code>toLowerCase</code> 会将调用该方法的字符串值转为小写形式，并返回。<code>toLowerCase</code> 不会影响字符串本身的值。</p> + +<h2 id="示例" style="margin-bottom: 20px; line-height: 30px;">示例</h2> + +<h3 id="例子：使用_toLowerCase" style="line-height: 24px;">例子：使用 <code>toLowerCase()</code></h3> + +<pre class="brush: js notranslate">console.log('中文简体 zh-CN || zh-Hans'.toLowerCase()); +// 中文简体 zh-cn || zh-hans + +console.log( "ALPHABET".toLowerCase() ); +// "alphabet"</pre> + +<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 0px; background: 0px 0px;"></div> + +<p><font face="x-locale-heading-primary, zillaslab, Palatino, Palatino Linotype, x-locale-heading-secondary, serif"><span style="font-size: 37.33327865600586px;"><strong>说明</strong></span></font></p> + + + +<table> + <tbody> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + <tr> + <td>{{SpecName('ES1')}}</td> + <td>{{Spec2('ES1')}}</td> + <td>Initial definition. Implemented in JavaScript 1.0.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.5.4.16', 'String.prototype.toLowerCase')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-string.prototype.tolowercase', 'String.prototype.toLowerCase')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.tolowercase', 'String.prototype.toLowerCase')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> <br> + </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>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</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>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("String.prototype.toLocaleLowerCase()")}}</li> + <li>{{jsxref("String.prototype.toLocaleUpperCase()")}}</li> + <li>{{jsxref("String.prototype.toUpperCase()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/string/tosource/index.html b/files/zh-cn/web/javascript/reference/global_objects/string/tosource/index.html new file mode 100644 index 0000000000..7914776a25 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/string/tosource/index.html @@ -0,0 +1,91 @@ +--- +title: String.prototype.toSource() +slug: Web/JavaScript/Reference/Global_Objects/String/toSource +translation_of: Web/JavaScript/Reference/Global_Objects/String/toSource +--- +<div>{{JSRef}} {{non-standard_header}}</div> + +<p><strong><code>toSource()</code></strong> 方法返回一个代表对象的源代码。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code>String.toSource() +<var>str</var>.toSource() +</code></pre> + +<h2 id="描述">描述</h2> + +<p><code>toSource()</code> 方法返回以下值：</p> + +<p>对于内建对象 {{jsxref("String")}} , <code>toSource()返回以下值说明源码不可用：</code></p> + +<pre class="brush: js">function String() { + [native code] +} +</pre> + +<p>对于实例{{jsxref("String")}} 或者字符串, <code>toSource()</code> 返回一个字符串表示源码.</p> + +<p>这种方法通常在内部被JavaScript调用，而不是明确的代码。.</p> + +<h2 id="规范">规范</h2> + +<p>不属于任何标准. 在 JavaScript 1.3实现了.</p> + +<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>{{CompatVersionUnknown}}</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>{{CompatVersionUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="参见">参见</h2> + +<ul> + <li>{{jsxref("Object.prototype.toSource()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/string/tostring/index.html b/files/zh-cn/web/javascript/reference/global_objects/string/tostring/index.html new file mode 100644 index 0000000000..192ae75b12 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/string/tostring/index.html @@ -0,0 +1,124 @@ +--- +title: String.prototype.toString() +slug: Web/JavaScript/Reference/Global_Objects/String/toString +translation_of: Web/JavaScript/Reference/Global_Objects/String/toString +--- +<div>{{JSRef("Global_Objects", "String")}}</div> + +<h2 id="Summary" name="Summary">概述</h2> + +<p><code><strong>toString()</strong></code> 方法返回指定对象的字符串形式。</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code><em>str</em>.toString()</code> +</pre> + +<h3 id="返回值">返回值</h3> + +<p>一个表示调用对象的字符串。</p> + +<h2 id="Description" name="Description">描述</h2> + +<p><code>String</code> 对象覆盖了{{jsxref("Global_Objects/Object", "Object")}} 对象的 <code>toString</code> 方法；并没有继承 {{jsxref("Object.toString()")}}。对于 <code>String</code> 对象，<code>toString</code> 方法返回该对象的字符串形式，和 {{jsxref("String.prototype.valueOf()")}} 方法返回值一样。</p> + +<h2 id="Examples" name="Examples">示例</h2> + +<h3 id="Example_Using_toString" name="Example:_Using_toString">例子：使用 <code>toString</code></h3> + +<p>下例输出一个字符串对象（String object）的字符串值：</p> + +<pre class="brush:js">var x = new String("Hello world"); + +alert(x.toString()) // 输出 "Hello world"</pre> + +<h2 id="规范">规范</h2> + +<table> + <tbody> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + <tr> + <td>{{SpecName('ES3')}}</td> + <td>{{Spec2('ES3')}}</td> + <td>Initial definition. Implemented in JavaScript 1.1.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.5.4.2', 'String.prototype.toString')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-string.prototype.tostring', 'String.prototype.toString')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.tostring', 'String.prototype.toString')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{ CompatibilityTable() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("Object.prototype.toSource()")}}</li> + <li>{{jsxref("String.prototype.valueOf()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/string/touppercase/index.html b/files/zh-cn/web/javascript/reference/global_objects/string/touppercase/index.html new file mode 100644 index 0000000000..7d0edf43c5 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/string/touppercase/index.html @@ -0,0 +1,87 @@ +--- +title: String.prototype.toUpperCase() +slug: Web/JavaScript/Reference/Global_Objects/String/toUpperCase +tags: + - JavaScript + - 原型 + - 字符串 + - 引用 + - 方法 +translation_of: Web/JavaScript/Reference/Global_Objects/String/toUpperCase +--- +<div>{{JSRef}}</div> + +<p><strong><code>toUpperCase()</code></strong> 方法将调用该方法的字符串转为大写形式并返回（如果调用该方法的值不是字符串类型会被强制转换）。</p> + +<div>{{EmbedInteractiveExample("pages/js/string-touppercase.html","shorter")}}</div> + +<p class="hidden">这个交互式示例的源代码存储在GitHub存储库中。如果您想对交互式示例项目作出贡献，请克隆<a href="/zh-CN/docs/">https://github.com/mdn/interactive-examples</a>并向我们发送请求。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox notranslate"><var>str</var>.toUpperCase()</pre> + +<h3 id="返回值">返回值</h3> + +<p>一个新的字符串，表示转换为大写的调用字符串。</p> + +<h3 id="错误处理">错误处理</h3> + +<dl> + <dt>{{jsxref("TypeError(类型错误)")}}</dt> + <dd>在 {{jsxref("null")}} 或 {{jsxref("undefined")}}类型上调用，例如：<code>String.prototype.toUpperCase.call(undefined)</code>.</dd> +</dl> + +<h2 id="描述">描述</h2> + +<p><code>toUpperCase()</code> 返回转为大写形式的字符串。此方法不会影响原字符串本身的值，因为JavaScript中字符串的值是不可改变的。</p> + +<h2 id="示例">示例</h2> + +<h3 id="基本用法">基本用法</h3> + +<pre class="brush: js notranslate">console.log('alphabet'.toUpperCase()); // 'ALPHABET' +</pre> + +<h3 id="将非字符串类型的_this_（上下文）转为字符串">将非字符串类型的 <code>this</code> （上下文）转为字符串</h3> + +<p>此方法会将任何非字符串类型的值转为字符串， 当你将其上下文 <code>this</code> 值设置为非字符串类型</p> + +<pre class="brush: js notranslate">const a = String.prototype.toUpperCase.call({ + toString: function toString() { + return 'abcdef'; + } +}); + +const b = String.prototype.toUpperCase.call(true); + +// 输出 'ABCDEF TRUE'。 +console.log(a, b); +</pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范</th> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.touppercase', 'String.prototype.toUpperCase')}}</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div class="hidden">此页中的兼容性表是从结构化数据生成的。如果你想对数据有所贡献，请查看<a href="/zh-CN/docs/">https://github.com/mdn/browser-compat-data</a>并向我们发送请求。</div> + +<p>{{Compat("javascript.builtins.String.toUpperCase")}}</p> + +<h2 id="参见">参见</h2> + +<ul> + <li>{{jsxref("String.prototype.toLocaleLowerCase()")}}</li> + <li>{{jsxref("String.prototype.toLocaleUpperCase()")}}</li> + <li>{{jsxref("String.prototype.toLowerCase()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/string/trim/index.html b/files/zh-cn/web/javascript/reference/global_objects/string/trim/index.html new file mode 100644 index 0000000000..66e0d5171f --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/string/trim/index.html @@ -0,0 +1,103 @@ +--- +title: String.prototype.trim() +slug: Web/JavaScript/Reference/Global_Objects/String/Trim +tags: + - ECMAScript 5 + - JavaScript + - Method + - Prototype + - String + - 参考 + - 字符串 + - 方法 +translation_of: Web/JavaScript/Reference/Global_Objects/String/Trim +--- +<div> +<div> +<div>{{JSRef}}</div> +</div> +</div> + +<p><strong><code>trim()</code> </strong>方法会从一个字符串的两端删除空白字符。在这个上下文中的空白字符是所有的空白字符 (space, tab, no-break space 等) 以及所有行终止符字符（如 LF，CR等）。</p> + +<p>{{EmbedInteractiveExample("pages/js/string-trim.html")}}</p> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox notranslate"><code><var>str</var>.trim()</code></pre> + +<h3 id="返回值">返回值</h3> + +<p>一个代表调用字符串两端去掉空白的新字符串。</p> + +<h2 id="描述">描述</h2> + +<p><code>trim()</code> 方法返回一个从两头去掉空白字符的字符串，并不影响原字符串本身。</p> + +<h2 id="例子">例子</h2> + +<h3 id="使用_trim">使用 <code>trim()</code></h3> + +<p>下面的例子中将显示小写的字符串 'foo':</p> + +<pre class="brush: js notranslate">var orig = ' foo '; +console.log(orig.trim()); // 'foo' + +// 另一个 .trim() 例子，只从一边删除 + +var orig = 'foo '; +console.log(orig.trim()); // 'foo' +</pre> + +<h2 id="兼容旧环境">兼容旧环境</h2> + +<p>如果 <code>trim()</code> 不存在，可以在所有代码前执行下面代码</p> + +<pre class="brush: js notranslate">if (!String.prototype.trim) { + String.prototype.trim = function () { + return this.replace(/^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g, ''); + }; +} +</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>{{SpecName('ES5.1', '#sec-15.5.4.20', 'String.prototype.trim')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td>Initial definition. Implemented in JavaScript 1.8.1.</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-string.prototype.trim', 'String.prototype.trim')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.trim', 'String.prototype.trim')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.String.trim")}}</p> + +<h2 id="参见">参见</h2> + +<ul> + <li>{{jsxref("String.prototype.trimStart()")}}</li> + <li>{{jsxref("String.prototype.trimEnd()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/string/trimleft/index.html b/files/zh-cn/web/javascript/reference/global_objects/string/trimleft/index.html new file mode 100644 index 0000000000..bc6133cecb --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/string/trimleft/index.html @@ -0,0 +1,122 @@ +--- +title: String.prototype.trimStart() +slug: Web/JavaScript/Reference/Global_Objects/String/TrimLeft +tags: + - JavaScript + - Method + - Prototype + - String + - 参考 + - 字符串 + - 方法 +translation_of: Web/JavaScript/Reference/Global_Objects/String/trimStart +--- +<div>{{JSRef}}</div> + +<div><strong><code>trimStart()</code> </strong>方法从字符串的开头删除空格。<code>trimLeft()</code> 是此方法的别名。</div> + +<div>{{EmbedInteractiveExample("pages/js/string-trimstart.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>str</var>.trimStart(); +<var>str</var>.trimLeft();</pre> + +<h3 id="返回值">返回值</h3> + +<p>一个新字符串，表示从其开头（左端）除去空格的调用字符串。</p> + +<h2 id="描述">描述</h2> + +<p><code>trimStart()</code> / <code>trimLeft()</code> 方法移除原字符串左端的连续空白符并返回一个新字符串，并不会直接修改原字符串本身。</p> + +<h3 id="别名">别名</h3> + +<p>为了与 {{jsxref("String.prototype.padStart")}} 等函数保持一致，标准方法名称为<code>trimStart</code>。 但是，出于 Web 兼容性原因，<code>trimLeft</code> 仍然是 <code>trimStart</code> 的别名。在某些引擎中，这意味着：</p> + +<pre class="brush: js">String.prototype.trimLeft.name === "trimStart";</pre> + +<h2 id="示例">示例</h2> + +<h3 id="使用_trimStart">使用 <code>trimStart()</code></h3> + +<p>下面的例子输出了小写的字符串 <code>"foo "</code>：</p> + +<pre class="brush:js;highlight:[5]">var str = " foo "; + +console.log(str.length); // 8 + +str = str.trimStart() // 等同于 str = str.trimLeft(); +console.log(str.length); // 5 +console.log(str); // "foo " +</pre> + +<h2 id="规范">规范</h2> + +<table> + <thead> + <tr> + <th scope="col">规范</th> + <th scope="col">状态</th> + <th scope="col">备注</th> + </tr> + </thead> + <tbody> + <tr> + <td><code><a href="https://github.com/tc39/proposal-string-left-right-trim/#stringprototypetrimstart--stringprototypetrimend">String.prototype.{trimStart,trimEnd}</a></code>proposal</td> + <td>Stage 4</td> + <td>Expected to be part of ES2019</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.String.trimStart")}}</p> + +<h2 id="Polyfill">Polyfill</h2> + +<pre class="brush: js">// https://github.com/FabioVergani/js-Polyfill_String-trimStart + +(function(w){ + var String=w.String, Proto=String.prototype; + + (function(o,p){ + if(p in o?o[p]?false:true:true){ + var r=/^\s+/; + o[p]=o.trimLeft||function(){ + return this.replace(r,'') + } + } + })(Proto,'trimStart'); + +})(window); + + +/* +ES6: +(w=>{ + const String=w.String, Proto=String.prototype; + + ((o,p)=>{ + if(p in o?o[p]?false:true:true){ + const r=/^\s+/; + o[p]=o.trimLeft||function(){ + return this.replace(r,'') + } + } + })(Proto,'trimStart'); + +})(window); +*/</pre> + +<h2 id="参见">参见</h2> + +<ul> + <li>{{jsxref("String.prototype.trim()")}}</li> + <li>{{jsxref("String.prototype.trimEnd()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/string/trimright/index.html b/files/zh-cn/web/javascript/reference/global_objects/string/trimright/index.html new file mode 100644 index 0000000000..9c8319cb29 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/string/trimright/index.html @@ -0,0 +1,84 @@ +--- +title: String.prototype.trimRight() +slug: Web/JavaScript/Reference/Global_Objects/String/TrimRight +tags: + - JavaScript + - Method + - Prototype + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/trimEnd +--- +<div>{{JSRef}}</div> + +<p><code><strong>trimEnd()</strong> </code>方法从一个字符串的末端移除空白字符。trimRight() 是这个方法的别名。</p> + +<p>{{EmbedInteractiveExample("pages/js/string-trimend.html")}}</p> + +<p>The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> and send us a pull request.</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code><var>str</var>.trimEnd(); +<var>str</var>.trimRight();</code></pre> + +<h3 id="返回值">返回值</h3> + +<p>一个新字符串，表示从调用字串的末（右）端除去空白。</p> + +<h2 id="Description" name="Description">描述</h2> + +<p><code>trimEnd()</code> / <code>trimRight()</code>方法移除原字符串右端的连续空白符并返回，<code>trimEnd()</code> / <code>trimRight()</code>方法并不会直接修改原字符串本身。</p> + +<h3 id="别名">别名</h3> + +<p>为了与 {{jsxref("String.prototype.padEnd")}} 等函数保持一致，标准方法名称为<code>trimEnd</code>。 但是，出于Web兼容性原因，<code>trimRight</code>仍然是<code>trimEnd</code>的别名。 在某些引擎中，这意味着：</p> + +<pre class="brush: js"><code>String.prototype.trimRight.name === "trimEnd";</code> +</pre> + +<h2 id="Examples" name="Examples">示例</h2> + +<h3 id="使用trimEnd">使用<code>trimEnd()</code></h3> + +<p>下面的例子输出了小写的字符串" foo":</p> + +<pre class="brush:js;highlight:[5]">var str = " foo "; + +alert(str.length); // 8 + +str = str.trimRight(); // 或写成str = str.trimEnd(); +console.log(str.length); // 6 +console.log(str); // ' foo' +</pre> + +<h2 id="Specifications">Specifications</h2> + +<table> + <thead> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + </thead> + <tbody> + <tr> + <td><code><a href="https://github.com/tc39/proposal-string-left-right-trim/#stringprototypetrimstart--stringprototypetrimend">String.prototype.{trimStart,trimEnd}</a></code>proposal</td> + <td>Stage 4</td> + <td>Expected to be part of ES2019</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility">Browser compatibility</h2> + +<p>The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.String.trimEnd")}}</p> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("String.prototype.trim()")}}</li> + <li>{{jsxref("String.prototype.trimStart()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/string/valueof/index.html b/files/zh-cn/web/javascript/reference/global_objects/string/valueof/index.html new file mode 100644 index 0000000000..7697c1074d --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/string/valueof/index.html @@ -0,0 +1,58 @@ +--- +title: String.prototype.valueOf() +slug: Web/JavaScript/Reference/Global_Objects/String/valueOf +translation_of: Web/JavaScript/Reference/Global_Objects/String/valueOf +--- +<div>{{JSRef}}</div> + +<p><strong><code>valueOf()</code></strong> 方法返回 {{jsxref("String")}} 对象的原始值</p> + +<div>{{EmbedInteractiveExample("pages/js/string-valueof.html")}}</div> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox notranslate"><code><var>str</var>.valueOf()</code></pre> + +<h3 id="返回结果">返回结果</h3> + +<p>A string representing the primitive value of a given {{jsxref("String")}} object.</p> + +<h2 id="描述">描述</h2> + +<p>The <code>valueOf()</code> method of {{jsxref("String")}} returns the primitive value of a {{jsxref("String")}} object as a string data type. This value is equivalent to {{jsxref("String.prototype.toString()")}}.</p> + +<p>此方法通常由JavaScript在内部调用，而不是在代码中显式调用。</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用_valueOf">使用 <code>valueOf()</code></h3> + +<pre class="brush: js notranslate">var x = new String('Hello world'); +console.log(x.valueOf()); // Displays 'Hello world' +</pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范</th> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.valueof', 'String.prototype.valueOf')}}</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p class="hidden">此页中的兼容性表是从结构化数据生成的。如果你想对数据有所贡献，请查看<a href="/zh-CN/docs/">https://github.com/mdn/browser-compat-data</a>并向我们发送请求。</p> + +<p>{{Compat("javascript.builtins.String.valueOf")}}</p> + +<h2 id="参见">参见</h2> + +<ul> + <li>{{jsxref("String.prototype.toString()")}}</li> + <li>{{jsxref("Object.prototype.valueOf()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/symbol/@@toprimitive/index.html b/files/zh-cn/web/javascript/reference/global_objects/symbol/@@toprimitive/index.html new file mode 100644 index 0000000000..3a4624f560 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/symbol/@@toprimitive/index.html @@ -0,0 +1,55 @@ +--- +title: 'Symbol.prototype[@@toPrimitive]' +slug: Web/JavaScript/Reference/Global_Objects/Symbol/@@toPrimitive +translation_of: Web/JavaScript/Reference/Global_Objects/Symbol/@@toPrimitive +--- +<div>{{JSRef}}</div> + +<p><code><strong>[@@toPrimitive]()</strong></code> 方法可将 Symbol 对象转换为原始值。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>Symbol()[Symbol.toPrimitive](hint); +</var></pre> + +<h3 id="返回值">返回值</h3> + +<p>该原始值为指定的 {{jsxref("Symbol")}} 对象</p> + +<h2 id="描述">描述</h2> + +<p> {{jsxref("Symbol")}} 的 <code>[@@toPrimitive]()</code> 方法返回该 Symbol 对象原始值作为 Symbol 数据形式。 <code>hint</code> 参数未被使用。</p> + +<p>JavaScript 调用 <code>[@@toPrimitive]() </code>方法将一个对象转换为原始值表示。你不需要自己调用 <code>[@@toPrimitive]()</code> 方法；当对象需要被转换为原始值时，JavaScript 会自动地调用该方法。</p> + +<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('ES6', '#sec-symbol.prototype-@@toprimitive', 'Symbol.prototype.@@toPrimitive')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-symbol.prototype-@@toprimitive', 'Symbol.prototype.@@toPrimitive')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{Compat("javascript.builtins.Symbol.@@toPrimitive")}}</p> + +<h2 id="参考资料">参考资料</h2> + +<ul> + <li>{{jsxref("Symbol.toPrimitive")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/symbol/asynciterator/index.html b/files/zh-cn/web/javascript/reference/global_objects/symbol/asynciterator/index.html new file mode 100644 index 0000000000..f0c05da9ab --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/symbol/asynciterator/index.html @@ -0,0 +1,76 @@ +--- +title: Symbol.asyncIterator +slug: Web/JavaScript/Reference/Global_Objects/Symbol/asyncIterator +translation_of: Web/JavaScript/Reference/Global_Objects/Symbol/asyncIterator +--- +<div>{{JSRef}}</div> + +<p><code><strong>Symbol.asyncIterator</strong></code> 符号指定了一个对象的默认异步迭代器。如果一个对象设置了这个属性，它就是异步可迭代对象，可用于<code><a href="/en-US/docs/Web/JavaScript/Reference/Statements/for-await...of">for await...of</a></code>循环。</p> + + + +<h2 id="描述">描述</h2> + +<p><code>Symbol.asyncIterator</code> 是一个用于访问对象的<code>@@asyncIterator</code>方法的内建符号。一个异步可迭代对象必须要有<code>Symbol.asyncIterator</code>属性。</p> + +<p>{{js_property_attributes(0,0,0)}}</p> + +<h2 id="示例">示例</h2> + +<h3 id="自定义异步可迭代对象">自定义异步可迭代对象</h3> + +<p>你可以通过设置<code>[Symbol.asyncIterator]</code>属性来自定义异步可迭代对象。</p> + +<pre class="brush: js">const myAsyncIterable = new Object(); +myAsyncIterable[Symbol.asyncIterator] = async function*() { + yield "hello"; + yield "async"; + yield "iteration!"; +}; + +(async () => { + for await (const x of myAsyncIterable) { + console.log(x); + // expected output: + // "hello" + // "async" + // "iteration!" + } +})(); +</pre> + +<h3 id="内建异步可迭代对象">内建异步可迭代对象</h3> + +<p>目前没有默认设定了<code>[Symbol.asyncIterator]</code>属性的JavaScript内建的对象。不过，WHATWG（网页超文本应用技术工作小组）Streams会被设定为第一批异步可迭代对象，<code>[Symbol.asyncIterator]</code> 最近已在设计规范中落地。</p> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">标准</th> + <th scope="col">状态</th> + <th scope="col">注释</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ES2018', '#sec-symbol.asynciterator', 'Symbol.asyncIterator')}}</td> + <td>{{Spec2('ES2018')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{compat("javascript.builtins.Symbol.asyncIterator")}}</p> + +<h2 id="参见">参见</h2> + +<ul> + <li><a href="/en-US/docs/Web/JavaScript/Reference/Iteration_protocols">Iteration protocols</a></li> + <li><a href="/en-US/docs/Web/JavaScript/Reference/Statements/for-await...of">for await... of</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/symbol/description/index.html b/files/zh-cn/web/javascript/reference/global_objects/symbol/description/index.html new file mode 100644 index 0000000000..1e52358a63 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/symbol/description/index.html @@ -0,0 +1,73 @@ +--- +title: Symbol.prototype.description +slug: Web/JavaScript/Reference/Global_Objects/Symbol/description +tags: + - JavaScript + - Property + - Prototype + - Symbol +translation_of: Web/JavaScript/Reference/Global_Objects/Symbol/description +--- +<div>{{JSRef}}</div> + +<p><code><strong>description</strong></code> 是一个只读属性，它会返回 {{jsxref("Symbol")}} 对象的可选描述的字符串。</p> + +<div>{{EmbedInteractiveExample("pages/js/symbol-prototype-description.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">Symbol('myDescription').description; +Symbol.iterator.description; +Symbol.for('foo').description; +</pre> + +<h2 id="描述">描述</h2> + +<p>{{jsxref("Symbol")}} 对象可以通过一个可选的描述创建，可用于调试，但不能用于访问 symbol 本身。<code>Symbol.prototype.description</code> 属性可以用于读取该描述。与 <code>Symbol.prototype.toString()</code> 不同的是它不会包含 "<code>Symbol()</code>" 的字符串。具体请看实例。</p> + +<h2 id="实例">实例</h2> + +<pre class="brush: js">Symbol('desc').toString(); // "Symbol(desc)" +Symbol('desc').description; // "desc" +Symbol('').description; // "" +Symbol().description; // undefined + +// well-known symbols +Symbol.iterator.toString(); // "Symbol(Symbol.iterator)" +Symbol.iterator.description; // "Symbol.iterator" + +// global symbols +Symbol.for('foo').toString(); // "Symbol(foo)" +Symbol.for('foo').description; // "foo" + +</pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + </tr> + <tr> + <td><code><a href="https://tc39.github.io/proposal-Symbol-description/#sec-symbol.prototype.description">get Symbol.prototype.description</a></code> proposal</td> + <td>Stage 3</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容">浏览器兼容</h2> + + + +<p>{{Compat("javascript.builtins.Symbol.description")}}</p> + +<h2 id="另请参阅">另请参阅</h2> + +<ul> + <li>{{jsxref("Symbol.prototype.toString()")}}</li> + <li>Polyfill: <a href="https://npmjs.com/symbol.prototype.description">https://npmjs.com/symbol.prototype.description</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/symbol/for/index.html b/files/zh-cn/web/javascript/reference/global_objects/symbol/for/index.html new file mode 100644 index 0000000000..ee0b84406a --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/symbol/for/index.html @@ -0,0 +1,154 @@ +--- +title: Symbol.for() +slug: Web/JavaScript/Reference/Global_Objects/Symbol/for +tags: + - JavaScript + - Method + - Symbol +translation_of: Web/JavaScript/Reference/Global_Objects/Symbol/for +--- +<div>{{JSRef}} </div> + +<p><code><strong>Symbol.for(key)</strong></code> 方法会根据给定的键 <code>key</code>，来从运行时的 symbol 注册表中找到对应的 symbol，如果找到了，则返回它，否则，新建一个与该键关联的 symbol，并放入全局 symbol 注册表中。</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><var>Symbol.for(key)</var>;</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt>key</dt> + <dd>一个字符串，作为 symbol 注册表中与某 symbol 关联的键（同时也会作为该 symbol 的描述）。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>返回由给定的 key 找到的 symbol，否则就是返回新创建的 symbol。</p> + +<h2 id="Description" name="Description">描述</h2> + +<p>和 <code>Symbol()</code> 不同的是，用 <code>Symbol.for()</code> 方法创建的的 symbol 会被放入一个全局 symbol 注册表中。<code>Symbol.for() 并不是每次都会创建一个新的 symbol</code>，它会首先检查给定的 key 是否已经在注册表中了。假如是，则会直接返回上次存储的那个。否则，它会再新建一个。</p> + +<h3 id="全局_symbol_注册表">全局 symbol 注册表</h3> + +<p>symbol 注册表中的记录结构：</p> + +<table class="standard-table"> + <caption>全局 symbol 注册表中的一个记录</caption> + <tbody> + <tr> + <th>字段名</th> + <th>字段值</th> + </tr> + <tr> + <td>[[key]]</td> + <td>一个字符串，用来标识每个 symbol</td> + </tr> + <tr> + <td>[[symbol]]</td> + <td>存储的 symbol 值</td> + </tr> + </tbody> +</table> + +<h2 id="示例">示例</h2> + +<pre class="brush: js">Symbol.for("foo"); // 创建一个 symbol 并放入 symbol 注册表中，键为 "foo" +Symbol.for("foo"); // 从 symbol 注册表中读取键为"foo"的 symbol + + +Symbol.for("bar") === Symbol.for("bar"); // true，证明了上面说的 +Symbol("bar") === Symbol("bar"); // false，Symbol() 函数每次都会返回新的一个 symbol + + +var sym = Symbol.for("mario"); +sym.toString(); +// "Symbol(mario)"，mario 既是该 symbol 在 symbol 注册表中的键名，又是该 symbol 自身的描述字符串 +</pre> + +<p>为了防止冲突，最好给你要放入 symbol 注册表中的 symbol 带上键前缀。</p> + +<pre class="brush: js">Symbol.for("mdn.foo"); +Symbol.for("mdn.bar"); +</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-symbol.for', 'Symbol.for')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-symbol.for', 'Symbol.for')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{ CompatibilityTable() }}</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>{{ CompatChrome(40) }}</td> + <td>{{ CompatGeckoDesktop("36.0") }}</td> + <td>{{ CompatNo() }}</td> + <td>{{ CompatNo() }}</td> + <td>10</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>{{ CompatNo() }}</td> + <td>{{ CompatNo() }}</td> + <td>{{ CompatGeckoMobile("36.0") }}</td> + <td>{{ CompatNo() }}</td> + <td>{{ CompatNo() }}</td> + <td>{{ CompatNo() }}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="See_Also" name="See_Also">相关链接</h2> + +<ul> + <li>{{jsxref("Symbol.keyFor()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/symbol/hasinstance/index.html b/files/zh-cn/web/javascript/reference/global_objects/symbol/hasinstance/index.html new file mode 100644 index 0000000000..ad28084f8e --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/symbol/hasinstance/index.html @@ -0,0 +1,59 @@ +--- +title: Symbol.hasInstance +slug: Web/JavaScript/Reference/Global_Objects/Symbol/hasInstance +translation_of: Web/JavaScript/Reference/Global_Objects/Symbol/hasInstance +--- +<p>{{JSRef}}</p> + +<p><strong><code>Symbol.hasInstance</code></strong>用于判断某对象是否为某构造器的实例。因此你可以用它自定义 {{jsxref("Operators/instanceof", "instanceof")}} 操作符在某个类上的行为。</p> + +<div> +<div>{{EmbedInteractiveExample("pages/js/symbol-hasinstance.html")}}</div> + +<div class="hidden">The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> and send us a pull request.</div> +</div> + +<div>{{js_property_attributes(0,0,0)}}</div> + +<h2 id="示例">示例</h2> + +<p><font face="Open Sans, Arial, sans-serif">你可实现一个自定义的</font><code>instanceof</code> 行为，<font face="Open Sans, Arial, sans-serif">例如：</font></p> + +<pre class="brush: js notranslate">class MyArray { + static [Symbol.hasInstance](instance) { + return Array.isArray(instance); + } +} +console.log([] instanceof MyArray); // true</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>{{SpecName('ES6', '#sec-symbol.hasinstance', 'Symbol.hasInstance')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-symbol.hasinstance', 'Symbol.hasInstance')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{Compat("javascript.builtins.Symbol.hasInstance")}}</p> + +<h2 id="参见">参见</h2> + +<ul> + <li>{{jsxref("Operators/instanceof", "instanceof")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/symbol/index.html b/files/zh-cn/web/javascript/reference/global_objects/symbol/index.html new file mode 100644 index 0000000000..9aec2c8777 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/symbol/index.html @@ -0,0 +1,227 @@ +--- +title: Symbol +slug: Web/JavaScript/Reference/Global_Objects/Symbol +tags: + - ECMAScript6 + - JavaScript + - Symbol +translation_of: Web/JavaScript/Reference/Global_Objects/Symbol +--- +<div>{{JSRef}} </div> + +<p><strong>symbol</strong> 是一种基本数据类型 （{{Glossary("Primitive", "primitive data type")}}）。<code>Symbol()</code>函数会返回<strong>symbol</strong>类型的值，该类型具有静态属性和静态方法。它的静态属性会暴露几个内建的成员对象；它的静态方法会暴露全局的symbol注册，且类似于内建对象类，但作为构造函数来说它并不完整，因为它不支持语法："<code>new Symbol()</code>"。</p> + +<p>每个从<code>Symbol()</code>返回的symbol值都是唯一的。一个symbol值能作为对象属性的标识符；这是该数据类型仅有的目的。更进一步的解析见—— <a href="https://developer.mozilla.org/en-US/docs/Glossary/Symbol">glossary entry for Symbol</a>。</p> + +<div>{{EmbedInteractiveExample("pages/js/symbol-constructor.html")}}</div> + + + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox notranslate"><code>Symbol(<em>[description]</em>)</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>description</code> {{optional_inline}}</dt> + <dd>可选的，字符串类型。对symbol的描述，可用于调试但不是访问symbol本身。</dd> +</dl> + +<h2 id="Description" name="Description">描述</h2> + +<p>直接使用<code>Symbol()</code>创建新的symbol类型，并用一个可选的字符串作为其描述。</p> + +<pre class="brush: js notranslate">var sym1 = Symbol(); +var sym2 = Symbol('foo'); +var sym3 = Symbol('foo'); +</pre> + +<p>上面的代码创建了三个新的symbol类型。 注意，<code>Symbol("foo")</code> 不会强制将字符串 “foo” 转换成symbol类型。它每次都会创建一个新的 symbol类型：</p> + +<pre class="brush: js notranslate">Symbol("foo") === Symbol("foo"); // false</pre> + +<p>下面带有 {{jsxref("Operators/new", "new")}} 运算符的语法将抛出 {{jsxref("TypeError")}} 错误：</p> + +<pre class="brush: js notranslate">var sym = new Symbol(); // TypeError</pre> + +<p>这会阻止创建一个显式的 Symbol 包装器对象而不是一个 Symbol 值。围绕原始数据类型创建一个显式包装器对象从 ECMAScript 6 开始不再被支持。 然而，现有的原始包装器对象，如 <code style="font-style: normal;">new Boolean</code>、<code style="font-style: normal;">new String</code>以及<span style="font-family: consolas,monaco,andale mono,monospace;"><code>new Number</code>，因为遗留原因仍可被创建。</span></p> + +<p>如果你真的想创建一个 <u>Symbol 包装器对象 </u>(<code>Symbol wrapper object</code>)，你可以使用 <code>Object()</code> 函数：</p> + +<pre class="brush: js notranslate">var sym = Symbol("foo"); +typeof sym; // "symbol" +var symObj = Object(sym); +typeof symObj; // "object"</pre> + +<h3 id="全局共享的_Symbol">全局共享的 Symbol</h3> + +<p>上面使用<code>Symbol()</code> 函数的语法，不会在你的整个代码库中创建一个可用的全局的symbol类型。 要创建跨文件可用的symbol，甚至跨域（每个都有它自己的全局作用域） , 使用 {{jsxref("Symbol.for()")}} 方法和 {{jsxref("Symbol.keyFor()")}} 方法从全局的symbol注册表设置和取得symbol。</p> + +<h3 id="在对象中查找_Symbol_属性">在对象中查找 Symbol 属性</h3> + +<p>{{jsxref("Object.getOwnPropertySymbols()")}} 方法让你在查找一个给定对象的符号属性时返回一个symbol类型的数组。注意，每个初始化的对象都是没有自己的symbol属性的，因此这个数组可能为空，除非你已经在对象上设置了symbol属性。</p> + +<h2 id="Properties" name="Properties">属性</h2> + +<dl> + <dt><code>Symbol.length</code></dt> + <dd>长度属性，值为0。</dd> + <dt>{{jsxref("Symbol.prototype")}}</dt> + <dd><code>symbol</code>构造函数的原型。</dd> +</dl> + +<h3 id="众所周知的_symbols">众所周知的 symbols</h3> + +<p>除了自己创建的symbol，JavaScript还内建了一些在ECMAScript 5 之前没有暴露给开发者的symbol，它们代表了内部语言行为。它们可以使用以下属性访问：</p> + +<dl> + <dt> + <h4 id="迭代_symbols">迭代 symbols</h4> + </dt> + <dt>{{jsxref("Symbol.iterator")}}</dt> + <dd>一个返回一个对象默认迭代器的方法。被 <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...of">for...of</a></code> 使用。</dd> + <dt>{{jsxref("Symbol.asyncIterator")}} {{experimental_inline}}</dt> + <dd>一个返回对象默认的异步迭代器的方法。被 <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for-await...of">for await of</a></code> 使用。</dd> + <dt> + <h4 id="正则表达式_symbols">正则表达式 symbols</h4> + </dt> + <dt>{{jsxref("Symbol.match")}}</dt> + <dd>一个用于对字符串进行匹配的方法，也用于确定一个对象是否可以作为正则表达式使用。被 {{jsxref("String.prototype.match()")}} 使用。</dd> + <dt>{{jsxref("Symbol.replace")}}</dt> + <dd>一个替换匹配字符串的子串的方法. 被 {{jsxref("String.prototype.replace()")}} 使用。</dd> + <dt>{{jsxref("Symbol.search")}}</dt> + <dd>一个返回一个字符串中与正则表达式相匹配的索引的方法。被{{jsxref("String.prototype.search()")}} 使用。</dd> + <dt>{{jsxref("Symbol.split")}}</dt> + <dd>一个在匹配正则表达式的索引处拆分一个字符串的方法.。被 {{jsxref("String.prototype.split()")}} 使用。</dd> + <dt> + <h4 id="其他_symbols">其他 symbols</h4> + </dt> + <dt>{{jsxref("Symbol.hasInstance")}}</dt> + <dd>一个确定一个构造器对象识别的对象是否为它的实例的方法。被 {{jsxref("Operators/instanceof", "instanceof")}} 使用。</dd> + <dt>{{jsxref("Symbol.isConcatSpreadable")}}</dt> + <dd>一个布尔值，表明一个对象是否应该flattened为它的数组元素。被 {{jsxref("Array.prototype.concat()")}} 使用。</dd> + <dt>{{jsxref("Symbol.unscopables")}}</dt> + <dd>拥有和继承属性名的一个对象的值被排除在与环境绑定的相关对象外。</dd> + <dt>{{jsxref("Symbol.species")}}</dt> + <dd>一个用于创建派生对象的构造器函数。</dd> + <dt>{{jsxref("Symbol.toPrimitive")}}</dt> + <dd>一个将对象转化为基本数据类型的方法。</dd> + <dt>{{jsxref("Symbol.toStringTag")}}</dt> + <dd>用于对象的默认描述的字符串值。被 {{jsxref("Object.prototype.toString()")}} 使用。</dd> +</dl> + +<h2 id="Methods" name="Methods">方法</h2> + +<dl> + <dt>{{jsxref("Symbol.for()", "Symbol.for(key)")}}</dt> + <dd>使用给定的key搜索现有的symbol，如果找到则返回该symbol。否则将使用给定的key在全局symbol注册表中创建一个新的symbol。</dd> + <dt>{{jsxref("Symbol.keyFor", "Symbol.keyFor(sym)")}}</dt> + <dd>从全局symbol注册表中，为给定的symbol检索一个共享的?symbol key。</dd> +</dl> + +<h2 id="Boolean_instances" name="Boolean_instances"><font face="Consolas, Monaco, Andale Mono, monospace">Symbol 原型</font></h2> + +<p>所有 Symbols 继承自 {{jsxref("Symbol.prototype")}}.</p> + +<h3 id="属性">属性</h3> + +<p>{{page('zh-CN/Web/JavaScript/Reference/Global_Objects/Symbol/prototype','Properties')}}</p> + +<h3 id="方法">方法</h3> + +<p>{{page('zh-CN/Web/JavaScript/Reference/Global_Objects/Symbol/prototype','Methods')}}</p> + +<h2 id="Examples" name="Examples">示例</h2> + +<h3 id="Creating_Boolean_objects_with_an_initial_value_of_false" name="Creating_Boolean_objects_with_an_initial_value_of_false">对 symbol 使用 typeof 运算符</h3> + +<p> {{jsxref("Operators/typeof", "typeof")}}运算符能帮助你识别 symbol 类型</p> + +<pre class="brush: js notranslate"><code class="language-js"><span class="keyword token">typeof</span> <span class="function token">Symbol<span class="punctuation token">(</span></span><span class="punctuation token">)</span> <span class="operator token">==</span><span class="operator token">=</span> <span class="string token">'symbol'</span> +<span class="keyword token">typeof</span> <span class="function token">Symbol<span class="punctuation token">(</span></span><span class="string token">'foo'</span><span class="punctuation token">)</span> <span class="operator token">==</span><span class="operator token">=</span> <span class="string token">'symbol'</span> +<span class="keyword token">typeof</span> Symbol<span class="punctuation token">.</span>iterator <span class="operator token">==</span><span class="operator token">=</span> <span class="string token">'symbol'</span></code> +</pre> + +<h3 id="Symbol_类型转换">Symbol 类型转换</h3> + +<p>当使用 symbol 值进行类型转换时需要注意一些事情：</p> + +<ul> + <li>尝试将一个 symbol 值转换为一个 number 值时，会抛出一个 {{jsxref("TypeError")}} 错误 (e.g. <code>+sym</code> or <code>sym | 0</code>).</li> + <li>使用宽松相等时， <code>Object(sym) == sym</code> returns <code>true.</code></li> + <li>这会阻止你从一个 symbol 值隐式地创建一个新的 string 类型的属性名。例如，<code>Symbol("foo") + "bar" 将抛出一个</code> {{jsxref("TypeError")}} (can't convert symbol to string).</li> + <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String#String_conversion">"safer" <code>String(sym)</code> conversion</a> 的作用会像symbol类型调用 {{jsxref("Symbol.prototype.toString()")}} 一样，但是注意 <code>new String(sym)</code> 将抛出异常。</li> +</ul> + +<h3 id="Symbols_与_for...in_迭代">Symbols 与 <code>for...in</code> 迭代</h3> + +<p>Symbols 在 <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...in"><code>for...in</code></a> 迭代中不可枚举。另外，{{jsxref("Object.getOwnPropertyNames()")}} 不会返回 symbol 对象的属性，但是你能使用 {{jsxref("Object.getOwnPropertySymbols()")}} 得到它们。</p> + +<pre class="brush: js line-numbers language-js notranslate"><code class="language-js"><span class="keyword token">var</span> obj <span class="operator token">=</span> <span class="punctuation token">{</span><span class="punctuation token">}</span><span class="punctuation token">;</span> + +obj<span class="punctuation token">[</span><span class="function token">Symbol</span><span class="punctuation token">(</span><span class="string token">"a"</span><span class="punctuation token">)</span><span class="punctuation token">]</span> <span class="operator token">=</span> <span class="string token">"a"</span><span class="punctuation token">;</span> +obj<span class="punctuation token">[</span>Symbol<span class="punctuation token">.</span><span class="keyword token">for</span><span class="punctuation token">(</span><span class="string token">"b"</span><span class="punctuation token">)</span><span class="punctuation token">]</span> <span class="operator token">=</span> <span class="string token">"b"</span><span class="punctuation token">;</span> +obj<span class="punctuation token">[</span><span class="string token">"c"</span><span class="punctuation token">]</span> <span class="operator token">=</span> <span class="string token">"c"</span><span class="punctuation token">;</span> +obj<span class="punctuation token">.</span>d <span class="operator token">=</span> <span class="string token">"d"</span><span class="punctuation token">;</span> + +<span class="keyword token">for</span> <span class="punctuation token">(</span><span class="keyword token">var</span> i <span class="keyword token">in</span> obj<span class="punctuation token">)</span> <span class="punctuation token">{</span> + console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>i<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// logs "c" and "d"</span> +<span class="punctuation token">}</span></code></pre> + +<h3 id="Symbols_与_JSON.stringify">Symbols 与 <code>JSON.stringify()</code></h3> + +<p>当使用 JSON.stringify() 时，以 symbol 值作为键的属性会被完全忽略：</p> + +<pre class="brush: js notranslate"><code class="language-js">JSON<span class="punctuation token">.</span><span class="function token">stringify</span><span class="punctuation token">(</span><span class="punctuation token">{</span><span class="punctuation token">[</span><span class="function token">Symbol</span><span class="punctuation token">(</span><span class="string token">"foo"</span><span class="punctuation token">)</span><span class="punctuation token">]</span><span class="punctuation token">:</span> <span class="string token">"foo"</span><span class="punctuation token">}</span><span class="punctuation token">)</span><span class="punctuation token">;</span> +<span class="comment token">// '{}'</span></code></pre> + +<p>更多细节，请看 {{jsxref("JSON.stringify()")}}。</p> + +<h3 id="Symbol_包装器对象作为属性的键">Symbol 包装器对象作为属性的键</h3> + +<p>当一个 Symbol 包装器对象作为一个属性的键时，这个对象将被强制转换为它包装过的 symbol 值：</p> + +<pre class="brush: js notranslate"><code class="language-js"><span class="keyword token">var</span> sym <span class="operator token">=</span> <span class="function token">Symbol</span><span class="punctuation token">(</span><span class="string token">"foo"</span><span class="punctuation token">)</span><span class="punctuation token">;</span> +<span class="keyword token">var</span> obj <span class="operator token">=</span> <span class="punctuation token">{</span><span class="punctuation token">[</span>sym<span class="punctuation token">]</span><span class="punctuation token">:</span> <span class="number token">1</span><span class="punctuation token">}</span><span class="punctuation token">;</span> +obj<span class="punctuation token">[</span>sym<span class="punctuation token">]</span><span class="punctuation token">;</span> <span class="comment token">// 1</span> +obj<span class="punctuation token">[</span><span class="function token">Object</span><span class="punctuation token">(</span>sym<span class="punctuation token">)</span><span class="punctuation token">]</span><span class="punctuation token">;</span> <span class="comment token">// still 1</span></code></pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table" style="height: 143px; width: 640px;"> + <tbody> + <tr> + <th scope="col">标准</th> + <th scope="col">状态</th> + <th scope="col">注释</th> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-symbol-objects', 'Symbol')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>原始定义</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-symbol-objects', 'Symbol')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.Symbol")}}</p> + +<h2 id="参考文档">参考文档</h2> + +<ul> + <li><a href="/en-US/docs/Glossary/Symbol">Glossary: Symbol data type</a></li> + <li>{{jsxref("Operators/typeof", "typeof")}}</li> + <li><a href="/en-US/docs/Web/JavaScript/Data_structures">Data types and data structures</a></li> + <li><a href="https://hacks.mozilla.org/2015/06/es6-in-depth-symbols/">"ES6 In Depth: Symbols"（深入ES6 Symbols ） on hacks.mozilla.org</a></li> +</ul> + +<div class="itanywhere-activator" style="left: 41px; top: 3679px; display: none;" title="Google Translator Anywhere"></div> diff --git a/files/zh-cn/web/javascript/reference/global_objects/symbol/isconcatspreadable/index.html b/files/zh-cn/web/javascript/reference/global_objects/symbol/isconcatspreadable/index.html new file mode 100644 index 0000000000..ed98d2bb29 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/symbol/isconcatspreadable/index.html @@ -0,0 +1,97 @@ +--- +title: Symbol.isConcatSpreadable +slug: Web/JavaScript/Reference/Global_Objects/Symbol/isConcatSpreadable +tags: + - JavaScript + - Symbol +translation_of: Web/JavaScript/Reference/Global_Objects/Symbol/isConcatSpreadable +--- +<div>{{JSRef}}</div> + +<p>内置的<strong><code>Symbol.isConcatSpreadable</code></strong><code>符号用于配置某对象作为</code>{{jsxref("Array.prototype.concat()")}}方法的参数时是否展开其数组元素。</p> + +<div>{{EmbedInteractiveExample("pages/js/symbol-isconcatspreadable.html")}}</div> + +<h2 id="描述">描述</h2> + +<p><code>@@isConcatSpreadable</code> 符号 (<code>Symbol.isConcatSpreadable</code>) 可以直接定义为对象属性或继承而来，它是布尔类型。它可以控制数组或类似数组（array-like）的对象的行为：</p> + +<ul> + <li>对于数组对象，默认情况下，用于concat时，会按数组元素展开然后进行连接（数组元素作为新数组的元素）。重置<code>Symbol.isConcatSpreadable</code>可以改变默认行为。</li> + <li>对于类似数组的对象，用于concat时，该对象整体作为新数组的元素，重置<code>Symbol.isConcatSpreadable</code>可改变默认行为。</li> +</ul> + +<p>{{js_property_attributes(0,0,0)}}</p> + +<h2 id="示例">示例</h2> + +<h3 id="数组">数组</h3> + +<p>默认情况下，{{jsxref("Array.prototype.concat()")}} 展开其元素连接到结果中：</p> + +<pre class="brush: js">var alpha = ['a', 'b', 'c'], + numeric = [1, 2, 3]; + +var alphaNumeric = alpha.concat(numeric); + +console.log(alphaNumeric); // 结果: ['a', 'b', 'c', 1, 2, 3] +</pre> + +<p>设置<code>Symbol.isConcatSpreadable</code>为<code>false</code>：</p> + +<pre class="brush: js">var alpha = ['a', 'b', 'c'], + numeric = [1, 2, 3]; + +numeric[Symbol.isConcatSpreadable] = false; +var alphaNumeric = alpha.concat(numeric); + +console.log(alphaNumeric); // 结果: ['a', 'b', 'c', [1, 2, 3] ] +</pre> + +<h3 id="Array-like_对象">Array-like 对象</h3> + +<p>对于类数组 (array-like)对象，默认不展开。期望展开其元素用于连接，需要设置 <code>Symbol.isConcatSpreadable</code> 为true：</p> + +<pre class="brush: js">var x = [1, 2, 3]; + +var fakeArray = { + [Symbol.isConcatSpreadable]: true, + length: 2, + 0: "hello", + 1: "world" +} + +x.concat(fakeArray); // [1, 2, 3, "hello", "world"] +</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>{{SpecName('ES6', '#sec-symbol.isconcatspreadable', 'Symbol.isconcatspreadable')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-symbol.isconcatspreadable', 'Symbol.isconcatspreadable')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td>No change.</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{Compat("javascript.builtins.Symbol.isConcatSpreadable")}}</p> + +<h2 id="参考">参考</h2> + +<ul> + <li>{{jsxref("Array.prototype.concat()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/symbol/iterator/index.html b/files/zh-cn/web/javascript/reference/global_objects/symbol/iterator/index.html new file mode 100644 index 0000000000..558a1323ca --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/symbol/iterator/index.html @@ -0,0 +1,94 @@ +--- +title: Symbol.iterator +slug: Web/JavaScript/Reference/Global_Objects/Symbol/iterator +tags: + - ECMAScript 2015 + - JavaScript + - Property + - Symbol +translation_of: Web/JavaScript/Reference/Global_Objects/Symbol/iterator +--- +<div>{{JSRef}}</div> + +<p><strong>Symbol.iterator </strong>为每一个对象定义了默认的迭代器。该迭代器可以被 <code><a href="/zh-CN/docs/Web/JavaScript/Reference/Statements/for...of">for...of</a></code> 循环使用。</p> + +<div>{{js_property_attributes(0,0,0)}}</div> + +<h2 id="描述">描述</h2> + +<p>当需要对一个对象进行迭代时（<font><font>比如开始用于一个</font></font><code><font><font>for..of</font></font></code><font><font>循环中</font></font>），它的<code>@@iterator</code>方法都会在不传参情况下被调用，返回的<strong>迭代器</strong>用于获取要迭代的值。</p> + +<p>一些内置类型拥有默认的迭代器行为，其他类型（如 {{jsxref("Object")}}）则没有。下表中的内置类型拥有默认的<span style="font-family: consolas,monaco,andale mono,monospace;"><code>@@iterator</code></span>方法：</p> + +<ul> + <li>{{jsxref("Array.@@iterator", "Array.prototype[@@iterator]()")}}</li> + <li>{{jsxref("TypedArray.@@iterator", "TypedArray.prototype[@@iterator]()")}}</li> + <li>{{jsxref("String.@@iterator", "String.prototype[@@iterator]()")}}</li> + <li>{{jsxref("Map.@@iterator", "Map.prototype[@@iterator]()")}}</li> + <li>{{jsxref("Set.@@iterator", "Set.prototype[@@iterator]()")}}</li> +</ul> + +<p>更多信息请参见<a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Iteration_protocols">迭代协议</a>。</p> + +<h2 id="示例">示例</h2> + +<h3 id="自定义迭代器">自定义迭代器</h3> + +<p>我们可以像下面这样创建自定义的迭代器：</p> + +<pre class="brush: js">var myIterable = {} +myIterable[Symbol.iterator] = function* () { + yield 1; + yield 2; + yield 3; +}; +[...myIterable] // [1, 2, 3] +</pre> + +<h3 id="不符合标准的迭代器">不符合标准的迭代器</h3> + +<p>如果一个迭代器 <code>@@iterator</code> 没有返回一个迭代器对象，那么它就是一个不符合标准的迭代器，这样的迭代器将会在运行期抛出异常，甚至非常诡异的 Bug。</p> + +<pre class="brush: js">var nonWellFormedIterable = {} +nonWellFormedIterable[Symbol.iterator] = () => 1 +[...nonWellFormedIterable] // TypeError: [] is not a function +</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-symbol.iterator', 'Symbol.iterator')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-symbol.iterator', 'Symbol.iterator')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div class="hidden">The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</div> + +<p>{{Compat("javascript.builtins.Symbol.iterator")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li><a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Iteration_protocols">迭代协议</a></li> + <li>{{jsxref("Array.@@iterator", "Array.prototype[@@iterator]()")}}</li> + <li>{{jsxref("TypedArray.@@iterator", "TypedArray.prototype[@@iterator]()")}}</li> + <li>{{jsxref("String.@@iterator", "String.prototype[@@iterator]()")}}</li> + <li>{{jsxref("Map.@@iterator", "Map.prototype[@@iterator]()")}}</li> + <li>{{jsxref("Set.@@iterator", "Set.prototype[@@iterator]()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/symbol/keyfor/index.html b/files/zh-cn/web/javascript/reference/global_objects/symbol/keyfor/index.html new file mode 100644 index 0000000000..150ae66f02 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/symbol/keyfor/index.html @@ -0,0 +1,115 @@ +--- +title: Symbol.keyFor() +slug: Web/JavaScript/Reference/Global_Objects/Symbol/keyFor +translation_of: Web/JavaScript/Reference/Global_Objects/Symbol/keyFor +--- +<div>{{JSRef("Global_Objects", "Symbol")}}</div> + +<h2 id="Summary" name="Summary">概述</h2> + +<p><code><strong>Symbol.keyFor(sym)</strong></code> 方法用来获取全局symbol 注册表中与某个 symbol 关联的键。</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox notranslate"><var>Symbol.keyFor(sym)</var>;</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt>sym</dt> + <dd>必选参数，需要查找键值的某个 Symbol 。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<dl> + <dd>如果全局注册表中查找到该symbol，则返回该symbol的key值，返回值为字符串类型。否则返回undefined</dd> +</dl> + +<h2 id="示例">示例</h2> + +<pre class="brush: js notranslate">// 创建一个全局 Symbol +var globalSym = Symbol.for("foo"); +Symbol.keyFor(globalSym); // "foo" + +var localSym = Symbol(); +Symbol.keyFor(localSym); // undefined， + +// 以下Symbol不是保存在全局Symbol注册表中 +Symbol.keyFor(Symbol.iterator) // undefined +</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('ES6', '#sec-symbol.keyfor', 'Symbol.keyFor')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{ CompatibilityTable() }}</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>{{ CompatNo() }}</td> + <td>{{ CompatGeckoDesktop("33.0") }}</td> + <td>{{ CompatNo() }}</td> + <td>{{ CompatNo() }}</td> + <td>{{ CompatNo() }}</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>{{ CompatNo() }}</td> + <td>{{ CompatNo() }}</td> + <td>{{ CompatGeckoMobile("33.0") }}</td> + <td>{{ CompatNo() }}</td> + <td>{{ CompatNo() }}</td> + <td>{{ CompatNo() }}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="See_Also" name="See_Also">相关链接</h2> + +<ul> + <li>{{jsxref("Symbol.prototype.for()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/symbol/match/index.html b/files/zh-cn/web/javascript/reference/global_objects/symbol/match/index.html new file mode 100644 index 0000000000..793b0ea01c --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/symbol/match/index.html @@ -0,0 +1,78 @@ +--- +title: Symbol.match +slug: Web/JavaScript/Reference/Global_Objects/Symbol/match +tags: + - JavaScript + - Symbol + - 属性 +translation_of: Web/JavaScript/Reference/Global_Objects/Symbol/match +--- +<div>{{JSRef}}</div> + +<p><code><strong>Symbol.match </strong></code>指定了匹配的是正则表达式而不是字符串。{{jsxref("String.prototype.match()")}} 方法会调用此函数。</p> + +<div>{{EmbedInteractiveExample("pages/js/symbol-match.html")}}</div> + + + +<h2 id="描述">描述</h2> + +<p>此函数还用于标识对象是否具有正则表达式的行为。比如， {{jsxref("String.prototype.startsWith()")}}，{{jsxref("String.prototype.endsWith()")}} 和 {{jsxref("String.prototype.includes()")}} 这些方法会检查其第一个参数是否是正则表达式，是正则表达式就抛出一个{{jsxref("TypeError")}}。现在，如果 <code>match</code> symbol 设置为 <code>false</code>（或者一个 {{Glossary("Falsy", "假值")}}），就表示该对象不打算用作正则表达式对象。</p> + +<p>{{js_property_attributes(0,0,0)}}</p> + +<h2 id="示例">示例</h2> + +<h3 id="禁止表达式检查">禁止表达式检查</h3> + +<p>下面代码会抛出一个 {{jsxref("TypeError")}}：</p> + +<pre class="brush: js">"/bar/".startsWith(/bar/); + +// Throws TypeError, 因为 /bar/ 是一个正则表达式 +// 且 Symbol.match 没有修改。</pre> + +<p>但是，如果你将 <code>Symbol.match</code> 置为 <code>false</code>，使用 <code>match</code> 属性的表达式检查会认为该象不是正则表达式对象。<code>startsWith</code> 和 <code>endsWith</code> 方法将不会抛出 <code>TypeError</code>。</p> + +<pre class="brush: js">var re = /foo/; +re[Symbol.match] = false; +"/foo/".startsWith(re); // true +"/baz/".endsWith(re); // false +</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-symbol.match', 'Symbol.match')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-symbol.match', 'Symbol.match')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器支持">浏览器支持</h2> + + + +<p>{{Compat("javascript.builtins.Symbol.match")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Symbol.replace")}}</li> + <li>{{jsxref("Symbol.search")}}</li> + <li>{{jsxref("Symbol.split")}}</li> + <li>{{jsxref("RegExp.@@match", "RegExp.prototype[@@match]()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/symbol/matchall/index.html b/files/zh-cn/web/javascript/reference/global_objects/symbol/matchall/index.html new file mode 100644 index 0000000000..730107b31c --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/symbol/matchall/index.html @@ -0,0 +1,65 @@ +--- +title: Symbol.matchAll +slug: Web/JavaScript/Reference/Global_Objects/Symbol/matchAll +tags: + - JavaScript + - Property + - Reference + - Symbol +translation_of: Web/JavaScript/Reference/Global_Objects/Symbol/matchAll +--- +<div>{{JSRef}}</div> + +<p><code><strong>Symbol.matchAll</strong></code> 返回一个迭代器，该迭代器根据字符串生成正则表达式的匹配项。此函数可以被 {{jsxref("String.prototype.matchAll()")}} 方法调用。</p> + +<div>{{EmbedInteractiveExample("pages/js/symbol-matchall.html")}}</div> + + + +<h2 id="描述">描述</h2> + +<div> +<p>此Symbol用于 {{jsxref("String.prototype.matchAll()")}} 特别是 {{jsxref("RegExp.@@matchAll", "RegExp.prototype[@@matchAll]()")}}。下面两个例子返回相同的结果:</p> + +<pre class="brush: js">'abc'.matchAll(/a/); + +/a/[Symbol.matchAll]('abc');</pre> + +<p>此方法用于自定义 {{jsxref("RegExp")}} 子类中的匹配行为。</p> + +<p>{{js_property_attributes(0,0,0)}}</p> +</div> + +<h2 id="示例">示例</h2> + +<p>更多示例请查阅 {{jsxref("String.prototype.matchAll()")}} 和 {{jsxref("RegExp.@@matchAll", "RegExp.prototype[@@matchAll]()")}}。</p> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">文档</th> + <th scope="col">状态</th> + <th scope="col">备注</th> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-symbol.matchall', 'Symbol.matchAll')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器支持">浏览器支持</h2> + + + +<p>{{Compat("javascript.builtins.Symbol.matchAll")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("String.prototype.matchAll()")}}</li> + <li>{{jsxref("RegExp.@@matchAll", "RegExp.prototype[@@matchAll]()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/symbol/prototype/index.html b/files/zh-cn/web/javascript/reference/global_objects/symbol/prototype/index.html new file mode 100644 index 0000000000..4ba14f92c5 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/symbol/prototype/index.html @@ -0,0 +1,66 @@ +--- +title: Symbol.prototype +slug: Web/JavaScript/Reference/Global_Objects/Symbol/prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Symbol +--- +<div>{{JSRef}}</div> + +<p><code><strong>Symbol</strong></code><strong><code>.prototype</code></strong> 表示 {{jsxref("Symbol")}} 构造函数的原型。.</p> + +<div>{{EmbedInteractiveExample("pages/js/symbol-prototype.html")}}</div> + +<h2 id="Description">Description</h2> + +<p>{{jsxref("Symbol")}} 继承自 {{jsxref("Symbol.prototype")}}. 你可以使用构造函数的原型对象来给所有Symbol实例添加属性或者方法。</p> + +<p>{{js_property_attributes(0,0,0)}}</p> + +<h2 id="Properties">Properties</h2> + +<dl> + <dt><code>Symbol.prototype.constructor</code></dt> + <dd>返回创建实例原型的函数. 默认为 {{jsxref("Symbol")}} 函数。</dd> + <dt>{{jsxref("Symbol.prototype.description")}}</dt> + <dd>一个包含symbol描述的只读字符串。</dd> +</dl> + +<h2 id="Methods">Methods</h2> + +<dl> + <dt>{{jsxref("Symbol.prototype.toSource()")}} {{Non-standard_inline}}</dt> + <dd>返回包含{{jsxref("Global_Objects/Symbol", "Symbol")}} 对象源码的字符串。覆盖{{jsxref("Object.prototype.toSource()")}} 方法。</dd> + <dt>{{jsxref("Symbol.prototype.toString()")}}</dt> + <dd>返回包含Symbol描述符的字符串。 覆盖{{jsxref("Object.prototype.toString()")}} 方法。</dd> + <dt>{{jsxref("Symbol.prototype.valueOf()")}}</dt> + <dd>返回 {{jsxref("Symbol")}} 对象的初始值.。覆盖 {{jsxref("Object.prototype.valueOf()")}} 方法。</dd> + <dt>{{jsxref("Symbol.prototype.@@toPrimitive()", "Symbol.prototype[@@toPrimitive]")}}</dt> + <dd> 返回{{jsxref("Symbol")}}对象的初始值。</dd> +</dl> + +<h2 id="Specifications">Specifications</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('ES6', '#sec-symbol.prototype', 'Symbol.prototype')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-symbol.prototype', 'Symbol.prototype')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容">浏览器兼容</h2> + +<p>{{Compat("javascript.builtins.Symbol.prototype")}}</p> + +<div id="compat-mobile"></div> diff --git a/files/zh-cn/web/javascript/reference/global_objects/symbol/replace/index.html b/files/zh-cn/web/javascript/reference/global_objects/symbol/replace/index.html new file mode 100644 index 0000000000..b5a5eeb5ea --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/symbol/replace/index.html @@ -0,0 +1,52 @@ +--- +title: Symbol.replace +slug: Web/JavaScript/Reference/Global_Objects/Symbol/replace +tags: + - JavaScript + - Symbol +translation_of: Web/JavaScript/Reference/Global_Objects/Symbol/replace +--- +<div>{{JSRef}}</div> + +<p><code><strong>Symbol.replace</strong></code> 这个属性指定了当一个字符串替换所匹配字符串时所调用的方法。{{jsxref("String.prototype.replace()")}} 方法会调用此方法。</p> + +<p>更多信息， 详见 {{jsxref("RegExp.@@replace", "RegExp.prototype[@@replace]()")}} 和 {{jsxref("String.prototype.replace()")}}。</p> + +<p>{{EmbedInteractiveExample("pages/js/symbol-replace.html")}}</p> + +<div>{{js_property_attributes(0,0,0)}}</div> + +<h2 id="Specifications">Specifications</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-symbol.replace', 'Symbol.replace')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-symbol.replace', 'Symbol.replace')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility">Browser compatibility</h2> + +<p>{{Compat("javascript.builtins.Symbol.replace")}}</p> + +<h2 id="See_also">See also</h2> + +<ul> + <li>{{jsxref("Symbol.match")}}</li> + <li>{{jsxref("Symbol.search")}}</li> + <li>{{jsxref("Symbol.split")}}</li> + <li>{{jsxref("RegExp.@@replace", "RegExp.prototype[@@replace]()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/symbol/search/index.html b/files/zh-cn/web/javascript/reference/global_objects/symbol/search/index.html new file mode 100644 index 0000000000..c1efdd302e --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/symbol/search/index.html @@ -0,0 +1,113 @@ +--- +title: Symbol.search +slug: Web/JavaScript/Reference/Global_Objects/Symbol/search +translation_of: Web/JavaScript/Reference/Global_Objects/Symbol/search +--- +<div>{{JSRef}}</div> + +<div></div> + +<p><code>Symbol.search 指定了一个搜索方法，这个方法接受用户输入的正则表达式，返回该正则表达式在字符串中匹配到的下标，这个方法由以下的方法来调用 </code>{{jsxref("String.prototype.search()")}}。</p> + +<p>更多信息请参见 {{jsxref("RegExp.@@search", "RegExp.prototype[@@search]()")}} 和{{jsxref("String.prototype.search()")}}.</p> + +<div>{{js_property_attributes(0,0,0)}}</div> + +<h2 id="案例">案例</h2> + +<h3 id="自定义字符串搜索">自定义字符串搜索</h3> + +<pre class="notranslate">class caseInsensitiveSearch { + constructor(value) { + this.value = value.toLowerCase(); + } + [Symbol.search](string) { + return string.toLowerCase().indexOf(this.value); + } +} + +console.log('foobar'.search(new caseInsensitiveSearch('BaR'))); +// expected output: 3</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-symbol.search', 'Symbol.search')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>规范中定义的几个部分</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-symbol.search', 'Symbol.search')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{CompatibilityTable}}</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>基本支持</td> + <td>{{CompatChrome(50)}}</td> + <td>{{ CompatGeckoDesktop(49) }}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</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>基本支持</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{ CompatGeckoMobile(49) }}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="参见">参见</h2> + +<ul> + <li>{{jsxref("Symbol.match")}}</li> + <li>{{jsxref("Symbol.replace")}}</li> + <li>{{jsxref("Symbol.split")}}</li> + <li>{{jsxref("RegExp.@@search", "RegExp.prototype[@@search]()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/symbol/species/index.html b/files/zh-cn/web/javascript/reference/global_objects/symbol/species/index.html new file mode 100644 index 0000000000..aeb9918a47 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/symbol/species/index.html @@ -0,0 +1,73 @@ +--- +title: Symbol.species +slug: Web/JavaScript/Reference/Global_Objects/Symbol/species +tags: + - ECMAScript 2015 + - JavaScript + - Property + - Symbol +translation_of: Web/JavaScript/Reference/Global_Objects/Symbol/species +--- +<div>{{JSRef}}</div> + +<p>知名的<strong> </strong><code><strong>Symbol.species</strong></code> 是个函数值属性，其被构造函数用以创建派生对象。</p> + +<div>{{EmbedInteractiveExample("pages/js/symbol-species.html")}}</div> + + + +<div>{{js_property_attributes(0,0,0)}}</div> + +<h2 id="描述">描述</h2> + +<p>species 访问器属性允许子类覆盖对象的默认构造函数。</p> + +<h2 id="示例">示例</h2> + +<p>你可能想在扩展数组类 <code>MyArray </code>上返回 {{jsxref("Array")}} 对象。 例如，当使用例如 {{jsxref("Array.map", "map()")}} 这样的方法返回默认的构造函数时，你希望这些方法能够返回父级的 Array 对象，以取代 <code>MyArray</code> 对象。<code>Symbol.species</code> 允许你这么做：</p> + +<pre class="brush: js">class MyArray extends Array { + // 覆盖 species 到父级的 Array 构造函数上 + static get [Symbol.species]() { return Array; } +} +var a = new MyArray(1,2,3); +var mapped = a.map(x => x * x); + +console.log(mapped instanceof MyArray); // false +console.log(mapped instanceof Array); // true +</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('ES6', '#sec-symbol.species', 'Symbol.species')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-symbol.species', 'Symbol.species')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.Symbol.species")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Map.@@species", "Map[@@species]")}}</li> + <li>{{jsxref("Set.@@species", "Set[@@species]")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/symbol/split/index.html b/files/zh-cn/web/javascript/reference/global_objects/symbol/split/index.html new file mode 100644 index 0000000000..53b98d57cd --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/symbol/split/index.html @@ -0,0 +1,117 @@ +--- +title: Symbol.split +slug: Web/JavaScript/Reference/Global_Objects/Symbol/split +translation_of: Web/JavaScript/Reference/Global_Objects/Symbol/split +--- +<div>{{JSRef}}</div> + +<p><code><strong>Symbol.split</strong></code> 指向 一个正则表达式的索引处分割字符串的方法。 这个方法通过 {{jsxref("String.prototype.split()")}} 调用。</p> + +<p>详情请参阅{{jsxref("RegExp.@@split", "RegExp.prototype[@@split]()")}} 和{{jsxref("String.prototype.split()")}}.</p> + +<div>{{EmbedInteractiveExample("pages/js/symbol-split.html")}}</div> + +<div class="hidden">The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> and send us a pull request.</div> + +<div>{{js_property_attributes(0,0,0)}}</div> + +<h2 id="示例">示例</h2> + +<p>[Symbol.split]指向‘aba’.split(/a/)</p> + +<pre class="brush: js notranslate">/a/[Symbol.split]('aba',3)</pre> + +<p>"dayinlove".split(exp)调用[Symbol.split](str)处理，并把实参"dayinlove"传给形参str</p> + +<pre class="brush: js notranslate">var exp = { + pat:'in', + [Symbol.split](str) { + return str.split(this.pat); + } + } + + "dayinlove".split(exp); +//["day", "love"]</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>{{SpecName('ES6', '#sec-symbol.split', 'Symbol.split')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>初始定义.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-symbol.split', 'Symbol.split')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{CompatibilityTable}}</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>{{CompatChrome(50)}}</td> + <td>{{ CompatGeckoDesktop(49) }}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</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>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{ CompatGeckoMobile(49) }}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="参阅">参阅</h2> + +<ul> + <li>{{jsxref("Symbol.match")}}</li> + <li>{{jsxref("Symbol.replace")}}</li> + <li>{{jsxref("Symbol.search")}}</li> + <li>{{jsxref("RegExp.@@split", "RegExp.prototype[@@split]()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/symbol/toprimitive/index.html b/files/zh-cn/web/javascript/reference/global_objects/symbol/toprimitive/index.html new file mode 100644 index 0000000000..61e4d36fb9 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/symbol/toprimitive/index.html @@ -0,0 +1,87 @@ +--- +title: Symbol.toPrimitive +slug: Web/JavaScript/Reference/Global_Objects/Symbol/toPrimitive +translation_of: Web/JavaScript/Reference/Global_Objects/Symbol/toPrimitive +--- +<div>{{JSRef}}</div> + +<div></div> + +<p><code><strong>Symbol.toPrimitive</strong></code> 是一个内置的 Symbol 值，它是作为对象的函数值属性存在的，当一个对象转换为对应的原始值时，会调用此函数。</p> + +<div>{{EmbedInteractiveExample("pages/js/symbol-toprimitive.html")}}</div> + +<h2 id="描述">描述</h2> + +<p>在 <code>Symbol.toPrimitive</code> 属性(用作函数值)的帮助下，一个对象可被转换为原始值。该函数被调用时，会被传递一个字符串参数 <code>hint</code> ，表示要转换到的原始值的预期类型。 <code>hint</code> 参数的取值是 <code>"number"</code>、<code>"string"</code> 和 <code>"default"</code> 中的任意一个。</p> + +<p>{{js_property_attributes(0,0,0)}}</p> + +<h2 id="示例">示例</h2> + +<p>下面的例子展示了， <code>Symbol.toPrimitive</code> 属性是如何干扰一个对象转换为原始值时输出的结果的。</p> + +<pre class="brush: js">// 一个没有提供 Symbol.toPrimitive 属性的对象，参与运算时的输出结果 +var obj1 = {}; +console.log(+obj1); // NaN +console.log(`${obj1}`); // "[object Object]" +console.log(obj1 + ""); // "[object Object]" + +// 接下面声明一个对象，手动赋予了 Symbol.toPrimitive 属性，再来查看输出结果 +var obj2 = { + [Symbol.toPrimitive](hint) { + if (hint == "number") { + return 10; + } + if (hint == "string") { + return "hello"; + } + return true; + } +}; +console.log(+obj2); // 10 -- hint 参数值是 "number" +console.log(`${obj2}`); // "hello" -- hint 参数值是 "string" +console.log(obj2 + ""); // "true" -- hint 参数值是 "default" +</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>{{SpecName('ES6', '#sec-symbol.toprimitive', 'Symbol.toPrimitive')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>原始定义</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-symbol.toprimitive', 'Symbol.toPrimitive')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p> {{Compat("javascript.builtins.Symbol.toPrimitive")}}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + </tbody> +</table> +</div> + +<h2 id="其他资料">其他资料</h2> + +<ul> + <li>{{jsxref("Date.@@toPrimitive", "Date.prototype[@@toPrimitive]")}}</li> + <li>{{jsxref("Symbol.@@toPrimitive", "Symbol.prototype[@@toPrimitive]")}}</li> + <li>{{jsxref("Object.prototype.toString()")}}</li> + <li>{{jsxref("Object.prototype.valueOf()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/symbol/tosource/index.html b/files/zh-cn/web/javascript/reference/global_objects/symbol/tosource/index.html new file mode 100644 index 0000000000..56d7571d55 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/symbol/tosource/index.html @@ -0,0 +1,93 @@ +--- +title: Symbol.prototype.toSource() +slug: Web/JavaScript/Reference/Global_Objects/Symbol/toSource +translation_of: Web/JavaScript/Reference/Global_Objects/Symbol/toSource +--- +<div>{{JSRef}} {{Non-standard_header}}</div> + +<p><code><strong>toSource()</strong></code> 方法返回代表该对象源码的字符串。</p> + +<p>该方法通常由JavaScript内部调用。</p> + +<h2 id="Syntax">Syntax</h2> + +<pre class="syntaxbox"><var>Symbol</var>.toSource() + +var sym = Symbol() +sym.toSource()</pre> + +<h2 id="Description">Description</h2> + +<p><code>toSource</code>方法返回以下值：</p> + +<p>对于内建<code>Symbol对象</code>, <code>toSource</code> 返回以下字符串，表明源代码不可见：</p> + +<pre class="brush:js">"function Symbol() { + [native code] +}"</pre> + +<p>对于<code>Symbol实例</code>, <code>toSource</code> 返回代表源码的字符串。</p> + +<pre class="brush: js">"Symbol()"</pre> + +<h2 id="Specifications">Specifications</h2> + +<p>还未成为任何标准的一部分</p> + +<h2 id="Browser_compatibility">Browser compatibility</h2> + +<p>{{CompatibilityTable}}</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>{{CompatNo}}</td> + <td>{{ CompatGeckoDesktop("36.0") }}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</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>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{ CompatGeckoMobile("36.0") }}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="See_also">See also</h2> + +<ul> + <li>{{jsxref("Object.prototype.toSource()")}} {{Non-standard_inline}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/symbol/tostring/index.html b/files/zh-cn/web/javascript/reference/global_objects/symbol/tostring/index.html new file mode 100644 index 0000000000..1ed899232e --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/symbol/tostring/index.html @@ -0,0 +1,116 @@ +--- +title: Symbol.prototype.toString() +slug: Web/JavaScript/Reference/Global_Objects/Symbol/toString +translation_of: Web/JavaScript/Reference/Global_Objects/Symbol/toString +--- +<div>{{JSRef("Global_Objects", "Symbol")}}</div> + +<h2 id="Summary" name="Summary">概述</h2> + +<p><code><strong>toString()</strong></code> 方法返回当前 symbol 对象的字符串表示。</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><var>symbol.toString()</var>;</pre> + +<h2 id="Description" name="Description">描述</h2> + +<p>{{jsxref("Symbol")}} 对象拥有自己的 <code>toString</code> 方法，因而遮蔽了原型链上的 {{jsxref("Object.prototype.toString()")}}。</p> + +<h3 id="symbol_原始值不能转换为字符串">symbol 原始值不能转换为字符串</h3> + +<p>symbol 原始值不能转换为字符串，所以只能先转换成它的包装对象，再调用 <code>toString()</code> 方法：</p> + +<pre class="brush: js">Symbol("foo") + "bar"; +// TypeError: Can't convert symbol to string +Symbol("foo").toString() + "bar" +// "Symbol(foo)bar"，就相当于下面的: +Object(Symbol("foo")).toString() + "bar" +// "Symbol(foo)bar" +</pre> + +<h2 id="示例">示例</h2> + +<pre class="brush: js">Symbol("desc").toString(); // "Symbol(desc)" + +// well-known symbols +Symbol.iterator.toString(); // "Symbol(Symbol.iterator) + +// global symbols +Symbol.for("foo").toString() // "Symbol(foo)" +</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('ES6', '#sec-symbol.prototype.tostring', 'Symbol.prototype.toString')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{ CompatibilityTable() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatGeckoDesktop("33.0") }}</td> + <td>{{ CompatNo() }}</td> + <td>{{ CompatNo() }}</td> + <td>{{ CompatNo() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatGeckoMobile("33.0") }}</td> + <td>{{ CompatNo() }}</td> + <td>{{ CompatNo() }}</td> + <td>{{ CompatNo() }}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="See_Also" name="See_Also">相关链接</h2> + +<ul> + <li>{{jsxref("Object.prototype.toString()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/symbol/tostringtag/index.html b/files/zh-cn/web/javascript/reference/global_objects/symbol/tostringtag/index.html new file mode 100644 index 0000000000..c09f904a6e --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/symbol/tostringtag/index.html @@ -0,0 +1,129 @@ +--- +title: Symbol.toStringTag +slug: Web/JavaScript/Reference/Global_Objects/Symbol/toStringTag +translation_of: Web/JavaScript/Reference/Global_Objects/Symbol/toStringTag +--- +<div>{{JSRef}}</div> + +<p><strong><code>Symbol.toStringTag</code></strong> 是一个内置 symbol，它通常作为对象的属性键使用，对应的属性值应该为字符串类型，这个字符串用来表示该对象的自定义类型标签，通常只有内置的 {{jsxref("Object.prototype.toString()")}} 方法会去读取这个标签并把它包含在自己的返回值里。</p> + +<div>{{js_property_attributes(0,0,0)}}</div> + +<h2 id="描述">描述</h2> + +<p>许多内置的 JavaScript 对象类型即便没有 <code>toStringTag</code> 属性，也能被 <code>toString()</code> 方法识别并返回特定的类型标签，比如：</p> + +<pre class="brush: js">Object.prototype.toString.call('foo'); // "[object String]" +Object.prototype.toString.call([1, 2]); // "[object Array]" +Object.prototype.toString.call(3); // "[object Number]" +Object.prototype.toString.call(true); // "[object Boolean]" +Object.prototype.toString.call(undefined); // "[object Undefined]" +Object.prototype.toString.call(null); // "[object Null]" +// ... and more +</pre> + +<p>另外一些对象类型则不然，<code>toString()</code> 方法能识别它们是因为引擎为它们设置好了 <code>toStringTag</code> 标签：</p> + +<pre class="brush: js">Object.prototype.toString.call(new Map()); // "[object Map]" +Object.prototype.toString.call(function* () {}); // "[object GeneratorFunction]" +Object.prototype.toString.call(Promise.resolve()); // "[object Promise]" +// ... and more +</pre> + +<p>但你自己创建的类不会有这份特殊待遇，<code>toString() </code>找不到 <code>toStringTag</code> 属性时只好返回默认的 <code>Object</code> 标签：</p> + +<pre class="brush: js">class ValidatorClass {} + +Object.prototype.toString.call(new ValidatorClass()); // "[object Object]" +</pre> + +<p>加上 <code>toStringTag</code> 属性，你的类也会有自定义的类型标签了：</p> + +<pre class="brush: js">class ValidatorClass { + get [Symbol.toStringTag]() { + return "Validator"; + } +} + +Object.prototype.toString.call(new ValidatorClass()); // "[object Validator]" +</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('ES6', '#sec-symbol.tostringtag', 'Symbol.toStringTag')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-symbol.tostringtag', 'Symbol.toStringTag')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{CompatibilityTable}}</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>{{CompatChrome(49)}}</td> + <td>{{CompatGeckoDesktop(51)}}</td> + <td>{{CompatNo}}</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(51)}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Object.prototype.toString()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/symbol/unscopables/index.html b/files/zh-cn/web/javascript/reference/global_objects/symbol/unscopables/index.html new file mode 100644 index 0000000000..ab6483defd --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/symbol/unscopables/index.html @@ -0,0 +1,89 @@ +--- +title: Symbol.unscopables +slug: Web/JavaScript/Reference/Global_Objects/Symbol/unscopables +tags: + - ECMAScript 2015 + - JavaScript + - Property + - Symbol +translation_of: Web/JavaScript/Reference/Global_Objects/Symbol/unscopables +--- +<div>{{JSRef}}</div> + +<p><strong><code>Symbol.unscopables </code></strong>指用于指定对象值，其对象自身和继承的从关联对象的 with 环境绑定中排除的属性名称。</p> + +<div>{{EmbedInteractiveExample("pages/js/symbol-unscopables.html")}}</div> + +<h2 id="描述">描述</h2> + +<p>可以在任何对象上定义 <code>@@unscopables</code> symbol (<code>Symbol.unscopables</code>)，用于排除属性名称并与 <code>with</code> 环境绑定在一起作为词法变量公开。 请注意，如果使用 <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Strict_mode">Strict mode</a>，语句将不可用，并且可能也不需要 symbol。</p> + +<p>在 <code>unscopables</code> 对象上设置属性为 true，将使其 <em>unscopable</em> 并且因此该属性也将不会在词法环境变量中出现。 如果设置属性为 <code>false</code> ，则将使其可 <code>scopable</code> 并且该属性会出现在词法环境变量中。</p> + +<p>{{js_property_attributes(0,0,0)}}</p> + +<h2 id="示例">示例</h2> + +<p>下列的代码可兼容 ES5 及以下版本。然而，在 ECMAScript 2015 (ES6) 或其后续版本中，{{jsxref("Array.prototype.keys()")}} 方法才会出现。意味着内部 <code>with</code> 环境“关键字” 存在该方法，但变量中不会存在。 也就是说，当 <code>unscopable</code>s symbol 被展示时，内置的<code>unscopables </code>设置是由 {{jsxref("Array.@@unscopables", "Array.prototype[@@unscopables]")}} 展示并实现的， 一些 Array 的方法 将作为 scoped 放入 <code>with</code> 语句中。</p> + +<pre class="brush: js">var keys = []; + +with(Array.prototype) { + keys.push("something"); +} + +Object.keys(Array.prototype[Symbol.unscopables]); +// ["copyWithin", "entries", "fill", "find", "findIndex", +// "includes", "keys", "values"] +</pre> + +<p>你也可以为你自己的对象设置 <code>unscopables</code> 。</p> + +<pre class="brush: js">var obj = { + foo: 1, + bar: 2 +}; + +obj[Symbol.unscopables] = { + foo: false, + bar: true +}; + +with(obj) { + console.log(foo); // 1 + console.log(bar); // ReferenceError: bar is not defined +} +</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-symbol.unscopables', 'Symbol.unscopables')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>首次定义</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-symbol.unscopables', 'Symbol.unscopables')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{Compat("javascript.builtins.Symbol.unscopables")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Array.@@unscopables", "Array.prototype[@@unscopables]")}}</li> + <li><code><a href="/en-US/docs/Web/JavaScript/Reference/Statements/with">with</a></code> statement (not available in <a href="/en-US/docs/Web/JavaScript/Reference/Strict_mode">Strict mode</a>)</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/symbol/valueof/index.html b/files/zh-cn/web/javascript/reference/global_objects/symbol/valueof/index.html new file mode 100644 index 0000000000..a5beee61d4 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/symbol/valueof/index.html @@ -0,0 +1,106 @@ +--- +title: Symbol.prototype.valueOf() +slug: Web/JavaScript/Reference/Global_Objects/Symbol/valueOf +translation_of: Web/JavaScript/Reference/Global_Objects/Symbol/valueOf +--- +<div>{{JSRef("Global_Objects", "Symbol")}}</div> + +<h2 id="Summary" name="Summary">概述</h2> + +<p><code><strong>valueOf()</strong></code> 方法返回当前 symbol 对象所包含的 symbol 原始值。</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><var>symbol.valueOf(); +</var></pre> + +<h2 id="Description" name="Description">描述</h2> + +<p>在 JavaScript 中，虽然大多数类型的对象在某些操作下都会自动的隐式调用自身的 <code>valueOf()</code> 方法或者 <code>toString()</code> 方法来将自己转换成一个原始值，但 symbol 对象不会这么干，symbol 对象无法隐式转换成对应的原始值：</p> + +<pre class="brush: js">Object(Symbol("foo")) + "bar"; +// TypeError: can't convert symbol object to primitive +// 无法隐式的调用 valueOf() 方法 + +Object(Symbol("foo")).valueOf() + "bar"; +// TypeError: can't convert symbol to string +// 手动调用 valueOf() 方法，虽然转换成了原始值，但 symbol 原始值不能转换为字符串 + +Object(Symbol("foo")).toString() + "bar"; +// "Symbol(foo)bar"，需要手动调用 toString() 方法才行 +</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('ES6', '#sec-symbol.prototype.valueof', 'Symbol.prototype.valueOf')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{ CompatibilityTable() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatGeckoDesktop("33.0") }}</td> + <td>{{ CompatNo() }}</td> + <td>{{ CompatNo() }}</td> + <td>{{ CompatNo() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatGeckoMobile("33.0") }}</td> + <td>{{ CompatNo() }}</td> + <td>{{ CompatNo() }}</td> + <td>{{ CompatNo() }}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="See_Also" name="See_Also">相关链接</h2> + +<ul> + <li>{{jsxref("Object.prototype.valueOf()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/syntaxerror/index.html b/files/zh-cn/web/javascript/reference/global_objects/syntaxerror/index.html new file mode 100644 index 0000000000..fed587b744 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/syntaxerror/index.html @@ -0,0 +1,171 @@ +--- +title: SyntaxError +slug: Web/JavaScript/Reference/Global_Objects/SyntaxError +tags: + - Error + - JavaScript + - Object + - SyntaxError +translation_of: Web/JavaScript/Reference/Global_Objects/SyntaxError +--- +<div>{{JSRef}}</div> + +<p><code><strong>SyntaxError</strong></code> 对象代表尝试解析语法上不合法的代码的错误。</p> + +<h2 id="Description" name="Description">描述</h2> + +<p>当Javascript语言解析代码时,Javascript引擎发现了不符合语法规范的tokens或token顺序时抛出<code>SyntaxError</code>.</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code>new SyntaxError([<var>message</var>[, <var>fileName</var>[, <var>lineNumber</var>]]])</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>message</code></dt> + <dd>可选的. 可阅读的错误描述信息</dd> + <dt><code>fileName</code> {{non-standard_inline}}</dt> + <dd>可选的. 包含引发异常的代码的文件名</dd> + <dt><code>lineNumber</code> {{non-standard_inline}}</dt> + <dd><span style="line-height: 19.0909080505371px;">可选的</span>. <span style="line-height: 19.0909080505371px;">包含引发异常的代码</span><span style="line-height: 19.0909080505371px;">的行号</span></dd> +</dl> + +<h2 id="Properties" name="Properties">属性</h2> + +<dl> + <dt>{{jsxref("SyntaxError.prototype")}}</dt> + <dd><code><font face="Open Sans, sans-serif">允许</font>SyntaxError</code>对象添加属性.</dd> +</dl> + +<h2 id="Methods" name="Methods">方法</h2> + +<p>全局 <code>SyntaxError</code> 自身不包含任何方法, 但从原型链中继承了一些方法.</p> + +<h2 id="SyntaxError_instances" name="SyntaxError_instances"><code>SyntaxError</code> 实例</h2> + +<h3 id="Properties_of_SyntaxError_instances" name="Properties_of_SyntaxError_instances">属性</h3> + +<div>{{page('/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/SyntaxError/prototype', '属性')}}</div> + +<h3 id="Methods_of_SyntaxError_instances" name="Methods_of_SyntaxError_instances">方法</h3> + +<div>{{page('/<span style="line-height: 19.0909080505371px;">zh-CN</span>/docs/Web/JavaScript/Reference/Global_Objects/SyntaxError/prototype', '方法')}}</div> + +<h2 id="Examples" name="Examples">示例</h2> + +<h3 id="Example:_Catch_an_SyntaxError" name="Example:_Catch_an_SyntaxError">捕获 <code>SyntaxError</code></h3> + +<pre class="brush: js">try { + eval('hoo bar'); +} catch (e) { + console.log(e instanceof SyntaxError); // true + console.log(e.message); // "missing ; before statement" + console.log(e.name); // "SyntaxError" + console.log(e.fileName); // "Scratchpad/1" + console.log(e.lineNumber); // 1 + console.log(e.columnNumber); // 4 + console.log(e.stack); // "@Scratchpad/1:2:3\n" +} +</pre> + +<h3 id="Example:_Create_an_SyntaxError" name="Example:_Create_an_SyntaxError">创建 <code>SyntaxError</code></h3> + +<pre class="brush: js">try { + throw new SyntaxError('Hello', 'someFile.js', 10); +} catch (e) { + console.log(e instanceof SyntaxError); // true + console.log(e.message); // "Hello" + console.log(e.name); // "SyntaxError" + console.log(e.fileName); // "someFile.js" + console.log(e.lineNumber); // 10 + console.log(e.columnNumber); // 0 + console.log(e.stack); // "@Scratchpad/2:11:9\n" +} +</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('ES3')}}</td> + <td>{{Spec2('ES3')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.11.6.4', 'SyntaxError')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-native-error-types-used-in-this-standard-syntaxerror', 'SyntaxError')}}</td> + <td>{{Spec2('ES6')}}</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>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</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>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Error")}}</li> + <li>{{jsxref("SyntaxError.prototype")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/syntaxerror/prototype/index.html b/files/zh-cn/web/javascript/reference/global_objects/syntaxerror/prototype/index.html new file mode 100644 index 0000000000..68a9ff3432 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/syntaxerror/prototype/index.html @@ -0,0 +1,132 @@ +--- +title: SyntaxError.prototype +slug: Web/JavaScript/Reference/Global_Objects/SyntaxError/prototype +tags: + - Error + - JavaScript + - Property + - Prototype + - SyntaxError +translation_of: Web/JavaScript/Reference/Global_Objects/SyntaxError +--- +<div>{{JSRef}}</div> + +<p><code><strong>SyntaxError.prototype</strong></code> 属性表示{{jsxref("SyntaxError")}} 构造器的原型.</p> + +<h2 id="Description" name="Description">描述</h2> + +<p>所有 {{jsxref("SyntaxError")}} 实例继承自 <code>SyntaxError.prototype</code>. 你可以使用该原型给所有实例添加属性和方法.</p> + +<h2 id="属性">属性</h2> + +<dl> + <dt><code>SyntaxError.prototype.constructor</code></dt> + <dd>创建实例的构造函数.</dd> + <dt>{{jsxref("Error.prototype.message", "SyntaxError.prototype.message")}}</dt> + <dd>错误信息. 尽管 ECMA-262 指出, {{jsxref("SyntaxError")}} 应该提供其子什么的信息属性,但在 <a href="/en-US/docs/Mozilla/Projects/SpiderMonkey">SpiderMonkey</a> 中, 仍是继承自{{jsxref("Error.prototype.message")}}.</dd> + <dt>{{jsxref("Error.prototype.name", "SyntaxError.prototype.name")}}</dt> + <dd><span style="line-height: 19.0909080505371px;">错误的名称.继承自</span> {{jsxref("Error")}}.</dd> + <dt>{{jsxref("Error.prototype.fileName", "SyntaxError.prototype.fileName")}}</dt> + <dd>抛出该异常的文件路径.继承自 {{jsxref("Error")}}.</dd> + <dt>{{jsxref("Error.prototype.lineNumber", "SyntaxError.prototype.lineNumber")}}</dt> + <dd><span style="line-height: 19.0909080505371px;">抛出该异常的文件的行号</span>. 继承自 {{jsxref("Error")}}.</dd> + <dt>{{jsxref("Error.prototype.columnNumber", "SyntaxError.prototype.columnNumber")}}</dt> + <dd><span style="line-height: 19.0909080505371px;">抛出该异常的文件的列数</span>. <span style="line-height: 19.0909080505371px;">继承自</span> {{jsxref("Error")}}.</dd> + <dt>{{jsxref("Error.prototype.stack", "SyntaxError.prototype.stack")}}</dt> + <dd>栈追踪信息. <span style="line-height: 19.0909080505371px;">继承自</span> {{jsxref("Error")}}.</dd> +</dl> + +<h2 id="方法">方法</h2> + +<p>尽管 {{jsxref("SyntaxError")}} 原型对象自身不包含任何方法,但 {{jsxref("SyntaxError")}} 实例从原型链中继承了一些方法.</p> + +<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('ES3')}}</td> + <td>{{Spec2('ES3')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.11.7.6', 'NativeError.prototype')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td>Defined as <code><em>NativeError</em>.prototype</code>.</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-nativeerror.prototype', 'NativeError.prototype')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Defined as <code><em>NativeError</em>.prototype</code>.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-nativeerror.prototype', 'NativeError.prototype')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td>Defined as <code><em>NativeError</em>.prototype</code>.</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>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</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>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="See_also" name="See_also">相关链接</h2> + +<ul> + <li>{{jsxref("Error.prototype")}}</li> + <li>{{jsxref("Function.prototype")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/typedarray/@@iterator/index.html b/files/zh-cn/web/javascript/reference/global_objects/typedarray/@@iterator/index.html new file mode 100644 index 0000000000..0d6556b0ca --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/typedarray/@@iterator/index.html @@ -0,0 +1,125 @@ +--- +title: 'TypedArray.prototype[@@iterator]()' +slug: Web/JavaScript/Reference/Global_Objects/TypedArray/@@iterator +translation_of: Web/JavaScript/Reference/Global_Objects/TypedArray/@@iterator +--- +<div>{{JSRef}}</div> + +<p>@@iterator 的初始值是和 {{jsxref("TypedArray.prototype.values()", "values")}} 属性的初始值相同的对象。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><var>arr</var>[Symbol.iterator]()</code></pre> + +<h3 id="返回值">返回值</h3> + +<p>数组的 <strong>迭代器</strong> 函数，通常是 {{jsxref("TypedArray.prototype.values()", "values()")}}函数。</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用for...of_循环的迭代">使用<code>for...of</code> 循环的迭代</h3> + +<pre class="brush: js">var arr = new Uint8Array([10, 20, 30, 40, 50]); +// 你的浏览器必须支持 for..of 循环 +// 以及 for 循环中的 let 区域变量 +for (let n of arr) { + console.log(n); +} +</pre> + +<h3 id="备选迭代">备选迭代</h3> + +<pre class="brush: js">var arr = new Uint8Array([10, 20, 30, 40, 50]); +var eArr = arr[Symbol.iterator](); +console.log(eArr.next().value); // 10 +console.log(eArr.next().value); // 20 +console.log(eArr.next().value); // 30 +console.log(eArr.next().value); // 40 +console.log(eArr.next().value); // 50 +</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('ES6', '#sec-%typedarray%.prototype-@@iterator', '%TypedArray%.prototype[@@iterator]()')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>初始定义。</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-%typedarray%.prototype-@@iterator', '%TypedArray%.prototype[@@iterator]()')}}</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>{{ CompatVersionUnknown }}</td> + <td>{{ CompatGeckoDesktop("36") }} [1]</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</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>{{CompatNo}}</td> + <td>{{ CompatVersionUnknown }}</td> + <td>{{ CompatGeckoMobile("36") }} [1]</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<p>[1] 从 Gecko 17 (Firefox 17 / Thunderbird 17 / SeaMonkey 2.14) 到 Gecko 26 (Firefox 26 / Thunderbird 26 / SeaMonkey 2.23 / Firefox OS 1.2) 使用 <code>iterator</code> 属性 (<a href="https://bugzilla.mozilla.org/show_bug.cgi?id=907077">bug 907077</a>)，从 Gecko 27 到 Gecko 35 使用<code>"@@iterator"</code> 占位符。 在 Gecko 36 (Firefox 36 / Thunderbird 36 / SeaMonkey 2.33)中，<code>@@iterator</code> <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Symbol">Symbol</a> 予以实现(<a href="https://bugzilla.mozilla.org/show_bug.cgi?id=918828">bug 918828</a>)。</p> + +<h2 id="See_also">See also</h2> + +<ul> + <li><a href="/en-US/docs/Web/JavaScript/Typed_arrays">JavaScript typed arrays</a></li> + <li>{{jsxref("TypedArray")}}</li> + <li>{{jsxref("TypedArray.prototype.entries()")}}</li> + <li>{{jsxref("TypedArray.prototype.keys()")}}</li> + <li>{{jsxref("TypedArray.prototype.values()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/typedarray/@@species/index.html b/files/zh-cn/web/javascript/reference/global_objects/typedarray/@@species/index.html new file mode 100644 index 0000000000..816a29d721 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/typedarray/@@species/index.html @@ -0,0 +1,126 @@ +--- +title: 'get TypedArray[@@species]' +slug: Web/JavaScript/Reference/Global_Objects/TypedArray/@@species +translation_of: Web/JavaScript/Reference/Global_Objects/TypedArray/@@species +--- +<div>{{JSRef}}</div> + +<p><code><strong>TypedArray[@@species]</strong></code> 访问器属性返回<a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray#TypedArray_objects">类型化数组</a>的构造器。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><em>TypedArray</em>[Symbol.species] + +其中<em>TypedArray</em>是下列类型之一： + +Int8Array +Uint8Array +Uint8ClampedArray +Int16Array +Uint16Array +Int32Array +Uint32Array +Float32Array +Float64Array +</pre> + +<h2 id="描述">描述</h2> + +<p><code>species</code> 访问器属性返回<a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray#TypedArray_objects">类型化数组</a>对象的构造器。 子类的构造器可能会覆盖它来修改构造器的赋值。</p> + +<h2 id="示例">示例</h2> + +<p><code>species</code> 属性返回默认的构造器函数，对于给定的<a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray#TypedArray_objects">类型化数组</a>对象，它是类型化数组构造器之一：</p> + +<pre class="brush: js">Int8Array[Symbol.species]; // function Int8Array() +Uint8Array[Symbol.species]; // function Uint8Array() +Float32Array[Symbol.species]; // function Float32Array() +</pre> + +<p>在派生的集合对象中 （也就是你自己定义的类型化数组<code>MyTypedArray</code>）， <code>MyTypedArray</code> 的 species 是 <code>MyTypedArray</code> 构造器。但是，你可能希望覆盖它，以便在你的派生类方法中返回<a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray#TypedArray_objects">类型化数组</a>的基类对象：</p> + +<pre class="brush: js">class MyTypedArray extends Uint8Array { + // 将 MyTypedArray species 覆盖为 Uint8Array 基类构造器 + static get [Symbol.species]() { return Uint8Array; } +}</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('ES6', '#sec-get-%typedarray%-@@species', 'get %TypedArray% [ @@species ]')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>初始定义。</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-get-%typedarray%-@@species', 'get %TypedArray% [ @@species ]')}}</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("48")}}</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("48")}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="另见">另见</h2> + +<ul> + <li>{{jsxref("TypedArray")}}</li> + <li>{{jsxref("Symbol.species")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/typedarray/buffer/index.html b/files/zh-cn/web/javascript/reference/global_objects/typedarray/buffer/index.html new file mode 100644 index 0000000000..9affc3690f --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/typedarray/buffer/index.html @@ -0,0 +1,106 @@ +--- +title: TypedArray.prototype.buffer +slug: Web/JavaScript/Reference/Global_Objects/TypedArray/buffer +translation_of: Web/JavaScript/Reference/Global_Objects/TypedArray/buffer +--- +<div>{{JSRef}}</div> + +<p><strong><code>buffer</code></strong>访问器属性表示由<em>TypedArray</em>在构造期间引用的{{jsxref("ArrayBuffer")}}。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>typedArray</var>.buffer</pre> + +<h2 id="描述">描述</h2> + +<p><code>buffer</code> 属性是一个访问器属性，它的 set 访问器函数是<code>undefined</code>，意思是你只能够读取这个属性。它的值在<em>TypedArray</em>构造时建立，不能被修改。<em>TypedArray</em>是这里的<a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray#TypedArray_objects">类型化数组</a>之一。</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用_buffer_属性">使用 <code>buffer</code> 属性</h3> + +<pre class="brush:js">var buffer = new ArrayBuffer(8); +var uint16 = new Uint16Array(buffer); +uint16.buffer; // ArrayBuffer { byteLength: 8 } +</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('ES6', '#sec-get-%typedarray%.prototype.buffer', 'TypedArray.prototype.buffer')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>初始定义。</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-get-%typedarray%.prototype.buffer', 'TypedArray.prototype.buffer')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{CompatibilityTable}}</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>7.0</td> + <td>{{ CompatGeckoDesktop("2") }}</td> + <td>10</td> + <td>11.6</td> + <td>5.1</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>4.0</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{ CompatGeckoMobile("2") }}</td> + <td>10</td> + <td>11.6</td> + <td>4.2</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="另见">另见</h2> + +<ul> + <li><a href="/en-US/docs/Web/JavaScript/Typed_arrays">JavaScript 类型化数组</a></li> + <li>{{jsxref("TypedArray")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/typedarray/bytelength/index.html b/files/zh-cn/web/javascript/reference/global_objects/typedarray/bytelength/index.html new file mode 100644 index 0000000000..7d09a0ec60 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/typedarray/bytelength/index.html @@ -0,0 +1,113 @@ +--- +title: TypedArray.prototype.byteLength +slug: Web/JavaScript/Reference/Global_Objects/TypedArray/byteLength +translation_of: Web/JavaScript/Reference/Global_Objects/TypedArray/byteLength +--- +<div>{{JSRef}}</div> + +<p><strong><code>byteLength</code></strong>访问器属性表示类型化数组的长度（字节数）。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>typedarray</var>.byteLength</pre> + +<h2 id="描述">描述</h2> + +<p><code>byteLength</code> 是一个访问器属性，它的 set 访问器函数是<code>undefined</code>，意思是你只能够读取这个属性。它的值在<em>TypedArray</em>构造时建立，不能被修改。如果 <em>TypedArray</em> 没有指定<code>byteOffset</code> 或者 <code>length</code>，会返回所引用的<code>ArrayBuffer</code> 的<code>length</code>。<em>TypedArray</em> 是这里的 <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray#TypedArray_objects">TypedArray 对象</a>之一。</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用byteLength_属性">使用<code>byteLength</code> 属性</h3> + +<pre class="brush:js">var buffer = new ArrayBuffer(8); + +var uint8 = new Uint8Array(buffer); +uint8.byteLength; // 8 (符合 buffer 的 byteLength) + +var uint8 = new Uint8Array(buffer, 1, 5); +uint8.byteLength; // 5 (在 Uint8Array 构造时指定) + +var uint8 = new Uint8Array(buffer, 2); +uint8.byteLength; // 6 (根据被构造的 Uint8Array 的 offset) +</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('ES6', '#sec-get-%typedarray%.prototype.bytelength', 'TypedArray.prototype.byteLength')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>初始定义。</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-get-%typedarray%.prototype.bytelength', 'TypedArray.prototype.byteLength')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{CompatibilityTable}}</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>7.0</td> + <td>{{ CompatGeckoDesktop("2") }}</td> + <td>10</td> + <td>11.6</td> + <td>5.1</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>4.0</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoMobile("2")}}</td> + <td>10</td> + <td>11.6</td> + <td>4.2</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="另见">另见</h2> + +<ul> + <li><a href="/en-US/docs/Web/JavaScript/Typed_arrays" title="en/JavaScript typed arrays">JavaScript 类型化数组</a></li> + <li>{{jsxref("TypedArray")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/typedarray/byteoffset/index.html b/files/zh-cn/web/javascript/reference/global_objects/typedarray/byteoffset/index.html new file mode 100644 index 0000000000..dfbb599911 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/typedarray/byteoffset/index.html @@ -0,0 +1,110 @@ +--- +title: TypedArray.prototype.byteOffset +slug: Web/JavaScript/Reference/Global_Objects/TypedArray/byteOffset +translation_of: Web/JavaScript/Reference/Global_Objects/TypedArray/byteOffset +--- +<div>{{JSRef}}</div> + +<p><strong><code>byteOffset</code></strong> 访问器属性表示类型化数组距离其{{jsxref("ArrayBuffer")}}起始位置的偏移（字节数）。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>typedarray</var>.byteOffset</pre> + +<h2 id="描述">描述</h2> + +<p><code>byteOffset</code> 是一个访问器属性，它的 set 访问器函数是<code>undefined</code>，意思是你只能够读取这个属性。它的值在<em>TypedArray</em>构造时建立，不能被修改。<em>TypedArray</em> 是这里的 <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray#TypedArray_objects">TypedArray 对象</a>之一。</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用byteOffset_属性">使用<code>byteOffset</code> 属性</h3> + +<pre class="brush:js">var buffer = new ArrayBuffer(8); + +var uint8 = new Uint8Array(buffer); +uint8.byteOffset; // 0 (没有指定 oddfet) + +var uint8 = new Uint8Array(buffer, 3); +uint8.byteOffset; // 3 (在构造 Uint8Array 时指定) +</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('ES6', '#sec-get-%typedarray%.prototype.byteoffset', 'TypedArray.prototype.byteOffset')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>初始定义。</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-get-%typedarray%.prototype.byteoffset', 'TypedArray.prototype.byteOffset')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{CompatibilityTable}}</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>7.0</td> + <td>{{ CompatGeckoDesktop("2") }}</td> + <td>10</td> + <td>11.6</td> + <td>5.1</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>4.0</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{ CompatGeckoMobile("2") }}</td> + <td>10</td> + <td>11.6</td> + <td>4.2</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="另见">另见</h2> + +<ul> + <li><a href="/en-US/docs/Web/JavaScript/Typed_arrays">JavaScript 类型化数组</a></li> + <li>{{jsxref("TypedArray")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/typedarray/bytes_per_element/index.html b/files/zh-cn/web/javascript/reference/global_objects/typedarray/bytes_per_element/index.html new file mode 100644 index 0000000000..4418eb2aab --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/typedarray/bytes_per_element/index.html @@ -0,0 +1,115 @@ +--- +title: TypedArray.BYTES_PER_ELEMENT +slug: Web/JavaScript/Reference/Global_Objects/TypedArray/BYTES_PER_ELEMENT +translation_of: Web/JavaScript/Reference/Global_Objects/TypedArray/BYTES_PER_ELEMENT +--- +<div>{{JSRef("Global_Objects", "TypedArray", "Int8Array,Uint8Array,Uint8ClampedArray,Int16Array,Uint16Array,Int32Array,Uint32Array,Float32Array,Float64Array")}}</div> + +<h2 id="概要">概要</h2> + +<p><code><strong>TypedArray.BYTES_PER_ELEMENT</strong></code> 属性代表了强类型数组中每个元素所占用的字节数。</p> + +<div>{{js_property_attributes(0,0,0)}}</div> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">TypedArray.BYTES_PER_ELEMENT;</pre> + +<h2 id="描述">描述</h2> + +<p>强类型数组对象用来解释为单个元素的字节数是不一样的。常量 <code>BYTES_PER_ELEMENT</code> 表示了特定强类型数组中每个元素所占用的字节数。</p> + +<h2 id="示例">示例</h2> + +<pre class="brush:js">Int8Array.BYTES_PER_ELEMENT; // 1 +Uint8Array.BYTES_PER_ELEMENT; // 1 +Uint8ClampedArray.BYTES_PER_ELEMENT; // 1 +Int16Array.BYTES_PER_ELEMENT; // 2 +Uint16Array.BYTES_PER_ELEMENT; // 2 +Int32Array.BYTES_PER_ELEMENT; // 4 +Uint32Array.BYTES_PER_ELEMENT; // 4 +Float32Array.BYTES_PER_ELEMENT; // 4 +Float64Array.BYTES_PER_ELEMENT; // 8</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 href="https://www.khronos.org/registry/typedarray/specs/latest/#7">Typed Array Specification</a></td> + <td>已过期</td> + <td><span><span>被ECMAScript 6取代</span></span></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-typedarray.bytes_per_element', 'TypedArray.BYTES_PER_ELEMENT')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition in an ECMA standard.</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{ CompatibilityTable() }}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>功能</th> + <th>Chrome</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>基本支持</td> + <td>7.0</td> + <td>{{ CompatGeckoDesktop("2") }}</td> + <td>10</td> + <td>11.6</td> + <td>5.1</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>功能</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>基本支持</td> + <td>4.0</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatGeckoMobile("2") }}</td> + <td>10</td> + <td>11.6</td> + <td>4.2</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="sect1"> </h2> + +<h2 id="参见">参见</h2> + +<ul> + <li><a href="/en-US/docs/Web/JavaScript/Typed_arrays" title="en/JavaScript typed arrays">JavaScript 强类型数组</a></li> + <li>{{jsxref("TypedArray")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/typedarray/copywithin/index.html b/files/zh-cn/web/javascript/reference/global_objects/typedarray/copywithin/index.html new file mode 100644 index 0000000000..845b742ab4 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/typedarray/copywithin/index.html @@ -0,0 +1,128 @@ +--- +title: TypedArray.prototype.copyWithin() +slug: Web/JavaScript/Reference/Global_Objects/TypedArray/copyWithin +tags: + - 类型化数组 + - 类型数组 +translation_of: Web/JavaScript/Reference/Global_Objects/TypedArray/copyWithin +--- +<div>{{JSRef}}</div> + +<p><code><strong>copyWithin()</strong></code><strong> </strong>方法将数组中元素的序列复制到以 <code>target</code> 起始的位置。拷贝的副本取自第二个参数（<code>start</code>）和第三个参数 （<code>end</code>）的下标位置。<code>end</code> 参数是可选的，默认为数组长度。该方法与 {{jsxref("Array.prototype.copyWithin")}} 的算法相同<em>。</em> <em>TypedArray</em> 指的是这里的 <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray#TypedArray_objects">类型化数组类型</a> 之一。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><var>typedarray</var>.copyWithin(<var>target</var>, <var>start</var>[, <var>end</var> = this.length])</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>target</code></dt> + <dd>目标起始位置的下标，复制元素到这里。</dd> + <dt><code>start</code></dt> + <dd>源起始位置的下标，在这里开始复制元素。</dd> + <dt><code>end {{optional_inline}}</code></dt> + <dd>可选。源终止位置的下标，在这里停止复制元素。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>修改后的类型化数组。</p> + +<h2 id="描述">描述</h2> + +<p>更多信息请见 {{jsxref("Array.prototype.copyWithin")}}。</p> + +<p>这个方法取代了实验性的 {{jsxref("TypedArray.prototype.move()")}}。</p> + +<h2 id="示例">示例</h2> + +<pre class="brush: js">var buffer = new ArrayBuffer(8); +var uint8 = new Uint8Array(buffer); +uint8.set([1,2,3]); +console.log(uint8); // Uint8Array [ 1, 2, 3, 0, 0, 0, 0, 0 ] +uint8.copyWithin(3,0,3); +console.log(uint8); // Uint8Array [ 1, 2, 3, 1, 2, 3, 0, 0 ] +</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('ES6', '#sec-%typedarray%.prototype.copywithin', 'TypedArray.prototype.copyWithin')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>初始定义。</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-%typedarray%.prototype.copywithin', 'TypedArray.prototype.copyWithin')}}</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>{{CompatChrome(45.0)}}</td> + <td>{{CompatGeckoDesktop("34")}}</td> + <td>{{CompatNo}}</td> + <td> + <p> {{CompatOpera(36.0)}}</p> + </td> + <td>{{CompatNo}}</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>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatGeckoMobile("34")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="另见">另见</h2> + +<ul> + <li>{{jsxref("TypedArray")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/typedarray/entries/index.html b/files/zh-cn/web/javascript/reference/global_objects/typedarray/entries/index.html new file mode 100644 index 0000000000..3dd4b5350d --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/typedarray/entries/index.html @@ -0,0 +1,124 @@ +--- +title: TypedArray.prototype.entries() +slug: Web/JavaScript/Reference/Global_Objects/TypedArray/entries +translation_of: Web/JavaScript/Reference/Global_Objects/TypedArray/entries +--- +<div>{{JSRef}}</div> + +<p>The <strong><code>entries()</code></strong>返回新的<code>Array Iterator</code>对象，包含数组每个下标处的键值对。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><var>arr</var>.entries()</code></pre> + +<h3 id="返回值">返回值</h3> + +<p>新的<code><strong>Array Iterator</strong></code>对象。</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用for...of_循环的迭代"><code>使用for...of</code> 循环的迭代</h3> + +<pre class="brush: js">var arr = new Uint8Array([10, 20, 30, 40, 50]); +var eArray = arr.entries(); +// 你的浏览器必须支持 for..of 循环 +// 以及 for 循环中的 let 区域变量 +for (let n of eArray) { + console.log(n); +} +</pre> + +<h3 id="备选迭代">备选迭代</h3> + +<pre class="brush: js">var arr = new Uint8Array([10, 20, 30, 40, 50]); +var eArr = arr.entries(); +console.log(eArr.next().value); // [0, 10] +console.log(eArr.next().value); // [1, 20] +console.log(eArr.next().value); // [2, 30] +console.log(eArr.next().value); // [3, 40] +console.log(eArr.next().value); // [4, 50] +</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-%typedarray%.prototype.entries', '%TypedArray%.prototype.entries()')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>初始定义。</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-%typedarray%.prototype.entries', '%TypedArray%.prototype.entries()')}}</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>{{CompatChrome(45.0)}}</td> + <td>{{CompatGeckoDesktop(37)}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatOpera(36.0)}}</td> + <td>{{CompatNo}}</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>{{CompatNo}}</td> + <td>{{ CompatVersionUnknown }}</td> + <td>{{CompatGeckoMobile(37)}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="另见">另见</h2> + +<ul> + <li><a href="/en-US/docs/Web/JavaScript/Typed_arrays">JavaScript 类型化数组</a></li> + <li>{{jsxref("TypedArray")}}</li> + <li>{{jsxref("TypedArray.prototype.keys()")}}</li> + <li>{{jsxref("TypedArray.prototype.values()")}}</li> + <li>{{jsxref("TypedArray.prototype.@@iterator()", "TypedArray.prototype[@@iterator]()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/typedarray/every/index.html b/files/zh-cn/web/javascript/reference/global_objects/typedarray/every/index.html new file mode 100644 index 0000000000..6e6e1260ed --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/typedarray/every/index.html @@ -0,0 +1,144 @@ +--- +title: TypedArray.prototype.every() +slug: Web/JavaScript/Reference/Global_Objects/TypedArray/every +translation_of: Web/JavaScript/Reference/Global_Objects/TypedArray/every +--- +<div>{{JSRef}}</div> + +<p><code><strong>every()</strong></code> 方法测试类型化数组的所有元素是否都能够通过由提供函数实现的测试。这个方法的算法与 {{jsxref("Array.prototype.every()")}}相同。 <em>TypedArray</em> 是这里的 <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray#TypedArray_objects">类型化数组类型</a> 之一。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><var>typedarray</var>.<code>every(<var>callback</var>[, <var>thisArg</var>])</code></code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>callback</code></dt> + <dd>用于测试每个元素的函数，接受三个参数： + <dl> + <dt><code>currentValue</code></dt> + <dd>要处理的类型化数组的当前元素。</dd> + <dt><code>index</code></dt> + <dd>要处理的当前元素在类型化数组中的下标</dd> + <dt><code>array</code></dt> + <dd>every 在其上调用的类型化数组</dd> + </dl> + </dd> + <dt><code>thisArg</code></dt> + <dd>可选，执行 <code>callback </code>时的 <code>this</code> 值。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>如果函数对数组每个元素返回 {{Glossary("truthy")}} ，则为<code><strong>true</strong></code>，否则为 <code><strong>false</strong></code>。</p> + +<h2 id="描述">描述</h2> + +<p><code>every</code> 方法为类型化数组中的每个元素执行一次 <code>callback</code> 函数，直到它找到一个使 <code>callback</code> 返回 <em>false</em>（表示可转换为布尔值 false 的值）的元素。如果发现了一个这样的元素，<code>every</code> 方法将会立即返回 <code>false</code>。否则，<code>callback</code> 为每一个元素返回 <code>true</code>，<code>every</code> 就会返回 <code>true</code>。<code>callback</code> 只会为那些已经被赋值的索引调用。不会为那些被删除或从来没被赋值的索引调用。</p> + +<p><code>callback</code> 以三个参数调用：元素的值，元素索引，以及要遍历的数组对象。</p> + +<p>如果将<code>thisArg</code>参数提供给<code>every</code>，它会在调用时传递给<code>callback</code>，作为它的 <code>this</code>值。否则，会传递<code>undefined</code> 作为它的<code>this</code> 值。 <code>callback</code>最终观测到的<code>this</code>值由 <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/this">用于决定函数可见的<code>this</code>值的一般规则</a>来决定。</p> + +<p><code>every</code> 不修改在其上调用的类型化数组。</p> + +<h2 id="示例">示例</h2> + +<h3 id="测试类型化数组所有元素的大小">测试类型化数组所有元素的大小</h3> + +<p>下面的示例测试了类型化数组所有元素是否大于 10。</p> + +<pre class="brush: js language-js">function isBigEnough(element, index, array) { + return element >= 10; +} +new Uint8Array([12, 5, 8, 130, 44]).every(isBigEnough); // false +new Uint8Array([12, 54, 18, 130, 44]).every(isBigEnough); // true</pre> + +<h3 id="使用箭头函数测试类型化数组的元素">使用箭头函数测试类型化数组的元素</h3> + +<p><a href="/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions">箭头函数</a>为相同测试提供了更短的语法。</p> + +<pre class="brush: js">new Uint8Array([12, 5, 8, 130, 44]).every(elem => elem >= 10); // false +new Uint8Array([12, 54, 18, 130, 44]).every(elem => elem >= 10); // true</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-%typedarray%.prototype.every', 'TypedArray.prototype.every')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>初始定义。</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-%typedarray%.prototype.every', 'TypedArray.prototype.every')}}</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>{{CompatChrome(45.0)}}</td> + <td>{{CompatGeckoDesktop("37")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatOpera(36.0)}}</td> + <td>{{CompatNo}}</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>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatGeckoDesktop("37")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="另见">另见</h2> + +<ul> + <li>{{jsxref("TypedArray.prototype.some()")}}</li> + <li>{{jsxref("Array.prototype.every()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/typedarray/fill/index.html b/files/zh-cn/web/javascript/reference/global_objects/typedarray/fill/index.html new file mode 100644 index 0000000000..3c89cc7f5b --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/typedarray/fill/index.html @@ -0,0 +1,134 @@ +--- +title: TypedArray.prototype.fill() +slug: Web/JavaScript/Reference/Global_Objects/TypedArray/fill +translation_of: Web/JavaScript/Reference/Global_Objects/TypedArray/fill +--- +<div>{{JSRef}}</div> + +<p><code><strong>fill() </strong>方法将</code>类型化数组中的从起始索引到终止索引内的全部元素。这个方法的算法和 {{jsxref("Array.prototype.fill()")}} 相同。 <em>TypedArray</em> 是这里的<a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray#TypedArray_objects">类型化数组类型</a>之一。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><var>typedarray</var>.<code>fill(<var>value</var>[, <var>start<var> = 0[, <var>end</var> = this.length]])</var></var></code></code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>value</code></dt> + <dd>用来填充类型化数组元素的值。</dd> + <dt><code>start</code></dt> + <dd>可选参数。起始索引，默认值为 0。</dd> + <dt><code>end</code></dt> + <dd>可选参数。终止索引（填充范围不包含此索引），默认值为 <code>this.length</code>。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>修改后的类型化数组。</p> + +<h2 id="描述">描述</h2> + +<p>将被元素填充的区间是 [<code>start</code>, <code>end</code>)。</p> + +<p><strong><code>fill </code></strong>方法接受三个参数 <code>value</code>，<code>start</code> 以及 <code>end。</code><code>start</code> 和 <code>end</code> 参数是可选的，默认值分别为 <code>0</code> 和 <code>this.length。</code></p> + +<p>如果 <code>start</code> 参数是负值，它会被视为 <code>length+start</code>，其中 <code>length</code> 是类型化数组的长度。如果 <code>end</code> 参数是负值，它会被视为 <code>length+end。</code></p> + +<h2 id="示例">示例</h2> + +<pre class="brush: js">new Uint8Array([1, 2, 3]).fill(4); // Uint8Array [4, 4, 4] +new Uint8Array([1, 2, 3]).fill(4, 1); // Uint8Array [1, 4, 4] +new Uint8Array([1, 2, 3]).fill(4, 1, 2); // Uint8Array [1, 4, 3] +new Uint8Array([1, 2, 3]).fill(4, 1, 1); // Uint8Array [1, 2, 3] +new Uint8Array([1, 2, 3]).fill(4, -3, -2); // Uint8Array [4, 2, 3] +</pre> + +<h2 id="兼容实现">兼容实现</h2> + +<p>由于并没有一个名为 <em>TypedArray</em> 的全局变量，我们必须“按需添加”兼容实现。请配合{{jsxref("Array.prototype.fill()")}}的兼容实现使用以下的“兼容实现”</p> + +<pre class="brush: js">// https://tc39.github.io/ecma262/#sec-%typedarray%.prototype.fill +if (!Uint8Array.prototype.fill) { + Uint8Array.prototype.fill = Array.prototype.fill; +} +</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>{{SpecName('ES2015', '#sec-%typedarray%.prototype.fill', 'TypedArray.prototype.fill')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>最初定义。</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-%typedarray%.prototype.fill', 'TypedArray.prototype.fill')}}</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>特性</th> + <th>Chrome</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>基础支持</td> + <td>45</td> + <td>{{CompatGeckoDesktop("37")}}</td> + <td>{{CompatNo}}</td> + <td>32</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>特性</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>基础支持</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatGeckoDesktop("37")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="相关">相关</h2> + +<ul> + <li>{{jsxref("Array.prototype.fill()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/typedarray/filter/index.html b/files/zh-cn/web/javascript/reference/global_objects/typedarray/filter/index.html new file mode 100644 index 0000000000..59af0c38db --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/typedarray/filter/index.html @@ -0,0 +1,145 @@ +--- +title: TypedArray.prototype.filter() +slug: Web/JavaScript/Reference/Global_Objects/TypedArray/filter +translation_of: Web/JavaScript/Reference/Global_Objects/TypedArray/filter +--- +<div>{{JSRef}}</div> + +<p><code><strong>filter()</strong></code>创建新的类型化数组，含有所有通过了测试的元素，测试由提供的函数实现。这个方法的算法和 {{jsxref("Array.prototype.filter()")}}<em>相同。</em> <em>TypedArray</em> 是这里的 <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray#TypedArray_objects">类型化数组类型</a> 之一。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>typedarray</var>.filter(<var>callback</var>[, <var>thisArg</var>])</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>callback</code></dt> + <dd>测试类型化数组每个元素的函数，以参数 <code>(element, index, typedarray)</code>调用。 如果返回 <code>true</code>则保留该元素，如果返回<code>false</code>则相反。</dd> + <dt><code>thisArg {{optional_inline}}</code></dt> + <dd>可选，执行<code>callback</code>时作为<code>this</code>的值。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>新的类型化数组，含有通过测试的元素</p> + +<h2 id="描述">描述</h2> + +<p><code>filter</code>方法对类型化数组中的元素调用提供的 <code>callback</code>函数，并且会为<code>callback</code>返回 true 的那些元素构造新的类型化数组。 <code>callback</code> 只对拥有值的类型化数组下标调用。它不会对未定义的，被删除的或者没有赋值的下标调用。没有传给<code>callback</code>的类型化数组的元素只是简单跳过，不会包含在新数组中。</p> + +<p><code>callback</code>以三个参数调用：</p> + +<ol> + <li>元素的值</li> + <li>元素下标</li> + <li>被遍历的类型化数组对象</li> +</ol> + +<p>如果将<code>thisArg</code>参数提供给<code>filter</code>，它会在调用时传递给<code>callback</code>，作为它的 <code>this</code>值。否则，会传递<code>undefined</code> 作为它的<code>this</code> 值。 <code>callback</code>最终观测到的<code>this</code>值由 <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/this">用于决定函数可见的<code>this</code>值的一般规则</a>来决定。</p> + +<p><code>filter()</code>不改变在其上调用的类型化数组。</p> + +<p>由 <code>filter</code>处理的元素范围在<code>callback</code>调用之前就确定了。 在 <code>filter</code>调用之后添加到数组的元素不会由 <code>callback</code>访问。 如果类型化数组的现有元素被改变，或被删除，它们传给<code>callback</code>的值是<code>filter</code> 访问它们时候的值。已删除的元素不会被访问。</p> + +<h2 id="示例">示例</h2> + +<h3 id="过滤所有较小的值">过滤所有较小的值</h3> + +<p>下面的示例使用了 <code>filter()</code> 来创建过滤后的类型化数组，小于 10 的元素都被移除了。</p> + +<pre class="brush: js">function isBigEnough(element, index, array) { + return element >= 10; +} +new Uint8Array([12, 5, 8, 130, 44]).filter(isBigEnough); +// Uint8Array [ 12, 130, 44 ] +</pre> + +<h3 id="使用箭头函数过滤类型化数组的元素">使用箭头函数过滤类型化数组的元素</h3> + +<p><a href="/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions">箭头函数</a> 为相同测试提供了更短的语法。</p> + +<pre class="brush: js">new Uint8Array([12, 5, 8, 130, 44]).filter(elem => elem >= 10); +// Uint8Array [ 12, 130, 44 ]</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-%typedarray%.prototype.filter', 'TypedArray.prototype.filter')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>初始定义</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-%typedarray%.prototype.filter', 'TypedArray.prototype.filter')}}</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>{{CompatChrome("45")}}</td> + <td>{{CompatGeckoDesktop("38")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</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>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatGeckoMobile("38")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="另见">另见</h2> + +<ul> + <li>{{jsxref("TypedArray.prototype.every()")}}</li> + <li>{{jsxref("TypedArray.prototype.some()")}}</li> + <li>{{jsxref("Array.prototype.filter()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/typedarray/find/index.html b/files/zh-cn/web/javascript/reference/global_objects/typedarray/find/index.html new file mode 100644 index 0000000000..1b6b25c036 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/typedarray/find/index.html @@ -0,0 +1,148 @@ +--- +title: TypedArray.prototype.find() +slug: Web/JavaScript/Reference/Global_Objects/TypedArray/find +translation_of: Web/JavaScript/Reference/Global_Objects/TypedArray/find +--- +<div>{{JSRef}}</div> + +<p>如果某个元素满足所提供的测试函数，<code><strong>find()</strong></code>方法返回类型化数组中的 <strong>值</strong>。否则返回{{jsxref("undefined")}} 。 <em>TypedArray</em> 是这里的 <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray#TypedArray_objects">类型化数组类型</a> 之一。</p> + +<p>同时请参见{{jsxref("TypedArray.findIndex", "findIndex()")}}方法，它返回了类型化数组中所发现元素的 <strong>下标</strong> ，而不是它的值。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><var>typedarray</var>.find(<var>callback</var>[, <var>thisArg</var>])</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>callback</code></dt> + <dd>用于在类型化数组中的每个元素上执行的函数，接受三个参数： + <dl> + <dt><code>element</code></dt> + <dd>要处理的类型化数组的当前元素。</dd> + <dt><code>index</code></dt> + <dd>要处理的当前元素在类型化数组中的下标</dd> + <dt><code>array</code></dt> + <dd><code>find</code> 在其上调用的类型化数组</dd> + </dl> + </dd> + <dt><code>thisArg</code></dt> + <dd>可选，执行<code>callback</code>时的<code>this</code>值。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>如果元素通过了测试，则为该元素，否则为{{jsxref("undefined")}}。</p> + +<h2 id="描述">描述</h2> + +<p><code>find</code> 方法对类型化数组中的每个元素执行一次 <code>callback</code> 函数，直到它找到一个使 <code>callback</code> 返回 <em>true</em>的元素。如果发现了一个这样的元素，<code>find</code> 方法将会立即返回该元素的值。否则，<code>find</code> 方法会返回{{jsxref("undefined")}}。<code>callback</code> 只会对那些已经被赋值的索引调用。不会对那些被删除或从来没被赋值的索引调用。</p> + +<p><code>callback</code> 以三个参数调用：元素的值，元素索引，以及要遍历的数组对象。</p> + +<p>如果将<code>thisArg</code>参数提供给<code>find</code>，它会在调用时传递给<code>callback</code>，作为它的 <code>this</code>值。如果没有提供，会使用<code>undefined</code>。</p> + +<p><code>find</code> 不修改在其上调用的类型化数组。</p> + +<p>由 <code>find</code>处理的元素范围在<code>callback</code>调用之前就确定了。 在 <code>find</code>调用之后添加到数组的元素不会由 <code>callback</code>访问。 如果类型化数组的现有元素被改变，或被删除，它们传给<code>callback</code>的值是<code>find</code> 访问它们时候的值。已删除的元素不会被访问。</p> + +<h2 id="示例">示例</h2> + +<h3 id="在类型化数组中寻找质数">在类型化数组中寻找质数</h3> + +<p>下面的示例在类型化数组中寻找质数（如果没有质数则返回 <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/undefined" title="The global undefined value property represents the value undefined. It is one of JavaScript's primitive types."><code>undefined</code></a>）。</p> + +<pre class="brush: js">function isPrime(element, index, array) { + var start = 2; + while (start <= Math.sqrt(element)) { + if (element % start++ < 1) { + return false; + } + } + return element > 1; +} + +var uint8 = new Uint8Array([4, 5, 8, 12]); +console.log(uint8.find(isPrime)); // 5</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-%typedarray%.prototype.find', '%TypedArray%.prototype.find')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>初始定义。</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-%typedarray%.prototype.find', '%TypedArray%.prototype.find')}}</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>{{CompatNo}}</td> + <td>{{CompatGeckoDesktop("37.0")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</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>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatGeckoMobile("37.0")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="另见">另见</h2> + +<ul> + <li>{{jsxref("TypedArray.prototype.findIndex()")}}</li> + <li>{{jsxref("TypedArray.prototype.every()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/typedarray/findindex/index.html b/files/zh-cn/web/javascript/reference/global_objects/typedarray/findindex/index.html new file mode 100644 index 0000000000..4ebcc0d816 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/typedarray/findindex/index.html @@ -0,0 +1,188 @@ +--- +title: TypedArray.prototype.findIndex() +slug: Web/JavaScript/Reference/Global_Objects/TypedArray/findIndex +translation_of: Web/JavaScript/Reference/Global_Objects/TypedArray/findIndex +--- +<div>{{JSRef}}</div> + +<p>如果某个元素满足所提供的测试函数，<code><strong>findIndex()</strong></code>方法返回类型化数组中的 <strong>下标</strong>。否则返回 -1。 <em>TypedArray</em> 是这里的 <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray#TypedArray_objects">类型化数组类型</a> 之一。</p> + +<p>同时请参见{{jsxref("TypedArray.findIndex", "find()")}}方法，它返回了类型化数组中所发现元素的 <strong>值</strong> ，而不是它的下标。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><var>typedarray</var>.findIndex(<var>callback</var>[, <var>thisArg</var>])</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>callback</code></dt> + <dd>用于在类型化数组中的每个元素上执行的函数，接受三个参数： + <dl> + <dt><code>element</code></dt> + <dd>要处理的类型化数组的当前元素。</dd> + <dt><code>index</code></dt> + <dd>要处理的当前元素在类型化数组中的下标</dd> + <dt><code>array</code></dt> + <dd><code>find</code> 在其上调用的类型化数组</dd> + </dl> + </dd> + <dt><code>thisArg</code></dt> + <dd>可选，执行<code>callback</code>时的<code>this</code>值。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>如果元素通过了测试，则为数组下标，否则为 -1。</p> + +<h2 id="描述">描述</h2> + +<p><code>findIndex</code> 方法对类型化数组中的每个元素执行一次 <code>callback</code> 函数，直到它找到一个使 <code>callback</code> 返回 <em>true</em>的元素。如果发现了一个这样的元素，<code>find</code> 方法将会立即返回该元素的下标。否则，<code>findIndex</code> 方法会返回 -1。<code>callback</code> 只会对那些已经被赋值的索引调用。不会对那些被删除或从来没被赋值的索引调用。</p> + +<p><code>callback</code> 以三个参数调用：元素的值，元素索引，以及要遍历的数组对象。</p> + +<p>如果将<code>thisArg</code>参数提供给<code>findIndex</code>，它会在调用时传递给<code>callback</code>，作为它的 <code>this</code>值。如果没有提供，会使用<code>undefined</code>。</p> + +<p><code>findIndex</code> 不修改在其上调用的类型化数组。</p> + +<p>由 <code>findIndex</code>处理的元素范围在<code>callback</code>调用之前就确定了。 在 <code>findIndex</code>调用之后添加到数组的元素不会由 <code>callback</code>访问。 如果类型化数组的现有元素被改变，或被删除，它们传给<code>callback</code>的值是<code>findIndex</code> 访问它们时候的值。已删除的元素不会被访问。</p> + +<h2 id="示例">示例</h2> + +<h3 id="在类型化数组中寻找质数的下标">在类型化数组中寻找质数的下标</h3> + +<p>下面的示例在类型化数组中寻找质数元素的下标（如果没有质数则返回 -1）.</p> + +<pre class="brush: js">function isPrime(element, index, array) { + var start = 2; + while (start <= Math.sqrt(element)) { + if (element % start++ < 1) { + return false; + } + } + return element > 1; +} + +var uint8 = new Uint8Array([4, 6, 8, 12]); +var uint16 = new Uint16Array([4, 6, 7, 12]); + +console.log(uint8.findIndex(isPrime)); // -1, 未发现 +console.log(uint16.findIndex(isPrime)); // 2 +</pre> + +<h2 id="Polyfill">Polyfill</h2> + +<pre class="brush: js">TypedArray.prototype.findIndex = Array.prototype.findIndex = Array.prototype.findIndex || function(evaluator, thisArg) { + 'use strict'; + if (!this) { + throw new TypeError('Array.prototype.some called on null or undefined'); + } + + if (typeof(evaluator) !== 'function') { + if (typeof(evaluator) === 'string') { + // 尝试将其转换为函数 + if ( ! (evaluator = eval(evaluator)) ){ + throw new TypeError(); + } + } else { + throw new TypeError(); + } + } + + var i; + if (thisArg === undefined) { // 为 thisArg 优化 + for (i in this) { + if (evaluator(this[i], i, this)) { + return i; + } + } + return -1; + } + for (i in this) { + if (evaluator.call(thisArg, this[i], i, this)) { + return i; + } + } + return -1; +};</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-%typedarray%.prototype.findindex', '%TypedArray%.prototype.findIndex')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>初始定义。</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-%typedarray%.prototype.findindex', '%TypedArray%.prototype.findIndex')}}</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>{{CompatNo}}</td> + <td>{{CompatGeckoDesktop("37.0")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</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>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatGeckoMobile("37.0")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="另见">另见</h2> + +<ul> + <li>{{jsxref("TypedArray.prototype.find()")}}</li> + <li>{{jsxref("TypedArray.prototype.indexOf()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/typedarray/foreach/index.html b/files/zh-cn/web/javascript/reference/global_objects/typedarray/foreach/index.html new file mode 100644 index 0000000000..801df8bed5 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/typedarray/foreach/index.html @@ -0,0 +1,111 @@ +--- +title: TypedArray.prototype.forEach() +slug: Web/JavaScript/Reference/Global_Objects/TypedArray/forEach +translation_of: Web/JavaScript/Reference/Global_Objects/TypedArray/forEach +--- +<div>{{JSRef}}</div> + +<p><code><strong>forEach()</strong></code>方法对类型化数组的每个元素调用提供的函数。 这个方法的算法和 {{jsxref("Array.prototype.forEach()")}}<em>相同。</em> <em>TypedArray</em> 是这里的 <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray#TypedArray_objects">类型化数组类型</a> 之一。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox notranslate"><code><var>typedarray</var>.forEach(<var>callback</var>[, <var>thisArg</var>])</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>callback</code></dt> + <dd>产生新的类型化数组的元素的函数，接受三个函数： + <dl> + <dt><code>currentValue</code></dt> + <dd>类型化数组中要处理的当前元素</dd> + <dt><code>index</code></dt> + <dd>类型化数组中要处理的当前元素的下标</dd> + <dt><code>array</code></dt> + <dd><code>forEach()</code>在其上调用的类型化数组</dd> + </dl> + </dd> + <dt><code>thisArg</code></dt> + <dd>可选，执行<code>callback</code>时作为<code>this</code>的值。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>{{jsxref("undefined")}}.</p> + +<h2 id="描述">描述</h2> + +<p><code>forEach</code>方法对类型化数组中的元素按升序调用提供的 <code>callback</code>函数。 它不会对删除或者省略的下标调用，但是会对存在并且值为{{jsxref("undefined")}}的元素调用。</p> + +<p><code>callback</code> 以 <strong>三个参数</strong>调用：</p> + +<ul> + <li>the <strong>元素的值</strong></li> + <li>the <strong>元素下标</strong></li> + <li>the <strong>被遍历的类型化数组</strong></li> +</ul> + +<p>如果将<code>thisArg</code>参数提供给<code>forEach</code>，它会在调用时传递给<code>callback</code>，作为它的 <code>this</code>值。否则，会传递<code>undefined</code> 作为它的<code>this</code> 值。 <code>callback</code>最终观测到的<code>this</code>值由 <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/this">用于决定函数可见的<code>this</code>值的一般规则</a>来决定。</p> + +<p>由 <code>forEach</code>处理的元素范围在<code>callback</code>调用之前就确定了。 在 <code>forEach</code>调用之后添加到数组的元素不会由 <code>callback</code>访问。 如果类型化数组的现有元素被改变，或被删除，它们传给<code>callback</code>的值是<code>forEach</code> 访问它们时候的值。已删除的元素不会被访问。</p> + +<p><code>forEach()</code>对每个数组元素执行一次<code>callback</code> 函数；不像 {{jsxref("TypedArray.prototype.every()", "every()")}} 和{{jsxref("TypedArray.prototype.some()", "some()")}}，它始终返回 {{jsxref("undefined")}}。</p> + +<h2 id="示例">示例</h2> + +<h3 id="记录类型化数组的内容">记录类型化数组的内容</h3> + +<p>下面的代码为数组中的每个元素记录一行日志：</p> + +<pre class="brush:js notranslate">function logArrayElements(element, index, array) { + console.log('a[' + index + '] = ' + element); +} + +new Uint8Array([0, 1, 2, 3]).forEach(logArrayElements); +// 日志： +// a[0] = 0 +// a[1] = 1 +// a[2] = 2 +// a[3] = 3 +</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-%typedarray%.prototype.foreach', '%TypedArray%.prototype.forEach')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>初始定义。</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-%typedarray%.prototype.foreach', '%TypedArray%.prototype.forEach')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div>{{CompatibilityTable}}</div> + +<div> + + +<p>{{Compat("javascript.builtins.TypedArray.forEach")}}</p> +</div> + +<h2 id="另见">另见</h2> + +<ul> + <li>{{jsxref("TypedArray.prototype.map()")}}</li> + <li>{{jsxref("TypedArray.prototype.every()")}}</li> + <li>{{jsxref("TypedArray.prototype.some()")}}</li> + <li>{{jsxref("Array.prototype.forEach()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/typedarray/from/index.html b/files/zh-cn/web/javascript/reference/global_objects/typedarray/from/index.html new file mode 100644 index 0000000000..20bdbf8b7f --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/typedarray/from/index.html @@ -0,0 +1,183 @@ +--- +title: TypedArray.from() +slug: Web/JavaScript/Reference/Global_Objects/TypedArray/from +tags: + - from + - 类型数组 +translation_of: Web/JavaScript/Reference/Global_Objects/TypedArray/from +--- +<div>{{JSRef}}</div> + +<p><code><strong><em>TypedArray</em>.from()</strong></code> 方法 从一个类数组或者可迭代对象中创建一个新<a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray#TypedArray_objects">类型数组</a>。 这个方法和 {{jsxref("Array.from()")}} 类似。</p> + +<h2 id="语法">语法</h2> + +<pre class="brush: js"><code><em>TypedArray</em>.from(source[, mapFn[, thisArg]])</code> +</pre> + +<p>上面代码中的 <code>TypedArray</code> 需要替换为下面的任何一个构造函数：</p> + +<div class="threecolumns"> +<ul> + <li> + <p>{{jsxref("Int8Array")}}</p> + </li> + <li>{{jsxref("Uint8Array")}}</li> + <li>{{jsxref("Uint8ClampedArray")}}</li> + <li>{{jsxref("Int16Array")}}</li> + <li>{{jsxref("Uint16Array")}}</li> + <li>{{jsxref("Int32Array")}}</li> + <li>{{jsxref("Uint32Array")}}</li> + <li>{{jsxref("Float32Array")}}</li> + <li>{{jsxref("Float64Array")}}</li> + <li>{{jsxref("BigInt64Array")}}</li> + <li>{{jsxref("BigUint64Array")}}</li> +</ul> +</div> + +<h3 id="参数">参数</h3> + +<dl> + <dt><em><code>source</code></em></dt> + <dd>想要转换为类型数组的类数组或者可迭代对象。</dd> + <dt><em><code>mapFn</code></em></dt> + <dd>可选参数。如果指定了该参数，则最后生成的类型数组会经过该函数的加工处理后再返回。</dd> + <dt><em><code>thisArg</code></em></dt> + <dd>可选参数。执行 <code>mapFn</code> 函数时 <code>this</code> 的值。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>一个新的 {{jsxref("TypedArray")}} 实例。</p> + +<h2 id="描述"> 描述</h2> + +<p><code><em>TypedArray</em>.from()</code> 允许你从下面两者来创建数组:</p> + +<ul> + <li>类数组对象（拥有一个 <code>length</code> 属性和若干索引属性的任意对象）</li> + <li><a href="/zh-CN/docs/Web/JavaScript/Guide/iterable">可迭代对象</a>（你可以从它身上迭代出若干个元素的对象，比如有 {{jsxref("Map")}} 和 {{jsxref("Set")}} 等）。</li> +</ul> + +<p><code><em>TypedArray</em>.from()</code> 方法有一个可选参数 <code>mapFn</code>, 让你可以在最后生成的类型数组上再执行一次 {{jsxref("Array.prototype.map", "map")}} 方法后再返回。也就是说以下两种形式是等价的：</p> + +<ul> + <li><code><em>TypedArray</em>.from(obj, mapFn, thisArg)</code> </li> + <li><code><em>TypedArray</em>.from(Array.prototype.map.call(obj, mapFn, thisArg))</code></li> +</ul> + +<p> <code>from()</code> 的 <code>length</code> 属性值为 <code>1</code>。</p> + +<p>{{jsxref("Array.from()")}} 和 <code><em>TypedArray</em>.from()</code> 之间有一些微妙的区别:</p> + +<ul> + <li>如果 <code>|this|</code> 的值传递给 <code><em>TypedArray</em>.from</code> 不是一个构造器, <code><em>TypedArray</em>.from</code> 将抛出{jsxref("TypeError")}}, 而 <code>Array.from</code> 默认将创建一个 {{jsxref("Array")}}.</li> + <li><code><em>TypedArray</em>.from</code> 使用<code>[Put]</code> 而 <code>rray.from</code> 使用<code>[DefineProperty]]</code>. 因此, 当和 {{jsxref("Proxy")}} 对象一起时, 它调用 {{jsxref("Global_Objects/Proxy/handler/set", "handler.set")}} 创建一个新的元素而非 {{jsxref("Global_Objects/Proxy/handler/defineProperty", "handler.defineProperty")}}.</li> + <li>当 <code>from</code> 获得一个迭代器时, <code><em>TypedArray</em></code> 一开始收集迭代器中的所有值， 此时创建一个 <code>|this|</code> 的实例用于计数, 然后在实例中设置值。 <code>Array.from</code> 设置每个从迭代器其中获取的值，最后设置它的长度。</li> + <li>当 <code>Array.from</code> 获得一个不可迭代的类数组时, it respects holes, 而 <code><em>TypedArray</em>.from</code> 将确保结果是 dense.</li> +</ul> + +<h2 id="示例">示例</h2> + +<pre class="brush: js">// 使用 Set (可迭代对象) +var s = new Set([1, 2, 3]); +Uint8Array.from(s); +// Uint8Array [ 1, 2, 3 ] + + +// 使用字符串 +Int16Array.from('123'); +// Int16Array [ 1, 2, 3 ] + + +// 使用箭头函数对数组元素进行映射 +Float32Array.from([1, 2, 3], x => x + x); +// Float32Array [ 2, 4, 6 ] + + +// 生成一个数字序列 +Uint8Array.from({length: 5}, (v, k) => k); +// Uint8Array [ 0, 1, 2, 3, 4 ] +</pre> + +<h2 id="Polyfill">Polyfill </h2> + +<p>在不支持 <code>from()</code> 的环境中，你可以在你代码的起始位置插入以下代码，来实现对其功能的大部分支持。</p> + +<pre class="brush: js">if (!Int8Array.__proto__.from) { + (function () { + Int8Array.__proto__.from = function (obj, func, thisObj) { + + var typedArrayClass = Int8Array.__proto__; + if(typeof this !== 'function') { + throw new TypeError('# is not a constructor'); + } + if (this.__proto__ !== typedArrayClass) { + throw new TypeError('this is not a typed array.'); + } + + func = func || function (elem) { + return elem; + }; + + if (typeof func !== 'function') { + throw new TypeError('specified argument is not a function'); + } + + obj = Object(obj); + if (!obj['length']) { + return new this(0); + } + var copy_data = []; + for(var i = 0; i < obj.length; i++) { + copy_data.push(obj[i]); + } + + copy_data = copy_data.map(func, thisObj); + + var typed_array = new this(copy_data.length); + for(var i = 0; i < typed_array.length; i++) { + typed_array[i] = copy_data[i]; + } + return typed_array; + } + })(); +}</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-%typedarray%.from', '%TypedArray%.from')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-%typedarray%.from', '%TypedArray%.from')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> + + +<p>{{Compat("javascript.builtins.TypedArray.from")}}</p> +</div> + +<h2 id="另见">另见</h2> + +<ul> + <li>{{jsxref("TypedArray.of()")}}</li> + <li>{{jsxref("Array.from()")}}</li> + <li>{{jsxref("Array.prototype.map()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/typedarray/includes/index.html b/files/zh-cn/web/javascript/reference/global_objects/typedarray/includes/index.html new file mode 100644 index 0000000000..9496cdc621 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/typedarray/includes/index.html @@ -0,0 +1,122 @@ +--- +title: TypedArray.prototype.includes() +slug: Web/JavaScript/Reference/Global_Objects/TypedArray/includes +translation_of: Web/JavaScript/Reference/Global_Objects/TypedArray/includes +--- +<div>{{JSRef}}</div> + +<p><code><strong>includes()</strong></code>方法判断类型化数组中是否含有特定元素，并相应返回<code>true</code> 或者<code>false</code> ，这个方法的算法和{{jsxref("Array.prototype.includes()")}}<em>相同。</em> <em>TypedArray</em> 是这里的 <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray#TypedArray_objects">类型化数组</a> 之一。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>typedarray</var>.includes(<var>searchElement</var>[, <var>fromIndex</var>]);</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>searchElement</code></dt> + <dd>要搜索的元素。</dd> + <dt><code>fromIndex</code></dt> + <dd>可选，数组中的位置，在这里开始搜索 <code>searchElement</code>；默认为 0。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>{{jsxref("Boolean")}}。</p> + +<h2 id="示例">示例</h2> + +<pre class="brush: js">var uint8 = new Uint8Array([1,2,3]); +uint8.includes(2); // true +uint8.includes(4); // false +uint8.includes(3, 3); // false + +// NaN 的处理 （仅仅对 Float32 和 Float64 为 true） +new Uint8Array([NaN]).includes(NaN); // false, 因为 NaN 传递给构造器时转换为 0 +new Float32Array([NaN]).includes(NaN); // true; +new Float64Array([NaN]).includes(NaN); // true; +</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('ES7', '#sec-%typedarray%.prototype.includes', 'TypedArray.prototype.includes')}}</td> + <td>{{Spec2('ES7')}}</td> + <td>初始定义。</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-%typedarray%.prototype.includes', 'TypedArray.prototype.includes')}}</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>Edge</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Basic support</td> + <td>47</td> + <td>43</td> + <td>14</td> + <td>{{CompatNo}}</td> + <td>34</td> + <td>10</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>{{CompatNo}}</td> + <td>47</td> + <td>43</td> + <td>{{CompatNo}}</td> + <td>34</td> + <td>10</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="另见">另见</h2> + +<ul> + <li>{{jsxref("Array.prototype.includes()")}}</li> + <li>{{jsxref("String.prototype.includes()")}}</li> + <li>{{jsxref("TypedArray.prototype.indexOf()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/typedarray/index.html b/files/zh-cn/web/javascript/reference/global_objects/typedarray/index.html new file mode 100644 index 0000000000..3ccd0fd6f2 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/typedarray/index.html @@ -0,0 +1,307 @@ +--- +title: TypedArray +slug: Web/JavaScript/Reference/Global_Objects/TypedArray +tags: + - JavaScript + - TypedArray + - 类型化数组 + - 类型数组 + - 缓冲区 +translation_of: Web/JavaScript/Reference/Global_Objects/TypedArray +--- +<p>{{JSRef}}</p> + +<p>一个<strong>类型化数组</strong>（<strong>TypedArray）</strong>对象描述了一个底层的<a href="/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/ArrayBuffer">二进制数据缓冲区</a>（binary data buffer）的一个类数组视图（view）。事实上，没有名为 <code>TypedArray</code> 的全局属性，也没有一个名为 <code>TypedArray</code> 的构造函数。相反，有许多不同的全局属性，它们的值是特定元素类型的类型化数组构造函数，如下所示。在下面的页面中，你会发现一些，与包含任何类型的元素的任意类型化数组一起使用的通用属性和方法。</p> + +<div>{{EmbedInteractiveExample("pages/js/typedarray-constructor.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="brush: js">// 下面代码是语法格式，不能直接运行， +// TypedArray 关键字需要替换为底部列出的构造函数。 +new TypedArray(); // ES2017中新增 +new<em> TypedArray</em>(length); +new <em>TypedArray</em>(typedArray); +new <em>TypedArray</em>(object); +new <em>TypedArray</em>(buffer [, byteOffset [, length]]); + +<em>// TypedArray 指的是以下的其中之一：</em> + +Int8Array(); +Uint8Array(); +Uint8ClampedArray(); +Int16Array(); +Uint16Array(); +Int32Array(); +Uint32Array(); +Float32Array(); +Float64Array();</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code><em>length</em></code></dt> + <dd>当传入 <code>length</code> 参数时，一个内部的数组缓冲区会被创建在内存中，该缓存区的大小（类型化数组中 <code>byteLength</code> 属性的值）是传入的 <code>length</code><em> </em>乘以数组中每个元素的字节数（<code>BYTES_PER_ELEMENT</code>），每个元素的值都为<code>0</code>。(译者注：每个元素的字节数是由具体的构造函数决定的，比如 <code>Int16Array()</code> 的每个元素的字节数为 <code>2</code>，<code>Int32Array()</code> 的每个元素的字节数为 <code>4</code>)</dd> + <dt><code><em>typedArray</em></code></dt> + <dd>当传入一个任意类型化数组对象作为 <code>typedArray</code> 参数时（比如 <code>Int32Array</code>），<code>typedArray</code> 会被复制到一个新的类型数组中。<code>typedArray</code> 中的每个值在被复制到新的数组之前，会被转化为相应类型的构造函数。新的生成的类型化数组对象将会有跟传入的数组相同的长度（译者注：比如原来的类型化数组的 <code>length==2</code>，那么新生成的数组的 <code>length</code> 也是 <code>2</code>，只是数组中的每一项进行了转化）。</dd> + <dt><code><em>object</em></code></dt> + <dd> + <p>当传入一个 <font face="Consolas, Liberation Mono, Courier, monospace"><code>object</code></font> 作为参数时，就像通过<font face="Consolas, Liberation Mono, Courier, monospace"> </font><code><em>TypedArray</em>.from()</code> 方法创建一个新的类型化数组一样。</p> + </dd> + <dt><code><em>buffer</em></code>, <code><em>byteOffset</em></code>, <code><em>length</em></code></dt> + <dd>当传入一个 <code>buffer</code> 参数，或者再另外加上可选参数 <code>byteOffset</code> 和 <code>length</code> 时，一个新的类型化数组视图将会被创建，并可用于呈现传入的 <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/ArrayBuffer" title="The ArrayBuffer object is used to represent a generic, fixed-length raw binary data buffer. You cannot directly manipulate the contents of an ArrayBuffer; instead, you create one of the typed array objects or a DataView object which represents the buffer in a specific format, and use that to read and write the contents of the buffer.">ArrayBuffer</a></code> 实例。<code>byteOffset</code> 和<code>length</code> 参数指定了类型化数组视图将要暴露的内存范围。如果两者都未传入，那么整个<code>buffer</code> 都会被呈现；如果仅仅忽略 <code>length</code>，那么 <code>buffer</code> 中偏移了 <code>byteOffset</code> 后剩下的 <code>buffer</code> 将会被呈现。</dd> +</dl> + +<h2 id="描述">描述</h2> + +<p>ECMAScript 2015 定义了一个 <em><code>TypeArray</code></em> 构造器作为所有的类型化数组构造器（<code>Int8Array</code>, <code>Int16Array</code> 等）的原型（<code>[[Prototype]]</code>）。该构造器并不会直接暴露出来：即没有全局的 <code>%TypedArray%</code> 和 <code>TypeArray</code> 属性，只能通过使用类似于 <code>Object.getPrototypeOf(Int8Array.prototype</code>) 的方式直接访问。所有的类型化数组构造器都会继承 <code>%</code><code>TypeArray%</code> 构造器函数的公共属性和方法。此外，所有的类型化数组的原型（如 <code>Int8Array.prototype</code>）都以 <code>%TypeArray%.prototype</code> 作为原型。</p> + +<p><code>%TypedArray%</code> 构造器自身不是特别有用，直接调用或使用 <code>new</code> 表达式实例化都会抛出一个{{jsxref("TypeError")}} 异常，除非在支持子类化（subclassing）创建对象的 JS 引擎下运行。但直到现在还没有这样的 JS 引擎出现。因此 <code>%TypeArray%</code> 仅仅在对所有的类型化数组构造器（<code>Int8Array</code> 等）的方法和属性进行 polyfill 的时候比较有用.</p> + +<p>当创建一个 <code>TypedArray</code> 实例（如 <code>Int8Array</code>）时，一个数组缓冲区将被创建在内存中，如果一个 <code>ArrayBuffer</code> 对象被当作参数传给构造函数，那么将使用传入的 <code>ArrayBuffer</code> 代替（即缓冲区被创建到 <code>ArrayBuffer</code> 中）。缓冲区的地址被存储在实例的内部属性中，并且所有 <code>%TypedArray%.prototype</code>上的方法，例如 <code>set value</code> 和 <code>get value</code> 等，都会在这个数组缓冲区上进行操作。</p> + +<h3 id="属性访问">属性访问</h3> + +<p>你可以使用标准数组索引语法获取类型化数组中的元素（也就是和访问普通数组元素一样，如 <code>foo[1]</code>），然而，在类型化数组上获取或者设置属性的值时，并不会在这个属性的原型链中进行搜索，即使在索引超出了边界的时候。在原型中添加的属性将会在 {{jsxref("ArrayBuffer")}} 中查询而不是在对象的属性中。但是你依然可以像其他对象一样使用命名的属性来访问（<code>foo.bar</code> 的形式）；具体见下面的例子：</p> + +<pre class="brush: js">// 使用标准数组语法来获取和设置属性值 +var int16 = new Int16Array(2); +int16[0] = 42; +console.log(int16[0]); // 42 + +// 原型中添加的属性访问不到（此时索引值未超边界，20 < 32） +Int8Array.prototype[20] = "foo"; +(new Int8Array(32))[20]; // 0 + +// 即使索引值超出了边界也一样不能访问（20 > 8） +Int8Array.prototype[20] = "foo"; +(new Int8Array(8))[20]; // undefined + +// 使用负数索引也不行 +Int8Array.prototype[-1] = "foo"; +(new Int8Array(8))[-1]; // undefined + +// 但是可以使用命名属性的方式访问到 +Int8Array.prototype.foo = "bar"; +(new Int8Array(32)).foo; // "bar"</pre> + +<h2 id="TypedArray_对象">TypedArray 对象</h2> + + + +<table> + <thead> + <tr> + <th scope="col">类型</th> + <th scope="col">单个元素值的范围</th> + <th scope="col">大小(bytes)</th> + <th scope="col">描述</th> + <th scope="col">Web IDL 类型</th> + <th scope="col">C 语言中的等价类型</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{jsxref("Int8Array")}}</td> + <td><code>-128</code> to <code>127</code></td> + <td>1</td> + <td>8 位二进制有符号整数</td> + <td><code>byte</code></td> + <td><code>int8_t</code></td> + </tr> + <tr> + <td>{{jsxref("Uint8Array")}}</td> + <td><code>0</code> to <code>255</code></td> + <td>1</td> + <td>8 位无符号整数（超出范围后从另一边界循环）</td> + <td><code>octet</code></td> + <td><code>uint8_t</code></td> + </tr> + <tr> + <td>{{jsxref("Uint8ClampedArray")}}</td> + <td><code>0</code> to <code>255</code></td> + <td>1</td> + <td>8 位无符号整数（超出范围后为边界值）</td> + <td><code>octet</code></td> + <td><code>uint8_t</code></td> + </tr> + <tr> + <td>{{jsxref("Int16Array")}}</td> + <td><code>-32768</code> to <code>32767</code></td> + <td>2</td> + <td>16 位二进制有符号整数</td> + <td><code>short</code></td> + <td><code>int16_t</code></td> + </tr> + <tr> + <td>{{jsxref("Uint16Array")}}</td> + <td><code>0</code> to <code>65535</code></td> + <td>2</td> + <td>16 位无符号整数</td> + <td><code>unsigned short</code></td> + <td><code>uint16_t</code></td> + </tr> + <tr> + <td>{{jsxref("Int32Array")}}</td> + <td><code>-2147483648</code> to <code>2147483647</code></td> + <td>4</td> + <td>32 位二进制有符号整数</td> + <td><code>long</code></td> + <td><code>int32_t</code></td> + </tr> + <tr> + <td>{{jsxref("Uint32Array")}}</td> + <td><code>0</code> to <code>4294967295</code></td> + <td>4</td> + <td>32 位无符号整数</td> + <td><code>unsigned long</code></td> + <td><code>uint32_t</code></td> + </tr> + <tr> + <td>{{jsxref("Float32Array")}}</td> + <td><code>1.2</code>×<code>10<sup>-38</sup></code> to <code>3.4</code>×<code>10<sup>38</sup></code></td> + <td>4</td> + <td>32 位 IEEE 浮点数（7 位有效数字，如 <code>1.1234567</code>）</td> + <td><code>unrestricted float</code></td> + <td><code>float</code></td> + </tr> + <tr> + <td>{{jsxref("Float64Array")}}</td> + <td><code>5.0</code>×<code>10<sup>-324</sup></code> to <code>1.8</code>×<code>10<sup>308</sup></code></td> + <td>8</td> + <td>64 位 IEEE 浮点数（16 有效数字，如 <code>1.123...15</code>)</td> + <td><code>unrestricted double</code></td> + <td><code>double</code></td> + </tr> + <tr> + <td>{{jsxref("BigInt64Array")}}</td> + <td><code>-2<sup>63</sup></code> to <code>2<sup>63</sup>-1</code></td> + <td>8</td> + <td>64 位二进制有符号整数</td> + <td><code>bigint</code></td> + <td><code>int64_t (signed long long)</code></td> + </tr> + <tr> + <td>{{jsxref("BigUint64Array")}}</td> + <td><code>0</code> to <code>2<sup>64</sup>-1</code></td> + <td>8</td> + <td>64 位无符号整数</td> + <td><code>bigint</code></td> + <td><code>uint64_t (unsigned long long)</code></td> + </tr> + </tbody> +</table> + +<h2 id="属性"><span style='font-family: x-locale-heading-primary,zillaslab,Palatino,"Palatino Linotype",x-locale-heading-secondary,serif; font-size: 2.33333rem; letter-spacing: -0.00278rem;'>属性</span></h2> + +<dl> + <dt>{{jsxref("TypedArray.BYTES_PER_ELEMENT")}}</dt> + <dd>返回一个数值，代表不同类型的类型化数组对象中，单个元素的字节大小。例如 <code>new Int8Array().BYTES_PER_ELEMENT === 1</code>, <font face="consolas, Liberation Mono, courier, monospace"><span style="background-color: rgba(220, 220, 220, 0.5);"><code>new Int16Array().BYTES_PER_ELEMENT === 2</code></span></font> （ 8 位字节为 1，16 位为 2 字节，类推）。 </dd> + <dt><code><em>TypedArray</em>.length</code></dt> + <dd>类型化数组中元素的个数，例如 <code>new Int8Array(3).length === 3</code>。</dd> + <dt>{{jsxref("TypedArray.name")}}</dt> + <dd>返回一个字符串值，代表当前构造器的名称，例如 <code>"Int8Array"</code>。</dd> + <dt>{{jsxref("TypedArray.@@species", "get TypedArray[@@species]")}}</dt> + <dd>用于创建派生对象的构造函数函数。</dd> + <dt>{{jsxref("TypedArray.prototype")}}</dt> + <dd><code>TypedArray</code> 对象的原型。</dd> +</dl> + +<h2 id="方法">方法</h2> + +<dl> + <dt>{{jsxref("TypedArray.from()")}}</dt> + <dd>使用类数组(array-like)或迭代对象创建一个新的类型化数组.参见 {{jsxref("Array.from()")}}.</dd> + <dt>{{jsxref("TypedArray.of()")}}</dt> + <dd>通过可变数量的参数创建新的类型化数组.参见 {{jsxref("Array.of()")}}.</dd> +</dl> + +<h2 id="TypedArray_原型">TypedArray 原型</h2> + +<p>所有的类型化数组都继承自 {{jsxref("TypedArray.prototype")}}.</p> + +<h3 id="属性_2">属性</h3> + +<p>{{page('zh-CN/Web/JavaScript/Reference/Global_Objects/TypedArray/prototype','属性')}}</p> + +<h3 id="方法_2">方法</h3> + +<p>{{page('zh-CN/Web/JavaScript/Reference/Global_Objects/TypedArray/prototype','methods')}}</p> + +<h3 id="方法的_Polyfill">方法的 Polyfill</h3> + +<p>大部分 <code><var>TypedArray</var></code>s 中的方法可以使用 JavaScript 中的普通数组中存在的方法来实现。</p> + +<p>下面的 JavaScript 代码片段，可能会是你尝试用来补救 <code><var>TypedArray</var></code> 方法缺失的手段（polyfill）：</p> + +<pre class="brush: js example-bad">var typedArrayTypes = [<code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Int8Array" title="The Int8Array typed array represents an array of twos-complement 8-bit signed integers. The contents are initialized to 0. Once established, you can reference elements in the array using the object's methods, or using standard array index syntax (that is, using bracket notation).">Int8Array</a>, <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Uint8Array" title="The Uint8Array typed array represents an array of 8-bit unsigned integers. The contents are initialized to 0. Once established, you can reference elements in the array using the object's methods, or using standard array index syntax (that is, using bracket notation).">Uint8Array</a>, <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Uint8ClampedArray" title="The Uint8ClampedArray typed array represents an array of 8-bit unsigned integers clamped to 0-255; if you specified a value that is out of the range of [0,255], 0 or 255 will be set instead; if you specify a non-integer, the nearest integer will be set. The contents are initialized to 0. Once established, you can reference elements in the array using the object's methods, or using standard array index syntax (that is, using bracket notation).">Uint8ClampedArray</a>, + <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Int16Array" title="The Int16Array typed array represents an array of twos-complement 16-bit signed integers in the platform byte order. If control over byte order is needed, use DataView instead. The contents are initialized to 0. Once established, you can reference elements in the array using the object's methods, or using standard array index syntax (that is, using bracket notation).">Int16Array</a>,<font face="consolas, monaco, Andale Mono, monospace"> </font></code><code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Uint16Array" title="The Uint16Array typed array represents an array of 16-bit unsigned integers in the platform byte order. If control over byte order is needed, use DataView instead. The contents are initialized to 0. Once established, you can reference elements in the array using the object's methods, or using standard array index syntax (that is, using bracket notation).">Uint16Array</a>, <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Int32Array" title="The Int32Array typed array represents an array of twos-complement 32-bit signed integers in the platform byte order. If control over byte order is needed, use DataView instead. The contents are initialized to 0. Once established, you can reference elements in the array using the object's methods, or using standard array index syntax (that is, using bracket notation).">Int32Array</a>, + <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Uint32Array" title="The Uint32Array typed array represents an array of 32-bit unsigned integers in the platform byte order. If control over byte order is needed, use DataView instead. The contents are initialized to 0. Once established, you can reference elements in the array using the object's methods, or using standard array index syntax (that is, using bracket notation).">Uint32Array</a>, <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Float32Array" title="The Float32Array typed array represents an array of 32-bit floating point numbers (corresponding to the C float data type) in the platform byte order. If control over byte order is needed, use DataView instead. The contents are initialized to 0. Once established, you can reference elements in the array using the object's methods, or using standard array index syntax (that is, using bracket notation).">Float32Array</a>, </code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Float64Array" title="The Float64Array typed array represents an array of 64-bit floating point numbers (corresponding to the C double data type) in the platform byte order. If control over byte order is needed, use DataView instead. The contents are initialized to 0. Once established, you can reference elements in the array using the object's methods, or using standard array index syntax (that is, using bracket notation)."><code>Float64Array</code></a>]; + +for (var k in typedArrayTypes) + for (var v in Array.prototype) + if (Array.prototype.hasOwnProperty(v) && + !typedArrayTypes[k].prototype.hasOwnProperty(v)) + typedArrayTypes[k].prototype[v] = Array.prototype[v];</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>{{SpecName('Typed Array')}}</td> + <td>{{Spec2('Typed Array')}}</td> + <td>Defined as <code>TypedArray</code> and <code>ArrayBufferView</code> interface with typed array view types. Superseded by ECMAScript 6.</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-typedarray-objects', 'TypedArray Objects')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition in an ECMA standard. Specified behaviour for indexed and named properties. Specified that <code>new</code> is required.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-typedarray-objects', 'TypedArray Objects')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器支持">浏览器支持</h2> + +<p><span style='background-color: transparent; color: #333333; display: inline !important; float: none; font-family: "Open Sans",arial,x-locale-body,sans-serif; font-size: 16px; font-style: normal; font-variant: normal; font-weight: 400; letter-spacing: normal; text-align: left; text-decoration: none; text-indent: 0px; text-transform: none; white-space: normal;'>{{Compat("javascript.builtins.TypedArray")}}</span></p> + +<h2 id="兼容性注意事项">兼容性注意事项</h2> + +<p>从ECMAScript 2015 (ES6) 开始，<code>TypedArray</code> 构造函数使用的时候必须要使用 <code>new</code> 操作符，否则会抛出 {{jsxref("TypeError")}} 异常。</p> + +<pre class="brush: js example-bad">var dv = Int8Array([1, 2, 3]); +// TypeError: calling a builtin Int8Array constructor </pre> + +<pre class="brush: js example-good">var dv = new Int8Array([1, 2, 3]);</pre> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li><a href="/en-US/docs/Web/JavaScript/Typed_arrays" title="en/JavaScript typed arrays">JavaScript typed arrays</a></li> + <li>{{jsxref("ArrayBuffer")}}</li> + <li>{{jsxref("DataView")}}</li> +</ul> + +<p> + <audio style="display: none;"></audio> +</p> + +<p> + <audio style="display: none;"></audio> +</p> + +<p> + <audio style="display: none;"></audio> +</p> diff --git a/files/zh-cn/web/javascript/reference/global_objects/typedarray/indexof/index.html b/files/zh-cn/web/javascript/reference/global_objects/typedarray/indexof/index.html new file mode 100644 index 0000000000..b7893c25f8 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/typedarray/indexof/index.html @@ -0,0 +1,132 @@ +--- +title: TypedArray.prototype.indexOf() +slug: Web/JavaScript/Reference/Global_Objects/TypedArray/indexOf +tags: + - TypedArray + - Uint8Array +translation_of: Web/JavaScript/Reference/Global_Objects/TypedArray/indexOf +--- +<div>{{JSRef}}</div> + +<p><code><strong>indexOf()</strong></code> 方法返回在类型数组中可以找到给定元素的第一个索引，如果不存在，则返回-1。 方法具有与 {{jsxref("Array.prototype.indexOf()")}} 相同的算法。 TypedArray是这里的<a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray#TypedArray_objects">类型化数组类型</a>之一。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><var>typedarray</var>.<var>i<code>ndexOf(<var>searchElement</var>[, <var>fromIndex</var> = 0])</code></var></code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>searchElement</code></dt> + <dd>需要在类型化数组中定位的元素</dd> + <dt><code>fromIndex</code></dt> + <dd>搜索的起始下标。如果下标大于等于类型化数组长度，则返回 -1，意思是类型化数组不会被搜索。如果提供的下标值是负数，则被当做距离类型化数组尾部的偏移。注：如果提供的下标是负数，类型化数组仍然从前到后搜索。如果计算出来的下标小于 0，则会搜索整个类型化数组。默认为 0（搜索整个类型化数组）。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>数组中元素的第一个下标；没有找到则返回<strong>-1</strong> 。</p> + +<h2 id="描述">描述</h2> + +<p><code>indexOf</code>使用<a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Comparison_Operators#Using_the_Equality_Operators">严格相等</a> （由 === 或三等号运算符使用的相同方法）比较<code>searchElement</code>和类型化数组的元素。</p> + +<h2 id="示例">示例</h2> + +<pre class="brush: js">let uint8 = new Uint8Array([2, 5, 9]); +uint8.indexOf(2); // 0 +uint8.indexOf(7); // -1 +uint8.indexOf(9, 2); // 2 +uint8.indexOf(2, -1); // -1 +uint8.indexOf(2, -3); // 0 +</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('ES6', '#sec-%typedarray%.prototype.indexof', 'TypedArray.prototype.indexOf')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>初始定义。</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-%typedarray%.prototype.indexof', 'TypedArray.prototype.indexOf')}}</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>Edge</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{CompatChrome("45")}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoDesktop("37")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatChrome("32")}}</td> + <td>{{CompatNo}}</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>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatGeckoDesktop("37")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="兼容性注解">兼容性注解</h2> + +<ul> + <li>自 Firefox 47 {{geckoRelease(47)}}起，这个方法不再返回<code>-0</code>。<br> + 例如， <code>new Uint8Array([0]).indexOf(0, -0)</code> 现在始终返回 <code>+0</code> ({{bug(1242043)}})。</li> +</ul> + +<h2 id="另见">另见</h2> + +<ul> + <li>{{jsxref("TypedArray.prototype.lastIndexOf()")}}</li> + <li>{{jsxref("Array.prototype.indexOf()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/typedarray/join/index.html b/files/zh-cn/web/javascript/reference/global_objects/typedarray/join/index.html new file mode 100644 index 0000000000..31dbcc2ae1 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/typedarray/join/index.html @@ -0,0 +1,128 @@ +--- +title: TypedArray.prototype.join() +slug: Web/JavaScript/Reference/Global_Objects/TypedArray/join +translation_of: Web/JavaScript/Reference/Global_Objects/TypedArray/join +--- +<div>{{JSRef}}</div> + +<p><code><strong>join()</strong></code>方法将数组中所有元素连接为一个字符串。这个方法的算法和{{jsxref("Array.prototype.join()")}}<em>相同。</em> <em>TypedArray</em> 是这里的 <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray#TypedArray_objects">类型化数组</a> 之一。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><var>typedarray</var>.join(<code>[<var>separator</var> = ',']</code>);</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>separator</code></dt> + <dd>可选。指定分隔每个元素的字符串。分隔符按需转换为字符串。如果没有，类型化数组的元素会以逗号(",")分隔。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>所有元素连接后的字符串。</p> + +<h2 id="示例">示例</h2> + +<pre class="brush: js">var uint8 = new Uint8Array([1,2,3]); +uint8.join(); // '1,2,3' +uint8.join(' / '); // '1 / 2 / 3' +uint8.join(''); // '123' +</pre> + +<h2 id="Polyfill">Polyfill</h2> + +<p>由于没有名为<em>TypedArray</em>的全局元素，polyfill 必须"按情况"实现。</p> + +<pre class="brush: js">// https://tc39.github.io/ecma262/#sec-%typedarray%.prototype.join +if (!Uint8Array.prototype.join) { + Object.defineProperty(Uint8Array.prototype, 'join', { + value: Array.prototype.join + }); +} +</pre> + +<p>如果你需要支持过时的 JavaScript 引擎，它们不支持<code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperty">Object.defineProperty</a></code>，最好不要 polyfill <code>Array.prototype</code> 方法，因为你不能使它们不可枚举。</p> + +<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-%typedarray%.prototype.join', 'TypedArray.prototype.join')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>初始定义。</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-%typedarray%.prototype.join', 'TypedArray.prototype.join')}}</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>Edge</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoDesktop("37")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</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>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatGeckoMobile("37")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="另见">另见</h2> + +<ul> + <li>{{jsxref("TypedArray")}}</li> + <li>{{jsxref("Array.prototype.join()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/typedarray/keys/index.html b/files/zh-cn/web/javascript/reference/global_objects/typedarray/keys/index.html new file mode 100644 index 0000000000..dbed46268a --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/typedarray/keys/index.html @@ -0,0 +1,128 @@ +--- +title: TypedArray.prototype.keys() +slug: Web/JavaScript/Reference/Global_Objects/TypedArray/keys +translation_of: Web/JavaScript/Reference/Global_Objects/TypedArray/keys +--- +<div>{{JSRef}}</div> + +<p><strong><code>keys()</code></strong>方法返回新的 <code>Array Iterator</code> 对象，包含数组中每个下标的键。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><var>arr</var>.keys()</code></pre> + +<h3 id="返回值">返回值</h3> + +<p>新的<code><strong>Array Iterator</strong></code>对象</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用for...of循环的迭代">使用<code>for...of</code>循环的迭代</h3> + +<pre class="brush: js">var arr = new Uint8Array([10, 20, 30, 40, 50]); +var eArray = arr.keys(); +// 你的浏览器必须支持 for..of 循环 +// 以及 for 循环中的 let 区域变量 +for (let n of eArray) { + console.log(n); +} +</pre> + +<h3 id="备选的迭代">备选的迭代</h3> + +<pre class="brush: js">var arr = new Uint8Array([10, 20, 30, 40, 50]); +var eArr = arr.keys(); +console.log(eArr.next().value); // 0 +console.log(eArr.next().value); // 1 +console.log(eArr.next().value); // 2 +console.log(eArr.next().value); // 3 +console.log(eArr.next().value); // 4 +</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-%typedarray%.prototype.keys', '%TypedArray%.prototype.keys()')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>初始定义。</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-%typedarray%.prototype.keys', '%TypedArray%.prototype.keys()')}}</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>Edge</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoDesktop(37)}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>10</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>{{CompatNo}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoMobile(37)}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>10</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="另见">另见</h2> + +<ul> + <li><a href="/en-US/docs/Web/JavaScript/Typed_arrays">JavaScript 类型化数组</a></li> + <li>{{jsxref("TypedArray")}}</li> + <li>{{jsxref("TypedArray.prototype.entries()")}}</li> + <li>{{jsxref("TypedArray.prototype.values()")}}</li> + <li>{{jsxref("TypedArray.prototype.@@iterator()", "TypedArray.prototype[@@iterator]()")}}</li> + <li><a href="/en-US/docs/Web/JavaScript/Reference/Statements/for...of">for...of</a></li> + <li><a href="/en-US/docs/Web/JavaScript/Reference/Iteration_protocols">迭代协议</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/typedarray/lastindexof/index.html b/files/zh-cn/web/javascript/reference/global_objects/typedarray/lastindexof/index.html new file mode 100644 index 0000000000..8552cf0dae --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/typedarray/lastindexof/index.html @@ -0,0 +1,130 @@ +--- +title: TypedArray.prototype.lastIndexOf() +slug: Web/JavaScript/Reference/Global_Objects/TypedArray/lastIndexOf +translation_of: Web/JavaScript/Reference/Global_Objects/TypedArray/lastIndexOf +--- +<div>{{JSRef}}</div> + +<p><code><strong>lastIndexOf()</strong></code> 方法返回在类型数组中可以找到给定元素的最后一个索引，如果不存在，则返回-1。 方法具有与 {{jsxref("Array.prototype.lastIndexOf()")}} 相同的算法。 TypedArray是这里的<a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray#TypedArray_objects">类型化数组类型</a>之一。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><var>typedarray</var>.<var><code>lastIndexOf(<var>searchElement</var>[, <var>fromIndex</var> = typedarray.length])</code></var></code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>searchElement</code></dt> + <dd>需要在类型化数组中定位的元素</dd> + <dt><code>fromIndex</code></dt> + <dd>可选。反向搜索的起始下标。默认为数组的长度，即会搜索整个类型化数组。如果下标大于等于类型化数组长度，会搜索整个类型化数组。如果是负数，则被当做距离类型化数组尾部的偏移。注：如果提供的下标是负数，类型化数组仍然从后到前搜索。如果计算出来的下标小于 0，则会返回 -1，即不会搜索类型化数组。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>数组中元素的最后一个下标；没有找到则返回 <strong>-1</strong> 。</p> + +<h2 id="描述">描述</h2> + +<p><code>lastIndexOf</code>使用<a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Comparison_Operators#Using_the_Equality_Operators">严格相等</a> （由 === 或三等号运算符使用的相同方法）比较<code>searchElement</code>和类型化数组的元素。</p> + +<h2 id="示例">示例</h2> + +<pre class="brush: js">var uint8 = new Uint8Array([2, 5, 9, 2]); +uint8.lastIndexOf(2); // 3 +uint8.lastIndexOf(7); // -1 +uint8.lastIndexOf(2, 3); // 3 +uint8.lastIndexOf(2, 2); // 0 +uint8.lastIndexOf(2, -2); // 0 +uint8.lastIndexOf(2, -1); // 3 +</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-%typedarray%.prototype.lastindexof', 'TypedArray.prototype.lastIndexOf')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>初始定义。</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-%typedarray%.prototype.lastindexof', 'TypedArray.prototype.lastIndexOf')}}</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>Edge</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoDesktop("37")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>10</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>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatGeckoDesktop("37")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>10</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="兼容性注解">兼容性注解</h2> + +<ul> + <li>自 Firefox 47 {{geckoRelease(47)}}起，这个方法不再返回<code>-0</code>。<br> + 例如， <code>new Uint8Array([0]).lastIndexOf(0, -0)</code> 现在始终返回 <code>+0</code> ({{bug(1242043)}})。</li> +</ul> + +<h2 id="另见">另见</h2> + +<ul> + <li>{{jsxref("TypedArray.prototype.indexOf()")}}</li> + <li>{{jsxref("Array.prototype.lastIndexOf()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/typedarray/length/index.html b/files/zh-cn/web/javascript/reference/global_objects/typedarray/length/index.html new file mode 100644 index 0000000000..0db01b1d09 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/typedarray/length/index.html @@ -0,0 +1,113 @@ +--- +title: TypedArray.prototype.length +slug: Web/JavaScript/Reference/Global_Objects/TypedArray/length +translation_of: Web/JavaScript/Reference/Global_Objects/TypedArray/length +--- +<div>{{JSRef}}</div> + +<p><strong><code>length</code></strong>访问器属性表示类型化数组的长度（元素数）。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>typedarray</var>.length</pre> + +<h2 id="描述">描述</h2> + +<p><code>length</code> 是一个访问器属性，它的 set 访问器函数是<code>undefined</code>，意思是你只能够读取这个属性。它的值在<em>TypedArray</em>构造时建立，不能被修改。如果 <em>TypedArray</em> 没有指定<code>byteOffset</code> 或者 <code>length</code>，会返回所引用的<code>ArrayBuffer</code> 的<code>length</code>。<em>TypedArray</em> 是这里的 <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray#TypedArray_objects">TypedArray 对象</a>之一。</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用length_属性">使用<code>length</code> 属性</h3> + +<pre class="brush:js">var buffer = new ArrayBuffer(8); + +var uint8 = new Uint8Array(buffer); +uint8.length; // 8 (符合 buffer 的 length) + +var uint8 = new Uint8Array(buffer, 1, 5); +uint8.length; // 5 (在 Uint8Array 构造时指定) + +var uint8 = new Uint8Array(buffer, 2); +uint8.length; // 6 (根据被构造的 Uint8Array 的 offset) +</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('ES6', '#sec-get-%typedarray%.prototype.length', 'TypedArray.prototype.length')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>初始定义</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-get-%typedarray%.prototype.length', 'TypedArray.prototype.length')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{CompatibilityTable}}</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>7.0</td> + <td>{{CompatGeckoDesktop("2")}}</td> + <td>10</td> + <td>11.6</td> + <td>5.1</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>4.0</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoMobile("2")}}</td> + <td>10</td> + <td>11.6</td> + <td>4.2</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="另见">另见</h2> + +<ul> + <li><a href="/en-US/docs/Web/JavaScript/Typed_arrays">JavaScript 类型化数组</a></li> + <li>{{jsxref("TypedArray")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/typedarray/map/index.html b/files/zh-cn/web/javascript/reference/global_objects/typedarray/map/index.html new file mode 100644 index 0000000000..b32a447ca3 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/typedarray/map/index.html @@ -0,0 +1,151 @@ +--- +title: TypedArray.prototype.map() +slug: Web/JavaScript/Reference/Global_Objects/TypedArray/map +translation_of: Web/JavaScript/Reference/Global_Objects/TypedArray/map +--- +<div>{{JSRef}}</div> + +<p><code><strong>map()</strong></code>方法对类型化数组的每个元素调用提供的函数，并使用结果来创建新的类型化数组。 这个方法的算法和 {{jsxref("Array.prototype.map()")}}<em>相同。</em> <em>TypedArray</em> 是这里的 <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray#TypedArray_objects">类型化数组类型</a> 之一。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><var>typedarray</var>.map(<var>callback</var>[, <var>thisArg</var>])</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>callback</code></dt> + <dd>产生新的类型化数组的元素的函数，接受三个函数： + <dl> + <dt><code>currentValue</code></dt> + <dd>类型化数组中要处理的当前元素</dd> + <dt><code>index</code></dt> + <dd>类型化数组中要处理的当前元素的下标</dd> + <dt><code>array</code></dt> + <dd><code>map</code>在其上调用的类型化数组</dd> + </dl> + </dd> + <dt><code>thisArg</code></dt> + <dd>可选，执行<code>callback</code>时作为<code>this</code>的值。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>新的类型化数组</p> + +<h2 id="描述">描述</h2> + +<p><code>map</code>方法对类型化数组中的元素调用提供的 <code>callback</code>函数，按照顺序，并且会从结果构造新的类型化数组。 <code>callback</code> 只对拥有值的类型化数组下标调用。它不会对未定义的，被删除的或者没有赋值的下标调用。</p> + +<p><code>callback</code> 以三个参数调用： 元素的值，元素下标，和被遍历的类型化数组。</p> + +<p>如果将<code>thisArg</code>参数提供给<code>map</code>，它会在调用时传递给<code>callback</code>，作为它的 <code>this</code>值。否则，会传递<code>undefined</code> 作为它的<code>this</code> 值。 <code>callback</code>最终观测到的<code>this</code>值由 <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/this">用于决定函数可见的<code>this</code>值的一般规则</a>来决定。</p> + +<p><code>map</code> 不改变在其上调用的类型化数组（虽然如果调用了<code>callback</code>可能会这样做）。</p> + +<p>由 <code>map</code>处理的元素范围在<code>callback</code>调用之前就确定了。 在 <code>map</code>调用之后添加到数组的元素不会由 <code>callback</code>访问。 如果类型化数组的现有元素被改变，或被删除，它们传给<code>callback</code>的值是<code>map</code> 访问它们时候的值。已删除的元素不会被访问。</p> + +<h2 id="示例">示例</h2> + +<h3 id="将类型数组映射被平方根的类型数组">将类型数组映射被平方根的类型数组</h3> + +<p>下面的代码接受一个类型数组，并创建一个新的类型数组，含有第一个类型数组中元素的平方根。</p> + +<pre class="brush: js">var numbers = new Uint8Array([1, 4, 9]); +var roots = numbers.map(Math.sqrt); +// roots is now: Uint8Array [1, 2, 3], +// numbers is still Uint8Array [1, 4, 9] +</pre> + +<h3 id="使用含有参数的函数来映射类型数组">使用含有参数的函数来映射类型数组</h3> + +<p>下面的代码展示了，当使用需要一个参数的函数时，<code>map</code>的工作方式。在<code>map</code>遍历原始数组的过程中，参数会自动赋值为类型化数组的每个元素。</p> + +<pre class="brush: js">var numbers = new Uint8Array([1, 4, 9]); +var doubles = numbers.map(function(num) { + return num * 2; +}); +// doubles is now Uint8Array [2, 8, 18] +// numbers is still Uint8Array [1, 4, 9] +</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-%typedarray%.prototype.map', 'TypedArray.prototype.map')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>原始定义。</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-%typedarray%.prototype.map', 'TypedArray.prototype.map')}}</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>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoDesktop("38")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</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>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatGeckoMobile("38")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="另见">另见</h2> + +<ul> + <li>{{jsxref("TypedArray.prototype.filter()")}}</li> + <li>{{jsxref("Array.prototype.map()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/typedarray/name/index.html b/files/zh-cn/web/javascript/reference/global_objects/typedarray/name/index.html new file mode 100644 index 0000000000..4de20db129 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/typedarray/name/index.html @@ -0,0 +1,117 @@ +--- +title: TypedArray.name +slug: Web/JavaScript/Reference/Global_Objects/TypedArray/name +tags: + - JavaScript + - Property + - TypedArray + - TypedArrays + - 构造函数 +translation_of: Web/JavaScript/Reference/Global_Objects/TypedArray/name +--- +<div>{{JSRef}}</div> + +<p><code><strong><em>TypedArray</em>.name</strong></code> ?属性是描述类型数组构造名的字符串值。</p> + +<div>{{js_property_attributes(0,0,0)}}</div> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">TypedArray.name;</pre> + +<h2 id="描述">描述</h2> + +<p>TypedArray ?对象中，每个元素所含的字节数都与其它元素不同，因此其字节数需要被描述。<code>name</code> 属性描述了数组所包含的数据类型。其命名的第一部分可以是Int(整型)、Uint(无符整型)或Float(浮点)；?其第二部分是一个描述数组所包含位数的数字；最后一部分为对象属性Array(ClampedArray为特例)。更多信息参见{{jsxref("Uint8ClampedArray")}}。</p> + +<h2 id="例子">?例子</h2> + +<pre class="brush:js">Int8Array.name; // "Int8Array" +Uint8Array.name; // "Uint8Array" +Uint8ClampedArray.name; // "Uint8ClampedArray" +Int16Array.name; // "Int16Array" +Uint16Array.name; // "Uint16Array" +Int32Array.name; // "Int32Array" +Uint32Array.name; // "Uint32Array" +Float32Array.name; // "Float32Array" +Float64Array.name; // "Float64Array"</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>{{SpecName('ES6', '#sec-properties-of-the-typedarray-constructors', 'TypedArray.name')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>初始定义</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-properties-of-the-typedarray-constructors', 'TypedArray.name')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容">?浏览器兼容</h2> + +<p>{{CompatibilityTable}}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>?特性</th> + <th>Chrome</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>?基础支持</td> + <td>7.0</td> + <td>{{ CompatGeckoDesktop("2") }}</td> + <td>10</td> + <td>11.6</td> + <td>5.1</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>特性</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>基础支持</td> + <td>4.0</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoMobile("2")}}</td> + <td>10</td> + <td>11.6</td> + <td>4.2</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="参见">参见</h2> + +<ul> + <li><a href="/en-US/docs/Web/JavaScript/Typed_arrays">JavaScript typed arrays</a></li> + <li>{{jsxref("TypedArray")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/typedarray/of/index.html b/files/zh-cn/web/javascript/reference/global_objects/typedarray/of/index.html new file mode 100644 index 0000000000..1aafb4c2c6 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/typedarray/of/index.html @@ -0,0 +1,138 @@ +--- +title: TypedArray.of() +slug: Web/JavaScript/Reference/Global_Objects/TypedArray/of +tags: + - Typed + - TypedArray + - TypedArray.fo() + - TypedArray.from() +translation_of: Web/JavaScript/Reference/Global_Objects/TypedArray/of +--- +<div>{{JSRef}}</div> + +<p><code><strong><em>TypedArray</em>.of()</strong></code> 方法创建一个具有可变数量参数的新<a href="/en-US/docs/">类型数组</a> 。此方法几乎与{{jsxref("Array.of()")}} 相同。</p> + +<h2 id="句法">句法</h2> + +<pre class="syntaxbox"><code><em>TypedArray</em>.of(<var>element0</var>[, <var>element1</var>[, ...[, <var>elementN</var>]]]) +</code> +where <em>TypedArray</em> is one of: + +Int8Array +Uint8Array +Uint8ClampedArray +Int16Array +Uint16Array +Int32Array +Uint32Array +Float32Array +Float64Array</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>element<em>N</em></code></dt> + <dd>创建类型数组的元素。</dd> +</dl> + +<h3 id="Return_value">Return value</h3> + +<p>一个新的 {{jsxref("TypedArray")}} 实例。</p> + +<h2 id="描述">描述</h2> + +<p>{{jsxref("Array.of()")}} 和 <code><em>TypedArray</em>.of()</code>之间的一些细微区别：</p> + +<ul> + <li>如果传递给TypedArray.of的这个值不是构造函数，TypedArray.of将抛出一个{{jsxref("TypeError")}} ，其中Array.of默认创建一个新的 {{jsxref("Array")}}。</li> + <li><code><em>TypedArray</em>.of</code> 使用 [[Put]] 其中Array.of使用 [[DefineProperty]]。因此，当使用{{jsxref("Proxy")}} 对象时，它调用 {{jsxref("Global_Objects/Proxy/handler/set", "handler.set")}} 创建新的元素，而不是 {{jsxref("Global_Objects/Proxy/handler/defineProperty", "handler.defineProperty")}}。</li> +</ul> + +<h2 id="范例">范例</h2> + +<pre class="brush: js">Uint8Array.of(1); // Uint8Array [ 1 ] +Int8Array.of("1", "2", "3"); // Int8Array [ 1, 2, 3 ] +Float32Array.of(1, 2, 3); // Float32Array [ 1, 2, 3 ] +Int16Array.of(undefined); // IntArray [ 0 ] +</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('ES6', '#sec-%typedarray%.of', '%TypedArray%.of')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-%typedarray%.of', '%TypedArray%.of')}}</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>{{CompatChrome(45.0)}}</td> + <td>{{CompatGeckoDesktop("38")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</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>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatGeckoMobile("38")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="也可以看看">也可以看看</h2> + +<ul> + <li>{{jsxref("TypedArray.from()")}}</li> + <li>{{jsxref("Array.of()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/typedarray/prototype/index.html b/files/zh-cn/web/javascript/reference/global_objects/typedarray/prototype/index.html new file mode 100644 index 0000000000..d756bbf7bf --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/typedarray/prototype/index.html @@ -0,0 +1,171 @@ +--- +title: TypedArray.prototype +slug: Web/JavaScript/Reference/Global_Objects/TypedArray/prototype +translation_of: Web/JavaScript/Reference/Global_Objects/TypedArray +--- +<div>{{JSRef}}</div> + +<p><code><strong>TypedArray</strong></code><strong><code>.prototype</code></strong>属性表示{{jsxref("TypedArray")}}构造器的原型.</p> + +<div>{{js_property_attributes(0,0,0)}}</div> + +<h2 id="描述">描述</h2> + +<p>{{jsxref("TypedArray")}} 实例继承自 {{jsxref("TypedArray.prototype")}}. 你可以通过该原型对象为所有的类型化数组(<a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray#TypedArray_objects">typed array types</a>)实例添加属性和方法.</p> + +<p>关于继承的更多的信息请参见关于<a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray#Description"><em>TypedArray</em></a> 的描述.</p> + +<h2 id="属性">属性</h2> + +<dl> + <dt><code>TypedArray.prototype.constructor</code></dt> + <dd>返回创建实例原型的构造函数.这是相应的<a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray#TypedArray_objects">typed array type</a>的默认的构造函数.</dd> + <dt>{{jsxref("TypedArray.prototype.buffer")}} {{readonlyInline}}</dt> + <dd>返回被格式化数组引用的{{jsxref("ArrayBuffer")}}. 创建时已被固化,因此是只读的.</dd> + <dt>{{jsxref("TypedArray.prototype.byteLength")}} {{readonlyInline}}</dt> + <dd>返回从{{jsxref("ArrayBuffer")}}读取的字节长度. 创建时已被固化,因此是只读的.</dd> + <dt>{{jsxref("TypedArray.prototype.byteOffset")}} {{readonlyInline}}</dt> + <dd>返回从{{jsxref("ArrayBuffer")}}读取时的字节偏移量<strong>.</strong>创建时已被固化,因此是只读的.</dd> + <dt>{{jsxref("TypedArray.prototype.length")}} {{readonlyInline}}</dt> + <dd>返回在类型化数组中的元素的数量<strong>.</strong>创建时已被固化,因此是只读的.</dd> +</dl> + +<h2 id="methods">methods</h2> + +<dl> + <dt>{{jsxref("TypedArray.prototype.copyWithin()")}}</dt> + <dd>浅拷贝数组的部分元素到同一数组的不同位置，且不改变数组的大小，返回该数组. 参见 {{jsxref("Array.prototype.copyWithin()")}}.</dd> + <dt>{{jsxref("TypedArray.prototype.entries()")}}</dt> + <dd>返回一个 <code><strong>Array Iterator</strong></code> 对象，该对象包含数组中每一个索引的键值对.参见 {{jsxref("Array.prototype.entries()")}}.</dd> + <dt>{{jsxref("TypedArray.prototype.every()")}}</dt> + <dd>测试数组的所有元素是否都通过了指定函数的测试. 参见{{jsxref("Array.prototype.every()")}}.</dd> + <dt>{{jsxref("TypedArray.prototype.fill()")}}</dt> + <dd>将一个数组中指定区间的所有元素的值, 都替换成或者说填充成为某个固定的值. 参见 {{jsxref("Array.prototype.fill()")}}.</dd> + <dt>{{jsxref("TypedArray.prototype.filter()")}}</dt> + <dd>使用指定的函数测试所有元素，并创建一个包含所有通过测试的元素的新数组. 参见 {{jsxref("Array.prototype.filter()")}}.</dd> + <dt>{{jsxref("TypedArray.prototype.find()")}}</dt> + <dd>返回一个满足提供的函数的测试的元素,若是没有满足的元素则返回<code>undefined</code> . 参见 {{jsxref("Array.prototype.find()")}}.</dd> + <dt>{{jsxref("TypedArray.prototype.findIndex()")}}</dt> + <dd>查找数组中某指定元素的索引, 如果找不到指定的元素, 则返回 -1. 参见 {{jsxref("Array.prototype.findIndex()")}}.</dd> + <dt>{{jsxref("TypedArray.prototype.forEach()")}}</dt> + <dd>对数组的每个元素执行一次提供的函数(回调函数). 参见 {{jsxref("Array.prototype.forEach()")}}.</dd> + <dt>{{jsxref("TypedArray.prototype.includes()")}} {{experimental_inline}}</dt> + <dd>确定一个类型化数组是否包括了某个元素,包含就返回true,不包含就返回false.参见 {{jsxref("Array.prototype.includes()")}}.</dd> + <dt>{{jsxref("TypedArray.prototype.indexOf()")}}</dt> + <dd>返回数组中第一个等于指定值得元素的索引,如果找不到则返回-1. 参见 {{jsxref("Array.prototype.indexOf()")}}.</dd> + <dt>{{jsxref("TypedArray.prototype.join()")}}</dt> + <dd>将数组中的所有元素连接成一个字符串. 参见 {{jsxref("Array.prototype.join()")}}.</dd> + <dt>{{jsxref("TypedArray.prototype.keys()")}}</dt> + <dd>返回一个新的包含数组索引的数组迭代器. 参见 {{jsxref("Array.prototype.keys()")}}.</dd> + <dt>{{jsxref("TypedArray.prototype.lastIndexOf()")}}</dt> + <dd>返回数组中最后一个等于指定值得元素的索引,如果找不到则返回-1.参见 {{jsxref("Array.prototype.lastIndexOf()")}}.</dd> + <dt>{{jsxref("TypedArray.prototype.map()")}}</dt> + <dd>创建一个由原数组中的每个元素调用一个指定方法后的返回值组成的新数组.参见 {{jsxref("Array.prototype.map()")}}.</dd> + <dt>{{jsxref("TypedArray.prototype.move()")}} {{non-standard_inline}} {{unimplemented_inline}}</dt> + <dd>以前的不标准版本的 {{jsxref("TypedArray.prototype.copyWithin()")}}.</dd> + <dt>{{jsxref("TypedArray.prototype.reduce()")}}</dt> + <dd>接收一个函数作为累加器（accumulator),数组中的每个值（从左到右）开始合并，最终为一个值. 参见{{jsxref("Array.prototype.reduce()")}}.</dd> + <dt>{{jsxref("TypedArray.prototype.reduceRight()")}}</dt> + <dd>接受一个函数作为累加器（accumulator）,让每个值（从右到左，亦即从尾到头）缩减为一个值.（与 <code>reduce()</code> 的执行方向相反）. 参见{{jsxref("Array.prototype.reduceRight()")}}.</dd> + <dt>{{jsxref("TypedArray.prototype.reverse()")}}</dt> + <dd>颠倒数组中元素的位置。第一个元素会成为最后一个，最后一个会成为第一个. 参见 {{jsxref("Array.prototype.reverse()")}}.</dd> + <dt>{{jsxref("TypedArray.prototype.set()")}}</dt> + <dd>读取一个指定数组中的元素保存到格式化数组中.</dd> + <dt>{{jsxref("TypedArray.prototype.slice()")}}</dt> + <dd>浅复制（shallow copy）数组的一部分到一个新的数组，并返回这个新数组. 参见 {{jsxref("Array.prototype.slice()")}}.</dd> + <dt>{{jsxref("TypedArray.prototype.some()")}}</dt> + <dd>数组中只要有一个元素满足提供的测试函数的测试就返回true,否则返回false. 参见 {{jsxref("Array.prototype.some()")}}.</dd> + <dt>{{jsxref("TypedArray.prototype.sort()")}}</dt> + <dd>对数组进行排序,并返回原数组(是改变原数组). 参见 {{jsxref("Array.prototype.sort()")}}.</dd> + <dt>{{jsxref("TypedArray.prototype.subarray()")}}</dt> + <dd>返回给定的起始和结束索引之间的元素组成的新的类型化数组.</dd> + <dt>{{jsxref("TypedArray.prototype.values()")}}</dt> + <dd>返回有数组中的元素组成的新的数组迭代对象. 参见 {{jsxref("Array.prototype.values()")}}.</dd> + <dt>{{jsxref("TypedArray.prototype.toLocaleString()")}}</dt> + <dd>返回一个将数组中的每个元素本地化后组成的字符串. 参见 {{jsxref("Array.prototype.toLocaleString()")}}.</dd> + <dt>{{jsxref("TypedArray.prototype.toString()")}}</dt> + <dd>返回一个由数组中的每个元素字符串化后组成的字符串. 参见 {{jsxref("Array.prototype.toString()")}}.</dd> + <dt>{{jsxref("TypedArray.prototype.@@iterator()", "TypedArray.prototype[@@iterator]()")}}</dt> + <dd>返回一个包含数组中每个元素的新的数组迭代对象.</dd> +</dl> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范</th> + <th scope="col">状态</th> + <th scope="col">备注</th> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-properties-of-the-%typedarrayprototype%-object', 'TypedArray prototype')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-properties-of-the-%typedarrayprototype%-object', 'TypedArray prototype')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容">浏览器兼容</h2> + +<p>{{CompatibilityTable}}</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>7.0</td> + <td>{{ CompatGeckoDesktop("2") }}</td> + <td>10</td> + <td>11.6</td> + <td>5.1</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>4.0</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{ CompatGeckoMobile("2") }}</td> + <td>10</td> + <td>11.6</td> + <td>4.2</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="参见">参见</h2> + +<ul> + <li><a href="/en-US/docs/Web/JavaScript/Typed_arrays">JavaScript typed arrays</a></li> + <li>{{jsxref("TypedArray")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/typedarray/reduce/index.html b/files/zh-cn/web/javascript/reference/global_objects/typedarray/reduce/index.html new file mode 100644 index 0000000000..fe10f859c0 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/typedarray/reduce/index.html @@ -0,0 +1,137 @@ +--- +title: TypedArray.prototype.reduce() +slug: Web/JavaScript/Reference/Global_Objects/TypedArray/reduce +translation_of: Web/JavaScript/Reference/Global_Objects/TypedArray/reduce +--- +<div>{{JSRef}}</div> + +<p><code><strong>reduce()</strong></code> 方法接受一个函数作为参数，这个函数作为一个累加器，从左到右遍历整个类型数组，最后返回一个单一的值. 这个方法和{{jsxref("Array.prototype.reduce()")}}使用了同样的算法. <em>TypedArray</em> 是一个 <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray#TypedArray_objects">类型数组</a>.</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><var>typedarray</var>.reduce(<var>callback</var>[, <var>initialValue</var>])</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>callback</code></dt> + <dd>对类型数组的每一个值应用的函数，它接受以下参数： + <dl> + <dt><code>previousValue</code></dt> + <dd>在上一次迭代中，调用callback的返回值， 或者是提供的 <code>initialValue。</code>.</dd> + <dt><code>currentValue</code></dt> + <dd>类型化数组中当前要处理的值。</dd> + <dt><code>index</code></dt> + <dd>类型化数组中要处理的当前元素的下标</dd> + <dt><code>array</code></dt> + <dd><code>reduce</code> 在其上调用的类型化数组。</dd> + </dl> + </dd> + <dt><code>initialValue</code></dt> + <dd><code>可选。用作 callback</code> <code>首次调用</code>的第一个参数的对象。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>由归约返回的结果。</p> + +<h2 id="描述">描述</h2> + +<p><code>reduce</code>方法对类型化数组中出现的每个元素执行<code>callback</code>函数，除了类型化数组的空隙。它接受四个参数：初始值（或者来自之前<code>callback</code>调用的值），当前元素的值，当前下标，以及被遍历的类型化数组。</p> + +<p>第一次调用回调函数的时候， <code>previousValue</code> 和 <code>currentValue</code> 可以是两个值之一。如果 <code>initialValue</code> 在<code>reduce</code>的调用中提供， <code>previousValue</code> 会等于<code>initialValue</code> 并且<code>currentValue</code> 会等于类型化数组的第一个值。 如果 <code>initialValue</code> 没有提供，则<code>previousValue</code>等于类型化数组的第一个值，<code>currentValue</code>会等于第二个值。</p> + +<p>如果类型化数组为空并且没有提供 <code>initialValue</code>，会抛出 {{jsxref("Global_Objects/TypeError", "TypeError")}} 。如果类型化数组中只有一个元素（无论位置）并且没有提供<code>initialValue</code> ，或者如果提供了<code>initialValue</code> 但是类型化数组为空，会返回唯一的值，但不会调用 <code>callback</code>。</p> + +<h2 id="示例">示例</h2> + +<h3 id="累加数组中的所有值">累加数组中的所有值</h3> + +<pre class="brush: js">var total = new Uint8Array([0, 1, 2, 3]).reduce(function(a, b) { + return a + b; +}); +// total == 6 +</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('ES6', '#sec-%typedarray%.prototype.reduce', '%TypedArray%.prototype.reduce')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>初始定义。</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-%typedarray%.prototype.reduce', '%TypedArray%.prototype.reduce')}}</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>Edge</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{CompatChrome("47")}}</td> + <td>12</td> + <td>{{CompatGeckoDesktop("37")}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatOpera("32")}}</td> + <td>{{CompatSafari("10")}}</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("37")}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>10</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="另见">另见</h2> + +<ul> + <li>{{jsxref("TypedArray.prototype.reduceRight()")}}</li> + <li>{{jsxref("Array.prototype.reduce()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/typedarray/reduceright/index.html b/files/zh-cn/web/javascript/reference/global_objects/typedarray/reduceright/index.html new file mode 100644 index 0000000000..ce443c7174 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/typedarray/reduceright/index.html @@ -0,0 +1,144 @@ +--- +title: TypedArray.prototype.reduceRight() +slug: Web/JavaScript/Reference/Global_Objects/TypedArray/reduceRight +translation_of: Web/JavaScript/Reference/Global_Objects/TypedArray/reduceRight +--- +<div>{{JSRef}}</div> + +<p><code><strong>reduceRight()</strong></code>在累加器和类型化数组的每个元素上（从右到左）调用函数，使其归约为单一的值。这个方法的算法和 {{jsxref("Array.prototype.reduceRight()")}}相同。 <em>TypedArray</em> 是这里的<a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray#TypedArray_objects">类型化数组类型</a> 之一。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><var>typedarray</var>.reduceRight(<var>callback</var>[, <var>initialValue</var>])</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>callback</code></dt> + <dd>对类型数组的每一个值应用的函数，它接受四个参数： + <dl> + <dt><code>previousValue</code></dt> + <dd>回调函数上一次调用所返回的值，或者是提供的 <code>initialValue</code>。</dd> + <dt><code>currentValue</code></dt> + <dd>类型化数组中当前要处理的值。</dd> + <dt><code>index</code></dt> + <dd>类型化数组中要处理的当前元素的下标</dd> + <dt><code>array</code></dt> + <dd><code>reduceRight</code> 在其上调用的类型化数组</dd> + </dl> + </dd> + <dt><code>initialValue</code></dt> + <dd>可选。用作 <code>callback</code> 首次调用的第一个参数的对象。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>由归约返回的结果。</p> + +<h2 id="描述">描述</h2> + +<p><code>reduceRight</code>方法对类型化数组中出现的每个元素执行<code>callback</code>函数，除了类型化数组的空隙。它接受四个参数：初始值（或者来自之前<code>callback</code>调用的值），当前元素的值，当前下标，以及被遍历的类型化数组。</p> + +<p><code>reduceRight</code>回调函数的调用是这样：</p> + +<pre class="brush: js">typedarray.reduceRight(function(previousValue, currentValue, index, typedarray) { + // ... +}); +</pre> + +<p>第一次调用回调函数的时候， <code>previousValue</code> 和 <code>currentValue</code> 可以是两个值之一。如果 <code>initialValue</code> 在<code>reduce</code>的调用中提供， <code>previousValue</code> 会等于<code>initialValue</code> 并且<code>currentValue</code> 会等于类型化数组的最后一个值。 如果 <code>initialValue</code> 没有提供，则<code>previousValue</code>等于类型化数组的最后一个值，<code>currentValue</code>会等于倒数第二个值。</p> + +<p>如果类型化数组为空并且没有提供 <code>initialValue</code>，会抛出 {{jsxref("Global_Objects/TypeError", "TypeError")}} 。如果类型化数组中只有一个元素（无论位置）并且没有提供<code>initialValue</code> ，或者如果提供了<code>initialValue</code> 但是类型化数组为空，会返回唯一的值，但不会调用 <code>callback</code>。</p> + +<h2 id="示例">示例</h2> + +<h3 id="累加数组中的所有值">累加数组中的所有值</h3> + +<pre class="brush: js">var total = new Uint8Array([0, 1, 2, 3]).reduceRight(function(a, b) { + return a + b; +}); +// total == 6 +</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('ES6', '#sec-%typedarray%.prototype.reduceRight', '%TypedArray%.prototype.reduceRight')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>初始定义。</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-%typedarray%.prototype.reduceRight', '%TypedArray%.prototype.reduceRight')}}</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>Edge</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{CompatChrome("45")}}</td> + <td>12</td> + <td>{{CompatGeckoDesktop("37")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatOpera("32")}}</td> + <td>{{CompatSafari("10")}}</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("37")}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="另见">另见</h2> + +<ul> + <li>{{jsxref("TypedArray.prototype.reduce()")}}</li> + <li>{{jsxref("Array.prototype.reduceRight()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/typedarray/reverse/index.html b/files/zh-cn/web/javascript/reference/global_objects/typedarray/reverse/index.html new file mode 100644 index 0000000000..b923d247d6 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/typedarray/reverse/index.html @@ -0,0 +1,106 @@ +--- +title: TypedArray.prototype.reverse() +slug: Web/JavaScript/Reference/Global_Objects/TypedArray/reverse +translation_of: Web/JavaScript/Reference/Global_Objects/TypedArray/reverse +--- +<div>{{JSRef}}</div> + +<p><code><strong>reverse()</strong></code>方法原地翻转类型化数组。类型化数组的第一个元素变为最后一个，最后一个变为第一个。这个方法的算法和{{jsxref("Array.prototype.reverse()")}}<em>相同。</em> <em>TypedArray</em> 是这里的 <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray#TypedArray_objects">类型化数组类型</a> 之一。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><var>typedarray</var>.reverse();</code></pre> + +<h3 id="返回值">返回值</h3> + +<p>翻转的数组。</p> + +<h2 id="示例">示例</h2> + +<pre class="brush: js">var uint8 = new Uint8Array([1, 2, 3]); +uint8.reverse(); + +console.log(uint8); // Uint8Array [3, 2, 1] +</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-%typedarray%.prototype.reverse', 'TypedArray.prototype.reverse')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>初始定义。</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-%typedarray%.prototype.reverse', 'TypedArray.prototype.reverse')}}</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>Edge</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{CompatChrome("45")}}</td> + <td>12</td> + <td>{{CompatGeckoDesktop("37")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatOpera("32")}}</td> + <td>{{CompatSafari("10")}}</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>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatGeckoDesktop("37")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>10</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="另见">另见</h2> + +<ul> + <li>{{jsxref("Array.prototype.reverse()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/typedarray/set/index.html b/files/zh-cn/web/javascript/reference/global_objects/typedarray/set/index.html new file mode 100644 index 0000000000..3ba2095fbf --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/typedarray/set/index.html @@ -0,0 +1,131 @@ +--- +title: TypedArray.prototype.set() +slug: Web/JavaScript/Reference/Global_Objects/TypedArray/set +translation_of: Web/JavaScript/Reference/Global_Objects/TypedArray/set +--- +<div>{{JSRef}}</div> + +<p> <strong><code>set()</code></strong> 方法用于从指定数组中读取值，并将其存储在类型化数组中。</p> + +<h2 id="语法">语法</h2> + +<pre class="notranslate"><var>typedarray</var>.set(<em>array</em>[, <em>offset</em>]) +<em>typedarray</em>.set(<em>typedarray</em>[, <em>offset</em>])</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>array</code></dt> + <dd>拷贝数据的源数组，源数组的所有值都会被复制到目标数组中，除非源数组的长度加上偏移量超过目标数组的长度，而在这种情况下会抛出异常。</dd> + <dd>参数array是源数组，指定从哪里拷贝值。源数组中的所有值都会被拷贝到目标数组中去。如果源数组的长度加上偏移值offset的结果超过目标数组的长度，则会抛出异常错误。</dd> + <dt><code>typedarray</code></dt> + <dd>如果源数组是一个类型化数组（typed array），则源数组和目标数组可以共享同一个底层的{{jsxref("ArrayBuffer")}}；JavaScript 引擎会智能地将 buffer 的指定区段拷贝到目标区段中去。</dd> + <dt><code>offset</code> {{ optional_inline() }}</dt> + <dd>偏移量参数 offset 指定从什么地方开始使用源数组 <code>array</code> 的值进行写入操作。如果忽略该参数，则默认为0（也就是说，从目标数组的下标为0处开始，使用源数组 <code>array</code> 的值覆盖重写）。</dd> +</dl> + +<h3 id="异常">异常</h3> + +<dl> + <dt>{{jsxref("RangeError")}}</dt> + <dd>如果指定的偏移量超出了类型化数组的范围，则该异常会被抛出。</dd> +</dl> + +<h2 id="示例">示例</h2> + +<h3 id="使用_set">使用 <code>set()</code></h3> + +<pre class="brush:js notranslate">var buffer = new ArrayBuffer(8); +var uint8 = new Uint8Array(buffer); + +uint8.set([1,2,3], 3); + +console.log(uint8); // Uint8Array [ 0, 0, 0, 1, 2, 3, 0, 0 ] +</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>{{SpecName('Typed Array')}}</td> + <td>{{Spec2('Typed Array')}}</td> + <td>ECMAScript 6中已废弃。</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-%typedarray%.prototype.set-array-offset', 'TypedArray.prototype.set')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>在ECMA标准中初始定义。</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-%typedarray%.prototype.set-array-offset', 'TypedArray.prototype.set')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{CompatibilityTable}}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>浏览器</th> + <th>Chrome</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>最低版本</td> + <td>7.0</td> + <td>{{CompatGeckoDesktop("2")}}</td> + <td>10</td> + <td>11.6</td> + <td>5.1</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>浏览器</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>最低版本</td> + <td>4.0</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoMobile("2")}}</td> + <td>10</td> + <td>11.6</td> + <td>4.2</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="另见">另见</h2> + +<ul> + <li><a href="/en-US/docs/Web/JavaScript/Typed_arrays">JavaScript typed arrays</a></li> + <li>{{jsxref("TypedArray")}}</li> + <li>{{jsxref("ArrayBuffer")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/typedarray/slice/index.html b/files/zh-cn/web/javascript/reference/global_objects/typedarray/slice/index.html new file mode 100644 index 0000000000..547cc36a8c --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/typedarray/slice/index.html @@ -0,0 +1,104 @@ +--- +title: TypedArray.prototype.slice() +slug: Web/JavaScript/Reference/Global_Objects/TypedArray/slice +translation_of: Web/JavaScript/Reference/Global_Objects/TypedArray/slice +--- +<div>{{JSRef}}</div> + +<p><code><strong>slice()</strong></code>方法将一个typed array的一部分浅拷贝到一个新的typed array对象中并返回。此方法采用与 {{jsxref("Array.prototype.slice()")}}相同的算法。<em>TypedArray指</em> <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray#TypedArray_objects">typed array types</a>中的一员 .</p> + +<div>{{EmbedInteractiveExample("pages/js/typedarray-slice.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><var>typedarr</var>ay.slice([<var>begin</var>[, <var>end</var>]])</code></pre> + +<h2 id="参数">参数</h2> + +<dl> + <dt><code>begin</code> {{optional_inline}}</dt> + <dd>从0开始的索引位置。</dd> + <dd>可以使用负值索引, 表示从数组末尾往前的偏移量。<code>slice(-2)</code> 表示提取数组中的末尾两个元素.</dd> + <dd>如果没有设定起始位置，则将从开始位置开始截取。</dd> + <dt><code>end</code> {{optional_inline}}</dt> + <dd>从0开始到尾元素前的索引值。 <code>slice</code> 取出的元素到此位置之前，不包含该位置。</dd> + <dd>例, <code>slice(1,4)</code> 表示读取第2个元素到第4个元素(元素索引：1, 2, 3)。</dd> + <dd>可以使用负值索引, 表示从数组末尾往前的偏移量。 <code>slice(2,-1)</code> 表示取出数组中的第3个到倒数第2个元素。</dd> + <dd>如果没有设定结束位置，则将从开始位置截取到序列尾部。(默认值为<code>typedarray.length</code>).</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>包含取出元素的新 typed array。</p> + +<h2 id="描述">描述</h2> + +<p><code>slice</code>方法并不会改变原数组的内容，它只是返回从原数组中取出的元素的浅复制集合。</p> + +<p>如果一个新元素被添加到它们任何一个数组中去，另外一个数组不会受到影响。</p> + +<h2 id="示例">示例</h2> + +<h3 id="返回已存在类型数组的一部分片段">返回已存在类型数组的一部分片段</h3> + +<pre class="brush: js">const uint8 = new Uint8Array([1,2,3]); +uint8.slice(1); // Uint8Array [ 2, 3 ] +uint8.slice(2); // Uint8Array [ 3 ] +uint8.slice(-2); // Uint8Array [ 2, 3 ] +uint8.slice(0,1); // Uint8Array [ 1 ] +</pre> + +<h2 id="Polyfill">Polyfill</h2> + +<p>由于没有叫做<em>TypedArray </em>的全局对象，必须在“按需”的基础上实现 Polyfill。</p> + +<pre>if (!Uint8Array.prototype.slice) { + Object.defineProperty(Uint8Array.prototype, 'slice', { + value: function (begin, end) + { + return new Uint8Array(Array.prototype.slice.call(this, begin, end)); + } + }); +}</pre> + +<p>这不是一个完整的 polyfill，因为它返回的是一个Array的实例而不是Uint8Array，所以它没有TypedArrays应有的一些属性。</p> + +<p>如果你要在不支持 <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperty">Object.defineProperty</a> </code>的老旧JavaScript引擎上支持这个特性，最好不要去实现 <code>Array.prototype</code> 中那些方法的 polyfill ，因为你没法让它们不可枚举。</p> + +<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-%typedarray%.prototype.slice', '%TypedArray%.prototype.slice')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-%typedarray%.prototype.slice', '%TypedArray%.prototype.slice')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> + + +<p>{{Compat("javascript.builtins.TypedArray.slice")}}</p> +</div> + +<h2 id="另见">另见</h2> + +<ul> + <li>{{jsxref("Array.prototype.slice()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/typedarray/some/index.html b/files/zh-cn/web/javascript/reference/global_objects/typedarray/some/index.html new file mode 100644 index 0000000000..2da4a21a65 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/typedarray/some/index.html @@ -0,0 +1,121 @@ +--- +title: TypedArray.prototype.some() +slug: Web/JavaScript/Reference/Global_Objects/TypedArray/some +translation_of: Web/JavaScript/Reference/Global_Objects/TypedArray/some +--- +<div>{{JSRef}}</div> + +<p>这个 <code><strong>some()</strong></code> 方法检测 <em>TypedArray</em> 的一些元素是否通过所提供函数的测试. 这个方法和 {{jsxref("Array.prototype.some()")}}<em> 相同.</em> <em>TypedArray</em> 是 <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray#TypedArray_objects">typed array types</a> 之一.</p> + +<div>{{EmbedInteractiveExample("pages/js/typedarray-some.html")}}</div> + +<div> </div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><var>typedarray</var>.<code>some(<var>callback</var>[, <var>thisArg</var>])</code></code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>callback</code></dt> + <dd>一个测试每个元素的函数，有3个参数: + <dl> + <dt><code>currentValue</code></dt> + <dd>在typed array中，正在被测试的元素.</dd> + <dt><code>index</code></dt> + <dd>在typed array中，正在被测试元素的索引.</dd> + <dt><code>array</code></dt> + <dd>正在被调用的 typed array 本身.</dd> + </dl> + </dd> + <dt><code>thisArg</code></dt> + <dd>可选的. <code>callback</code> 回调函数的 <code>this</code> 值 .</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p><code><strong>true</strong></code> 如果 callback 函数以任一数组元素为参数调用时，返回 {{Glossary("truthy")}}; 否则, <code><strong>false</strong></code>.</p> + +<h2 id="描述">描述</h2> + +<p>对于 typed array 中的每个元素，<code>some</code>方法执行一次 <code>callback</code>，直到找到一个<code>callback </code>返回 true 的元素. 如果一个元素被找到, <code>some</code> 立即返回 <code>true</code>. 否则, <code>some</code> 返回 <code>false</code>.</p> + +<p><code>callback</code> 期望3个参数: 元素的值, 元素的索引, 和被遍历的数组对象.</p> + +<p>如果 <code>some</code> 提供 <code>thisArg</code>, 那么<code>thisArg</code>会作为 <code>callback</code> 调用时的<code>this值</code>. 否则, <code>callback</code> 调用时的 <code>this</code> 是 <code>undefined</code>. <code>callback</code> 最终可观测的<code>this</code> 是根据 <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/this">确定函数this的通常规则</a> 所确定的.</p> + +<p><code>some</code> 被调用不会改变 typed array .</p> + +<h3 class="highlight-spanned" id="示例"><span class="highlight-span">示例</span></h3> + +<h3 id="Testing_size_of_all_typed_array_elements">Testing size of all typed array elements</h3> + +<p>以下示例测试typed array中的所有元素都大于10.</p> + +<pre class="brush: js language-js">function isBiggerThan10(element, index, array) { + return element > 10; +} +new Uint8Array([2, 5, 8, 1, 4]).some(isBiggerThan10); // false +new Uint8Array([12, 5, 8, 1, 4]).some(isBiggerThan10); // true +</pre> + +<h3 id="Testing_typed_array_elements_using_arrow_functions">Testing typed array elements using arrow functions</h3> + +<p><a href="/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions">Arrow functions</a> 提供更段的语法做相同的测试.</p> + +<pre class="brush: js">new Uint8Array([2, 5, 8, 1, 4]).some(elem => elem > 10); // false +new Uint8Array([12, 5, 8, 1, 4]).some(elem => elem > 10); // true</pre> + +<h2 id="Polyfill">Polyfill</h2> + +<p>由于没有名为 <em>TypedArray 的全局对象</em>, 必须在“as needed”的基础上进行填充.</p> + +<pre class="brush: js">// https://tc39.github.io/ecma262/#sec-%typedarray%.prototype.some +if (!Uint8Array.prototype.some) { + Object.defineProperty(Uint8Array.prototype, 'some', { + value: Array.prototype.some + }); +} +</pre> + +<p>假如你需要支持的过时JavaScript引擎不支持<code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperty">Object.defineProperty</a></code>，最好不要使用<code>Array.prototype</code>方法填充，因为你不能让它们不可枚举.</p> + +<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-%typedarray%.prototype.some', 'TypedArray.prototype.some')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-%typedarray%.prototype.some', 'TypedArray.prototype.some')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容">浏览器兼容</h2> + +<div> + + +<p>{{Compat("javascript.builtins.TypedArray.some")}}</p> +</div> + +<h2 id="参阅">参阅</h2> + +<ul> + <li>{{jsxref("TypedArray.prototype.every()")}}</li> + <li>{{jsxref("Array.prototype.some()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/typedarray/sort/index.html b/files/zh-cn/web/javascript/reference/global_objects/typedarray/sort/index.html new file mode 100644 index 0000000000..1b0615c342 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/typedarray/sort/index.html @@ -0,0 +1,126 @@ +--- +title: TypedArray.prototype.sort() +slug: Web/JavaScript/Reference/Global_Objects/TypedArray/sort +translation_of: Web/JavaScript/Reference/Global_Objects/TypedArray/sort +--- +<div>{{JSRef}}</div> + +<p><code><strong>sort()</strong></code>方法<em>原地</em>排序类型化数组的元素，并且返回类型化数组。这个方法的算法和{{jsxref("Array.prototype.sort()")}}<em>相同。</em> <em>TypedArray</em> 是这里的 <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray#TypedArray_objects">类型化数组类型</a> 之一。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>typedarray</var>.sort([<var>compareFunction</var>])</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>compareFunction</code> {{optional_inline}}</dt> + <dd>指定定义排序顺序的函数</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>排序后的类型化数组。</p> + +<h2 id="示例">示例</h2> + +<p>更多示例请参考 {{jsxref("Array.prototype.sort()")}} 方法。</p> + +<pre class="brush: js">var numbers = new Uint8Array([40, 1, 5, 200]); +numbers.sort(); +// Uint8Array [ 1, 5, 40, 200 ] +// 在这里，按数值排序数值时， +// 不需要比较函数。 + +var numbers = [40, 1, 5, 200]; +numbers.sort(); +// 将元素作为字符串来排序。 +// [1, 200, 40, 5] + +function compareNumbers(a, b) { + return a - b; +} + +numbers.sort(compareNumbers); +// [ 1, 5, 40, 200 ] +</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-%typedarray%.prototype.sort', 'TypedArray.prototype.sort')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>初始定义。</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-%typedarray%.prototype.sort', 'TypedArray.prototype.sort')}}</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>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoDesktop(46)}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatVersionUnknown}}</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(46)}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="另见">另见</h2> + +<ul> + <li>{{jsxref("Array.prototype.sort()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/typedarray/subarray/index.html b/files/zh-cn/web/javascript/reference/global_objects/typedarray/subarray/index.html new file mode 100644 index 0000000000..a15c160816 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/typedarray/subarray/index.html @@ -0,0 +1,104 @@ +--- +title: TypedArray.prototype.subarray() +slug: Web/JavaScript/Reference/Global_Objects/TypedArray/subarray +translation_of: Web/JavaScript/Reference/Global_Objects/TypedArray/subarray +--- +<div>{{JSRef}}</div> + +<div><code>subarray()</code> 返回一个新的、基于相同 {{jsxref("ArrayBuffer")}}、元素类型也相同的的 <em>TypedArray</em>。开始的索引将会被包括，而结束的索引将不会被包括。<em>TypedArray </em>是指 <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray#TypedArray_objects">typed array types</a> 的其中之一。</div> + +<p> </p> + +<div>{{EmbedInteractiveExample("pages/js/typedarray-subarray.html")}}</div> + +<p> </p> + + + +<h2 id="用法">用法</h2> + +<pre class="syntaxbox"><var>typedarr</var>ay.subarray([begin [,end]]) +</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt>begin {{optional_inline}}</dt> + <dd>元素开始的索引，开始索引的元素将会被包括。若该值没有传入，将会返回一个拥有全部元素的数组。</dd> + <dt>end {{optional_inline}}</dt> + <dd>元素结束的索引，结束索引的元素将<strong>不会</strong>被包括。若该值没有传入，从 <code>begin</code> 所指定的那一个元素到数组末尾的所有元素都将会被包含进新数组中。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>一个新的 {{jsxref("TypedArray")}} 对象。</p> + +<h2 id="说明">说明</h2> + +<ul> + <li>被 <code>begin</code> 和 <code>end</code> 指定的范围将会收束与当前数组的有效索引</li> + <li>若计算后得出的长度是负数，将会被收束成0</li> + <li>若 <code>begin</code> 或 <code>end</code> 是负数，将会被当做成是从数组末端读取的索引</li> +</ul> + +<p>需要注意的是，使用该方法返回的新数组还是建立在原有的 Buffer 之上的，所以，改动数组的内容将会影响到原数组，反之亦然。</p> + +<p> </p> + +<h2 id="Examples">Examples</h2> + +<p> </p> + +<h3 id="Using_the_subarray_method">Using the <code>subarray</code> method</h3> + +<pre class="brush:js">var buffer = new ArrayBuffer(8); +var uint8 = new Uint8Array(buffer); +uint8.set([1,2,3]); + +console.log(uint8); // Uint8Array [ 1, 2, 3, 0, 0, 0, 0, 0 ] + +var sub = uint8.subarray(0,4); + +console.log(sub); // Uint8Array [ 1, 2, 3, 0 ] +</pre> + +<h2 id="Specifications">Specifications</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('Typed Array')}}</td> + <td>{{Spec2('Typed Array')}}</td> + <td>Superseded by ECMAScript 6.</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-%typedarray%.prototype.subarray', 'TypedArray.prototype.subarray')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition in an ECMA standard.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-%typedarray%.prototype.subarray', 'TypedArray.prototype.subarray')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility">Browser compatibility</h2> + + + +<p>{{Compat("javascript.builtins.TypedArray.subarray")}}</p> + +<h2 id="See_also">See also</h2> + +<ul> + <li><a href="/en-US/docs/Web/JavaScript/Typed_arrays">JavaScript typed arrays</a></li> + <li>{{jsxref("TypedArray")}}</li> + <li>{{jsxref("ArrayBuffer")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/typedarray/tolocalestring/index.html b/files/zh-cn/web/javascript/reference/global_objects/typedarray/tolocalestring/index.html new file mode 100644 index 0000000000..c99fa0b350 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/typedarray/tolocalestring/index.html @@ -0,0 +1,78 @@ +--- +title: TypedArray.prototype.toLocaleString() +slug: Web/JavaScript/Reference/Global_Objects/TypedArray/toLocaleString +tags: + - ECMAScript 2015 + - JavaScript + - TypedArray +translation_of: Web/JavaScript/Reference/Global_Objects/TypedArray/toLocaleString +--- +<div>{{JSRef}}</div> + +<p><code><strong>toLocaleString()</strong></code>方法返回一个字符串，表明该类型化数组的元素。这些元素被转化为字符串并由一个区域设置指定的分隔符（例如逗号 “,”）分隔。这个方法与{{jsxref("Array.prototype.toLocaleString()")}}拥有相同的算法。同时，由于类型化数组的元素都是数，将每个元素转化为字符串的算法与{{jsxref("Number.prototype.toLocaleString()")}}是相同的。（类型化数组）的是<a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray#TypedArray_objects">typed array types</a>中的其中一个。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>typedarr</var>ay.toLocaleString([locales [, options]]);</pre> + +<h3 id="参数">参数</h3> + +<div>{{page('/en-US/docs/Web/JavaScript/Reference/Global_Objects/NumberFormat', 'Parameters')}}</div> + +<h3 id="返回值">返回值</h3> + +<p>一个字符串，表明该类型化数组内的元素。</p> + +<h2 id="例子">例子</h2> + +<h3 id="使用toLocaleString">使用<code>toLocaleString</code></h3> + +<pre class="brush: js">var uint = new Uint32Array([2000, 500, 8123, 12, 4212]); + +uint.toLocaleString(); +// 如果在de-DE区域设置下运行 +// "2.000,500,8.123,12,4.212" + +uint.toLocaleString('en-US'); +// "2,000,500,8,123,12,4,212" + +uint.toLocaleString('ja-JP', { style: 'currency', currency: 'JPY' }); +// "￥2,000,￥500,￥8,123,￥12,￥4,212" +</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>{{SpecName('ES2015', '#sec-%typedarray%.prototype.tolocalestring', 'TypedArray.prototype.toLocaleString')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>初始定义。</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-%typedarray%.prototype.tolocalestring', 'TypedArray.prototype.toLocaleString')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> + + +<p>{{Compat("javascript.builtins.TypedArray.toLocaleString")}}</p> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Array.prototype.toLocaleString()")}}</li> + <li>{{jsxref("Number.prototype.toLocaleString()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/typedarray/tostring/index.html b/files/zh-cn/web/javascript/reference/global_objects/typedarray/tostring/index.html new file mode 100644 index 0000000000..5da94eb0e4 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/typedarray/tostring/index.html @@ -0,0 +1,114 @@ +--- +title: TypedArray.prototype.toString() +slug: Web/JavaScript/Reference/Global_Objects/TypedArray/toString +translation_of: Web/JavaScript/Reference/Global_Objects/TypedArray/toString +--- +<div>{{JSRef}}</div> + +<p><code><strong>toString()</strong></code>方法返回一个表示指定数组及其元素的字符串。这个方法的算法和{{jsxref("Array.prototype.toString()")}}<em>一样。</em><em>TypedArray</em> 在这是<a href="/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/TypedArray#TypedArray_objects">typed array types </a>之一。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><var>typedarray</var>.toString()</pre> + +<h3 id="返回值">返回值</h3> + +<p>一个字符串，表示类型数组(typed array)的元素。</p> + +<h2 id="描述">描述</h2> + +<p> {{jsxref("TypedArray")}} 对象重写了{{jsxref("Object")}}的 <code>toString</code>方法。对 TypedArray 对象来说，<code>toString</code> 方法联结了数组，并返回一个字符串，它包含由逗号分隔的数组元素。例如，下面的代码创建了一个类型数组，使用<code>toString</code> 将数组转化为字符串。</p> + +<pre class="brush: js">var numbers = new Uint8Array([2, 5, 8, 1, 4]) +numbers.toString(); // "2,5,8,1,4" +</pre> + +<p>当一个类型数组表示为文本值，或者当一个数组被用于字符串连接，则JavaScript 将自动调用 <code>toString</code> 方法。</p> + +<h3 id="兼容性">兼容性</h3> + +<p>如果浏览器还不支持<code>TypedArray.prototype.toString()</code> 方法，JavaScript 将调用{{jsxref("Object")}}的 <code>toString </code>方法：</p> + +<pre class="brush: js">var numbers = new Uint8Array([2, 5, 8, 1, 4]) +numbers.toString(); // "[object Uint8Array]" +</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('ES6', '#sec-%typedarray%.prototype.tostring', 'TypedArray.prototype.toString')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>初始定义</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-%typedarray%.prototype.tostring', 'Array.prototype.toString')}}</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>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoDesktop(51)}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</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>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoMobile(51)}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("TypedArray.prototype.join()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/typedarray/values/index.html b/files/zh-cn/web/javascript/reference/global_objects/typedarray/values/index.html new file mode 100644 index 0000000000..16d89f9aee --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/typedarray/values/index.html @@ -0,0 +1,126 @@ +--- +title: TypedArray.prototype.values() +slug: Web/JavaScript/Reference/Global_Objects/TypedArray/values +translation_of: Web/JavaScript/Reference/Global_Objects/TypedArray/values +--- +<div>{{JSRef}}</div> + +<p><strong><code>values()</code></strong>返回新的 <code>Array Iterator</code> 对象，包含数组中每个下标处的值。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><var>arr</var>.values()</code></pre> + +<h3 id="返回值">返回值</h3> + +<p>新的<code><strong>Array Iterator</strong></code>对象。</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用for...of_循环的迭代">使用<code>for...of</code> 循环的迭代</h3> + +<pre class="brush: js">var arr = new Uint8Array([10, 20, 30, 40, 50]); +var eArray = arr.values(); +// 你的浏览器必须支持 for..of 循环 +// 以及 for 循环中的 let 区域变量 +for (let n of eArray) { + console.log(n); +} +</pre> + +<h3 id="备选迭代">备选迭代</h3> + +<pre class="brush: js">var arr = new Uint8Array([10, 20, 30, 40, 50]); +var eArr = arr.values(); +console.log(eArr.next().value); // 10 +console.log(eArr.next().value); // 20 +console.log(eArr.next().value); // 30 +console.log(eArr.next().value); // 40 +console.log(eArr.next().value); // 50 +</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-%typedarray%.prototype.values', '%TypedArray%.prototype.values()')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>初始定义。</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-%typedarray%.prototype.values', '%TypedArray%.prototype.values()')}}</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>Edge</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{ CompatVersionUnknown }}</td> + <td>12</td> + <td>{{CompatGeckoDesktop(37)}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatOpera("26")}}</td> + <td>{{CompatSafari("10")}}</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>{{CompatNo}}</td> + <td>{{ CompatVersionUnknown }}</td> + <td>{{CompatGeckoMobile(37)}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>10</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="另见">另见</h2> + +<ul> + <li><a href="/en-US/docs/Web/JavaScript/Typed_arrays">JavaScript 类型化数组</a></li> + <li>{{jsxref("TypedArray")}}</li> + <li>{{jsxref("TypedArray.prototype.entries()")}}</li> + <li>{{jsxref("TypedArray.prototype.keys()")}}</li> + <li>{{jsxref("TypedArray.prototype.@@iterator()", "TypedArray.prototype[@@iterator]()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/typeerror/index.html b/files/zh-cn/web/javascript/reference/global_objects/typeerror/index.html new file mode 100644 index 0000000000..e8710ef901 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/typeerror/index.html @@ -0,0 +1,133 @@ +--- +title: TypeError +slug: Web/JavaScript/Reference/Global_Objects/TypeError +tags: + - Error + - JavaScript + - Object + - Reference + - Référence(2) + - TypeError + - 参考 + - 类型错误 +translation_of: Web/JavaScript/Reference/Global_Objects/TypeError +--- +<div>{{JSRef}}</div> + +<p><code><strong>TypeError（类型错误）</strong></code> 对象用来表示值的类型非预期类型时发生的错误。</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code>new TypeError([<var>message</var>[, <var>fileName</var>[, <var>lineNumber</var>]]])</code></pre> + +<h3 id="Parameters" name="Parameters">参数</h3> + +<dl> + <dt><code>message 消息</code></dt> + <dd>可选. 描述此错误</dd> + <dt><code>fileName 文件名</code> {{non-standard_inline}}</dt> + <dd>可选. 引起该异常的代码所在的文件的名字。</dd> + <dt><code>lineNumber 行号</code> {{non-standard_inline}}</dt> + <dd>可选. 引起该异常的代码的行号。</dd> +</dl> + +<h2 id="Description" name="Description">描述</h2> + +<p>当传入函数的<strong>操作数</strong>或<strong>参数</strong>的类型并非操作符或函数所预期的类型时，将抛出一个 TypeError 类型错误。</p> + +<h2 id="Properties" name="Properties">属性</h2> + +<dl> + <dt>{{jsxref("TypeError.prototype")}}</dt> + <dd>允许为一个 TypeError 类型错误附加属性。</dd> +</dl> + +<h2 id="Methods" name="Methods">方法</h2> + +<p>全局 TypeError 不包含任何方法，不过，它将从原型链中继承一些方法。</p> + +<h2 id="TypeError_instances" name="TypeError_instances"><code>TypeError</code> 类型错误实例</h2> + +<h3 id="Properties_of_TypeError_instances" name="Properties_of_TypeError_instances">属性</h3> + +<div>{{page('/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/TypeError/prototype', '属性')}}</div> + +<h3 id="Methods_of_TypeError_instances" name="Methods_of_TypeError_instances">方法</h3> + +<div>{{page('/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/TypeError/prototype', '方法')}}</div> + +<h2 id="Examples" name="Examples">示例</h2> + +<h3 id="Example:_Catch_an_TypeError" name="Example:_Catch_an_TypeError">示例: 捕获类型错误</h3> + +<pre class="brush: js">try { + null.f(); +} catch (e) { + console.log(e instanceof TypeError); // true + console.log(e.message); // "null has no properties" + console.log(e.name); // "TypeError" + console.log(e.fileName); // "Scratchpad/1" + console.log(e.lineNumber); // 2 + console.log(e.columnNumber); // 2 + console.log(e.stack); // "@Scratchpad/2:2:3\n" +} +</pre> + +<h3 id="Example:_Create_an_TypeError" name="Example:_Create_an_TypeError">示例: 创建一个类型错误</h3> + +<pre class="brush: js">try { + throw new TypeError('Hello', "someFile.js", 10); +} catch (e) { + console.log(e instanceof TypeError); // true + console.log(e.message); // "Hello" + console.log(e.name); // "TypeError" + console.log(e.fileName); // "someFile.js" + console.log(e.lineNumber); // 10 + console.log(e.columnNumber); // 0 + console.log(e.stack); // "@Scratchpad/2:2:9\n" +} +</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>{{SpecName('ES3', '#sec-15.11.6.5', 'TypeError')}}</td> + <td>{{Spec2('ES3')}}</td> + <td>初始定义。</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.11.6.5', 'TypeError')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-native-error-types-used-in-this-standard-typeerror', 'TypeError')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div class="hidden"> +<p>The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p> </p> +</div> + +<div>{{Compat("javascript.builtins.TypeError")}}</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Error")}}</li> + <li>{{jsxref("TypeError.prototype")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/typeerror/prototype/index.html b/files/zh-cn/web/javascript/reference/global_objects/typeerror/prototype/index.html new file mode 100644 index 0000000000..058c791b71 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/typeerror/prototype/index.html @@ -0,0 +1,93 @@ +--- +title: TypeError.prototype +slug: Web/JavaScript/Reference/Global_Objects/TypeError/prototype +tags: + - Error + - JavaScript + - TypeError + - 原型 + - 错误 +translation_of: Web/JavaScript/Reference/Global_Objects/TypeError +--- +<div>{{JSRef}}</div> + +<p><code><strong>TypeError.prototype</strong></code> 属性表示 {{jsxref("TypeError")}}构造函数的原型。</p> + +<p> </p> + +<h2 id="描述">描述</h2> + +<p>所有{{jsxref("TypeError")}}实例都继承自TypeError.prototype。您可以使用原型向所有实例添加属性或方法</p> + +<p> </p> + +<h2 id="属性">属性</h2> + +<dl> + <dt><code>TypeError.prototype.constructor</code></dt> + <dd>声明创建实例原型 (prototype) 的方法。</dd> + <dt>{{jsxref("Error.prototype.message", "TypeError.prototype.message")}}</dt> + <dd>错误信息。虽然 ECMA-262 规范指出 {{jsxref("TypeError")}} 应该实现其自身的 <code>message</code> 属性，但是在 <a href="/en-US/docs/Mozilla/Projects/SpiderMonkey">SpiderMonkey</a> 中，该属性继承自 {{jsxref("Error.prototype.message")}}。</dd> + <dt>{{jsxref("Error.prototype.name", "TypeError.prototype.name")}}</dt> + <dd>错误名称。继承自 {{jsxref("Error")}}。</dd> + <dt>{{jsxref("Error.prototype.fileName", "TypeError.prototype.fileName")}}</dt> + <dd>引起该错误的代码所在文件的路径。继承自 {{jsxref("Error")}}。</dd> + <dt>{{jsxref("Error.prototype.lineNumber", "TypeError.prototype.lineNumber")}}</dt> + <dd>引起错误的代码所在行的行号。继承自 {{jsxref("Error")}}。</dd> + <dt>{{jsxref("Error.prototype.columnNumber", "TypeError.prototype.columnNumber")}}</dt> + <dd>引起错误的代码所在列的列号。继承自 {{jsxref("Error")}}。</dd> + <dt>{{jsxref("Error.prototype.stack", "TypeError.prototype.stack")}}</dt> + <dd>堆栈跟踪记录。 继承自 {{jsxref("Error")}}。</dd> +</dl> + +<h2 id="方法">方法</h2> + +<p>尽管 {{jsxref("TypeError")}} 不包含任何自己的方法, 但{{jsxref("TypeError")}}的实例通过原型链继承了一些方法。</p> + +<p> </p> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">规范</th> + <th scope="col">状态</th> + <th scope="col">说明</th> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-nativeerror.prototype', 'NativeError.prototype')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> 定义为 <code><em>NativeError</em>.prototype</code>.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.11.7.6', 'NativeError.prototype')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> 定义为 <code><em>NativeError</em>.prototype</code>.</td> + </tr> + <tr> + <td>{{SpecName('ES3', '#sec-15.11.7.6', 'NativeError.prototype')}}</td> + <td>{{Spec2('ES3')}}</td> + <td> 初始定义</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div class="hidden"> +<p>The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>and send us a pull request.</p> + +<p> </p> +</div> + +<p>{{Compat("javascript.builtins.TypeError")}}</p> + +<div id="compat-desktop"> </div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Error.prototype")}}</li> + <li>{{jsxref("Function.prototype")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/uint16array/index.html b/files/zh-cn/web/javascript/reference/global_objects/uint16array/index.html new file mode 100644 index 0000000000..6d7fadd8e9 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/uint16array/index.html @@ -0,0 +1,160 @@ +--- +title: Uint16Array +slug: Web/JavaScript/Reference/Global_Objects/Uint16Array +translation_of: Web/JavaScript/Reference/Global_Objects/Uint16Array +--- +<div>{{JSRef}}</div> + +<p><code><font face="Arial, x-locale-body, sans-serif"><span style="background-color: #ffffff;">该 </span></font><strong>Uint16Array</strong></code> 类型数组表示16位无符号整数，按平台字节顺序排列。如果需要控制字节顺序，请使用 DataView 代替。内容被初始化为0。建立后，就可以使用对象的方法或使用标准数组索引语法（即使用括号表示法）引用数组中的元素。</p> + +<h2 id="构造函数">构造函数</h2> + +<dl> + <dt><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Uint16Array/Uint16Array"><code>Uint16Array()</code></a></dt> + <dd>创建一个新的 <code>Uint16Array</code> 对象。</dd> +</dl> + +<h2 id="静态属性">静态属性</h2> + +<dl> + <dt>{{jsxref("TypedArray.BYTES_PER_ELEMENT", "Uint16Array.BYTES_PER_ELEMENT")}}</dt> + <dd>返回元素大小的数值。在 <code>Uint16Array</code> 情况下为 <code>2</code>。</dd> + <dt>{{jsxref("TypedArray.name", "Uint16Array.name")}}</dt> + <dd>返回构造函数名称的字符串值。 在 <code>Uint16Array</code> 情况下，类型为： "Uint16Array"。</dd> +</dl> + +<h2 id="静态方法">静态方法</h2> + +<dl> + <dt>{{jsxref("TypedArray.from", "Uint16Array.from()")}}</dt> + <dd>从类数组或可迭代对象创建一个新的 <code>Uint16Array</code> 。可参阅 {{jsxref("Array.from()")}}。</dd> + <dt>{{jsxref("TypedArray.of", "Uint16Array.of()")}}</dt> + <dd>创建一个新的具有可变参数数目的 <code>Uint16Array</code> 。可参阅 {{jsxref("Array.of()")}}。</dd> +</dl> + +<h2 id="实例属性">实例属性</h2> + +<dl> + <dt>{{jsxref("TypedArray.prototype.buffer", "Uint16Array.prototype.buffer")}}</dt> + <dd>返回 <code>Uint16Array</code> 在构造时固定引用的 {{jsxref("ArrayBuffer")}} 。因此是 <strong>只读的</strong>。</dd> + <dt>{{jsxref("TypedArray.prototype.byteLength", "Uint16Array.prototype.byteLength")}}</dt> + <dd>返回 <code>Uint16Array</code> 从 {{jsxref("ArrayBuffer")}}开始的长度（以字节为单位）。在构建时固定，因此是 <strong>只读的 。</strong></dd> + <dt>{{jsxref("TypedArray.prototype.byteOffset", "Uint16Array.prototype.byteOffset")}}</dt> + <dd>返回 <code>Uint16Array</code> 从 {{jsxref("ArrayBuffer")}}开始的偏移量（以字节为单位）。在构建时固定，因此是 <strong>只读的 。</strong></dd> + <dt>{{jsxref("TypedArray.prototype.length", "Uint16Array.prototype.length")}}</dt> + <dd>返回 <code>Uint16Array</code> 中包含的元素数量。在构建时固定，因此是 <strong>只读的 。</strong></dd> +</dl> + +<h2 id="实例方法">实例方法</h2> + +<dl> + <dt>{{jsxref("TypedArray.copyWithin", "Uint16Array.prototype.copyWithin()")}}</dt> + <dd>复制数组中的一序列数组元素。 可参阅 {{jsxref("Array.prototype.copyWithin()")}}。</dd> + <dt>{{jsxref("TypedArray.entries", "Uint16Array.prototype.entries()")}}</dt> + <dd>返回一个新的 <code>Array Iterator</code> 对象，该对象包含数组中的每个索引的键/值对。可参阅 {{jsxref("Array.prototype.entries()")}}。</dd> + <dt>{{jsxref("TypedArray.every", "Uint16Array.prototype.every()")}}</dt> + <dd>测试数组中的所有元素是否通过函数提供的测试。 可参阅 {{jsxref("Array.prototype.every()")}}。</dd> + <dt>{{jsxref("TypedArray.fill", "Uint16Array.prototype.fill()")}}</dt> + <dd>使用静态值填充从开始索引到结束索引的数组的所有元素。 可参阅 {{jsxref("Array.prototype.fill()")}}。</dd> + <dt>{{jsxref("TypedArray.filter", "Uint16Array.prototype.filter()")}}</dt> + <dd>根据所提供的过滤函数，将所有返回true的所有元素创建一个新的数组。可参阅 {{jsxref("Array.prototype.filter()")}}。</dd> + <dt>{{jsxref("TypedArray.find", "Uint16Array.prototype.find()")}}</dt> + <dd>返回数组中满足所提供的测试函数的值，没有则返回 <code>undefined</code> 。 可参阅 {{jsxref("Array.prototype.find()")}}。</dd> + <dt>{{jsxref("TypedArray.findIndex", "Uint16Array.prototype.findIndex()")}}</dt> + <dd>返回数组中满足所提供的测试函数的索引，没有则返回 -1。 可参阅 {{jsxref("Array.prototype.findIndex()")}}。</dd> + <dt>{{jsxref("TypedArray.forEach", "Uint16Array.prototype.forEach()")}}</dt> + <dd>为数组中的每个元素调用一个函数。 可参阅 {{jsxref("Array.prototype.forEach()")}}。</dd> + <dt>{{jsxref("TypedArray.includes", "Uint16Array.prototype.includes()")}}</dt> + <dd>判断数组中是否包含某个元素，有则返回 <code>true</code> ，无则返回 <code>false</code> 。 可参阅 {{jsxref("Array.prototype.includes()")}}。</dd> + <dt>{{jsxref("TypedArray.indexOf", "Uint16Array.prototype.indexOf()")}}</dt> + <dd>返回数组中等于指定的值的元素第一个（最小）索引，没有则返回 -1。 可参阅 {{jsxref("Array.prototype.indexOf()")}}。</dd> + <dt>{{jsxref("TypedArray.join", "Uint16Array.prototype.join()")}}</dt> + <dd>将数组中的所有元素连接成字符串。可参阅 {{jsxref("Array.prototype.join()")}}。</dd> + <dt>{{jsxref("TypedArray.keys", "Uint16Array.prototype.keys()")}}</dt> + <dd>f返回一个新的 <code>Array Iterator</code> ，其包含数组中每个索引的键。 可参阅 {{jsxref("Array.prototype.keys()")}}。</dd> + <dt>{{jsxref("TypedArray.lastIndexOf", "Uint16Array.prototype.lastIndexOf()")}}</dt> + <dd>返回数组中最后一个（最大的）与指定值相等的元素的索引，没有则返回 -1。可参阅 {{jsxref("Array.prototype.lastIndexOf()")}}。</dd> + <dt>{{jsxref("TypedArray.map", "Uint16Array.prototype.map()")}}</dt> + <dd>返回一个根据所提供的函数对每个元素处理后的新数组。可参阅 {{jsxref("Array.prototype.map()")}}。</dd> + <dt>{{jsxref("TypedArray.reduce", "Uint16Array.prototype.reduce()")}}</dt> + <dd>根据所提供的函数对累加器和数组的每一个值（从左到右）进行处理，并返回最后调用函数的值。可参阅 {{jsxref("Array.prototype.reduce()")}}。</dd> + <dt>{{jsxref("TypedArray.reduceRight", "Uint16Array.prototype.reduceRight()")}}</dt> + <dd>根据所提供的函数对累加器和数组的每一个值（从右到左）进行处理，并返回最后调用函数的值。 可参阅 {{jsxref("Array.prototype.reduceRight()")}}。</dd> + <dt>{{jsxref("TypedArray.reverse", "Uint16Array.prototype.reverse()")}}</dt> + <dd>颠倒数组的顺序，使第一个元素成为最后一个，最后一个元素成为第一个。 可参阅 {{jsxref("Array.prototype.reverse()")}}。</dd> + <dt>{{jsxref("TypedArray.set", "Uint16Array.prototype.set()")}}</dt> + <dd>在类型化数组中存储多个值，从指定数组中读取输入值。</dd> + <dt>{{jsxref("TypedArray.slice", "Uint16Array.prototype.slice()")}}</dt> + <dd>截取数组中的一部分并作为新数组返回。 可参阅 {{jsxref("Array.prototype.slice()")}}。</dd> + <dt>{{jsxref("TypedArray.some", "Uint16Array.prototype.some()")}}</dt> + <dd>判读数组中是否至少有一个元素满足所提供的测试函数，有则返回 true。 可参阅 {{jsxref("Array.prototype.some()")}}。</dd> + <dt>{{jsxref("TypedArray.sort", "Uint16Array.prototype.sort()")}}</dt> + <dd>对数组中的元素进行排序并返回排序后的数组。 可参阅 {{jsxref("Array.prototype.sort()")}}。</dd> + <dt>{{jsxref("TypedArray.subarray", "Uint16Array.prototype.subarray()")}}</dt> + <dd>从给定的开始与结束元素索引中返回一个新的 <code>Uint16Array</code> 。</dd> + <dt>{{jsxref("TypedArray.values", "Uint16Array.prototype.values()")}}</dt> + <dd>返回一个新的 <code>Array Iterator</code> 对象，该对象包含数组中的每个索引的值。 可参阅 {{jsxref("Array.prototype.values()")}}.</dd> + <dt>{{jsxref("TypedArray.toLocaleString", "Uint16Array.prototype.toLocaleString()")}}</dt> + <dd>返回表示数组及其元素的本地化字符串。 可参阅 {{jsxref("Array.prototype.toLocaleString()")}}。</dd> + <dt>{{jsxref("TypedArray.toString", "Uint16Array.prototype.toString()")}}</dt> + <dd>返回表示数组及其元素的字符串。可参阅 {{jsxref("Array.prototype.toString()")}}。</dd> + <dt>{{jsxref("TypedArray.@@iterator", "Uint16Array.prototype[@@iterator]()")}}</dt> + <dd>返回一个新的 <code>Array Iterator</code> 对象， 其包含数组中每个索引的值。</dd> +</dl> + +<h2 id="示例">示例</h2> + +<h3 id="Different_ways_to_create_a_Uint16Array">Different ways to create a Uint16Array</h3> + +<pre class="brush: js notranslate">// 长度 +var uint16 = new Uint16Array(2); +uint16[0] = 42; +console.log(uint16[0]); // 42 +console.log(uint16.length); // 2 +console.log(uint16.BYTES_PER_ELEMENT); // 2 + +// 数组 +var arr = new Uint16Array([21,31]); +console.log(arr[1]); // 31 + +// 另一个类型数组 +var x = new Uint16Array([21, 31]); +var y = new Uint16Array(x); +console.log(y[0]); // 21 + +// 一个 ArrayBuffer +var buffer = new ArrayBuffer(8); +var z = new Uint16Array(buffer, 0, 4); + +// 可迭代 +var iterable = function*(){ yield* [1,2,3]; }(); +var uint16 = new Uint16Array(iterable); +// Uint16Array[1, 2, 3] +</pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Specification</th> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#table-49', 'TypedArray constructors')}}</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div class="hidden">此页面上的兼容性表是由结构化数据生成的。如果您想贡献数据，请查看 <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> 并向我们发送pull请求。</div> + +<p>{{Compat("javascript.builtins.Uint16Array")}}</p> + +<h2 id="可参阅">可参阅</h2> + +<ul> + <li><a href="/en-US/docs/Web/JavaScript/Typed_arrays" title="en/JavaScript typed arrays">JavaScript typed arrays</a></li> + <li>{{jsxref("ArrayBuffer")}}</li> + <li>{{jsxref("DataView")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/uint32array/index.html b/files/zh-cn/web/javascript/reference/global_objects/uint32array/index.html new file mode 100644 index 0000000000..1239590bdf --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/uint32array/index.html @@ -0,0 +1,176 @@ +--- +title: Uint32Array +slug: Web/JavaScript/Reference/Global_Objects/Uint32Array +translation_of: Web/JavaScript/Reference/Global_Objects/Uint32Array +--- +<div>{{JSRef("Global_Objects", "TypedArray", "Int8Array,Uint8Array,Uint8ClampedArray,Int16Array,Uint16Array,Int32Array,Uint32Array,Float32Array,Float64Array")}}</div> + +<div></div> + +<p><strong><code>Uint32Array</code> </strong>表示一个由基于平台字节序的32位无符号字节组成的数组。如果需要对字节顺序进行控制(译者注：即 littleEndian 或 bigEndian)，请使用 {{jsxref("DataView")}} 代替。数组中每个元素的初始值都是<code>0</code>。一旦创建，你可以用对象的方法引用数组里的元素，或者使用标准的数组索引语法（即，使用中括号）。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">new Uint32Array(); // new in ES2017 +new Uint32Array(length); +new Uint32Array(typedArray); +new Uint32Array(object); +new Uint32Array(buffer [, byteOffset [, length]]);</pre> + +<p>更多的构造器语法和属性请参照 <em><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray#Syntax">TypedArray</a>。</em></p> + +<h2 id="属性">属性</h2> + +<dl> + <dt>{{jsxref("TypedArray.BYTES_PER_ELEMENT", "Uint32Array.BYTES_PER_ELEMENT")}}</dt> + <dd>返回一个数值，代表<code>Uint32Array</code>中单个元素的字节大小。<code>Uint32Array</code> 返回 <code>4</code>。</dd> + <dt>Uint32Array.length</dt> + <dd>固定值(static)属性，值为3。使用 {{jsxref("TypedArray.prototype.length", "Uint32Array.prototype.length")}} 获得数组的真实长度（元素个数）。</dd> + <dt>{{jsxref("TypedArray.name", "Uint32Array.name")}}</dt> + <dd>返回字符串类型的值，表示构造器的名字。<code>Uint32Array</code> 的返回值是: "Uint32Array"。</dd> + <dt>{{jsxref("TypedArray.prototype", "Uint32Array.prototype")}}</dt> + <dd><em>TypedArray</em> 对象的原型链。</dd> +</dl> + +<h2 id="方法">方法</h2> + +<dl> + <dt>{{jsxref("TypedArray.from", "Uint32Array.from()")}}</dt> + <dd>从类似数组或者可迭代对象创建一个新的 <code>Uint32Array</code> 。请参考 {{jsxref("Array.from()")}}.</dd> + <dt>{{jsxref("TypedArray.of", "Uint32Array.of()")}}</dt> + <dd>从可变长度的参数创建一个新的 <code>Uint32Array</code> 。请参考 {{jsxref("Array.of()")}}.</dd> +</dl> + +<h2 id="Boolean_instances" name="Boolean_instances"><code>Uint32Array</code> 原型</h2> + +<p><font face="Open Sans, sans-serif">所有 </font><code>Uint32Array</code> 对象继承自 {{jsxref("TypedArray.prototype", "%TypedArray%.prototype")}}.</p> + +<h3 id="属性_2">属性</h3> + +<dl> + <dt><code>Uint32Array.prototype.constructor</code></dt> + <dd>返回创建实例原型的函数。 默认返回 <code>Uint32Array</code> 的构造器。</dd> + <dt>{{jsxref("TypedArray.prototype.buffer", "Uint32Array.prototype.buffer")}} {{readonlyInline}}</dt> + <dd>返回 <code>Uint32Array</code>引用的 {{jsxref("ArrayBuffer")}}。 由于构造时已固定，所以是<strong>只读的</strong>。</dd> + <dt>{{jsxref("TypedArray.prototype.byteLength", "Uint32Array.prototype.byteLength")}} {{readonlyInline}}</dt> + <dd>返回从其 {{jsxref("ArrayBuffer")}} 开始的 <code>Uint32Array</code> 字节长度。由于构造时已固定，所以是<strong>只读的</strong>。</dd> + <dt>{{jsxref("TypedArray.prototype.byteOffset", "Uint32Array.prototype.byteOffset")}} {{readonlyInline}}</dt> + <dd>返回从其 {{jsxref("ArrayBuffer")}} 的偏移开始的 <code>Uint32Array</code> 字节长度。由于构造时已固定，所以是<strong>只读的</strong>。</dd> + <dt>{{jsxref("TypedArray.prototype.length", "Uint32Array.prototype.length")}} {{readonlyInline}}</dt> + <dd>返回 <code>Uint32Array</code> 中元素的个数。由于构造时已固定，所以是<strong>只读的</strong>。</dd> +</dl> + +<h3 id="方法_2">方法</h3> + +<dl> + <dt>{{jsxref("TypedArray.copyWithin", "Uint32Array.prototype.copyWithin()")}}</dt> + <dd>拷贝（浅拷贝）数组的部分元素到本数组的不同位置（不改变数组的大小）。请参考 {{jsxref("Array.prototype.copyWithin()")}}。</dd> + <dt>{{jsxref("TypedArray.entries", "Uint32Array.prototype.entries()")}}</dt> + <dd>返回一个 <code>Array Iterator</code> 对象，该对象包含数组中每一对索引的键值对。请参考 {{jsxref("Array.prototype.entries()")}}。</dd> + <dt>{{jsxref("TypedArray.every", "Uint32Array.prototype.every()")}}</dt> + <dd>测试是否数组中的所有元素都通过给定的测试函数。请参考 {{jsxref("Array.prototype.every()")}}。</dd> + <dt>{{jsxref("TypedArray.fill", "Uint32Array.prototype.fill()")}}</dt> + <dd>使用静态值填充从起始下标到终止下标的数组元素。请参考 {{jsxref("Array.prototype.fill()")}}。</dd> + <dt>{{jsxref("TypedArray.filter", "Uint32Array.prototype.filter()")}}</dt> + <dd>创造一个新数组，含有原数组中可通过给定的过滤器函数的所有元素。请参考 {{jsxref("Array.prototype.filter()")}}。</dd> + <dt>{{jsxref("TypedArray.find", "Uint32Array.prototype.find()")}}</dt> + <dd>如果数组中的元素满足提供的测试函数，返回找到的值，如果没有找到则返回 <code>undefined</code>。请参考 {{jsxref("Array.prototype.find()")}}。</dd> + <dt>{{jsxref("TypedArray.findIndex", "Uint32Array.prototype.findIndex()")}}</dt> + <dd>如果数组中的元素满足提供的测试函数，返回找到的下标，如果没有找到则返回 -1。请参考 {{jsxref("Array.prototype.findIndex()")}}。</dd> + <dt>{{jsxref("TypedArray.forEach", "Uint32Array.prototype.forEach()")}}</dt> + <dd>对数组内的每个元素调用一个函数。请参考 {{jsxref("Array.prototype.forEach()")}}。</dd> + <dt>{{jsxref("TypedArray.includes", "Uint32Array.prototype.includes()")}}</dt> + <dd>判断该数组是否包含特定值，如果包含返回 <code>true</code>，否则返回<code>false</code>。请参考 {{jsxref("Array.prototype.includes()")}}。</dd> + <dt>{{jsxref("TypedArray.indexOf", "Uint32Array.prototype.indexOf()")}}</dt> + <dd>返回数组中等于特定值的第一个元素（下标最小）的下标，如果没有找到则返回 -1。请参考 {{jsxref("Array.prototype.indexOf()")}}。</dd> + <dt>{{jsxref("TypedArray.join", "Uint32Array.prototype.join()")}}</dt> + <dd>将数组内的元素拼接成一个字符串。请参考 {{jsxref("Array.prototype.join()")}}。</dd> + <dt>{{jsxref("TypedArray.keys", "Uint32Array.prototype.keys()")}}</dt> + <dd>返回一个 <code>Array Iterator</code> 对象，该对象包含数组中所有索引(key)。请参考 {{jsxref("Array.prototype.keys()")}}。</dd> + <dt>{{jsxref("TypedArray.lastIndexOf", "Uint32Array.prototype.lastIndexOf()")}}</dt> + <dd>返回数组中等于特定值的最后一个元素（下标最大）的下标，如果没有找到则返回 -1。请参考 {{jsxref("Array.prototype.lastIndexOf()")}}。</dd> + <dt>{{jsxref("TypedArray.map", "Uint32Array.prototype.map()")}}</dt> + <dd>用该数组的每个元素调用给定函数的结果创建新数组。请参考 {{jsxref("Array.prototype.map()")}}。</dd> + <dt>{{jsxref("TypedArray.reduce", "Uint32Array.prototype.reduce()")}}</dt> + <dd>对累加器和数组的每个值应用函数（从左到右），使其归约为单一的值。请参考 {{jsxref("Array.prototype.reduce()")}}。</dd> + <dt>{{jsxref("TypedArray.reduceRight", "Uint32Array.prototype.reduceRight()")}}</dt> + <dd>对累加器和数组的每个值应用函数（从右到左），使其归约为单一的值。请参考 {{jsxref("Array.prototype.reduceRight()")}}。</dd> + <dt>{{jsxref("TypedArray.reverse", "Uint32Array.prototype.reverse()")}}</dt> + <dd>翻转数组中的元素顺序——首尾颠倒。请参考 {{jsxref("Array.prototype.reverse()")}}。</dd> + <dt>{{jsxref("TypedArray.set", "Uint32Array.prototype.set()")}}</dt> + <dd>从一个给定的数组中读取多个数据并存储至 typed array。</dd> + <dt>{{jsxref("TypedArray.slice", "Uint32Array.prototype.slice()")}}</dt> + <dd>提取数组的某个部分并返回新的数组。请参考 {{jsxref("Array.prototype.slice()")}}。</dd> + <dt>{{jsxref("TypedArray.some", "Uint32Array.prototype.some()")}}</dt> + <dd>测试是否数组中有（至少一个）元素可通过给定的测试函数。请参考 {{jsxref("Array.prototype.some()")}}。</dd> + <dt>{{jsxref("TypedArray.sort", "Uint32Array.prototype.sort()")}}</dt> + <dd>就地排序数组中的元素，并返回该数组。请参考 {{jsxref("Array.prototype.sort()")}}。</dd> + <dt>{{jsxref("TypedArray.subarray", "Uint32Array.prototype.subarray()")}}</dt> + <dd>根据给定的起始和结束元素下标，返回一个新的 <code>Uint32Array</code> 子数组。</dd> + <dt>{{jsxref("TypedArray.values", "Uint32Array.prototype.values()")}}</dt> + <dd>返回新的 <code>Array Iterator</code> 对象，其含有数组中每个索引的值。请参考 {{jsxref("Array.prototype.values()")}}。</dd> + <dt>{{jsxref("TypedArray.toLocaleString", "Uint32Array.prototype.toLocaleString()")}}</dt> + <dd>返回表示数组及其元素的本地化字符串。请参考 {{jsxref("Array.prototype.toLocaleString()")}}。</dd> + <dt>{{jsxref("TypedArray.toString", "Uint32Array.prototype.toString()")}}</dt> + <dd>返回表示数组及其元素的字符串。请参考 {{jsxref("Array.prototype.toString()")}}。</dd> + <dt>{{jsxref("TypedArray.@@iterator", "Uint32Array.prototype[@@iterator]()")}}</dt> + <dd>返回新的 <code>Array Iterator</code> 对象，其含有数组中每个索引的值。</dd> +</dl> + +<h2 id="示例">示例</h2> + +<p>用不同的方法创建 <code>Uint32Array</code>：</p> + +<pre class="brush: js">// 给定长度 +var uint32 = new Uint32Array(2); +uint32[0] = 42; +console.log(uint32[0]); // 42 +console.log(uint32.length); // 2 +console.log(uint32.BYTES_PER_ELEMENT); // 4 + +// 给定数组 +var arr = new Uint32Array([21, 31]); +console.log(arr[1]); // 31 + +// 给定 TypedArray +var x = new Uint32Array([21, 31]); +var y = new Uint32Array(x); +console.log(y[0]); // 21 + +// 给定 ArrayBuffer +var buffer = new ArrayBuffer(16); +var z = new Uint32Array(buffer, 0, 4); + +// 给定可迭代对象 +var iterable = function*(){ yield* [1, 2, 3]; }(); +var uint32 = new Uint32Array(iterable); +// Uint32Array[1, 2, 3]</pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Specification</th> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#table-49', 'TypedArray constructors')}}</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div class="hidden"> +<p>The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> +</div> + +<p>{{Compat("javascript.builtins.Uint32Array")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li><a href="/en-US/docs/Web/JavaScript/Typed_arrays" title="en/JavaScript typed arrays">JavaScript typed arrays</a></li> + <li>{{jsxref("ArrayBuffer")}}</li> + <li>{{jsxref("DataView")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/uint8array/index.html b/files/zh-cn/web/javascript/reference/global_objects/uint8array/index.html new file mode 100644 index 0000000000..1619a2abb3 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/uint8array/index.html @@ -0,0 +1,193 @@ +--- +title: Uint8Array +slug: Web/JavaScript/Reference/Global_Objects/Uint8Array +translation_of: Web/JavaScript/Reference/Global_Objects/Uint8Array +--- +<div>{{JSRef}}</div> + +<p><strong><code>Uint8Array</code></strong> 数组类型表示一个8位无符号整型数组，创建时内容被初始化为0。创建完后，可以以对象的方式或使用数组下标索引的方式引用数组中的元素。</p> + +<h2 id="语法格式">语法格式</h2> + +<pre class="syntaxbox">new Uint8Array(); // ES2017 最新语法 +new Uint8Array(length); // 创建初始化为0的，包含length个元素的无符号整型数组 +new Uint8Array(typedArray); +new Uint8Array(object); +new Uint8Array(buffer [, byteOffset [, length]]);</pre> + +<p>构造语法和参数的更多信息请参见 <em><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray#Syntax">TypedArray</a></em>.</p> + +<h2 id="属性">属性</h2> + +<dl> + <dt>{{jsxref("TypedArray.BYTES_PER_ELEMENT", "Uint8Array.BYTES_PER_ELEMENT")}}</dt> + <dd>返回数组中元素的字节数，Uint8Array中返回1字节。</dd> + <dt>Uint8Array.length</dt> + <dd>静态属性length一直为0。想获知其真实长度（元素个数），请参阅 {{jsxref("TypedArray.prototype.length", "Uint8Array.prototype.length")}}.</dd> + <dt>{{jsxref("TypedArray.name", "Uint8Array.name")}}</dt> + <dd>返回构造名的字符串，对Uint8Array类型而言返回 “Uint8Array”</dd> + <dt>{{jsxref("TypedArray.prototype", "Uint8Array.prototype")}}</dt> + <dd><em>TypedArray</em> 对象的原型.</dd> +</dl> + +<h2 id="方法">方法</h2> + +<dl> + <dt>{{jsxref("TypedArray.from", "Uint8Array.from()")}}</dt> + <dd>从一个数组或可迭代的对象创建一个新的<code>Uint8Array</code>数组，可参见{{jsxref("Array.from()")}}.</dd> + <dt>{{jsxref("TypedArray.of", "Uint8Array.of()")}}</dt> + <dd>通过一个可变数目的参数创建一个新的<code>Uint8Array</code>数组，可参见{{jsxref("Array.of()")}}.</dd> +</dl> + +<h2 id="Boolean_instances" name="Boolean_instances"><code>Uint8Array</code> 原型声明</h2> + +<p>所有的<code>Uint8Array对象继承自</code> {{jsxref("TypedArray.prototype", "%TypedArray%.prototype")}}.</p> + +<h3 id="属性_2">属性</h3> + +<dl> + <dt><code>Uint8Array.prototype.constructor</code></dt> + <dd>返回创建实例属性的函数，默认为 <code>Uint8Array</code> 构造器。</dd> + <dt>{{jsxref("TypedArray.prototype.buffer", "Uint8Array.prototype.buffer")}} {{readonlyInline}}</dt> + <dd>返回由 <code>Uint8Array</code>引用的 {{jsxref("ArrayBuffer")}} ，在构造时期固定，所以是<strong>只读</strong>的。</dd> + <dt>{{jsxref("TypedArray.prototype.byteLength", "Uint8Array.prototype.byteLength")}} {{readonlyInline}}</dt> + <dd>返回<code>Uint8Array</code>长度（字节数）。在构造时期固定，所以是 <strong>只读的</strong>。</dd> + <dt>{{jsxref("TypedArray.prototype.byteOffset", "Uint8Array.prototype.byteOffset")}} {{readonlyInline}}</dt> + <dd>返回<code>Uint8Array</code> 距离其 {{jsxref("ArrayBuffer")}} 起始位置的偏移（字节数）。在构造时期固定，所以是 <strong>只读的</strong>。</dd> + <dt>{{jsxref("TypedArray.prototype.length", "Uint8Array.prototype.length")}} {{readonlyInline}}</dt> + <dd>返回保存在 <code>Uint8Array</code>中的元素数量。 在构造时期固定，所以是 <strong>只读的</strong>。</dd> +</dl> + +<h3 id="方法_2">方法</h3> + +<dl> + <dt>{{jsxref("TypedArray.copyWithin", "Uint8Array.prototype.copyWithin()")}}</dt> + <dd>复制数组中的元素序列，请参见 {{jsxref("Array.prototype.copyWithin()")}}。</dd> + <dt>{{jsxref("TypedArray.entries", "Uint8Array.prototype.entries()")}}</dt> + <dd>返回新的<code>Array Iterator</code> 对象，含有数组中每个下标处的键值对。请参见{{jsxref("Array.prototype.entries()")}}.</dd> + <dt>{{jsxref("TypedArray.every", "Uint8Array.prototype.every()")}}</dt> + <dd>测试数组中所有元素是否都能通过由函数提供的测试。请参见 {{jsxref("Array.prototype.every()")}}。</dd> + <dt>{{jsxref("TypedArray.fill", "Uint8Array.prototype.fill()")}}</dt> + <dd>使用静态值填充从起始下标到终止下标的数组元素。请参见 {{jsxref("Array.prototype.fill()")}}。</dd> + <dt>{{jsxref("TypedArray.filter", "Uint8Array.prototype.filter()")}}</dt> + <dd>创建新的数组，含有数组中给定过滤器返回 true 的所有元素。请参见{{jsxref("Array.prototype.filter()")}}.</dd> + <dt>{{jsxref("TypedArray.find", "Uint8Array.prototype.find()")}}</dt> + <dd>如果数组中的元素满足提供的测试函数，返回找到的值，如果没有找到则返回 <code>undefined</code>。请参见 {{jsxref("Array.prototype.find()")}}。</dd> + <dt>{{jsxref("TypedArray.findIndex", "Uint8Array.prototype.findIndex()")}}</dt> + <dd>如果数组中的元素满足提供的测试函数，返回找到的下标，如果没有找到则返回 -1。请参见 {{jsxref("Array.prototype.findIndex()")}}.</dd> + <dt>{{jsxref("TypedArray.forEach", "Uint8Array.prototype.forEach()")}}</dt> + <dd>对数组的每个元素调用字符串 {{jsxref("Array.prototype.forEach()")}}。</dd> + <dt>{{jsxref("TypedArray.includes", "Uint8Array.prototype.includes()")}} {{experimental_inline}}</dt> + <dd>判断类型化数组是否包含特定值，如果包含返回 <code>true</code>，否则返回<code>false</code>。另见{{jsxref("Array.prototype.includes()")}}。</dd> + <dt>{{jsxref("TypedArray.indexOf", "Uint8Array.prototype.indexOf()")}}</dt> + <dd>返回数组中等于特定值的第一个元素（下标最小），如果没有找到则返回 -1，请参见 {{jsxref("Array.prototype.indexOf()")}}.</dd> + <dt>{{jsxref("TypedArray.join", "Uint8Array.prototype.join()")}}</dt> + <dd>将数组中所有元素连接为字符串。请参见 {{jsxref("Array.prototype.join()")}}。</dd> + <dt>{{jsxref("TypedArray.keys", "Uint8Array.prototype.keys()")}}</dt> + <dd>返回新的<code>Array Iterator</code> ，含有数组中每个下标的键，请参见 {{jsxref("Array.prototype.keys()")}}。</dd> + <dt>{{jsxref("TypedArray.lastIndexOf", "Uint8Array.prototype.lastIndexOf()")}}</dt> + <dd>返回数组中等于特定值的最后一个元素（下标最大），如果没有找到则返回 -1，请参见 {{jsxref("Array.prototype.lastIndexOf()")}}。</dd> + <dt>{{jsxref("TypedArray.map", "Uint8Array.prototype.map()")}}</dt> + <dd>使用在该数组的每个元素上调用函数的结果创建新数组，请参见{{jsxref("Array.prototype.map()")}}。</dd> + <dt>{{jsxref("TypedArray.move", "Uint8Array.prototype.move()")}} {{non-standard_inline}} {{unimplemented_inline}}</dt> + <dd>{{jsxref("TypedArray.copyWithin", "Uint8Array.prototype.copyWithin()")}}的之前的非标准版本。</dd> + <dt>{{jsxref("TypedArray.reduce", "Uint8Array.prototype.reduce()")}}</dt> + <dd>对累加器和数组的每个值应用函数（从左到右），使其归约为单一的值， 另见 {{jsxref("Array.prototype.reduce()")}}。</dd> + <dt>{{jsxref("TypedArray.reduceRight", "Uint8Array.prototype.reduceRight()")}}</dt> + <dd>对累加器和数组的每个值应用函数（从右到左），使其归约为单一的值， 另见 {{jsxref("Array.prototype.reduceRight()")}}。</dd> + <dt>{{jsxref("TypedArray.reverse", "Uint8Array.prototype.reverse()")}}</dt> + <dd>翻转数组中的元素顺序 — 第一个变为最后，最后变为第一个。另见 {{jsxref("Array.prototype.reverse()")}}。</dd> + <dt>{{jsxref("TypedArray.set", "Uint8Array.prototype.set()")}}</dt> + <dd>在类型化数组中储存多个值，从特定数组中读取输入。</dd> + <dt>{{jsxref("TypedArray.slice", "Uint8Array.prototype.slice()")}}</dt> + <dd>提取数组的某个部分并返回新的数组，请参见 {{jsxref("Array.prototype.slice()")}}。</dd> + <dt>{{jsxref("TypedArray.some", "Uint8Array.prototype.some()")}}</dt> + <dd>如果数组中至少一个元素满足给定的测试函数，则返回<code>true</code>。请参见{{jsxref("Array.prototype.some()")}}。</dd> + <dt>{{jsxref("TypedArray.sort", "Uint8Array.prototype.sort()")}}</dt> + <dd>原地排序数组中的元素，并返回该数组，请参见 {{jsxref("Array.prototype.sort()")}}。</dd> + <dt>{{jsxref("TypedArray.subarray", "Uint8Array.prototype.subarray()")}}</dt> + <dd><code>从给定的元素起始和终止下标返回新的 Uint8Array</code> 。</dd> + <dt>{{jsxref("TypedArray.values", "Uint8Array.prototype.values()")}}</dt> + <dd>返回新的 <code>Array Iterator</code> 对象，含有数组每个下标处的值，请参见 {{jsxref("Array.prototype.values()")}}。</dd> + <dt>{{jsxref("TypedArray.toLocaleString", "Uint8Array.prototype.toLocaleString()")}}</dt> + <dd>返回表示数组及其元素的本地化字符串，请参见 {{jsxref("Array.prototype.toLocaleString()")}}。</dd> + <dt>{{jsxref("TypedArray.toString", "Uint8Array.prototype.toString()")}}</dt> + <dd>返回表示数组及其元素的字符串。请参见 {{jsxref("Array.prototype.toString()")}}。</dd> + <dt>{{jsxref("TypedArray.@@iterator", "Uint8Array.prototype[@@iterator]()")}}</dt> + <dd><code>返回新的 Array Iterator</code> 对象，包含数组中每个下标处的值。</dd> +</dl> + +<h2 id="例子">例子</h2> + +<pre class="brush: js">// 来自长度 +var uint8 = new Uint8Array(2); +uint8[0] = 42; +console.log(uint8[0]); // 42 +console.log(uint8.length); // 2 +console.log(uint8.BYTES_PER_ELEMENT); // 1 + +// 来自数组 +var arr = new Uint8Array([21,31]); +console.log(arr[1]); // 31 + +// 来自另一个 TypedArray +var x = new Uint8Array([21, 31]); +var y = new Uint8Array(x); +console.log(y[0]); // 21 + +// 来自 ArrayBuffer +var buffer = new ArrayBuffer(8); +var z = new Uint8Array(buffer, 1, 4); + +// 来自一个迭代器 +var iterable = function*(){ yield* [1,2,3]; }(); +var uint8 = new Uint8Array(iterable); +// Uint8Array[1, 2, 3] + +</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 href="https://www.khronos.org/registry/typedarray/specs/latest/#7">类型化数组规范</a></td> + <td>Obsolete</td> + <td><span><span>由 ECMAScript 6 取代。</span></span></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#table-45', 'TypedArray constructors')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>ECMA 标准中的初始定义。</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.Uint8Array")}}</p> + +<h2 id="兼容性说明">兼容性说明</h2> + +<p>从 ECMAScript 2015 开始，<code>Uint8Array</code> 构造函数需要通过 {{jsxref("Operators/new", "new")}} 操作符调用。即日起如果没有使用 <code>new</code> 调用 <code>Uint8Array</code> 的构造函数，将会抛出 {{jsxref("TypeError")}} 。</p> + +<pre class="brush: js example-bad">var dv = Uint8Array([1, 2, 3]); +// TypeError: calling a builtin Uint8Array constructor +// 不使用 new 将会被禁止</pre> + +<pre class="brush: js example-good">var dv = new Uint8Array([1, 2, 3]);</pre> + +<h2 id="相关内容">相关内容</h2> + +<ul> + <li><a href="/en-US/docs/Web/JavaScript/Typed_arrays" title="en/JavaScript typed arrays">JavaScript 类型化数组</a></li> + <li>{{jsxref("ArrayBuffer")}}</li> + <li>{{jsxref("DataView")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/uint8clampedarray/index.html b/files/zh-cn/web/javascript/reference/global_objects/uint8clampedarray/index.html new file mode 100644 index 0000000000..86028a8fb9 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/uint8clampedarray/index.html @@ -0,0 +1,280 @@ +--- +title: Uint8ClampedArray +slug: Web/JavaScript/Reference/Global_Objects/Uint8ClampedArray +translation_of: Web/JavaScript/Reference/Global_Objects/Uint8ClampedArray +--- +<div>{{JSRef}}</div> + +<p><strong><code>Uint8ClampedArray</code>（8位无符号整型固定数组）</strong> 类型化数组表示一个由值固定在0-255区间的8位无符号整型组成的数组；如果你指定一个在 [0,255] 区间外的值，它将被替换为0或255；如果你指定一个非整数，那么它将被设置为最接近它的整数。（数组）内容被初始化为0。一旦（数组）被创建，你可以使用对象的方法引用数组里的元素，或使用标准的数组索引语法（即使用方括号标记）。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox notranslate">new Uint8ClampedArray(length); +new Uint8ClampedArray(typedArray); +new Uint8ClampedArray(object); +new Uint8ClampedArray(buffer [, byteOffset [, length]]);</pre> + +<p>关于构造函数语法和参数的更多信息，参见 <em><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray#Syntax">TypedArray</a></em>。</p> + +<h2 id="属性">属性</h2> + +<dl> + <dt>{{jsxref("TypedArray.BYTES_PER_ELEMENT", "Uint8ClampedArray.BYTES_PER_ELEMENT")}}</dt> + <dd>返回元素大小的一个数值。对 <code>Uint8ClampedArray</code> 而言是1。</dd> + <dt>{{jsxref("TypedArray.prototype.length", "Uint8ClampedArray.prototype.length")}}</dt> + <dd>静态长度属性值为0。对于实际长度（元素的数量），见 {{jsxref("TypedArray.prototype.length", "Uint8ClampedArray.prototype.length")}}。</dd> + <dt>{{jsxref("TypedArray.name", "Uint8ClampedArray.name")}}</dt> + <dd>返回构造函数名的字符串值。对 <code>Uint8ClampedArray</code> 类型而言："Uint8ClampedArray"。</dd> + <dt>{{jsxref("TypedArray.prototype", "Uint8ClampedArray.prototype")}}</dt> + <dd>原型是 <em>TypedArray</em> （类型化数组）对象。</dd> +</dl> + +<h2 id="方法">方法</h2> + +<dl> + <dt>{{jsxref("TypedArray.from", "Uint8ClampedArray.from()")}}</dt> + <dd>从一个类数组或可枚举对象创建一个新的 <code>Uint8ClampedArray</code>。参见 {{jsxref("Array.from()")}}。</dd> + <dt>{{jsxref("TypedArray.of", "Uint8ClampedArray.of()")}}</dt> + <dd>通过一个可选数量参数来创建一个新的 <code>Uint8ClampedArray</code>。参见 {{jsxref("Array.of()")}}。</dd> +</dl> + +<h2 id="Uint8ClampedArray_原型">Uint8ClampedArray 原型</h2> + +<p>所有的 <code>Uint8ClampedArray</code> 对象继承自 {{jsxref("TypedArray.prototype", "%TypedArray%.prototype")}}。</p> + +<h3 id="属性_2">属性</h3> + +<dl> + <dt><code>Uint8ClampedArray.prototype.constructor</code></dt> + <dd>返回创建一个实例原型的函数。这是 <code>Uint8ClampedArray</code> 默认的构造函数。</dd> + <dt>{{jsxref("TypedArray.prototype.buffer", "Uint8ClampedArray.prototype.buffer")}} {{readonlyInline}}</dt> + <dd>返回由 <code>Uint8ClampedArray</code> 引用的 {{jsxref("ArrayBuffer")}} 。在创建时所固定下来，因此<strong>只能读取</strong>。</dd> + <dt>{{jsxref("TypedArray.prototype.byteLength", "Uint8ClampedArray.prototype.byteLength")}} {{readonlyInline}}</dt> + <dd>返回从 {{jsxref("ArrayBuffer")}} 开始的 <code>Uint8ClampedArray</code> 的（字节的）长度。在创建时所固定下来，因此<strong>只能读取</strong>。</dd> + <dt>{{jsxref("TypedArray.prototype.byteOffset", "Uint8ClampedArray.prototype.byteOffset")}} {{readonlyInline}}</dt> + <dd>返回从 {{jsxref("ArrayBuffer")}} 开始的 <code>Uint8ClampedArray</code> 的（字节的）偏移。在创建时所固定下来，因此<strong>只能读取</strong>。</dd> + <dt>{{jsxref("TypedArray.prototype.length", "Uint8ClampedArray.prototype.length")}} {{readonlyInline}}</dt> + <dd>返回 <code>UintClamped8Array</code> 具有的元素数量。在创建时所固定下来，因此<strong>只能读取</strong>。</dd> +</dl> + +<h3 id="方法_2">方法</h3> + +<dl> + <dt>{{jsxref("TypedArray.copyWithin", "Uint8ClampedArray.prototype.copyWithin()")}}</dt> + <dd>复制数组内一段数组元素的序列。参见 {{jsxref("Array.prototype.copyWithin()")}}。</dd> + <dt>{{jsxref("TypedArray.entries", "Uint8ClampedArray.prototype.entries()")}}</dt> + <dd>返回一个新的包含数组中每个索引对应的键/值对的数组迭代器对象。参见 {{jsxref("Array.prototype.entries()")}}。</dd> + <dt>{{jsxref("TypedArray.every", "Uint8ClampedArray.prototype.every()")}}</dt> + <dd>测试数组里的所有元素是否通过所提供的函数的测试。参见 {{jsxref("Array.prototype.every()")}}。</dd> + <dt>{{jsxref("TypedArray.fill", "Uint8ClampedArray.prototype.fill()")}}</dt> + <dd>用一个固定值填充一个数组内的从起始索引到结束索引的全部元素。参见 {{jsxref("Array.prototype.fill()")}}。</dd> + <dt>{{jsxref("TypedArray.filter", "Uint8ClampedArray.prototype.filter()")}}</dt> + <dd>由该数组中所有经所提供的筛选函数返回为 true 的元素创建一个新数组。参见 {{jsxref("Array.prototype.filter()")}}。</dd> + <dt>{{jsxref("TypedArray.find", "Uint8ClampedArray.prototype.find()")}}</dt> + <dd>如果数组里的一个元素符合所提供的测试函数则返回找到的这个值，如果没有找到则返回 <code>undefined</code>。参见 {{jsxref("Array.prototype.find()")}}。</dd> + <dt>{{jsxref("TypedArray.findIndex", "Uint8ClampedArray.prototype.findIndex()")}}</dt> + <dd>如果数组里的一个元素符合所提供的测试函数则返回找到的索引，如果没有找到则返回 -1。参见 {{jsxref("Array.prototype.findIndex()")}}。</dd> + <dt>{{jsxref("TypedArray.forEach", "Uint8ClampedArray.prototype.forEach()")}}</dt> + <dd>对数组内的每个元素调用一个函数。参见 {{jsxref("Array.prototype.forEach()")}}。</dd> + <dt>{{jsxref("TypedArray.includes", "Uint8ClampedArray.prototype.includes()")}} {{experimental_inline}}</dt> + <dd>确定一个类型化数组是否包含一个特定的元素，对应地返回 <code>true</code> 或 <code>false</code>。参见 {{jsxref("Array.prototype.includes()")}}。</dd> + <dt>{{jsxref("TypedArray.indexOf", "Uint8ClampedArray.prototype.indexOf()")}}</dt> + <dd>Returns the first (least) index of an element within the array equal to the specified value, or -1 if none is found. See also {{jsxref("Array.prototype.indexOf()")}}.</dd> + <dt>{{jsxref("TypedArray.join", "Uint8ClampedArray.prototype.join()")}}</dt> + <dd>Joins all elements of an array into a string. See also {{jsxref("Array.prototype.join()")}}.</dd> + <dt>{{jsxref("TypedArray.keys", "Uint8ClampedArray.prototype.keys()")}}</dt> + <dd>Returns a new <code>Array Iterator</code> that contains the keys for each index in the array. See also {{jsxref("Array.prototype.keys()")}}.</dd> + <dt>{{jsxref("TypedArray.lastIndexOf", "Uint8ClampedArray.prototype.lastIndexOf()")}}</dt> + <dd>Returns the last (greatest) index of an element within the array equal to the specified value, or -1 if none is found. See also {{jsxref("Array.prototype.lastIndexOf()")}}.</dd> + <dt>{{jsxref("TypedArray.map", "Uint8ClampedArray.prototype.map()")}}</dt> + <dd>Creates a new array with the results of calling a provided function on every element in this array. See also {{jsxref("Array.prototype.map()")}}.</dd> + <dt>{{jsxref("TypedArray.move", "Uint8ClampedArray.prototype.move()")}} {{non-standard_inline}} {{unimplemented_inline}}</dt> + <dd>Former non-standard version of {{jsxref("TypedArray.copyWithin", "Uint8ClampedArray.prototype.copyWithin()")}}.</dd> + <dt>{{jsxref("TypedArray.reduce", "Uint8ClampedArray.prototype.reduce()")}}</dt> + <dd>Apply a function against an accumulator and each value of the array (from left-to-right) as to reduce it to a single value. See also {{jsxref("Array.prototype.reduce()")}}.</dd> + <dt>{{jsxref("TypedArray.reduceRight", "Uint8ClampedArray.prototype.reduceRight()")}}</dt> + <dd>Apply a function against an accumulator and each value of the array (from right-to-left) as to reduce it to a single value. See also {{jsxref("Array.prototype.reduceRight()")}}.</dd> + <dt>{{jsxref("TypedArray.reverse", "Uint8ClampedArray.prototype.reverse()")}}</dt> + <dd>Reverses the order of the elements of an array — the first becomes the last, and the last becomes the first. See also {{jsxref("Array.prototype.reverse()")}}.</dd> + <dt>{{jsxref("TypedArray.set", "Uint8ClampedArray.prototype.set()")}}</dt> + <dd>Stores multiple values in the typed array, reading input values from a specified array.</dd> + <dt>{{jsxref("TypedArray.slice", "Uint8ClampedArray.prototype.slice()")}}</dt> + <dd>Extracts a section of an array and returns a new array. See also {{jsxref("Array.prototype.slice()")}}.</dd> + <dt>{{jsxref("TypedArray.some", "Uint8ClampedArray.prototype.some()")}}</dt> + <dd>Returns true if at least one element in this array satisfies the provided testing function. See also {{jsxref("Array.prototype.some()")}}.</dd> + <dt>{{jsxref("TypedArray.sort", "Uint8ClampedArray.prototype.sort()")}}</dt> + <dd>Sorts the elements of an array in place and returns the array. See also {{jsxref("Array.prototype.sort()")}}.</dd> + <dt>{{jsxref("TypedArray.subarray", "Uint8ClampedArray.prototype.subarray()")}}</dt> + <dd>Returns a new <code>Uint8ClampedArray</code> from the given start and end element index.</dd> + <dt>{{jsxref("TypedArray.values", "Uint8ClampedArray.prototype.values()")}}</dt> + <dd>Returns a new <code>Array Iterator</code> object that contains the values for each index in the array. See also {{jsxref("Array.prototype.values()")}}.</dd> + <dt>{{jsxref("TypedArray.toLocaleString", "Uint8ClampedArray.prototype.toLocaleString()")}}</dt> + <dd>Returns a localized string representing the array and its elements. See also {{jsxref("Array.prototype.toLocaleString()")}}.</dd> + <dt>{{jsxref("TypedArray.toString", "Uint8ClampedArray.prototype.toString()")}}</dt> + <dd>Returns a string representing the array and its elements. See also {{jsxref("Array.prototype.toString()")}}.</dd> + <dt>{{jsxref("TypedArray.@@iterator", "Uint8ClampedArray.prototype[@@iterator]()")}}</dt> + <dd>Returns a new <code>Array Iterator</code> object that contains the values for each index in the array.</dd> +</dl> + +<h2 id="实例">实例</h2> + +<p>创建一个 <code>Uint8ClampedArray</code> 的不同方式：</p> + +<pre class="brush: js notranslate">// From a length +var uintc8 = new Uint8ClampedArray(2); +uintc8[0] = 42; +uintc8[1] = 1337; +console.log(uintc8[0]); // 42 +console.log(uintc8[1]); // 255 (clamped) +console.log(uintc8.length); // 2 +console.log(uintc8.BYTES_PER_ELEMENT); // 1 + +// From an array +var arr = new Uint8ClampedArray([21,31]); +console.log(arr[1]); // 31 + +// From another TypedArray +var x = new Uint8ClampedArray([21, 31]); +var y = new Uint8ClampedArray(x); +console.log(y[0]); // 21 + +// From an ArrayBuffer +var buffer = new ArrayBuffer(8); +var z = new Uint8ClampedArray(buffer, 1, 4); + +// From an iterable +var iterable = function*(){ yield* [1,2,3]; }(); +var uintc8 = new Uint8ClampedArray(iterable); +// Uint8ClampedArray[1, 2, 3] +</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>{{SpecName('Typed Array')}}</td> + <td>{{Spec2('Typed Array')}}</td> + <td>已由 ECMAScript 2015 替代。</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#table-49', 'TypedArray constructors')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>最初定义在一份 ECMA 标准中。规定 <code>new</code> 是必需的。</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#table-49', 'TypedArray constructors')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{CompatibilityTable}}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>特性</th> + <th>Chrome</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>基础支持</td> + <td>7.0</td> + <td>{{ CompatGeckoDesktop(2) }}</td> + <td>11 (as of <a href="https://support.microsoft.com/en-us/kb/2929437">KB2929437</a>)</td> + <td>11.6</td> + <td>5.1</td> + </tr> + <tr> + <td>需要使用 <code>new</code></td> + <td>{{CompatUnknown}}</td> + <td>{{ CompatGeckoDesktop(44) }}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + </tr> + <tr> + <td>构造函数中可枚举</td> + <td>{{CompatUnknown}}</td> + <td>{{ CompatGeckoDesktop(52) }}</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>特性</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>基础支持</td> + <td>4.0</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{ CompatGeckoMobile(2) }}</td> + <td>{{CompatVersionUnknown}}</td> + <td>11.6</td> + <td>4.2</td> + </tr> + <tr> + <td>需要使用 <code>new</code></td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{ CompatGeckoMobile(44) }}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + </tr> + <tr> + <td>构造函数中可枚举</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{ CompatGeckoMobile(52) }}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="兼容性注意事项">兼容性注意事项</h2> + +<p>从 ECMAScript 2015 开始， <code>Uint8ClampedArray</code> 构造函数需要用一个 {{jsxref("Operators/new", "new")}} 操作符来构建。从现在开始，不使用 <code>new</code> 来调用一个 <code>Uint8ClampedArray</code> 构造函数将会抛出一个 {{jsxref("TypeError")}}。</p> + +<pre class="brush: js example-bad notranslate">var dv = Uint8ClampedArray([1, 2, 3]); +// TypeError: calling a builtin Uint8ClampedArray constructor +// without new is forbidden</pre> + +<pre class="brush: js example-good notranslate">var dv = new Uint8ClampedArray([1, 2, 3]);</pre> + +<h2 id="参见">参见</h2> + +<ul> + <li><a href="/en-US/docs/Web/JavaScript/Typed_arrays">JavaScript typed arrays</a></li> + <li>{{jsxref("ArrayBuffer")}}</li> + <li>{{jsxref("DataView")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/undefined/index.html b/files/zh-cn/web/javascript/reference/global_objects/undefined/index.html new file mode 100644 index 0000000000..71a33f157d --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/undefined/index.html @@ -0,0 +1,138 @@ +--- +title: undefined +slug: Web/JavaScript/Reference/Global_Objects/undefined +translation_of: Web/JavaScript/Reference/Global_Objects/undefined +--- +<div> +<div> +<div>{{jsSidebar("Objects")}}</div> + +<div>全局属性<code><strong>undefined</strong></code>表示原始值<code>{{Glossary("Undefined", "undefined")}}。</code>它是一个JavaScript的 {{Glossary("Primitive", "原始数据类型")}} 。</div> + +<div></div> + +<div>{{js_property_attributes(0,0,0)}}</div> + +<div></div> + +<div> +<div>{{EmbedInteractiveExample("pages/js/globalprops-undefined.html")}}</div> +</div> +</div> +</div> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code>undefined </code></pre> + +<h2 id="Description" name="Description">描述</h2> + +<p><code>undefined</code>是<em>全局对象</em>的一个属性。也就是说，它是全局作用域的一个变量。<code>undefined</code>的最初值就是原始数据类型<code>{{Glossary("Undefined", "undefined")}}</code>。</p> + +<p>在现代浏览器（JavaScript 1.8.5/Firefox 4+），自ECMAscript5标准以来undefined是一个不能被配置（non-configurable），不能被重写（non-writable）的属性。即便事实并非如此，也要避免去重写它。</p> + +<p>一个没有被赋值的变量的类型是undefined。如果方法或者是语句中<strong>操作的变量没有被赋值，则会返回undefined</strong>（对于这句话持疑惑态度，请查看英文原文来理解）。</p> + +<pre class="brush: js">function test(a){ + console.log(typeof a); // undefined + return a; +} + +test(); // 返回"undefined"</pre> + +<p>一个函数如果没有使用return语句指定{{jsxref("Statements/return", "返回")}}值，就会返回一个undefined值。</p> + +<div class="warning"> +<p>但是它有可能在非全局作用域中被当作{{Glossary("Identifier", "标识符")}}（变量名）来使用(因为undefined不是一个{{jsxref("Reserved_Words", "保留字")}}))，这样做是一个非常坏的主意，因为这样会使你的代码难以去维护和排错。</p> + +<pre class="brush: js">// 不要这样做！ + +// 打印 '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') + +</pre> +</div> + +<h2 id="示例">示例</h2> + +<h3 id="严格相等和undefined">严格相等和undefined</h3> + +<p>你可以使用undefined和严格相等或不相等操作符来决定一个变量是否拥有值。在下面的代码中，变量x是未定义的，if 语句的求值结果将是true</p> + +<pre class="brush: js">var x; + +if (x === undefined) { +// 执行这些语句 +} else { +// 这些语句不会被执行 +}</pre> + +<div class="note"> +<p>注意：这里是必须使用严格相等操作符（===）而不是标准相等操作符（==），因为 x == undefined 会检查x是不是null，但是严格相等不会检查（有点饶人，其实 === 会严格判断双方的类型、值等是否相等）。null不等同于undefined。移步{{jsxref("Operators/Comparison_Operators", "比较操作符")}}查看详情。</p> +</div> + +<h3 id="Typeof_操作符和undefined">Typeof 操作符和undefined</h3> + +<p>或者，可以使用{{jsxref("Operators/typeof", "typeof")}}：</p> + +<pre class="brush: js">var x; +if(typeof x === 'undefined') { + // 执行这些语句 +}</pre> + +<p>使用 {{jsxref("Operators/typeof", "typeof")}}的原因是它不会在一个变量没有被声明的时候抛出一个错误。</p> + +<pre class="brush: js">// 这里没有声明y +if(typeof y === 'undefined') { // 没有错误，执行结果为true + console.log("y is " + typeof y ) // y is undefined +} + +if(y === undefined) { // ReferenceError: y is not defined + +}</pre> + +<p>但是，技术方面看来这样的使用方法应该被避免。JavaScript是一个静态作用域语言，所以，一个变量是否被声明可以通过看它是否在一个封闭的上下文中被声明。唯一的例外是全局作用域，但是全局作用域是被绑定在全局对象上的，所以要检查一个变量是否在全局上下文中存在可以通过检查全局对象上是否存在这个属性（比如使用{{jsxref("Operators/in", "in")}}操作符）。</p> + +<pre class="brush: js line-numbers language-js"><code class="language-js"><span class="keyword token">if</span> <span class="punctuation token">(</span><span class="string token">'x'</span> <span class="keyword token">in</span> window<span class="punctuation token">)</span> <span class="punctuation token">{</span> + <span class="comment token">// 只有x被全局性的定义 才会这行这些语句</span> +<span class="punctuation token">}</span></code></pre> + +<h3 id="Void操作符和undefined">Void操作符和undefined</h3> + +<p>{{jsxref("Operators/void", "void")}} 操作符是第三种可以替代的方法。</p> + +<pre class="brush: js">var x; +if(x === void 0) { + // 执行这些语句 +} + +// 没有声明y +if(y === void 0) { + // 抛出一个RenferenceError错误(与`typeof`相比) +} +</pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Specification</th> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-undefined', 'undefined')}}</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{Compat("javascript.builtins.undefined")}}</p> diff --git a/files/zh-cn/web/javascript/reference/global_objects/unescape/index.html b/files/zh-cn/web/javascript/reference/global_objects/unescape/index.html new file mode 100644 index 0000000000..b85895a7cd --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/unescape/index.html @@ -0,0 +1,84 @@ +--- +title: unescape() +slug: Web/JavaScript/Reference/Global_Objects/unescape +tags: + - JavaScript +translation_of: Web/JavaScript/Reference/Global_Objects/unescape +--- +<div>{{jsSidebar("Objects")}}</div> + +<p><font face="Open Sans, Arial, sans-serif">已废弃的</font><code><strong>unescape()</strong></code> 方法计算生成一个新的字符串，其中的十六进制转义序列将被其表示的字符替换。上述的转义序列就像{{jsxref("escape")}}里介绍的一样。因为 <code>unescape</code> 已经废弃，建议使用 {{jsxref("decodeURI")}}或者{{jsxref("decodeURIComponent")}} 替代本方法。</p> + +<div class="note"><strong>注意：</strong>不要使用<code>unescape</code>去解码URLS，使用<code>decodeURI</code>替代。</div> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code>unescape(str)</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>str</code></dt> + <dd>被编码过的字符串。</dd> + <dt> + <h3 id="返回值">返回值</h3> + </dt> + <dd>一个未被转义的新字符串。</dd> +</dl> + +<h2 id="描述">描述</h2> + +<p><code>unescape</code>函数是<em>全局对象</em>的一个属性。</p> + +<h2 id="示例">示例</h2> + +<pre class="brush: js">unescape('abc123'); // "abc123" +unescape('%E4%F6%FC'); // "äöü" +unescape('%u0107'); // "ć" +</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('ES1', '#sec-15.1.2.5', 'unescape')}}</td> + <td>{{Spec2('ES1')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-B.2.2', 'unescape')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td>Defined in the (informative) Compatibility Annex B</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-unescape-string', 'unescape')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Defined in the (normative) Annex B for Additional ECMAScript Features for Web Browsers</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-unescape-string', 'unescape')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td>Defined in the (normative) Annex B for Additional ECMAScript Features for Web Browsers</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容">浏览器兼容</h2> + +<div class="hidden">The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</div> + +<p>{{Compat("javascript.builtins.unescape")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("decodeURI")}}</li> + <li>{{jsxref("decodeURIComponent")}}</li> + <li>{{jsxref("escape")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/uneval/index.html b/files/zh-cn/web/javascript/reference/global_objects/uneval/index.html new file mode 100644 index 0000000000..38d7959076 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/uneval/index.html @@ -0,0 +1,68 @@ +--- +title: uneval() +slug: Web/JavaScript/Reference/Global_Objects/uneval +tags: + - JavaScript +translation_of: Web/JavaScript/Reference/Global_Objects/uneval +--- +<div>{{jsSidebar("Objects")}}{{Non-standard_header}}</div> + +<p><code><strong>uneval()</strong></code> 函数创建一个代表对象的源代码的字符串。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">uneval(<var>object</var>)</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>object</code></dt> + <dd>JavaScript 表达式或者语句</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<dl> + <dd>表示给定对象的源代码的字符串</dd> +</dl> + +<div class="note"><strong>注意：</strong>无法通过此方法获取对象的 JSON 形式。</div> + +<h2 id="描述">描述</h2> + +<p><code>uneval()</code> 是一个顶级函数并且不与任何对象关联</p> + +<h2 id="实例">实例</h2> + +<pre class="brush:js">var a = 1; +uneval(a); // returns a String containing 1 + +var b = "1"; +uneval(b) // returns a String containing "1" + +uneval(function foo(){}); // returns "(function foo(){})" + + +var a = uneval(function foo(){return 'hi'}); +var foo = eval(a); +foo(); // returns "hi" +</pre> + +<h2 id="规范">规范</h2> + +<p>不属于任何规范的一部分。</p> + +<h2 id="浏览器兼容">浏览器兼容</h2> + +<div class="hidden">The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</div> + +<p>{{Compat("javascript.builtins.uneval")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Global_Objects/eval", "eval()")}}</li> + <li>{{jsxref("JSON.stringify")}}</li> + <li>{{jsxref("JSON.parse")}}</li> + <li>{{jsxref("Object.toSource")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/urierror/index.html b/files/zh-cn/web/javascript/reference/global_objects/urierror/index.html new file mode 100644 index 0000000000..980de3b3c6 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/urierror/index.html @@ -0,0 +1,136 @@ +--- +title: URIError +slug: Web/JavaScript/Reference/Global_Objects/URIError +tags: + - Error + - JavaScript + - URIError + - 对象 +translation_of: Web/JavaScript/Reference/Global_Objects/URIError +--- +<div>{{JSRef}}</div> + +<p>URIError 对象用来表示以一种错误的方式使用全局URI处理函数而产生的错误。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code>new URIError([<var>message</var>[, <var>fileName</var>[, <var>lineNumber</var>]]])</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>message</code></dt> + <dd>选填。易于理解的错误描述。</dd> + <dt><code>fileName</code> 【非标准内联】</dt> + <dd>选填。包含造成异常的代码的文件名称。</dd> + <dt><code>lineNumber</code> 【非标准内联】</dt> + <dd>选填。造成异常的代码行号。</dd> +</dl> + +<h2 id="描述">描述</h2> + +<p>当向全局 URI 处理函数传递一个不合法的URI时，URIError 错误会被抛出。</p> + +<h2 id="属性">属性</h2> + +<dl> + <dt>{{jsxref("URIError.prototype")}}</dt> + <dd>允许向一个 URIError 对象添加额外的属性。</dd> +</dl> + +<h2 id="方法">方法</h2> + +<p>虽然全局 URIError 对象没有任何自己的方法，但是它能通过原型链继承一些方法。</p> + +<h2 id="URIError_实例"><code>URIError 实例</code></h2> + +<h3 id="属性_2">属性</h3> + +<div>{{page('/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/URIError/prototype', '属性')}}</div> + +<h3 id="方法_2">方法</h3> + +<div>{{page('/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/URIError/prototype', '方法')}}</div> + +<h2 id="示例">示例</h2> + +<h3 id="捕获一个_URIError_实例">捕获一个 <code>URIError 实例</code></h3> + +<pre class="brush: js">try { + decodeURIComponent('%'); +} catch (e) { + console.log(e instanceof URIError); // true + console.log(e.message); // "malformed URI sequence" + console.log(e.name); // "URIError" + console.log(e.fileName); // "Scratchpad/1" + console.log(e.lineNumber); // 2 + console.log(e.columnNumber); // 2 + console.log(e.stack); // "@Scratchpad/2:2:3\n" +} +</pre> + +<h3 id="创建一个_URIError_实例">创建一个 <code>URIError 实例</code></h3> + +<pre class="brush: js">try { + throw new URIError('Hello', 'someFile.js', 10); +} catch (e) { + console.log(e instanceof URIError); // true + console.log(e.message); // "Hello" + console.log(e.name); // "URIError" + console.log(e.fileName); // "someFile.js" + console.log(e.lineNumber); // 10 + console.log(e.columnNumber); // 0 + console.log(e.stack); // "@Scratchpad/2:2:9\n" +} +</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>{{SpecName('ES3', '#sec-15.11.6.6', 'URIError')}}</td> + <td>{{Spec2('ES3')}}</td> + <td>初始定义</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.11.6.6', 'URIError')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-native-error-types-used-in-this-standard-urierror', 'URIError')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-native-error-types-used-in-this-standard-urierror', 'URIError')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容">浏览器兼容</h2> + +<div> +<div class="hidden">浏览器兼容性表由结构化数据生成。如果你想贡献这部分数据，请您通过<a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>向我们pull request。</div> + +<p>{{Compat("javascript.builtins.URIError")}}</p> +</div> + +<h2 id="参见">参见</h2> + +<ul> + <li>{{jsxref("Error")}}</li> + <li>{{jsxref("URIError.prototype")}}</li> + <li>{{jsxref("Global_Objects/decodeURI", "decodeURI()")}}</li> + <li>{{jsxref("Global_Objects/decodeURIComponent", "decodeURIComponent()")}}</li> + <li>{{jsxref("Global_Objects/encodeURI", "encodeURI()")}}</li> + <li>{{jsxref("Global_Objects/encodeURIComponent", "encodeURIComponent()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/urierror/prototype/index.html b/files/zh-cn/web/javascript/reference/global_objects/urierror/prototype/index.html new file mode 100644 index 0000000000..f011159690 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/urierror/prototype/index.html @@ -0,0 +1,82 @@ +--- +title: URIError.prototype +slug: Web/JavaScript/Reference/Global_Objects/URIError/prototype +translation_of: Web/JavaScript/Reference/Global_Objects/URIError +--- +<div>{{JSRef}}</div> + +<div><code><strong>URIError.prototype</strong></code> 属性表示 {{jsxref("URIError")}} 构造器的原型。</div> + +<h2 id="描述">描述</h2> + +<p>所有的 {{jsxref("URIError")}} 实例都继承自 <code>URIError.prototype</code>。 可以通过原型(prototype) 给所有的实例添加属性或者方法。</p> + +<h2 id="属性">属性</h2> + +<dl> + <dt><code>URIError.prototype.constructor</code></dt> + <dd>声明创建实例原型 (prototype) 的方法。</dd> + <dt>{{jsxref("Error.prototype.message", "URIError.prototype.message")}}</dt> + <dd>错误信息。虽然 ECMA-262 规范指出 {{jsxref("URIError")}} 应该提供其自己专属的 <code><strong>message</strong></code><strong> </strong>属性，但是在 <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Projects/SpiderMonkey">SpiderMonkey</a> 中，该属性继承自 {{jsxref("Error.prototype.message")}}</dd> + <dt>{{jsxref("Error.prototype.name", "URIError.prototype.name")}}</dt> + <dd>错误名称。继承自 {{jsxref("Error")}}。</dd> + <dt>{{jsxref("Error.prototype.fileName", "URIError.prototype.fileName")}}</dt> + <dd>产生该错误的代码所在文件的路径。 继承自 {{jsxref("Error")}}。</dd> + <dt>{{jsxref("Error.prototype.lineNumber", "URIError.prototype.lineNumber")}}</dt> + <dd>产生该错误的代码所在行的行号。继承自 {{jsxref("Error")}}。</dd> + <dt>{{jsxref("Error.prototype.columnNumber", "URIError.prototype.columnNumber")}}</dt> + <dd>产生该错误的代码所在列的列号。 继承自 {{jsxref("Error")}}。</dd> + <dt>{{jsxref("Error.prototype.stack", "URIError.prototype.stack")}}</dt> + <dd>堆栈记录。继承自 {{jsxref("Error")}}。</dd> +</dl> + +<h2 id="方法">方法</h2> + +<p>虽然 {{jsxref("URIError")}} 的原型对象自身不包含任何方法，但是 {{jsxref("URIError")}} 的实例通过原型链(prototype chain)继承了一些方法。</p> + +<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('ES3', '#sec-15.11.7.6', 'NativeError.prototype')}}</td> + <td>{{Spec2('ES3')}}</td> + <td> 初始定义</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.11.7.6', 'NativeError.prototype')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> 定义为 <code><em>NativeError</em>.prototype</code>.</td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-nativeerror.prototype', 'NativeError.prototype')}}</td> + <td>{{Spec2('ES6')}}</td> + <td><font face="Open Sans, arial, x-locale-body, sans-serif"><span style="background-color: rgba(212, 221, 228, 0.15);"> 定义为</span></font><code><em>NativeError</em>.prototype</code>.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-nativeerror.prototype', 'NativeError.prototype')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td><font face="Open Sans, arial, x-locale-body, sans-serif"><span style="background-color: rgba(212, 221, 228, 0.25);"> 定义为</span></font><code><em>NativeError</em>.prototype</code>.</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div> + + +<p>{{Compat("javascript.builtins.URIError")}}</p> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Error.prototype")}}</li> + <li>{{jsxref("Function.prototype")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/weakmap/clear/index.html b/files/zh-cn/web/javascript/reference/global_objects/weakmap/clear/index.html new file mode 100644 index 0000000000..b2d51c64a1 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/weakmap/clear/index.html @@ -0,0 +1,104 @@ +--- +title: WeakMap.prototype.clear() +slug: Web/JavaScript/Reference/Global_Objects/WeakMap/clear +tags: + - JavaScript + - Method + - WeakMap + - clear() +translation_of: Web/JavaScript/Reference/Global_Objects/WeakMap/clear +--- +<div>{{JSRef}} {{obsolete_header}}</div> + +<p><code><strong>clear()</strong></code>用来从 <code>WeakMap对象中移除所有元素。</code>但不再是ECMAScript和它的实现部分。</p> + +<div class="warning"> +<p>Warning:</p> + +<p><img alt="WeakMap(no clear() any more).png" src="https://mdn.mozillademos.org/files/15608/WeakMap(no%20clear()%20any%20more).png" style="height: 490px; width: 735px;"></p> +</div> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><em>wm</em>.clear();</pre> + +<h2 id="示例">示例</h2> + +<h3 id="使用_clear_方法">使用 <code>clear</code> 方法</h3> + +<pre class="brush: js;highlight:[10] example-bad">var wm = new WeakMap(); +var obj = {}; + +wm.set(obj, "foo"); +wm.set(window, "bar"); + +wm.has(obj); // true +wm.has(window); // true + +wm.clear(); + +wm.has(obj) // false +wm.has(window) // false +</pre> + +<h2 id="规范">规范</h2> + +<p>当前版本或者起草中没有这个方法，这个方法在版本 28（2014 年 10 月 14） 之前是 ECMAScript 6 起草规范的一部分，但是在起草之后的版本中被移除了。它不在是最终标准的一部分了 。</p> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{CompatibilityTable}}</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>36</td> + <td>{{CompatNo}} [1]</td> + <td>11</td> + <td>23</td> + <td>7.1</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>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>{{CompatNo}}</td> + <td>{{CompatNo}} [1]</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>8</td> + </tr> + </tbody> +</table> +</div> + +<p>[1] The <code>clear()</code> 曾经在高于 20 版本低于 45 版本之间被支持。</p> + +<h2 id="相近">相近</h2> + +<ul> + <li>{{jsxref("WeakMap")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/weakmap/delete/index.html b/files/zh-cn/web/javascript/reference/global_objects/weakmap/delete/index.html new file mode 100644 index 0000000000..337563ecd3 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/weakmap/delete/index.html @@ -0,0 +1,108 @@ +--- +title: WeakMap.prototype.delete() +slug: Web/JavaScript/Reference/Global_Objects/WeakMap/delete +translation_of: Web/JavaScript/Reference/Global_Objects/WeakMap/delete +--- +<div>{{JSRef("Global_Objects", "WeakMap")}}</div> + +<h2 id="Summary" name="Summary">概述</h2> + +<p><code><strong>delete()</strong></code> 方法可以从一个 <code>WeakMap</code> 对象中删除指定的元素。</p> + +<h2 id="Syntax" name="Syntax">语法</h2> + +<pre class="syntaxbox"><code><em>wm</em>.delete(key);</code></pre> + +<h3 id="Parameters参数">Parameters参数</h3> + +<dl> + <dt>key</dt> + <dd>需要删除的元素的键</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>如果成功删除，返回 <code>true</code>，否则返回 <code>false</code>。</p> + +<h2 id="Examples" name="Examples">示例</h2> + +<pre class="brush: js;">var wm = new WeakMap(); +wm.set(window, "foo"); + +wm.delete(window); // 返回 true，表示删除成功。 + +wm.has(window); // 返回 false，因为 window 对象已经被删除了。 +</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('ES6', '#sec-weakmap.prototype.delete', 'WeakMap.prototype.delete')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{CompatibilityTable}}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Chrome</th> + <th>Firefox (SpiderMonkey)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{CompatVersionUnknown}}[1]</td> + <td>{{CompatGeckoDesktop("6.0")}}</td> + <td>11</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Android</th> + <th>Firefox Mobile (SpiderMonkey)</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{CompatNo}}</td> + <td>{{CompatGeckoMobile("6.0")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("WeakMap")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/weakmap/get/index.html b/files/zh-cn/web/javascript/reference/global_objects/weakmap/get/index.html new file mode 100644 index 0000000000..5dd596c3ff --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/weakmap/get/index.html @@ -0,0 +1,120 @@ +--- +title: WeakMap.prototype.get() +slug: Web/JavaScript/Reference/Global_Objects/WeakMap/get +translation_of: Web/JavaScript/Reference/Global_Objects/WeakMap/get +--- +<div>{{JSRef}}</div> + +<p><code><strong>get()</strong></code> 方法返回 <code>WeakMap</code> 指定的元素。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><em>wm</em>.get(key);</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt>key</dt> + <dd>必须。 想要从 <code>WeakMap </code>获取的元素的键。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<h3 id="返回与指定键相关联的值，如果_WeakMap_对象找不到这个键则返回_undefined。"><span style="font-size: 14px; line-height: 1.5;">返回与指定键相关联的值，如果 </span><code style="font-size: 14px; font-style: normal; font-weight: normal; line-height: 1.5;">WeakMap</code><span style="font-size: 14px; line-height: 1.5;"> 对象找不到这个键则返回 </span><code style="font-size: 14px; font-style: normal; font-weight: normal; line-height: 1.5;">undefined</code><span style="font-size: 14px; line-height: 1.5;">。</span></h3> + +<h2 id="例子">例子</h2> + +<h3 id="使用_get_方法">使用 <code>get </code>方法<code> </code></h3> + +<pre class="brush: js">var wm = new WeakMap(); +wm.set(window, "foo"); + +wm.get(window); // 返回 "foo". +wm.get("baz"); // 返回 undefined. +</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('ES6', '#sec-weakmap.prototype.get', 'WeakMap.prototype.get')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-weakmap.prototype.get', 'WeakMap.prototype.get')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{CompatibilityTable}}</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>36</td> + <td>{{CompatGeckoDesktop("6.0")}}</td> + <td>11</td> + <td>23</td> + <td>7.1</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>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>{{CompatNo}}</td> + <td>{{CompatGeckoMobile("6.0")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>8</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="Firefox_中的注意事项">Firefox 中的注意事项</h2> + +<ul> + <li>Prior to SpiderMonkey 38 {{geckoRelease(38)}}, this method threw a {{jsxref("TypeError")}} when the key parameter was not an object. However, the latest ES6 standard specifies to return <code>undefined</code> instead. Furthermore, <code>WeakMap.prototype.get</code> accepted an optional second argument as a fallback value, which is not part of the standard. Both non-standard behaviors are removed in version 38 and higher ({{bug(1127827)}}).</li> +</ul> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("WeakMap")}}</li> + <li>{{jsxref("WeakMap.set()")}}</li> + <li>{{jsxref("WeakMap.has()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/weakmap/has/index.html b/files/zh-cn/web/javascript/reference/global_objects/weakmap/has/index.html new file mode 100644 index 0000000000..2c411d429d --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/weakmap/has/index.html @@ -0,0 +1,123 @@ +--- +title: WeakMap.prototype.has() +slug: Web/JavaScript/Reference/Global_Objects/WeakMap/has +translation_of: Web/JavaScript/Reference/Global_Objects/WeakMap/has +--- +<div>{{JSRef}}</div> + +<p> <code><strong>has()</strong></code> 方法根据WeakMap对象的元素中是否存在key键返回一个boolean值。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><em>wm</em>.has(key);</code></pre> + +<h3 id="Parameters">Parameters</h3> + +<dl> + <dt>key</dt> + <dd>必须的。用来检测WeakMap对象中是否存在元素的键为key。</dd> +</dl> + +<h3 id="Return_value">Return value</h3> + +<dl> + <dt>Boolean</dt> + <dd>如果指定的key存在于某个元素中则返回true，否则返回flase。</dd> +</dl> + +<h2 id="例子">例子</h2> + +<h3 id="使用_has方法">使用 <code>has方法</code></h3> + +<pre class="brush: js">var wm = new WeakMap(); +wm.set(window, "foo"); + +wm.has(window); // returns true +wm.has("baz"); // returns false +</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('ES6', '#sec-weakmap.prototype.has', 'WeakMap.prototype.has')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-weakmap.prototype.has', 'WeakMap.prototype.has')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容">浏览器兼容</h2> + +<p>{{CompatibilityTable}}</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>36</td> + <td>{{CompatGeckoDesktop("6.0")}}</td> + <td>11</td> + <td>23</td> + <td>7.1</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>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>{{CompatNo}}</td> + <td>{{CompatGeckoMobile("6.0")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>8</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="Firefox-特有说明">Firefox-特有说明</h2> + +<ul> + <li>直到SpiderMonkey 38 {{geckoRelease(38)}}, 这个方法在key参数不是一个对象时会抛出 {{jsxref("TypeError")}}。它已经从版本38后按照最新版本的ES6标准修复 ({{bug(1127827)}}).</li> +</ul> + +<h2 id="See_also">See also</h2> + +<ul> + <li>{{jsxref("WeakMap")}}</li> + <li>{{jsxref("WeakMap.prototype.set()")}}</li> + <li>{{jsxref("WeakMap.prototype.get()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/weakmap/index.html b/files/zh-cn/web/javascript/reference/global_objects/weakmap/index.html new file mode 100644 index 0000000000..936763d12f --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/weakmap/index.html @@ -0,0 +1,159 @@ +--- +title: WeakMap +slug: Web/JavaScript/Reference/Global_Objects/WeakMap +tags: + - ECMAScript 2015 + - JavaScript + - WeakMap +translation_of: Web/JavaScript/Reference/Global_Objects/WeakMap +--- +<div>{{JSRef}}</div> + +<p><strong><code>WeakMap</code></strong> 对象是一组键/值对的集合，其中的键是弱引用的。其键必须是对象，而值可以是任意的。</p> + +<p>你可以从这里了解更多关于<code>WeakMap</code>的内容:{{SectionOnPage("/zh-CN/docs/Web/JavaScript/Guide/Keyed_collections", "WeakMap对象")}}.</p> + +<h2 id="语法">语法</h2> + +<pre>new WeakMap([iterable])</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>iterable</code></dt> + <dd>Iterable 是一个数组（二元数组）或者其他可迭代的且其元素是键值对的对象。每个键值对会被加到新的 WeakMap 里。null 会被当做 undefined。</dd> +</dl> + +<h2 id="描述">描述</h2> + +<p>WeakMap 的 key 只能是 <code>Object</code> 类型。 {{Glossary("Primitive", "原始数据类型")}} 是不能作为 key 的（比如 {{jsxref("Symbol")}}）。</p> + +<h3 id="Why_WeakMap">Why <em>WeakMap</em>?</h3> + +<p>在 JavaScript 里，map API 可以通过使其四个 API 方法共用两个数组(一个存放键,一个存放值)来实现。给这种 map 设置值时会同时将键和值添加到这两个数组的末尾。从而使得键和值的索引在两个数组中相对应。当从该 map 取值的时候，需要遍历所有的键，然后使用索引从存储值的数组中检索出相应的值。</p> + +<p>但这样的实现会有两个很大的缺点，首先赋值和搜索操作都是 O(n) 的时间复杂度( n 是键值对的个数)，因为这两个操作都需要遍历全部整个数组来进行匹配。另外一个缺点是可能会导致内存泄漏，因为数组会一直引用着每个键和值。这种引用使得垃圾回收算法不能回收处理他们，即使没有其他任何引用存在了。</p> + +<p>相比之下，原生的 WeakMap 持有的是每个键对象的“弱引用”，这意味着在没有其他引用存在时垃圾回收能正确进行。原生 WeakMap 的结构是特殊且有效的，其用于映射的 key 只有在其没有被回收时才是有效的。</p> + +<p>正由于这样的弱引用，<code>WeakMap</code> 的 key 是不可枚举的 (没有方法能给出所有的 key)。如果key 是可枚举的话，其列表将会受垃圾回收机制的影响，从而得到不确定的结果。因此，如果你想要这种类型对象的 key 值的列表，你应该使用 {{jsxref("Map")}}。</p> + +<p>基本上，如果你要往对象上添加数据，又不想干扰垃圾回收机制，就可以使用 WeakMap。</p> + +<h2 id="属性">属性</h2> + +<dl> + <dt><code>WeakMap.length</code></dt> + <dd><code>length</code> 属性的值为 0。</dd> + <dt>{{jsxref("WeakMap.prototype")}}</dt> + <dd><code>WeakMap</code> 构造器的原型。 允许添加属性到所有的 WeakMap 对象。</dd> +</dl> + +<h2 id="WeakMap_实例"><code>WeakMap</code> 实例</h2> + +<p>所有 <code>WeakMap</code> 实例继承自 {{jsxref("WeakMap.prototype")}}.</p> + +<h3 id="属性_2">属性</h3> + +<p>{{page('zh-CN/Web/JavaScript/Reference/Global_Objects/WeakMap/prototype','属性')}}</p> + +<h3 id="方法">方法</h3> + +<p>{{page('zh-CN/Web/JavaScript/Reference/Global_Objects/WeakMap/prototype','方法')}}</p> + +<h2 id="示例">示例</h2> + +<h3 id="使用_WeakMap">使用 <code>WeakMap</code></h3> + +<pre class="brush: js">const wm1 = new WeakMap(), + wm2 = new WeakMap(), + wm3 = new WeakMap(); +const o1 = {}, + o2 = function(){}, + o3 = window; + +wm1.set(o1, 37); +wm1.set(o2, "azerty"); +wm2.set(o1, o2); // value可以是任意值,包括一个对象或一个函数 +wm2.set(o3, undefined); +wm2.set(wm1, wm2); // 键和值可以是任意对象,甚至另外一个WeakMap对象 + +wm1.get(o2); // "azerty" +wm2.get(o2); // undefined,wm2中没有o2这个键 +wm2.get(o3); // undefined,值就是undefined + +wm1.has(o2); // true +wm2.has(o2); // false +wm2.has(o3); // true (即使值是undefined) + +wm3.set(o1, 37); +wm3.get(o1); // 37 + +wm1.has(o1); // true +wm1.delete(o1); +wm1.has(o1); // false +</pre> + +<h3 id="实现一_个带有_.clear_方法的类_WeakMap_类">实现一 个带有 .clear() 方法的类 <code>WeakMap</code> 类</h3> + +<pre class="brush: js">class ClearableWeakMap { + constructor(init) { + this._wm = new WeakMap(init) + } + clear() { + this._wm = new WeakMap() + } + delete(k) { + return this._wm.delete(k) + } + get(k) { + return this._wm.get(k) + } + has(k) { + return this._wm.has(k) + } + set(k, v) { + this._wm.set(k, v) + return this + } +}</pre> + +<h2 id="Specifications" name="Specifications">规范</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ES6', '#sec-weakmap-objects', 'WeakMap')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-weakmap-objects', 'WeakMap')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p class="hidden">The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<div>{{Compat("javascript.builtins.WeakMap")}}</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li><a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=547941">WeakMap bug at Mozilla</a></li> + <li><a href="http://fitzgeraldnick.com/weblog/53/">Hiding Implementation Details with ECMAScript 6 WeakMaps</a></li> + <li>{{jsxref("Map")}}</li> + <li>{{jsxref("Set")}}</li> + <li>{{jsxref("WeakSet")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/weakmap/prototype/index.html b/files/zh-cn/web/javascript/reference/global_objects/weakmap/prototype/index.html new file mode 100644 index 0000000000..706b6d795c --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/weakmap/prototype/index.html @@ -0,0 +1,137 @@ +--- +title: WeakMap.prototype +slug: Web/JavaScript/Reference/Global_Objects/WeakMap/prototype +translation_of: Web/JavaScript/Reference/Global_Objects/WeakMap +--- +<div>{{JSRef}}</div> + +<p><code><strong>WeakMap</strong></code><strong><code>.prototype</code></strong>属性表现为 {{jsxref("WeakMap")}}的构造器。</p> + +<div>{{js_property_attributes(0,0,0)}}</div> + +<h2 id="描述">描述</h2> + +<p>{{jsxref("WeakMap")}} 实例从 {{jsxref("WeakMap.prototype")}}继承了所有属性。你可以在<code>WeakMap构造器中添加属性和方法，从而使得所有</code>实例中都有效。</p> + +<p><code>WeakMap.prototype</code> 本身只是一个普通的对象：</p> + +<pre class="brush: js">Object.prototype.toString.call(WeakMap.prototype); // "[object Object]"</pre> + +<h2 id="属性">属性</h2> + +<dl> + <dt><code>WeakMap.prototype.constructor</code></dt> + <dd>返回创建WeakMap实例的原型函数。 {{jsxref("WeakMap")}}函数是默认的。</dd> +</dl> + +<h2 id="方法">方法</h2> + +<dl> + <dt>{{jsxref("WeakMap.delete", "WeakMap.prototype.delete(key)")}}</dt> + <dd>移除key的关联对象。执行后 <code>WeakMap.prototype.has(key)返回</code><code>false。</code></dd> + <dt>{{jsxref("WeakMap.get", "WeakMap.prototype.get(key)")}}</dt> + <dd>返回<code>key关联对象</code>, 或者 <code>undefined</code>(没有key关联对象时)。</dd> + <dt>{{jsxref("WeakMap.has", "WeakMap.prototype.has(key)")}}</dt> + <dd>根据是否有key关联对象返回一个Boolean值。</dd> + <dt>{{jsxref("WeakMap.set", "WeakMap.prototype.set(key, value)")}}</dt> + <dd>在WeakMap中设置一组key关联对象，返回这个 <code>WeakMap</code>对象。</dd> + <dt><s class="obsoleteElement">{{jsxref("WeakMap.prototype.clear()")}} {{obsolete_inline}}</s></dt> + <dd><s class="obsoleteElement">从<code>WeakMap中移除所有的</code> key/value 。 注意，该方法已弃用,但可以通过创建一个空的WeakMap并替换原对象来实现 (参看 {{jsxref("WeakMap")}}的后半部分)</s></dd> +</dl> + +<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('ES6', '#sec-weakmap.prototype', 'WeakMap.prototype')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-weakmap.prototype', 'WeakMap.prototype')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容">浏览器兼容</h2> + +<p>{{CompatibilityTable}}</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>36</td> + <td>{{CompatGeckoDesktop("6.0")}}</td> + <td>11</td> + <td>23</td> + <td>7.1</td> + </tr> + <tr> + <td>Ordinary object</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatGeckoDesktop("40")}}</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>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatGeckoMobile("6.0")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>8</td> + </tr> + <tr> + <td>Ordinary object</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatGeckoMobile("40")}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="另请参阅">另请参阅</h2> + +<ul> + <li>{{jsxref("Map.prototype")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/weakmap/set/index.html b/files/zh-cn/web/javascript/reference/global_objects/weakmap/set/index.html new file mode 100644 index 0000000000..9643d66bfd --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/weakmap/set/index.html @@ -0,0 +1,89 @@ +--- +title: WeakMap.prototype.set() +slug: Web/JavaScript/Reference/Global_Objects/WeakMap/set +tags: + - JavaScript + - Method + - WeakMap +translation_of: Web/JavaScript/Reference/Global_Objects/WeakMap/set +--- +<div>{{JSRef}}</div> + +<p><code><strong>set()</strong></code> 方法根据指定的<code>key</code>和<code>value在</code> <code>WeakMap</code>对象中添加新/更新元素。</p> + +<div>{{EmbedInteractiveExample("pages/js/weakmap-prototype-set.html")}}</div> + + + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><em>wm</em>.set(key, value);</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt>key</dt> + <dd>必须的。必须是<code>对象</code>。是要在<code>WeakMap</code> 对象中添加元素的key部分。</dd> + <dt>value</dt> + <dd>必须的。任意的值。是要在<code>WeakMap</code> 对象中添加/元素的value部分。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>该<code>WeakMap</code>对象</p> + +<h2 id="例子">例子</h2> + +<h3 id="使用set方法"><code>使用set方法</code></h3> + +<pre class="brush: js">var wm = new WeakMap(); +var obj = {}; + +// Add new elements to the WeakMap +wm.set(obj, "foo").set(window, "bar"); // chainable + +// Update an element in the WeakMap +wm.set(obj, "baz"); +</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('ES6', '#sec-weakmap.prototype.set', 'WeakMap.prototype.set')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-weakmap.prototype.set', 'WeakMap.prototype.set')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容">浏览器兼容</h2> + + + +<p>{{Compat("javascript.builtins.WeakMap.set")}}</p> + +<h2 id="Firefox-特殊说明">Firefox-特殊说明</h2> + +<ul> + <li>直到Firefox 33 {{geckoRelease("33")}}, <code>WeakMap.prototype.set</code> returned <code>undefined</code> 而不支持联式。它已经修复 ({{bug(1031632)}}). 这样的实现也存在于 Chrome/v8 (<a href="https://code.google.com/p/v8/issues/detail?id=3410">issue</a>).</li> +</ul> + +<h2 id="See_also">See also</h2> + +<ul> + <li>{{jsxref("WeakMap")}}</li> + <li>{{jsxref("WeakMap.prototype.get()")}}</li> + <li>{{jsxref("WeakMap.prototype.has()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/weakref/deref/index.html b/files/zh-cn/web/javascript/reference/global_objects/weakref/deref/index.html new file mode 100644 index 0000000000..9d9fdbdba1 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/weakref/deref/index.html @@ -0,0 +1,69 @@ +--- +title: WeakRef.prototype.deref() +slug: Web/JavaScript/Reference/Global_Objects/WeakRef/deref +translation_of: Web/JavaScript/Reference/Global_Objects/WeakRef/deref +--- +<div>{{JSRef}}</div> + +<div></div> + +<div><code>deref</code>方法返回{{jsxref("WeakRef")}} 实例的目标对象，如果目标对象已被垃圾收集，则返回<code>undefined</code> 。</div> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox notranslate"><code><var>obj</var> = <var>ref</var>.deref();</code> +</pre> + +<h3 id="返回值">返回值</h3> + +<p>返回WeakRef的目标对象，如果该对象已被垃圾收集，则返回<code>undefined</code> 。</p> + +<h2 id="说明">说明</h2> + +<p>有关一些重要说明，请参阅{{jsxref("WeakRef")}}页面上的<a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/WeakRef#Notes_on_WeakRefs">Notes on WeakRefs</a> 。</p> + +<h2 id="例子">例子</h2> + +<h3 id="使用deref">使用deref</h3> + +<p>有关<a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/WeakRef#Examples">完整示例</a>，请参阅{{jsxref("WeakRef")}}页面的示例部分。</p> + +<pre class="brush: js notranslate">const tick = () => { + // Get the element from the weak reference, if it still exists + const element = this.ref.deref(); + if (element) { + element.textContent = ++this.count; + } else { + // The element doesn't exist anymore + console.log("The element is gone."); + this.stop(); + this.ref = null; + } +};</pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">规范</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('WeakRefs', '#sec-weak-ref.prototype.deref', 'WeakRef.prototype.deref()')}}</td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.WeakRef.deref")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("WeakRef")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/weakref/index.html b/files/zh-cn/web/javascript/reference/global_objects/weakref/index.html new file mode 100644 index 0000000000..91452cd75f --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/weakref/index.html @@ -0,0 +1,144 @@ +--- +title: WeakRef +slug: Web/JavaScript/Reference/Global_Objects/WeakRef +translation_of: Web/JavaScript/Reference/Global_Objects/WeakRef +--- +<div>{{JSRef}}</div> + +<div></div> + +<p>WeakRef对象允许您保留对另一个对象的弱引用，而不会阻止被弱引用对象被GC回收</p> + +<h2 id="描述">描述</h2> + +<p>WeakRef对象包含对对象的弱引用，这个弱引用被称为该WeakRef对象的target或者是referent。对对象的弱引用是指当该对象应该被GC回收时不会阻止GC的回收行为。而与此相反的，一个普通的引用（默认是强引用）会将与之对应的对象保存在内存中。只有当该对象没有任何的强引用时，JavaScript引擎GC才会销毁该对象并且回收该对象所占的内存空间。如果上述情况发生了，那么你就无法通过任何的弱引用来获取该对象。</p> + +<div class="note"> +<p><strong>Note:</strong> 在使用前请阅读<a href="#Avoid_where_possible">Avoid where possible</a>，对于WeakRef对象的使用要慎重考虑，<strong>能不使用就尽量不要使用</strong></p> +</div> + +<h2 id="构造函数">构造函数</h2> + +<dl> + <dt>{{jsxref("WeakRef/WeakRef", "WeakRef()")}}</dt> + <dd>创建一个WeakRef对象</dd> +</dl> + +<h2 id="实例方法">实例方法</h2> + +<dl> + <dt>{{jsxref("WeakRef.deref", "WeakRef.prototype.deref()")}}</dt> + <dd>返回当前实例的WeakRef对象所绑定的target对象，如果该target对象已被GC回收则返回<code>undefined</code></dd> +</dl> + +<h2 id="为什么尽量避免使用">为什么尽量避免使用</h2> + +<p>正确使用WeakRef对象需要仔细的考虑，最好尽量避免使用。避免依赖于规范没有保证的任何特定行为也是十分重要的。何时、如何以及是否发生垃圾回收取决于任何给定JavaScript引擎的实现。<strong>GC在一个JavaScript引擎中的行为有可能在另一个JavaScript引擎中的行为大相径庭，或者甚至在同一类引擎，不同版本中GC的行为都有可能有较大的差距</strong>。GC目前还是JavaScript引擎实现者不断改进和改进解决方案的一个难题。</p> + +<p>以下是WeakRef提案的作者在其解释文件（<a href="https://github.com/tc39/proposal-weakrefs/blob/master/README.md">explainer document</a>）中提出的一些具体观点</p> + +<blockquote> +<p><a href="https://en.wikipedia.org/wiki/Garbage_collection_(computer_science)">Garbage collectors</a> are complicated. If an application or library depends on GC cleaning up a WeakRef or calling a finalizer [cleanup callback] in a timely, predictable manner, it's likely to be disappointed: the cleanup may happen much later than expected, or not at all. Sources of variability include:</p> + +<ul> + <li>One object might be garbage-collected much sooner than another object, even if they become unreachable at the same time, e.g., due to generational collection.</li> + <li>Garbage collection work can be split up over time using incremental and concurrent techniques.</li> + <li>Various runtime heuristics can be used to balance memory usage, responsiveness.</li> + <li>The JavaScript engine may hold references to things which look like they are unreachable (e.g., in closures, or inline caches).</li> + <li>Different JavaScript engines may do these things differently, or the same engine may change its algorithms across versions.</li> + <li>Complex factors may lead to objects being held alive for unexpected amounts of time, such as use with certain APIs.</li> +</ul> +</blockquote> + +<h2 id="关于WeakRefs的说明">关于WeakRefs的说明</h2> + +<p>关于WeakRefs的一些说明</p> + +<ul> + <li>如果您的代码刚刚为目标对象创建了WeakRef，或者从WeakRef的deref方法获取了目标对象，在当前JavaScript <a href="https://tc39.es/ecma262/#job">job</a> (包括在脚本作业末尾运行的任何promise reaction作业) 结束之前，不会回收该目标对象。也就是说，您只能“看到”在事件循环的两次循环之间回收的对象。这主要是为了避免在代码中显示任何给定JavaScript引擎的GC行为 ------ 因为如果不这样的话，那么人们会根据这个行为来编写代码，而当GC的行为改变时，就会造成不可预知的后果。(GC是一个棘手的问题；JavaScript引擎实现者依然不断地改进和改进它的工作方式)</li> + <li>如果多个<code>WeakRef</code>s 有相同的目标，那么他们的target对象是一样的。对其中一个调用deref的结果将与对另一个调用deref的结果匹配（在同一个作业中），您不会从其中一个获取目标对象，而是从另一个获取未定义的对象。</li> + <li>如果一个对象是WeakRef的target,又是in a {{jsxref("FinalizationRegistry")}},那么该target就会在调用与注册表关联的任何清理回调之前或者同时被清理。如果清理回调调用对象的WeakRef上的deref，它将收到<code>undefined</code></li> + <li>你不能更改WeakRef的target，它将始终是第一次指定的target或者在回收该target时会定义</li> + <li>WeakRef可能永远不会从deref返回undefined，即使没有什么东西能很好地保存target，因为GC可能永远不会决定回收对象。</li> +</ul> + +<h2 id="例子">例子</h2> + +<h3 id="使用WeakRef对象">使用WeakRef对象</h3> + +<p>这个例子演示了在一个DOM元素中启动一个计数器，当这个元素不存在时停止:</p> + +<pre class="brush: js notranslate">class Counter { + constructor(element) { + // Remember a weak reference to the DOM element + this.ref = new WeakRef(element); + this.start(); + } + + start() { + if (this.timer) { + return; + } + + this.count = 0; + + const tick = () => { + // Get the element from the weak reference, if it still exists + const element = this.ref.deref(); + if (element) { + element.textContent = ++this.count; + } else { + // The element doesn't exist anymore + console.log("The element is gone."); + this.stop(); + this.ref = null; + } + }; + + tick(); + this.timer = setInterval(tick, 1000); + } + + stop() { + if (this.timer) { + clearInterval(this.timer); + this.timer = 0; + } + } +} + +const counter = new Counter(document.getElementById("counter")); +counter.start(); +setTimeout(() => { + document.getElementById("counter").remove(); +}, 5000); +</pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">规范</th> + </tr> + </thead> + <tbody> + <tr> + <td><a href="https://github.com/tc39/proposal-weakrefs">WeakRefs proposal</a></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + + + +<p>{{Compat("javascript.builtins.WeakRef")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("FinalizationRegistry")}}</li> + <li>{{jsxref("WeakSet")}}</li> + <li>{{jsxref("WeakMap")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/weakset/add/index.html b/files/zh-cn/web/javascript/reference/global_objects/weakset/add/index.html new file mode 100644 index 0000000000..d163451c4c --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/weakset/add/index.html @@ -0,0 +1,121 @@ +--- +title: WeakSet.prototype.add() +slug: Web/JavaScript/Reference/Global_Objects/WeakSet/add +tags: + - ECMAScript 2015 + - JavaScript + - WeakSet +translation_of: Web/JavaScript/Reference/Global_Objects/WeakSet/add +--- +<div>{{JSRef}}</div> + +<p><code><strong>add()</strong></code> 方法在 <code>WeakSet</code> 对象的最后一个元素后添加新的对象。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><em>ws</em>.add(value);</code> +</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt>value</dt> + <dd>必须。 将对象添加进 <code>WeakSet</code> 集合中。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p><code>WeakSet</code> 对象。</p> + +<h2 id="使用_add_方法">使用 <code>add</code> 方法</h2> + +<pre class="brush: js">var ws = new WeakSet(); + +ws.add(window); // 添加 window 对象进 WeakSet 中 + +ws.has(window); // true + +// Weakset 仅取得对象作为参数 +ws.add(1); +// 结果为 "TypeError: Invalid value used in weak set" 在 Chrome 浏览器中 +// 并且 "TypeError: 1 is not a non-null object" 在 Firefox 浏览器中</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-weakset.prototype.add', 'WeakSet.prototype.add')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-weakset.prototype.add', 'WeakSet.prototype.add')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{CompatibilityTable}}</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>36</td> + <td>{{CompatGeckoDesktop(34)}}</td> + <td>{{CompatNo}}</td> + <td>23</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>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>{{CompatNo}}</td> + <td>{{ CompatGeckoMobile(34) }}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("WeakSet")}}</li> + <li>{{jsxref("WeakSet.prototype.delete()")}}</li> + <li>{{jsxref("WeakSet.prototype.has()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/weakset/clear/index.html b/files/zh-cn/web/javascript/reference/global_objects/weakset/clear/index.html new file mode 100644 index 0000000000..7d1e17ee9d --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/weakset/clear/index.html @@ -0,0 +1,94 @@ +--- +title: WeakSet.prototype.clear() +slug: Web/JavaScript/Reference/Global_Objects/WeakSet/clear +tags: + - JavaScript + - Method + - WeakSet + - 废弃 +translation_of: Web/JavaScript/Reference/Global_Objects/WeakSet/clear +--- +<div>{{JSRef}} {{obsolete_header}}</div> + +<p><code><strong>clear()</strong></code> 方法用于删除 <code>WeakSet</code> 对象的所有元素，但是已经不是 ECMAScript 的一部分了。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><em>ws</em>.clear();</pre> + +<h2 id="示例">示例</h2> + +<h3 id="使用_clear方法">使用 <code>clear方法</code></h3> + +<pre class="brush: js example-bad">var ws = new WeakSet(); + +ws.add(window); +ws.has(window); // true + +ws.clear(); + +ws.has(window); // false +</pre> + +<h2 id="规范">规范</h2> + +<p>没有规范或草案。该方法原本计划包括在 ECMAScript 6，但是在草案 revision 28 (October 14, 2014) 被抛弃了。浏览器原先的实现不久后也被移除了，它从来不是标准的一分子。</p> + +<h2 id="浏览器支持">浏览器支持</h2> + +<p>{{CompatibilityTable}}</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>36</td> + <td>{{CompatNo}} [1]</td> + <td>{{CompatNo}}</td> + <td>23</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>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>{{CompatNo}}</td> + <td>{{CompatNo}} [1]</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<p>[1] Added to Firefox in version 34, but removed in version 46. See {{bug(1101817)}}.</p> + +<h2 id="相关">相关</h2> + +<ul> + <li>{{jsxref("WeakSet")}}</li> + <li>{{jsxref("WeakSet.prototype.delete()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/weakset/delete/index.html b/files/zh-cn/web/javascript/reference/global_objects/weakset/delete/index.html new file mode 100644 index 0000000000..82b35b0a7d --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/weakset/delete/index.html @@ -0,0 +1,117 @@ +--- +title: WeakSet.prototype.delete() +slug: Web/JavaScript/Reference/Global_Objects/WeakSet/delete +translation_of: Web/JavaScript/Reference/Global_Objects/WeakSet/delete +--- +<div>{{JSRef}}</div> + +<p><code><strong>delete()</strong></code> 方法从 <code>WeakSet 对象中</code>移除指定的元素。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><em>ws</em>.delete(value);</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt>value</dt> + <dd>必须。从 <code>WeakSet</code> 对象中移除的对象。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>如果在 <code>WeakSet</code> 对象中成功移除元素则返回 true。如果 key 没有在 WeakSet 中<font face="Consolas, Liberation Mono, Courier, monospace">找到或者 key 不是一个对象，则返回 false。</font></p> + +<h2 id="示例">示例</h2> + +<h3 id="使用_delete_方法">使用 <code>delete</code> 方法</h3> + +<pre class="brush: js">var ws = new WeakSet(); +var obj = {}; + +ws.add(window); + +ws.delete(obj); // 返回 false。因为找不到要删除的obj +ws.delete(window); // 返回 true。成功地移除了元素 + +ws.has(window); // 返回 false。因为 WeakSet 中已经不存在 window 对象 +</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('ES6', '#sec-weakset.prototype.delete', 'WeakSet.prototype.delete')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-weakset.prototype.delete', 'WeakSet.prototype.delete')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{CompatibilityTable}}</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>36</td> + <td>{{CompatGeckoDesktop(34)}}</td> + <td>{{CompatNo}}</td> + <td>23</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>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>{{CompatNo}}</td> + <td>{{ CompatGeckoMobile(34) }}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("WeakSet")}}</li> + <li>{{jsxref("WeakSet.prototype.clear()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/weakset/has/index.html b/files/zh-cn/web/javascript/reference/global_objects/weakset/has/index.html new file mode 100644 index 0000000000..7a06b243e3 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/weakset/has/index.html @@ -0,0 +1,118 @@ +--- +title: WeakSet.prototype.has() +slug: Web/JavaScript/Reference/Global_Objects/WeakSet/has +translation_of: Web/JavaScript/Reference/Global_Objects/WeakSet/has +--- +<div>{{JSRef}}</div> + +<p><code><strong>has()</strong></code> 方法根据 <code>WeakSet</code> 是否存在相应对象返回布尔值。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code><em>ws</em>.has(value);</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt>value</dt> + <dd>必须。 测试 <code>WeakSet 中是否存在该对象。</code></dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<dl> + <dt>Boolean</dt> + <dd>如果 <code>WeakSet</code> 对象中存在指定的元素，返回 true；否则返回 <code>false。</code></dd> +</dl> + +<h2 id="示例">示例</h2> + +<h3 id="使用_has_方法">使用 <code>has</code> 方法</h3> + +<pre class="brush: js">var ws = new WeakSet(); +var obj = {}; +ws.add(window); + +mySet.has(window); // 返回 true +mySet.has(obj); // 返回 false +</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('ES6', '#sec-weakset.prototype.has', 'WeakSet.prototype.has')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-weakset.prototype.has', 'WeakSet.prototype.has')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>{{CompatibilityTable}}</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>36</td> + <td>{{CompatGeckoDesktop(34)}}</td> + <td>{{CompatNo}}</td> + <td>23</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>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>{{CompatNo}}</td> + <td>{{ CompatGeckoMobile(34) }}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("WeakSet")}}</li> + <li>{{jsxref("WeakSet.prototype.add()")}}</li> + <li>{{jsxref("WeakSet.prototype.delete()")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/weakset/index.html b/files/zh-cn/web/javascript/reference/global_objects/weakset/index.html new file mode 100644 index 0000000000..389a55f5e1 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/weakset/index.html @@ -0,0 +1,148 @@ +--- +title: WeakSet +slug: Web/JavaScript/Reference/Global_Objects/WeakSet +tags: + - WeakSet +translation_of: Web/JavaScript/Reference/Global_Objects/WeakSet +--- +<div>{{JSRef}}</div> + +<div></div> + +<p><strong><code>WeakSet</code></strong> 对象允许你将<em>弱保持对象</em>存储在一个集合中。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"> new WeakSet([iterable]);</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt>iterable</dt> + <dd>如果传入一个<a href="/zh-CN/docs/Web/JavaScript/Reference/Statements/for...of">可迭代对象</a>作为参数, 则该对象的所有迭代值都会被自动添加进生成的 <code>WeakSet</code> 对象中。null 被认为是 undefined。</dd> +</dl> + +<h2 id="示例">示例</h2> + +<h3 id="使用_WeakSet对象">使用 <code>WeakSet</code>对象</h3> + +<pre class="brush: js">var ws = new WeakSet(); +var foo = {}; +var bar = {}; + +ws.add(foo); +ws.add(bar); + +ws.has(foo); // true +ws.has(bar); // true + +ws.delete(foo); // 从set中删除 foo 对象 +ws.has(foo); // false, foo 对象已经被删除了 +ws.has(bar); // true, bar 依然存在</pre> + +<p>注意， <code>foo !== bar</code>。 尽管它们是相似的对象，但是它们不是<em><strong>同一个对象。</strong></em>因此，它们都可以被加入到set中。</p> + +<h2 id="描述">描述</h2> + +<p><code>WeakSet</code> 对象是一些对象值的集合, 并且其中的每个对象值都只能出现一次。在<code>WeakSet</code>的集合中是唯一的</p> + +<p>它和 {{jsxref("Set")}} 对象的区别有两点:</p> + +<ul> + <li>与<code>Set</code>相比，<code>WeakSet</code> 只能是<strong>对象的集合</strong>，而不能是任何类型的任意值。</li> + <li><code>WeakSet</code>持弱引用：集合中对象的引用为弱引用。 如果没有其他的对<code>WeakSet</code>中对象的引用，那么这些对象会被当成垃圾回收掉。 这也意味着WeakSet中没有存储当前对象的列表。 正因为这样，<code>WeakSet</code> 是不可枚举的。</li> +</ul> + +<h3 id="检测循环引用">检测循环引用</h3> + +<p>递归调用自身的函数需要一种通过跟踪哪些对象已被处理，来应对循环数据结构的方法。</p> + +<p>为此，WeakSet非常适合处理这种情况：</p> + +<pre class="brush: js">// 对 传入的subject对象 内部存储的所有内容执行回调 +function execRecursively(fn, subject, _refs = null){ + if(!_refs) + _refs = new WeakSet(); + + // 避免无限递归 + if(_refs.has(subject)) + return; + + fn(subject); + if("object" === typeof subject){ + _refs.add(subject); + for(let key in subject) + execRecursively(fn, subject[key], _refs); + } +} + +const foo = { + foo: "Foo", + bar: { + bar: "Bar" + } +}; + +foo.bar.baz = foo; // 循环引用! +execRecursively(obj => console.log(obj), foo);</pre> + +<p>在此，在第一次运行时创建<code>WeakSet</code>，并将其与每个后续函数调用一起传递（使用内部参数_refs）。 对象的数量或它们的遍历顺序无关紧要，因此，WeakSet比{{jsxref("Set")}}更适合（和执行）跟踪对象引用，尤其是在涉及大量对象时。</p> + +<h2 id="Properties" name="Properties">属性</h2> + +<dl> + <dt><code>WeakSet.length</code></dt> + <dd><code>length</code> 属性的值为 0.</dd> + <dt>{{jsxref("WeakSet.prototype")}}</dt> + <dd><span>表示<code>WeakSet</code>构造函数的原型。 允许向所有<code>WeakSet</code>对象添加属性。</span></dd> +</dl> + +<h2 id="Boolean_instances" name="Boolean_instances"><code>WeakSet</code> 实例</h2> + +<p>所有 <code>WeakSet</code> 实例都继承自 {{jsxref("WeakSet.prototype")}}.</p> + +<h3 id="属性">属性</h3> + +<p>{{page('zh-CN/Web/JavaScript/Reference/Global_Objects/WeakSet/prototype','Properties')}}</p> + +<h3 id="方法">方法</h3> + +<p>{{page('zh-CN/Web/JavaScript/Reference/Global_Objects/WeakSet/prototype','Methods')}}</p> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <tbody> + <tr> + <td>规范链接</td> + <td>规范状态</td> + <td>备注</td> + </tr> + <tr> + <td>{{SpecName('ES2015', '#sec-weakset-objects', 'WeakSet')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>Initial definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-weakset-objects', 'WeakSet')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<div class="hidden"> +<p>The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> +</div> + +<p>{{Compat("javascript.builtins.WeakSet")}}</p> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li>{{jsxref("Map")}}</li> + <li>{{jsxref("Set")}}</li> + <li>{{jsxref("WeakMap")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/weakset/prototype/index.html b/files/zh-cn/web/javascript/reference/global_objects/weakset/prototype/index.html new file mode 100644 index 0000000000..3f323d5fe2 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/weakset/prototype/index.html @@ -0,0 +1,114 @@ +--- +title: WeakSet.prototype +slug: Web/JavaScript/Reference/Global_Objects/WeakSet/prototype +translation_of: Web/JavaScript/Reference/Global_Objects/WeakSet +--- +<div>{{JSRef("Global_Objects", "WeakSet")}}</div> + +<h2 id="Summary" name="Summary">Summary</h2> + +<p>The <code><strong>WeakSet</strong></code><strong><code>.prototype</code></strong> property represents the prototype for the {{jsxref("WeakSet")}} constructor.</p> + +<div>{{js_property_attributes(0,0,0)}}</div> + +<h2 id="Description" name="Description">Description</h2> + +<p>{{jsxref("WeakSet")}} instances inherit from {{jsxref("WeakSet.prototype")}}. You can use the constructor's prototype object to add properties or methods to all <code>WeakSet</code> instances.</p> + +<h2 id="Properties">Properties</h2> + +<dl> + <dt><code>WeakSet.prototype.constructor</code></dt> + <dd>返回构造函数即 {{jsxref("WeakSet")}} 本身.</dd> +</dl> + +<h2 id="Methods">Methods</h2> + +<dl> + <dt>{{jsxref("WeakSet.add", "WeakSet.prototype.add(value)")}}</dt> + <dd> 在<span style="line-height: 1.5;">该 </span><code style="font-size: 14px;">WeakSet</code><span style="line-height: 1.5;"> 对象中添加一个新元素 <code>value</code>.</span></dd> + <dt>{{jsxref("WeakSet.delete", "WeakSet.prototype.delete(value)")}}</dt> + <dd>从<span style="line-height: 1.5;">该 </span><code style="font-size: 14px;">WeakSet</code><span style="line-height: 1.5;"> 对象中删除</span><span style="line-height: 1.5;"> </span><code style="font-size: 14px;">value </code><span style="line-height: 1.5;">这个元素, 之后 </span><code style="font-size: 14px;">WeakSet.prototype.has(value)</code><span style="line-height: 1.5;"> 方法便会返回 </span><code style="font-size: 14px;">false</code><span style="line-height: 1.5;">.</span></dd> + <dt>{{jsxref("WeakSet.has", "WeakSet.prototype.has(value)")}}</dt> + <dd>返回一个布尔值, 表示给定的值 <code>value</code> 是否存在于这个 <code>WeakSet</code> 中.</dd> +</dl> + +<h2 id="Specifications">Specifications</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('ES6', '#sec-weakset.prototype', 'WeakSet.prototype')}}</td> + <td>{{Spec2('ES6')}}</td> + <td>Initial definition.</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility">Browser compatibility</h2> + +<p>{{ CompatibilityTable() }}</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>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatNo() }} {{bug(792439)}}</td> + <td>{{ CompatNo() }}</td> + <td>{{ CompatNo() }}</td> + <td>{{ CompatNo() }}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>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>{{ CompatNo() }}</td> + <td>{{ CompatNo() }} {{bug(792439)}}</td> + <td>{{ CompatNo() }}</td> + <td>{{ CompatNo() }}</td> + <td>{{ CompatNo() }}</td> + </tr> + </tbody> +</table> +</div> + +<h3 id="Chrome-specific_notes">Chrome-specific notes</h3> + +<ul> + <li>This feature is available behind a preference. In <code style="font-size: 14px;">chrome://flags</code>, activate the entry “Enable Experimental JavaScript”.</li> +</ul> + +<h2 id="See_also">See also</h2> + +<ul> + <li>{{jsxref("Set.prototype")}}</li> + <li>{{jsxref("WeakMap.prototype")}}</li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/webassembly/compile/index.html b/files/zh-cn/web/javascript/reference/global_objects/webassembly/compile/index.html new file mode 100644 index 0000000000..6489b54a09 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/webassembly/compile/index.html @@ -0,0 +1,101 @@ +--- +title: WebAssembly.compile() +slug: Web/JavaScript/Reference/Global_Objects/WebAssembly/compile +translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly/compile +--- +<div>{{JSRef}} {{SeeCompatTable}}</div> + +<p><strong><code>WebAssembly.compile()</code></strong> 方法编译WebAssembly二进制代码到一个{{jsxref("WebAssembly.Module")}} 对象。如果在实例化之前有必要去编译一个模块，那么这个方法是有用的（否则，将会使用{{jsxref("WebAssembly.instantiate()")}} 方法）</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">Promise<WebAssembly.Module> WebAssembly.compile(bufferSource);</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><em>bufferSource</em></dt> + <dd>一个包含你想编译的wasm模块二进制代码的 <a href="/en-US/docs/Web/JavaScript/Typed_arrays">typed array</a>(类型数组) or <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/ArrayBuffer">ArrayBuffer</a>(数组缓冲区)</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>一个解析为 {{jsxref("WebAssembly.Module")}} 的<code>Promise</code> 对象。</p> + +<h3 id="异常">异常</h3> + +<ul> + <li>如果 <code>bufferSource</code> 不是一个 <a href="/en-US/docs/Web/JavaScript/Typed_arrays">typed array</a>, 将抛出一个 {{jsxref("TypeError")}} 。</li> + <li>如果编译失败 promise 将会 reject 一个 {{jsxref("WebAssembly.CompileError")}}。</li> +</ul> + +<h2 id="例子">例子</h2> + +<p>下面的例子 (查看GitHub上的 <a href="https://github.com/mdn/webassembly-examples/blob/master/js-api-examples/index-compile.html">index-compile.html</a> 例子, 并且也能 <a href="https://mdn.github.io/webassembly-examples/js-api-examples/index-compile.html">查看运行效果</a>) 使用 <code>compile()</code> 方法编译加载进来的 simple.wasm 二进制代码并且使用 <a href="/en-US/docs/Web/API/Worker/postMessage">postMessage()</a> 发送给一个 <a href="https://developer.mozilla.org/en-US/docs/Web/API/Web_Workers_API">worker</a>。</p> + +<pre class="brush: js">var worker = new Worker("wasm_worker.js"); + +fetch('simple.wasm').then(response => + response.arrayBuffer() +).then(bytes => + WebAssembly.compile(bytes) +).then(mod => + worker.postMessage(mod) +);</pre> + +<p>在线程中 (查看 <code><a href="https://github.com/mdn/webassembly-examples/blob/master/js-api-examples/wasm_worker.js">wasm_worker.js</a></code>) 我们定义了一个导入对象共模块使用，然后设置了一个事件处理函数来接收主线程发送过来的模块。当模块被接收之后，我们使用{{jsxref("WebAssembly.Instantiate()")}} 方法创建了一个实例，调用从它里面导出的一个方法，接下来展示了我们可以用 {{jsxref("WebAssembly.Module/exports", "WebAssembly.Module.exports")}} 属性来调用模块上返回的可用信息。</p> + +<pre class="brush: js">var importObject = { + imports: { + imported_func: function(arg) { + console.log(arg); + } + } +}; + +onmessage = function(e) { + console.log('module received from main thread'); + var mod = e.data; + + WebAssembly.instantiate(mod, importObject).then(function(instance) { + instance.exports.exported_func(); + }); + + var exports = WebAssembly.Module.exports(mod); + console.log(exports[0]); +};</pre> + +<h2 id="Specifications">Specifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('WebAssembly JS', '#webassemblycompile', 'compile()')}}</td> + <td>{{Spec2('WebAssembly JS')}}</td> + <td>Initial draft definition.</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">Browser compatibility</h2> + +<div> + + +<p>{{Compat("javascript.builtins.WebAssembly.compile")}}</p> +</div> + +<h2 id="See_also">See also</h2> + +<ul> + <li><a href="/en-US/docs/WebAssembly">WebAssembly</a> overview page</li> + <li><a href="/en-US/docs/WebAssembly/Concepts">WebAssembly concepts</a></li> + <li><a href="/en-US/docs/WebAssembly/Using_the_JavaScript_API">Using the WebAssembly JavaScript API</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/webassembly/compileerror/index.html b/files/zh-cn/web/javascript/reference/global_objects/webassembly/compileerror/index.html new file mode 100644 index 0000000000..179b8589a2 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/webassembly/compileerror/index.html @@ -0,0 +1,114 @@ +--- +title: WebAssembly.CompileError() +slug: Web/JavaScript/Reference/Global_Objects/WebAssembly/CompileError +translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly/CompileError +--- +<div>{{JSRef}}</div> + +<p><code><strong>WebAssembly.CompileError()</strong></code>构造函数创建一个新的WebAssembly <code>CompileError</code>对象，该对象表示WebAssembly解码或验证期间的错误。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox"><code>new WebAssembly.CompileError(<var>message</var>, <var>fileName</var>, <var>lineNumber</var>)</code></pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>message</code> {{optional_inline}}</dt> + <dd><span class="tlid-translation translation" lang="zh-CN"><span title="">有可读性的错误描述。</span></span></dd> + <dt><code>fileName</code> {{optional_inline}}{{non-standard_inline}}</dt> + <dd>包含导致异常的代码的文件名。</dd> + <dt><code>lineNumber</code> {{optional_inline}}{{non-standard_inline}}</dt> + <dd>导致异常的代码的行号。</dd> +</dl> + +<h2 id="属性">属性</h2> + +<p><em><code>CompileError</code>构造函数没有一些它特有的属性，但是，它确实通过原型链继承了某些属性。</em></p> + +<dl> + <dt><code>WebAssembly.CompileError.prototype.constructor</code></dt> + <dd>创建示例原型的特定函数。</dd> + <dt>{{jsxref("Error.prototype.message", "WebAssembly.CompileError.prototype.message")}}</dt> + <dd>错误信息。 尽管ECMA-262指定{{jsxref("URIError")}}应提供自己的<code>message</code>属性，但在<a href="/en-US/docs/Mozilla/Projects/SpiderMonkey">SpiderMonkey</a>中，它继承了 {{jsxref("Error.prototype.message")}}。</dd> + <dt>{{jsxref("Error.prototype.name", "WebAssembly.CompileError.prototype.name")}}</dt> + <dd>错误名称。继承自 {{jsxref("Error")}}。</dd> + <dt>{{jsxref("Error.prototype.fileName", "WebAssembly.CompileError.prototype.fileName")}}</dt> + <dd>报出错误的文件名。继承自 {{jsxref("Error")}}。</dd> + <dt>{{jsxref("Error.prototype.lineNumber", "WebAssembly.CompileError.prototype.lineNumber")}}</dt> + <dd>报出错误的代码所在文件中的行数。继承自 {{jsxref("Error")}}。</dd> + <dt>{{jsxref("Error.prototype.columnNumber", "WebAssembly.CompileError.prototype.columnNumber")}}</dt> + <dd>报出错误的代码所在文件中的列数。继承自 {{jsxref("Error")}}。</dd> + <dt>{{jsxref("Error.prototype.stack", "WebAssembly.CompileError.prototype.stack")}}</dt> + <dd>堆栈跟踪。 继承自{{jsxref("Error")}}。</dd> +</dl> + +<h2 id="方法">方法</h2> + +<p><em><code>CompileError</code>构造函数不包含自己的方法，但是，它确实通过原型链继承了一些方法。</em></p> + +<dl> + <dt>{{jsxref("Error.prototype.toSource", "WebAssembly.CompileError.prototype.toSource()")}}</dt> + <dd>返回可能导致相同错误的代码。 继承自{{jsxref("Error")}}。</dd> + <dt>{{jsxref("Error.prototype.toString", "WebAssembly.CompileError.prototype.toString()")}}</dt> + <dd>返回表示代表指定的<code>Error</code>对象的字符串。从 {{jsxref("Error")}}继承。</dd> +</dl> + +<h2 id="示例">示例</h2> + +<p>以下代码段创建一个新的CompileError实例，并将其详细信息记录到控制台：</p> + +<pre class="brush: js">try { + throw new WebAssembly.CompileError('Hello', 'someFile', 10); +} catch (e) { + console.log(e instanceof CompileError); // true + console.log(e.message); // "Hello" + console.log(e.name); // "CompileError" + console.log(e.fileName); // "someFile" + console.log(e.lineNumber); // 10 + console.log(e.columnNumber); // 0 + console.log(e.stack); // 返回代码运行的位置 +}</pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('WebAssembly JS', '#constructor-properties-of-the-webassembly-object', 'WebAssembly constructors')}}</td> + <td>{{Spec2('WebAssembly JS')}}</td> + <td>Initial WebAssembly draft definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-native-error-types-used-in-this-standard', 'NativeError')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td>Definition of standard NativeError types.</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">浏览器兼容性</h2> + +<div> + + +<p>{{Compat("javascript.builtins.WebAssembly.CompileError")}}</p> +</div> + +<h2 id="参见">参见</h2> + +<ul> + <li><a href="/en-US/docs/WebAssembly">WebAssembly</a> overview page</li> + <li><a href="/en-US/docs/WebAssembly/Concepts">WebAssembly concepts</a></li> + <li><a href="/en-US/docs/WebAssembly/Using_the_JavaScript_API">Using the WebAssembly JavaScript API</a></li> +</ul> + +<dl> +</dl> diff --git a/files/zh-cn/web/javascript/reference/global_objects/webassembly/compilestreaming/index.html b/files/zh-cn/web/javascript/reference/global_objects/webassembly/compilestreaming/index.html new file mode 100644 index 0000000000..f36e646699 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/webassembly/compilestreaming/index.html @@ -0,0 +1,77 @@ +--- +title: WebAssembly.compileStreaming() +slug: Web/JavaScript/Reference/Global_Objects/WebAssembly/compileStreaming +translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly/compileStreaming +--- +<div>{{JSRef}}</div> + +<p><strong><code>WebAssembly.compileStreaming()</code></strong> 方法用来从一个流式源中直接编译一个 {{jsxref("WebAssembly.Module")}}。当模块需要在被实例化前被编译时，这个方法会很有用。如果要从流式源实例化一个模块应采用 {{jsxref("WebAssembly.instantiateStreaming()")}} 方法。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">Promise<WebAssembly.Module> WebAssembly.compileStreaming(<em>source</em>);</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><em>source</em></dt> + <dd>一个 {{domxref("Response")}} 对象或一个会履行（fulfill）它的 promise，用来表示你想编译的 .wasm 模块的流式源。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>一个会被解决（resolve）为编译后的 {{jsxref("WebAssembly.Module")}} 对象的 <code>Promise</code>。</p> + +<h3 id="异常">异常</h3> + +<ul> + <li>如果 <code>bufferSource</code> 不是一个 <a href="/en-US/docs/Web/JavaScript/Typed_arrays">typed array</a>，将会抛出 {{jsxref("TypeError")}} 异常。</li> + <li>如果编译失败，promise 会通过拒绝（reject）来返回一个 {{jsxref("WebAssembly.CompileError")}}。</li> +</ul> + +<h2 id="例子">例子</h2> + +<p>下面的例子（在 GitHub 上查看我们的 <a href="https://github.com/mdn/webassembly-examples/blob/master/js-api-examples/compile-streaming.html">compile-streaming.html</a> 示例或者直接<a href="https://mdn.github.io/webassembly-examples/js-api-examples/compile-streaming.html">在线预览</a>）直接从流式源传输一个 .wasm 模块然后将其编译为一个 {{jsxref("WebAssembly.Module")}} 对象。因为 <code>compileStreaming()</code> 方法可以接受一个结果为 {{domxref("Response")}} 对象的 promise，因此你可以直接用 {{domxref("WindowOrWorkerGlobalScope.fetch()")}} 的调用结果来调用该方法。</p> + +<pre class="brush: js">var importObject = { imports: { imported_func: arg => console.log(arg) } }; + +WebAssembly.compileStreaming(fetch('simple.wasm')) +.then(module => WebAssembly.instantiate(module, importObject)) +.then(instance => instance.exports.exported_func());</pre> + +<p>得到的 module 实例接下来通过 {{jsxref("WebAssembly.instantiate()")}} 方法被实例化了，然后调用模块导出的函数。</p> + +<h2 id="Specifications">Specifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('WebAssembly Embedding', '#webassemblycompilestreaming', 'compileStreaming()')}}</td> + <td>{{Spec2('WebAssembly Embedding')}}</td> + <td>Initial draft definition.</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">Browser compatibility</h2> + +<div> + + +<p>{{Compat("javascript.builtins.WebAssembly.compileStreaming")}}</p> +</div> + +<h2 id="See_also">See also</h2> + +<ul> + <li><a href="/en-US/docs/WebAssembly">WebAssembly</a> overview page</li> + <li><a href="/en-US/docs/WebAssembly/Concepts">WebAssembly concepts</a></li> + <li><a href="/en-US/docs/WebAssembly/Using_the_JavaScript_API">Using the WebAssembly JavaScript API</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/webassembly/global/index.html b/files/zh-cn/web/javascript/reference/global_objects/webassembly/global/index.html new file mode 100644 index 0000000000..3366032120 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/webassembly/global/index.html @@ -0,0 +1,107 @@ +--- +title: WebAssembly.Global +slug: Web/JavaScript/Reference/Global_Objects/WebAssembly/Global +translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly/Global +--- +<div>{{JSRef}}</div> + +<p><strong><code>WebAssembly.Global</code></strong> 对象表示一个全局变量实例, 可以被JavaScript 和importable/exportable 访问 ,跨越一个或多个{{jsxref("WebAssembly.Module")}} 实例. 他允许被多个modules动态连接.</p> + +<h2 id="构造函数语法">构造函数语法</h2> + +<p><strong><a href="/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/WebAssembly/Global">WebAssembly.Global()</a></strong></p> + +<p> 创建一个新的<code>全局</code>对象。</p> + +<h2 id="Global_实例">Global 实例</h2> + +<p>所有的 <code>Global</code> 实例 继承自 <code>Global()</code> 构造函数 <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/WebAssembly/Global/prototype">prototype object</a> — 修改会影响 所有 <code>Global</code> 实例.</p> + +<h3 id="实例属性">实例属性</h3> + +<dl> + <dt><code>Global.prototype.constructor</code></dt> + <dd>返回创建对象实例的函数. 缺省为构造函数为 {{jsxref("WebAssembly.Global()")}}</dd> + <dt><code>Global.prototype[@@toStringTag]</code></dt> + <dd>属性 <a href="/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Symbol/toStringTag">@@toStringTag</a> 初始值为字符串 "WebAssembly.Global".</dd> + <dt><code>Global.prototype.value</code></dt> + <dd>全局变量包含的值 — 可以直接用于设置和获取全局变量的值.</dd> +</dl> + +<h3 id="实例方法">实例方法</h3> + +<dl> + <dt><code>Global.prototype.valueOf()</code></dt> + <dd>旧式的方法，返回全局变量包含的值.</dd> +</dl> + +<h2 id="例子">例子</h2> + +<h3 id="创建_Global_实例">创建 Global 实例 </h3> + +<p>以下例子展示了使用 <code>WebAssembly.Global()</code> 构造函数创建一个新的实例. 它定义为可修饰的 类型为<code>i32</code> , 值为 0.</p> + +<p>global的值发生改变, 首先设置<code>Global.value</code> 为42, 然后使用导出函数 <code>incGlobal()</code> 增加为43. 导出函数在 <code>global.wasm</code> 模块中(它将参数的值加一并返回).</p> + +<pre class="brush: js notranslate">const output = document.getElementById('output'); + +function assertEq(msg, got, expected) { + output.innerHTML += `Testing ${msg}: `; + if (got !== expected) + output.innerHTML += `FAIL!<br>Got: ${got}<br>Expected: ${expected}<br>`; + else + output.innerHTML += `SUCCESS! Got: ${got}<br>`; +} + +assertEq("WebAssembly.Global exists", typeof WebAssembly.Global, "function"); + +const global = new WebAssembly.Global({value:'i32', mutable:true}, 0); + +WebAssembly.instantiateStreaming(fetch('global.wasm'), { js: { global } }) +.then(({instance}) => { + assertEq("getting initial value from wasm", instance.exports.getGlobal(), 0); + global.value = 42; + assertEq("getting JS-updated value from wasm", instance.exports.getGlobal(), 42); + instance.exports.incGlobal(); + assertEq("getting wasm-updated value from JS", global.value, 43); +});</pre> + +<div class="note"> +<p><strong>注意</strong>: 你可以在<a href="https://mdn.github.io/webassembly-examples/js-api-examples/global.html">running live on GitHub</a> 查看例子; 也可以访问<a href="https://github.com/mdn/webassembly-examples/blob/master/js-api-examples/global.html">source code</a>.</p> +</div> + +<h2 id="规格">规格</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">规格</th> + <th scope="col">状态</th> + <th scope="col">解释</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('WebAssembly JS', '#globals', 'WebAssembly.Global()')}}</td> + <td>{{Spec2('WebAssembly JS')}}</td> + <td>Initial draft definition.</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">浏览器兼容性</h2> + +<div> + + +<p>{{Compat("javascript.builtins.WebAssembly.Global")}}</p> +</div> + +<h2 id="See_also">See also</h2> + +<ul> + <li><a href="/en-US/docs/WebAssembly">WebAssembly</a> overview page</li> + <li><a href="/en-US/docs/WebAssembly/Concepts">WebAssembly concepts</a></li> + <li><a href="/en-US/docs/WebAssembly/Using_the_JavaScript_API">Using the WebAssembly JavaScript API</a></li> + <li><a href="https://github.com/WebAssembly/mutable-global/blob/master/proposals/mutable-global/Overview.md">Import/Export mutable globals proposal</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/webassembly/index.html b/files/zh-cn/web/javascript/reference/global_objects/webassembly/index.html new file mode 100644 index 0000000000..66f14793af --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/webassembly/index.html @@ -0,0 +1,106 @@ +--- +title: WebAssembly +slug: Web/JavaScript/Reference/Global_Objects/WebAssembly +tags: + - API + - JavaScript + - WebAssembly +translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly +--- +<div>{{JSRef}}</div> + +<p><strong><code>WebAssembly</code></strong>JavaScript 对象是所有 <a href="/en-US/docs/WebAssembly">WebAssembly</a> 相关功能的命名空间。</p> + +<p>和大多数全局对象不一样，<code>WebAssembly</code>不是一个构造函数（它不是一个函数对象）。它类似于 {{jsxref("Math")}} 对象或者 {{jsxref("Intl")}} 对象，Math 对象也是一个命名空间对象，用于保存数学常量和函数；Intl则是用于国际化和其他语言相关函数的命名空间对象。</p> + +<h2 id="描述">描述</h2> + +<p><code>WebAssembly</code>对象主要用于：</p> + +<ul> + <li>使用 {{jsxref("WebAssembly.instantiate()")}} 函数加载 WebAssembly 代码。</li> + <li>通过 {{jsxref("WebAssembly.Memory()")}}/{{jsxref("WebAssembly.Table()")}} 构造函数创建新的内存和表实例。</li> + <li>由 {{jsxref("WebAssembly.CompileError()")}}/{{jsxref("WebAssembly.LinkError()")}}/{{jsxref("WebAssembly.RuntimeError()")}} 构造函数来提供 WebAssembly 中的错误信息。</li> +</ul> + +<h2 id="方法">方法</h2> + +<dl> + <dt>{{jsxref("WebAssembly.instantiate()")}}</dt> + <dd>用于编译和实例化 WebAssembly 代码的主 API，返回一个 <code>Module</code> 和它的第一个<code>Instance</code>实例。</dd> + <dt>{{jsxref("WebAssembly.instantiateStreaming()")}}</dt> + <dd>直接从流式底层源编译和实例化WebAssembly模块，同时返回<code>Module</code>及其第一个<code>Instance</code>实例。</dd> + <dt>{{jsxref("WebAssembly.compile()")}}</dt> + <dd>把 WebAssembly 二进制代码编译为一个 {{jsxref("WebAssembly.Module")}} ，不进行实例化。</dd> + <dt>{{jsxref("WebAssembly.compileStreaming()")}}</dt> + <dd>直接从流式底层源代码编译{{jsxref("WebAssembly.Module")}} ，将实例化作为一个单独的步骤。</dd> + <dt>{{jsxref("WebAssembly.validate()")}}</dt> + <dd>校验 WebAssembly 二进制代码的类型数组是否合法，合法则返回 true ，否则返回 false 。</dd> +</dl> + +<h2 id="构造器">构造器</h2> + +<dl> + <dt>{{jsxref("WebAssembly.Global()")}}</dt> + <dd>创建一个新的WebAssembly <code>Global</code> 全局对象.</dd> + <dt>{{jsxref("WebAssembly.Module()")}}</dt> + <dd>创建一个新的WebAssembly <code>Module</code>模块对象。</dd> + <dt>{{jsxref("WebAssembly.Instance()")}}</dt> + <dd>创建一个新的WebAssembly <code>Instance</code>实例对象。</dd> + <dt>{{jsxref("WebAssembly.Memory()")}}</dt> + <dd>创建一个新的WebAssembly <code>Memory</code>内存对象。</dd> + <dt>{{jsxref("WebAssembly.Table()")}}</dt> + <dd>创建一个新的WebAssembly <code>Table</code>表格对象。</dd> + <dt>{{jsxref("WebAssembly.CompileError()")}}</dt> + <dd>创建一个新的WebAssembly <code>CompileError</code>编译错误对象。</dd> + <dt>{{jsxref("WebAssembly.LinkError()")}}</dt> + <dd>创建一个新的WebAssembly <code>LinkError</code>链接错误对象。</dd> + <dt>{{jsxref("WebAssembly.RuntimeError()")}}</dt> + <dd>创建一个新的WebAssembly <code>RuntimeError</code>运行时错误对象。</dd> +</dl> + +<h2 id="示例">示例</h2> + +<p>下面的示例（请参见GitHub上的<a href="https://github.com/mdn/webassembly-examples/blob/master/js-api-examples/instantiate-streaming.html">Instantiate-streaming.html</a>演示，并查看<a href="https://mdn.github.io/webassembly-examples/js-api-examples/instantiate-streaming.html">在线演示</a>）直接从流式底层源传输.wasm模块，然后对其进行编译和实例化，并通过<code>ResultObject</code>实现promise。 由于<code>instantiateStreaming()</code>函数接受对 {{domxref("Response")}} 对象的promise，因此您可以直接向其传递{{domxref("WindowOrWorkerGlobalScope.fetch()")}}调用，然后它将把返回的response传递给随后的函数。</p> + +<pre class="brush: js line-numbers language-js"><code class="language-js"><span class="keyword token">var</span> importObject <span class="operator token">=</span> <span class="punctuation token">{</span> imports<span class="punctuation token">:</span> <span class="punctuation token">{</span> <span class="function function-variable token">imported_func</span><span class="punctuation token">:</span> <span class="parameter token">arg</span> <span class="operator token">=></span> console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>arg<span class="punctuation token">)</span> <span class="punctuation token">}</span> <span class="punctuation token">}</span><span class="punctuation token">;</span> + +WebAssembly<span class="punctuation token">.</span><span class="function token">instantiateStreaming</span><span class="punctuation token">(</span><span class="function token">fetch</span><span class="punctuation token">(</span><span class="string token">'simple.wasm'</span><span class="punctuation token">)</span><span class="punctuation token">,</span> importObject<span class="punctuation token">)</span> +<span class="punctuation token">.</span><span class="function token">then</span><span class="punctuation token">(</span><span class="parameter token">obj</span> <span class="operator token">=></span> obj<span class="punctuation token">.</span>instance<span class="punctuation token">.</span>exports<span class="punctuation token">.</span><span class="function token">exported_func</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">)</span></code></pre> + +<p>返回的<code>ResultObject</code>实例的成员可以被随后访问到，可以调用实例中被导出的方法。</p> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('WebAssembly JS', '#the-webassembly-object', 'WebAssembly')}}</td> + <td>{{Spec2('WebAssembly JS')}}</td> + <td>初始草案定义</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">浏览器兼容性</h2> + +<div> + + +<p>{{Compat("javascript.builtins.WebAssembly")}}</p> + +<h2 id="参见">参见</h2> + +<ul> + <li><a href="/en-US/docs/WebAssembly">WebAssembly</a> overview page</li> + <li><a href="/en-US/docs/WebAssembly/Concepts">WebAssembly concepts</a></li> + <li><a href="/en-US/docs/WebAssembly/Using_the_JavaScript_API">Using the WebAssembly JavaScript API</a></li> +</ul> +</div> diff --git a/files/zh-cn/web/javascript/reference/global_objects/webassembly/instance/index.html b/files/zh-cn/web/javascript/reference/global_objects/webassembly/instance/index.html new file mode 100644 index 0000000000..d9fdee81e1 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/webassembly/instance/index.html @@ -0,0 +1,89 @@ +--- +title: WebAssembly.Instance +slug: Web/JavaScript/Reference/Global_Objects/WebAssembly/Instance +tags: + - API + - Experimental + - JavaScript + - Reference + - WebAssembly +translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly/Instance +--- +<div>{{JSRef}} {{SeeCompatTable}}</div> + +<p> <strong><code>WebAssembly.Instance</code></strong> 对象本身是有状态的，是 <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/WebAssembly/Module">WebAssembly.Module</a> 的一个可执行实例。 <code>实例</code>包含所有的 <a href="https://developer.mozilla.org/en-US/docs/WebAssembly/Exported_functions">WebAssembly 导出函数</a> ，允许从JavaScript 调用 WebAssembly 代码。</p> + +<p><code>WebAssembly.Instance()</code> 构造函数以同步方式实例化一个{{jsxref("WebAssembly.Module")}} 对象。 然而, 通常获取实例的方法是通过异步函数{{jsxref("WebAssembly.instantiate()")}} .</p> + +<h2 id="构造函数">构造函数</h2> + +<div class="warning"> +<p><strong>重要</strong>: 由于大型模块的实例化代价极高， 开发人员应只在必须同步实例化的时候，才使用<code>Instance()</code>；绝大多数情况应该使用异步方法{{jsxref("WebAssembly.instantiate()")}} .</p> +</div> + +<pre class="syntaxbox notranslate">var myInstance = new WebAssembly.Instance(<em>module</em>, <em>importObject</em>);</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><em>module</em></dt> + <dd>要被实例化的 <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/WebAssembly/Module" title="The Module() constructor of the WebAssembly global object creates a new Module object instance."><code>WebAssembly.Module</code></a> 对象.</dd> + <dt><em>importObject</em> {{optional_inline}}</dt> + <dd>一个包含值的对象，导入到新创建的 <code>实例</code>, 比如函数或 <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/WebAssembly/Memory" title="The Memory() constructor of the WebAssembly global object creates a new Memory object instance, which represents a WebAssembly memory. These can be thought of as resizeable array buffers, wrappers around WebAssembly memories."><code>WebAssembly.Memory</code></a> 对象. There must be one matching property for each declared import of <code>module</code> 否则抛出 <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/WebAssembly/LinkError">WebAssembly.LinkError</a> 异常.</dd> +</dl> + +<h2 id="实例化">实例化</h2> + +<p>所有的 <code>Instance</code> 实例继承自<code>Instance()</code> <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/WebAssembly/Instance/prototype">属性对象</a>— 修改它会影响所有的<code>Instance</code> 实例.</p> + +<h3 id="实例属性">实例属性</h3> + +<dl> + <dt>{{jsxref("WebAssembly/Instance/exports", "Instance.prototype.exports")}}</dt> + <dd>返回一个包含此 WebAssembly 模块实例所导出的全部成员的 JS 对象，以便 JavaScript 访问和使用这些成员，这个对象是只读的。</dd> + <dt></dt> +</dl> + +<div class="hidden"> +<dl> + <dt></dt> + <dt> + <p>译者注：英文版的变动有点大，用例模块暂时不翻译，后来者有心的话可以翻译一下。</p> + </dt> +</dl> +</div> + +<h2 id="规格">规格</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">规格</th> + <th scope="col">状态</th> + <th scope="col">描述</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('WebAssembly JS', '#webassemblyinstance-objects', 'Instance')}}</td> + <td>{{Spec2('WebAssembly JS')}}</td> + <td>Initial draft definition.</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">浏览器兼容性</h2> + +<div class="hidden"> +<p>为了便于维护，此兼容性表格由结构化数据生成。如果您有意向此表格贡献内容，请向 <a href="https://github.com/mdn/browser-compat-data ">这个仓库</a> 提交代码并发送对应的 pull request 给我们。</p> +</div> + +<div>{{Compat("javascript.builtins.WebAssembly.Instance")}}</div> + +<h2 id="参考">参考</h2> + +<ul> + <li><a href="/en-US/docs/WebAssembly">WebAssembly</a> overview page</li> + <li><a href="/en-US/docs/WebAssembly/Concepts">WebAssembly concepts</a></li> + <li><a href="/en-US/docs/WebAssembly/Using_the_JavaScript_API">Using the WebAssembly JavaScript API</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/webassembly/instantiate/index.html b/files/zh-cn/web/javascript/reference/global_objects/webassembly/instantiate/index.html new file mode 100644 index 0000000000..5567c99432 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/webassembly/instantiate/index.html @@ -0,0 +1,175 @@ +--- +title: WebAssembly.instantiate() +slug: Web/JavaScript/Reference/Global_Objects/WebAssembly/instantiate +translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly/instantiate +--- +<div>{{JSRef}}</div> + +<p><strong><code>WebAssembly.instantiate()</code></strong> 允许你编译和实例化 WebAssembly 代码。这个方法有两个重载方式:</p> + +<ul> + <li>第一种主要重载方式使用WebAssembly二进制代码的 <a href="/en-US/docs/Web/JavaScript/Typed_arrays">typed array</a> 或{{jsxref("ArrayBuffer")}}形，一并进行编译和实例化。返回的 <code>Promise</code> 会携带已编译的 {{jsxref("WebAssembly.Module")}} 和它的第一个实例化对象 {{jsxref("WebAssembly.Instance")}}.</li> + <li>第二种重载使用已编译的 {{jsxref("WebAssembly.Module")}} , 返回的 <code>Promise</code> 携带一个 <code>Module</code>的实例化对象 <code>Instance</code>. 如果这个 <code>Module</code> 已经被编译了或者是从缓存中获取的( <a href="/en-US/docs/WebAssembly/Caching_modules">retrieved from cache</a>), 那么这种重载方式是非常有用的.</li> +</ul> + +<div class="blockIndicator warning"> +<p><strong>重要</strong>: 此方法不是获取(fetch)和实例化wasm模块的最具效率方法。 如果可能的话，您应该改用较新的{{jsxref("WebAssembly.instantiateStreaming()")}}方法，该方法直接从原始字节码中直接获取，编译和实例化模块，因此不需要转换为{{jsxref("ArrayBuffer")}}。</p> +</div> + +<h2 id="语法">语法</h2> + +<h3 id="主重载方式_—_使用wasm二进制代码">主重载方式 — 使用wasm二进制代码</h3> + +<pre class="syntaxbox">Promise<ResultObject> WebAssembly.instantiate(bufferSource, importObject); +</pre> + +<h4 id="参数">参数</h4> + +<dl> + <dt><em>bufferSource</em></dt> + <dd>一个包含你想编译的wasm模块二进制代码的 <a href="/en-US/docs/Web/JavaScript/Typed_arrays">typed array</a>(类型数组) or <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/ArrayBuffer">ArrayBuffer</a>(数组缓冲区)</dd> + <dt><em>importObject</em> {{optional_inline}}</dt> + <dd>一个将被导入到新创建实例中的对象，它包含的值有函数、{{jsxref("WebAssembly.Memory")}} 对象等等。编译的模块中，对于每一个导入的值都要有一个与其匹配的属性与之相对应，否则将会抛出 <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/WebAssembly/LinkError">WebAssembly.LinkError</a>。</dd> +</dl> + +<h4 id="返回值">返回值</h4> + +<p>解析为包含两个字段的 <code>ResultObject</code> 的一个 <code>Promise</code>:</p> + +<ul> + <li><code>module</code>: 一个被编译好的 {{jsxref("WebAssembly.Module")}} 对象. 这个模块可以被再次实例化，通过 <a href="/en-US/docs/Web/API/Worker/postMessage">postMessage()</a> 被分享，或者缓存到 <a href="/en-US/docs/WebAssembly/Caching_modules">IndexedDB</a>。</li> + <li><code>instance</code>: 一个包含所有 <a href="/en-US/docs/WebAssembly/Exported_functions">Exported WebAssembly functions</a>的{{jsxref("WebAssembly.Instance")}}对象。</li> +</ul> + +<h4 id="异常">异常</h4> + +<ul> + <li>如果参数的类型或结构不正确，将会抛出异常 {{jsxref("TypeError")}} .</li> + <li>如果操作失败，promise 将会被 reject 掉， 根据失败的原因不同，会抛出3种异常，{{jsxref("WebAssembly.CompileError")}}，{{jsxref("WebAssembly.LinkError")}}, 或{{jsxref("WebAssembly.RuntimeError")}}。</li> +</ul> + +<h3 id="第二种重载_—_使用模块对象">第二种重载 — 使用模块对象</h3> + +<pre class="syntaxbox">Promise<WebAssembly.Instance> WebAssembly.instantiate(module, importObject); +</pre> + +<h4 id="参数_2">参数</h4> + +<dl> + <dt><em>module</em></dt> + <dd>将被实例化的 {{jsxref("WebAssembly.Module")}} 对象。</dd> + <dt><em>importObject</em> {{optional_inline}}</dt> + <dd>一个将被导入到新创建实例中的对象，它包含的值有函数、{{jsxref("WebAssembly.Memory")}} 对象等等。编译的模块中，对于每一个导入的值都要有一个与其匹配的属性与之相对应，否则将会抛出{{jsxref("WebAssembly.LinkError")}} 。</dd> +</dl> + +<h4 id="返回值_2">返回值</h4> + +<p>一个解析为 {{jsxref("WebAssembly.Instance")}} 的<code>Promise</code> 对象。</p> + +<h4 id="异常_2">异常</h4> + +<ul> + <li>如果参数的类型或结构不正确，将抛出异常 {{jsxref("TypeError")}} 。</li> + <li>如果操作失败，promise 将会被 reject 掉， 根据失败的原因不同，会抛出3种异常，{{jsxref("WebAssembly.CompileError")}}，{{jsxref("WebAssembly.LinkError")}}, 或{{jsxref("WebAssembly.RuntimeError")}}。</li> +</ul> + +<h2 id="例子">例子</h2> + +<p><strong>提示</strong>: 在大多数情况下，您可能需要使用{{jsxref("WebAssembly.instantiateStreaming()")}}，因为它比<code>instantiate()</code>更具效率。</p> + +<h3 id="第一种重载例子">第一种重载例子</h3> + +<p>使用 fetch 获取一些 WebAssembly 二进制代码后，我们使用 {{jsxref("WebAssembly.instantiate()")}} 方法编译并实例化模块，在此过程中，导入了一个 Javascript 方法在 WebAssembly 模块中， 接下来我们使用<code>Instance</code> 导出的<a href="/en-US/docs/WebAssembly/Exported_functions">Exported WebAssembly </a>方法。</p> + +<pre class="brush: js">var importObject = { + imports: { + imported_func: function(arg) { + console.log(arg); + } + }, + env: { + abort: () => {}, + }, +}; + +/* 2019-08-03：importObject必须存在env对象以及env对象的abort方法 */ + +fetch('simple.wasm').then(response => + response.arrayBuffer() +).then(bytes => + WebAssembly.instantiate(bytes, importObject) +).then(result => + result.instance.exports +);</pre> + +<div class="note"> +<p><strong>注</strong>: 查看GitHub(<a href="https://mdn.github.io/webassembly-examples/js-api-examples/">在线实例</a>)的 <a href="https://github.com/mdn/webassembly-examples/blob/master/js-api-examples/index.html">index.html</a> 中一个相似的例子，使用了我们的<code><a href="https://github.com/mdn/webassembly-examples/blob/master/wasm-utils.js#L1">fetchAndInstantiate()</a></code>库函数</p> +</div> + +<h3 id="第二种重载例子">第二种重载例子</h3> + +<p>下面的例子（查看我们GitHub的 <a href="https://github.com/mdn/webassembly-examples/blob/master/js-api-examples/index-compile.html">index-compile.html</a> 例子，可在线演示）使用 <code>compile()</code> 方法编译了 simple.wasm 字节码，然后通过 <a href="/en-US/docs/Web/API/Worker/postMessage">postMessage()</a> 发送给一个线程 <a href="https://developer.mozilla.org/en-US/docs/Web/API/Web_Workers_API">worker</a>。</p> + +<pre class="brush: js">var worker = new Worker("wasm_worker.js"); + +fetch('simple.wasm').then(response => + response.arrayBuffer() +).then(bytes => + WebAssembly.compile(bytes) +).then(mod => + worker.postMessage(mod) +);</pre> + +<p>在线程中 (查看 <code><a href="https://github.com/mdn/webassembly-examples/blob/master/js-api-examples/wasm_worker.js">wasm_worker.js</a></code>) 我们定义了一个导入对象供模块使用，然后设置了一个事件处理函数来接收主线程发来的模块。当模块被接收到后，我们使用{{jsxref("WebAssembly.instantiate()")}} 方法创建一个实例并且调用它从内部导出的函数。</p> + +<pre class="brush: js">var importObject = { + imports: { + imported_func: function(arg) { + console.log(arg); + } + } +}; + +onmessage = function(e) { + console.log('module received from main thread'); + var mod = e.data; + + WebAssembly.instantiate(mod, importObject).then(function(instance) { + instance.exports.exported_func(); + }); +};</pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('WebAssembly JS', '#webassemblyinstantiate', 'instantiate()')}}</td> + <td>{{Spec2('WebAssembly JS')}}</td> + <td>Initial draft definition.</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">浏览器兼容性</h2> + +<div> + + +<p>{{Compat("javascript.builtins.WebAssembly.instantiate")}}</p> +</div> + +<h2 id="参见">参见</h2> + +<ul> + <li><a href="/en-US/docs/WebAssembly">WebAssembly</a> overview page</li> + <li><a href="/en-US/docs/WebAssembly/Concepts">WebAssembly concepts</a></li> + <li><a href="/en-US/docs/WebAssembly/Using_the_JavaScript_API">Using the WebAssembly JavaScript API</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/webassembly/instantiatestreaming/index.html b/files/zh-cn/web/javascript/reference/global_objects/webassembly/instantiatestreaming/index.html new file mode 100644 index 0000000000..f6698d9862 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/webassembly/instantiatestreaming/index.html @@ -0,0 +1,85 @@ +--- +title: WebAssembly.instantiateStreaming() +slug: Web/JavaScript/Reference/Global_Objects/WebAssembly/instantiateStreaming +translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly/instantiateStreaming +--- +<div>{{JSRef}}</div> + +<p><strong><code>WebAssembly.instantiateStreaming()</code></strong> 方法直接从流式底层源编译和实例化WebAssembly模块。这是加载wasm代码一种非常有效的优化方式。</p> + +<h2 id="Syntax">Syntax</h2> + +<pre class="syntaxbox">Promise<ResultObject> WebAssembly.instantiateStreaming(<em>source</em>, <em>importObject</em>);</pre> + +<h3 id="Parameters">Parameters</h3> + +<dl> + <dt><em>source</em></dt> + <dd>一个{{domxref("Response")}}对象 或 一个可以履行（fulfill）一个（Response）的 {{jsxref("Promise")}}，表示你想要传输、编译和实例化的 .wasm 模块基础源。</dd> + <dt><em>importObject</em> {{optional_inline}}</dt> + <dd>包含一些想要导入到新创建<code>Instance</code>中值的对象，例如方法 或 {{jsxref("WebAssembly.Memory")}} 对象。每个已编译模块的声明导入必须有一个匹配属性，否则抛出 <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/WebAssembly/LinkError">WebAssembly.LinkError</a> 异常。</dd> +</dl> + +<h3 id="Return_value">Return value</h3> + +<p>一个 <code>Promise</code> ，通过resolve返回一个包含两个属性的 <code>ResultObject</code> ：</p> + +<ul> + <li><code>module</code>: {{jsxref("WebAssembly.Module")}} 对象表示编译完成的WebAssembly模块. 这个<code>Module</code>能够再次被实例化 或 通过<a href="/en-US/docs/Web/API/Worker/postMessage">postMessage()</a>共享。</li> + <li><code>instance</code>: {{jsxref("WebAssembly.Instance")}} 对象包含WebAssembly所有公开方法 <a href="/en-US/docs/WebAssembly/Exported_functions">Exported WebAssembly functions</a>.</li> +</ul> + +<h3 id="Exceptions">Exceptions</h3> + +<ul> + <li>如果任意参数的类型或结构错误, {{jsxref("TypeError")}} 抛出.</li> + <li>如果操作失败, Promise通过reject根据失败原因返回 {{jsxref("WebAssembly.CompileError")}}，{{jsxref("WebAssembly.LinkError")}} 或 {{jsxref("WebAssembly.RuntimeError")}}。</li> +</ul> + +<h2 id="Examples">Examples</h2> + +<p>下面的示例 (在GitHub上查看 <a href="https://github.com/mdn/webassembly-examples/blob/master/js-api-examples/instantiate-streaming.html">instantiate-streaming.html</a> 示例, 并且也可 <a href="https://mdn.github.io/webassembly-examples/js-api-examples/instantiate-streaming.html">view it live</a> ) 直接从基础源传输一个 .wasm 模块，然后进行编译和实例化, Promise 履行后返回一个 <code>ResultObject</code>. 因为 <code>instantiateStreaming()</code> 方法允许履行后返回{{domxref("Response")}}对象的Promise，你可以直接传递一个 {{domxref("WindowOrWorkerGlobalScope.fetch()")}} 请求，它会在履行后将response传递给方法.</p> + +<pre class="brush: js">var importObject = { imports: { imported_func: arg => console.log(arg) } }; + +WebAssembly.instantiateStreaming(fetch('simple.wasm'), importObject) +.then(obj => obj.instance.exports.exported_func());</pre> + +<p>然后访问<code>ResultObject</code>的实例成员，并调用包含的公开函数。</p> + +<h2 id="Specifications">Specifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('WebAssembly Embedding', '#webassemblyinstantiatestreaming', 'instantiateStreaming()')}}</td> + <td>{{Spec2('WebAssembly Embedding')}}</td> + <td>Initial draft definition.</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">Browser compatibility</h2> + +<div> + + +<p>{{Compat("javascript.builtins.WebAssembly.instantiateStreaming")}}</p> +</div> + +<h2 id="See_also">See also</h2> + +<ul> + <li><a href="/en-US/docs/WebAssembly">WebAssembly</a> overview page</li> + <li><a href="/en-US/docs/WebAssembly/Concepts">WebAssembly concepts</a></li> + <li><a href="/en-US/docs/WebAssembly/Using_the_JavaScript_API">Using the WebAssembly JavaScript API</a></li> + <li><a href="/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Promise">Promise</a></li> + <li><a href="/zh-CN/docs/Web/API/Fetch_API/Using_Fetch">使用Fetch</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/webassembly/memory/index.html b/files/zh-cn/web/javascript/reference/global_objects/webassembly/memory/index.html new file mode 100644 index 0000000000..1d559210a4 --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/webassembly/memory/index.html @@ -0,0 +1,112 @@ +--- +title: WebAssembly.Memory() +slug: Web/JavaScript/Reference/Global_Objects/WebAssembly/Memory +translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly/Memory +--- +<div>{{JSRef}}</div> + +<p><code><strong>WebAssembly.Memory()</strong></code> 构造函数创建一个新的 <code>Memory</code> 对象。该对象的 {{jsxref("WebAssembly/Memory/buffer","buffer")}} 属性是一个可调整大小的 <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/ArrayBuffer">ArrayBuffer</a> ，其内存储的是 WebAssembly <code>实例</code> 所访问内存的原始字节码。</p> + +<p>从 JavaScript 或 WebAssembly 中所创建的内存，可以由 JavaScript 或 WebAssembly 来访问及更改。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">var myMemory = new WebAssembly.Memory(memoryDescriptor);</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><em>memoryDescriptor</em></dt> + <dd>一个可包含以下成员的对象: + <dl> + <dt><em>initial</em></dt> + <dd>WebAssembly 内存的初始大小，以 WebAssembly 页面为单位。</dd> + <dt><em>maximum {{optional_inline}}</em></dt> + <dd>以 WebAssembly 页面为单位，可允许 WebAssembly 内存的 <code>最大值</code>。当存在此属性时，此参数用于提示引擎预先保留内存。但是，引擎可能会忽略或限制此预留请求。通常情况下大多数 WebAssembly 模块不需要设置 <code>最大值</code>。</dd> + </dl> + </dd> +</dl> + +<div class="note"> +<p><strong>注意</strong>: A WebAssembly 页面的大小为一个常量 65,536 字节，即64KB。</p> +</div> + +<h3 id="异常">异常</h3> + +<ul> + <li>如果 <code>memoryDescriptor</code> 的类型不是对象，则抛出 {{jsxref("TypeError")}} 异常。</li> + <li>如果指定了 <code>maximum</code> 并且小于 <code>initial</code>，则抛出 {{jsxref("RangeError")}} 异常。</li> +</ul> + +<h2 id="Memory_实例"><code>Memory</code> 实例</h2> + +<p>所有 <code>Memory</code> 实例都继承自 <code>Memory()</code> 构造函数的 <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/WebAssembly/Memory/prototype">原型对象</a> — 这个原型可被修改并影响到所有的 <code>Memory</code> 实例。</p> + +<h3 id="实例属性">实例属性</h3> + +<dl> + <dt><code>Memory.prototype.constructor</code></dt> + <dd>返回创建此对象实例的函数。默认情况下，它是 {{jsxref("WebAssembly.Memory()")}} 构造函数。</dd> + <dt>{{jsxref("WebAssembly/Memory/buffer","Memory.prototype.buffer")}}</dt> + <dd>一个访问器，用于返回内存中包含的缓冲区。</dd> +</dl> + +<h3 id="实例方法">实例方法</h3> + +<dl> + <dt>{{jsxref("WebAssembly/Memory/grow","Memory.prototype.grow()")}}</dt> + <dd>通过指定 WebAssembly 页面数量来增加内存实例的大小。（每个页面大小为64KB）</dd> +</dl> + +<h2 id="示例">示例</h2> + +<p>有两种方法可以获得 <code>WebAssembly.Memory</code> 对象。第一种方法是由 JavaScript 来创建。以下示例创建了一个新的 WebAssembly 内存实例，初始大小为 10页（640KB），最大值设置为 100页（6.4MB）。</p> + +<pre class="brush: js">var memory = new WebAssembly.Memory({initial:10, maximum:100});</pre> + +<p>获取 <code>WebAssembly.Memory</code> 对象的第二种方法是从 WebAssembly 模块中导出。以下示例 （详见GitHub页面 <a href="https://github.com/mdn/webassembly-examples/blob/master/js-api-examples/memory.html">memory.html</a> ，也可以 <a href="https://mdn.github.io/webassembly-examples/js-api-examples/memory.html">用浏览器运行查看</a>） 使用 {{jsxref("WebAssembly.instantiateStreaming()")}} 方法实例化已加载的 memory.wasm 字节代码，同时导入上面一行中创建的内存。用它来存储一些值，然后导出一个函数并用它来对一些值进行求和操作。</p> + +<pre class="brush: js">WebAssembly.instantiateStreaming(fetch('memory.wasm'), { js: { mem: memory } }) +.then(obj => { + var i32 = new Uint32Array(memory.buffer); + for (var i = 0; i < 10; i++) { + i32[i] = i; + } + var sum = obj.instance.exports.accumulate(0, 10); + console.log(sum); +});</pre> + +<h2 id="标准规范">标准规范</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">规范</th> + <th scope="col">状态</th> + <th scope="col">备注</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('WebAssembly JS', '#webassemblymemory-objects', 'Memory')}}</td> + <td>{{Spec2('WebAssembly JS')}}</td> + <td>初步定义草案</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">浏览器兼容性</h2> + +<div> + + +<p>{{Compat("javascript.builtins.WebAssembly.Memory")}}</p> +</div> + +<h2 id="参见">参见</h2> + +<ul> + <li><a href="/en-US/docs/WebAssembly">WebAssembly</a> overview page</li> + <li><a href="/en-US/docs/WebAssembly/Concepts">WebAssembly concepts</a></li> + <li><a href="/en-US/docs/WebAssembly/Using_the_JavaScript_API">Using the WebAssembly JavaScript API</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/webassembly/module/index.html b/files/zh-cn/web/javascript/reference/global_objects/webassembly/module/index.html new file mode 100644 index 0000000000..c328e5f3ba --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/webassembly/module/index.html @@ -0,0 +1,87 @@ +--- +title: WebAssembly.Module +slug: Web/JavaScript/Reference/Global_Objects/WebAssembly/Module +translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly/Module +--- +<div>{{JSRef}}</div> + +<div><strong><code>WebAssembly.Module</code></strong> 对象包含已经由浏览器编译的无状态 WebAssembly 代码，可以高效地<a href="https://developer.mozilla.org/en-US/docs/Web/API/Worker/postMessage">与 Workers 共享</a>、<a href="https://developer.mozilla.org/en-US/docs/WebAssembly/Caching_modules">缓存在 IndexedDB 中</a>，和多次实例化。</div> + +<div> </div> + +<div><code>WebAssembly.Module()</code> 构造函数可以用来同步编译给定的 WebAssembly 二进制代码。不过，获取 <code>Module</code> 对象的主要方法是通过异步编译函数，如 {{jsxref("WebAssembly.compile()")}}，或者是<a href="/en-US/docs/WebAssembly/Caching_modules">通过 IndexedDB 读取 Module 对象</a>.</div> + +<div> </div> + +<h2 id="构造函数语法">构造函数语法</h2> + +<div class="warning"> +<p><strong>重要提示：</strong>由于大型模块的编译可能很消耗资源，开发人员只有在绝对需要同步编译时，才使用 <code>Module()</code> 构造函数；其他情况下，应该使用异步 {{jsxref("WebAssembly.compile()")}} 方法。</p> +</div> + +<pre class="syntaxbox">var myModule = new WebAssembly.Module(bufferSource);</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><em>bufferSource</em></dt> + <dd>一个 <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Typed_arrays">类型化数组</a> 或 <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/ArrayBuffer">ArrayBuffer</a>，包含要编译的 .wasm 模块的二进制代码。</dd> +</dl> + +<h2 id="Module_构造函数的方法属性"><code>Module</code> 构造函数的方法属性</h2> + +<dl> + <dt>{{jsxref("Global_Objects/WebAssembly/Module/customSections", "WebAssembly.Module.customSections()")}}</dt> + <dd>给定 <code>Module</code> 对象和字符串，通过该字符串，返回 Module 对象中所有自定义部分的内容的副本。</dd> + <dt>{{jsxref("Global_Objects/WebAssembly/Module/exports", "WebAssembly.Module.exports()")}}</dt> + <dd>给定 <code>Module</code> 对象，返回一个数组，内容是所有已声明的接口的描述。</dd> + <dt>{{jsxref("Global_Objects/WebAssembly/Module/imports", "WebAssembly.Module.imports()")}}</dt> + <dd>给定 <code>Module</code> 对象，返回一个数组，内容是所有已声明的引用的描述。</dd> +</dl> + +<h2 id="Module_实例"><code>Module</code> 实例</h2> + +<p>所有 <code>Module</code> 实例继承自 <code>Module()</code> 构造函数的<a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/WebAssembly/Module/prototype">原型对象</a> —— 修改它会影响所有 <code>Module</code> 实例。</p> + +<h3 id="实例属性">实例属性</h3> + +<p>{{page('/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/WebAssembly/Module/prototype', 'Properties')}}</p> + +<h3 id="实例方法">实例方法</h3> + +<p>Module 实例没有自己的默认方法。</p> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">规范</th> + <th scope="col">状态</th> + <th scope="col">注释</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('WebAssembly JS', '#webassemblymodule-objects', 'WebAssembly.Module()')}}</td> + <td>{{Spec2('WebAssembly JS')}}</td> + <td>定义初稿</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">浏览器兼容性</h2> + +<div> +<div class="hidden">此页面上的兼容性表格由结构化数据生成。 如果您想为数据做出贡献，请查看 <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> 并向我们发送合并请求。</div> + +<p>{{Compat("javascript.builtins.WebAssembly.Module")}}</p> +</div> + +<h2 id="另请查阅">另请查阅</h2> + +<ul> + <li><a href="/en-US/docs/WebAssembly">WebAssembly</a> 概览页面</li> + <li><a href="/en-US/docs/WebAssembly/Concepts">WebAssembly 概念</a></li> + <li><a href="/en-US/docs/WebAssembly/Using_the_JavaScript_API">使用 WebAssembly JavaScript API</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/webassembly/runtimeerror/index.html b/files/zh-cn/web/javascript/reference/global_objects/webassembly/runtimeerror/index.html new file mode 100644 index 0000000000..3962917a9e --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/webassembly/runtimeerror/index.html @@ -0,0 +1,111 @@ +--- +title: WebAssembly.RuntimeError() +slug: Web/JavaScript/Reference/Global_Objects/WebAssembly/RuntimeError +translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly/RuntimeError +--- +<div>{{JSRef}}</div> + +<p><code><strong>WebAssembly.RuntimeError()</strong></code>构造函数创建一个新的WebAssembly RuntimeError对象---一个每当WebAssembly陷入指定陷阱时将抛出的类型。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">new WebAssembly.RuntimeError(<var>message</var>, <var>fileName</var>, <var>lineNumber</var>)</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>message</code> {{optional_inline}}</dt> + <dd>有可读性的错误信息。</dd> + <dt><code>fileName</code> {{optional_inline}}{{non-standard_inline}}</dt> + <dd>包含导致异常的代码的文件名。</dd> + <dt><code>lineNumber</code> {{optional_inline}}{{non-standard_inline}}</dt> + <dd>导致异常的代码的行号。</dd> +</dl> + +<h2 id="属性">属性</h2> + +<p><em><code>RuntimeError</code>构造函数不包含其自身特有的属性，但是，它确实通过原型链继承了某些属性。</em></p> + +<dl> + <dt><code>WebAssembly.RuntimeError.prototype.constructor</code></dt> + <dd>创建示例原型的特定函数。</dd> + <dt>{{jsxref("Error.prototype.message", "WebAssembly.RuntimeError.prototype.message")}}</dt> + <dd>错误信息。 尽管ECMA-262指定{{jsxref("URIError")}}应提供自己的<code>message</code>属性，但在<a href="https://developer.mozilla.org/en-US/docs/Mozilla/Projects/SpiderMonkey">SpiderMonkey</a>中，它继承了{{jsxref("Error.prototype.message")}}。</dd> + <dt>{{jsxref("Error.prototype.name", "WebAssembly.RuntimeError.prototype.name")}}</dt> + <dd>错误名称。继承自 {{jsxref("Error")}}.</dd> + <dt>{{jsxref("Error.prototype.fileName", "WebAssembly.RuntimeError.prototype.fileName")}}</dt> + <dd>报出错误的文件路径。继承自 {{jsxref("Error")}}.</dd> + <dt>{{jsxref("Error.prototype.lineNumber", "WebAssembly.RuntimeError.prototype.lineNumber")}}</dt> + <dd>报出错误的代码所在文件中的行数。继承自{{jsxref("Error")}}.</dd> + <dt>{{jsxref("Error.prototype.columnNumber", "WebAssembly.RuntimeError.prototype.columnNumber")}}</dt> + <dd>报出错误的代码所在文件中的列数。继承自 {{jsxref("Error")}}.</dd> + <dt>{{jsxref("Error.prototype.stack", "WebAssembly.RuntimeError.prototype.stack")}}</dt> + <dd>堆栈跟踪。 继承自 {{jsxref("Error")}}.</dd> +</dl> + +<h2 id="方法">方法</h2> + +<p><em><code>RuntimeError</code>构造函数不包含自己的方法，但是，它确实通过原型链继承了一些方法。</em></p> + +<dl> + <dt>{{jsxref("Error.prototype.toSource", "WebAssembly.RuntimeError.prototype.toSource()")}}</dt> + <dd>返回可能导致相同错误的代码。 继承自{{jsxref("Error")}}.</dd> + <dt>{{jsxref("Error.prototype.toString", "WebAssembly.RuntimeError.prototype.toString()")}}</dt> + <dd>返回表示代表指定的<code>Error</code>对象的字符串。从{{jsxref("Error")}}.</dd> +</dl> + +<h2 id="样例">样例</h2> + +<p>以下代码段创建了一个新的RuntimeError实例，并将其详细信息记录到控制台：</p> + +<pre class="brush: js">try { + throw new WebAssembly.RuntimeError('Hello', 'someFile', 10); +} catch (e) { + console.log(e instanceof RuntimeError); // true + console.log(e.message); // "Hello" + console.log(e.name); // "RuntimeError" + console.log(e.fileName); // "someFile" + console.log(e.lineNumber); // 10 + console.log(e.columnNumber); // 0 + console.log(e.stack); // 返回代码运行的位置 +}</pre> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('WebAssembly JS', '#constructor-properties-of-the-webassembly-object', 'WebAssembly constructors')}}</td> + <td>{{Spec2('WebAssembly JS')}}</td> + <td>Initial WebAssembly draft definition.</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-native-error-types-used-in-this-standard', 'NativeError')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td>Definition of standard NativeError types.</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">浏览器兼容性</h2> + +<div> + + +<p>{{Compat("javascript.builtins.WebAssembly.RuntimeError")}}</p> +</div> + +<h2 id="参见">参见</h2> + +<ul> + <li><a href="/en-US/docs/WebAssembly">WebAssembly</a> overview page</li> + <li><a href="/en-US/docs/WebAssembly/Concepts">WebAssembly concepts</a></li> + <li><a href="/en-US/docs/WebAssembly/Using_the_JavaScript_API">Using the WebAssembly JavaScript API</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/webassembly/table/index.html b/files/zh-cn/web/javascript/reference/global_objects/webassembly/table/index.html new file mode 100644 index 0000000000..a3fbc0a4dc --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/webassembly/table/index.html @@ -0,0 +1,130 @@ +--- +title: WebAssembly.Table() +slug: Web/JavaScript/Reference/Global_Objects/WebAssembly/Table +translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly/Table +--- +<div>{{JSRef}}</div> + +<p><code><strong>WebAssembly.Table()</strong></code> 构造函数根据给定的大小和元素类型创建一个Table对象。 </p> + +<p>这是一个包装了WebAssemble Table 的Javascript包装对象，具有类数组结构，存储了多个函数引用。在Javascript或者WebAssemble中创建Table 对象可以同时被Javascript或WebAssemble 访问和更改。</p> + +<div class="note"> +<p><strong>Note</strong>: Tables 对象目前只能存储函数引用，不过在将来可能会被扩展。</p> +</div> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox notranslate">var myTable = new WebAssembly.Table(tableDescriptor);</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><em>tableDescriptor</em></dt> + <dd>该对象具有以下属性： + <dl> + <dt><em>element</em></dt> + <dd>一个表明储存在该Table中对象的类型。 目前只能是： <code>"anyfunc"</code> (函数)。</dd> + <dt><em>initial</em></dt> + <dd>该WebAssembly Table初始大小。</dd> + <dt><em>maximum {{optional_inline}}</em></dt> + <dd>该WebAssembly Table允许扩展到的最大大小。</dd> + </dl> + </dd> +</dl> + +<h3 id="异常">异常</h3> + +<ul> + <li>如果 <code>tableDescriptor</code> 不是对象类型, 将会抛出 {{jsxref("TypeError")}} 异常。</li> + <li>如果申明了 <code>maximum</code> 属性并且比 <code>initial小</code>, 将会抛出{{jsxref("RangeError")}} 异常。</li> +</ul> + +<h2 id="Table_Instance"><code>Table</code> Instance</h2> + +<p>所有<code>Table</code>实例都继承自<code>Table()</code>构造函数的<a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/WebAssembly/Table/prototype">原型对象</a>-可以对其进行修改以影响所有<code>Table</code>实例。</p> + +<h3 id="Instance_属性">Instance 属性</h3> + +<dl> + <dt><code>Table.prototype.constructor</code></dt> + <dd><font><font>返回创建该对象实例的函数。</font><font>默认情况下，这是</font></font>{{jsxref("WebAssembly.Table()")}} 的<font><font>构造函数。</font></font></dd> + <dt>{{jsxref("WebAssembly/Table/length","Table.prototype.length")}}</dt> + <dd>返回Table的长度，即元素数。</dd> +</dl> + +<h3 id="Instance_methods">Instance methods</h3> + +<dl> + <dt>{{jsxref("WebAssembly/Table/get","Table.prototype.get()")}}</dt> + <dd>Accessor function — gets the element stored at a given index.</dd> + <dt>{{jsxref("WebAssembly/Table/grow","Table.prototype.grow()")}}</dt> + <dd>Increases the size of the Table instance by a specified number of elements.</dd> + <dt>{{jsxref("WebAssembly/Table/set","Table.prototype.set()")}}</dt> + <dd>Sets an element stored at a given index to a given value.</dd> +</dl> + +<h2 id="例子">例子</h2> + +<p>The following example (see table2.html <a href="https://github.com/mdn/webassembly-examples/blob/master/js-api-examples/table2.html">source code</a> and <a href="https://mdn.github.io/webassembly-examples/js-api-examples/table2.html">live version</a>) creates a new WebAssembly Table instance with an initial size of 2 elements. We then print out the table length and contents of the two indexes (retrieved via {{jsxref("WebAssembly/Table/get", "Table.prototype.get()")}} to show that the length is two and both elements are {{jsxref("null")}}.</p> + +<pre class="brush: js notranslate">var tbl = new WebAssembly.Table({initial:2, element:"anyfunc"}); +console.log(tbl.length); // "2" +console.log(tbl.get(0)); // "null" +console.log(tbl.get(1)); // "null"</pre> + +<p>We then create an import object that contains the table:</p> + +<pre class="brush: js notranslate">var importObj = { + js: { + tbl:tbl + } +};</pre> + +<p>Finally, we load and instantiate a wasm module (table2.wasm) using the {{jsxref("WebAssembly.instantiateStreaming()")}} method. The table2.wasm module contains two functions (one that returns 42 and another that returns 83) and stores both into elements 0 and 1 of the imported table (see <a href="https://github.com/mdn/webassembly-examples/blob/master/js-api-examples/table2.wat">text representation</a>). So after instantiation, the table still has length 2, but the elements now contain callable <a href="/en-US/docs/WebAssembly/Exported_functions">Exported WebAssembly Functions</a> which we can call from JS.</p> + +<pre class="brush: js notranslate">WebAssembly.instantiateStreaming(fetch('table2.wasm'), importObject) +.then(function(obj) { + console.log(tbl.length); + console.log(tbl.get(0)()); + console.log(tbl.get(1)()); +});</pre> + +<p>Note how you've got to include a second function invocation operator at the end of the accessor to actually invoke the referenced function and log the value stored inside it (e.g. <code>get(0)()</code> rather than <code>get(0)</code>) .</p> + +<p>This example shows that we're creating and accessing the table from JavaScript, but the same table is visible and callable inside the wasm instance too.</p> + +<h2 id="规范">规范</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">规范</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('WebAssembly JS', '#webassemblytable-objects', 'Table')}}</td> + <td>{{Spec2('WebAssembly JS')}}</td> + <td>Initial draft definition.</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">浏览器兼容性</h2> + +<div> + + +<p>{{Compat("javascript.builtins.WebAssembly.Table")}}</p> +</div> + +<h2 id="相关链接">相关链接</h2> + +<ul> + <li><a href="/en-US/docs/WebAssembly">WebAssembly</a> overview page</li> + <li><a href="/en-US/docs/WebAssembly/Concepts">WebAssembly concepts</a></li> + <li><a href="/en-US/docs/WebAssembly/Using_the_JavaScript_API">Using the WebAssembly JavaScript API</a></li> +</ul> diff --git a/files/zh-cn/web/javascript/reference/global_objects/webassembly/validate/index.html b/files/zh-cn/web/javascript/reference/global_objects/webassembly/validate/index.html new file mode 100644 index 0000000000..7d44cc216b --- /dev/null +++ b/files/zh-cn/web/javascript/reference/global_objects/webassembly/validate/index.html @@ -0,0 +1,75 @@ +--- +title: WebAssembly.validate() +slug: Web/JavaScript/Reference/Global_Objects/WebAssembly/validate +translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly/validate +--- +<div>{{JSRef}}</div> + +<p><strong><code>WebAssembly.validate()</code></strong> 方法用于验证包含 WebAssembly 二进制码的一个 <a href="/en-US/docs/Web/JavaScript/Typed_arrays">typed array</a> 是否合法，返回 <code>true</code> 如果这些字节能构成一个合法的 wasm 模块，否则返回 <code>false</code>。</p> + +<h2 id="语法">语法</h2> + +<pre class="syntaxbox">WebAssembly.validate(bufferSource);</pre> + +<h3 id="参数">参数</h3> + +<dl> + <dt><code>bufferSource</code></dt> + <dd>一个包含 WebAssembly 二进制码的 <a href="/en-US/docs/Web/JavaScript/Typed_arrays">typed array</a> 或 <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/ArrayBuffer">ArrayBuffer</a>。</dd> +</dl> + +<h3 id="返回值">返回值</h3> + +<p>一个布尔值，用来表示给定的 <code>bufferSource</code> 是合法 wasm 代码（<code>true</code>）或者不是（<code>false</code>）。</p> + +<h3 id="异常">异常</h3> + +<p>如果给定的 <code>bufferSource</code> 不是 <a href="/en-US/docs/Web/JavaScript/Typed_arrays">typed array</a> 或 <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/ArrayBuffer">ArrayBuffer</a> 类型，将会抛出 {{jsxref("TypeError")}} 异常。</p> + +<h2 id="例子">例子</h2> + +<p>下面的例子（查看 validate.html <a href="https://github.com/mdn/webassembly-examples/blob/master/js-api-examples/validate.html">源代码</a>，或者<a href="https://mdn.github.io/webassembly-examples/js-api-examples/validate.html">在线预览</a>）通过 <code>fetch</code> 获取了一个 .wasm 模块并将其转换为一个 typed array。接下来用 <code>validate()</code> 方法来验证这个模块是否合法。</p> + +<pre class="brush: js">fetch('simple.wasm').then(response => + response.arrayBuffer() +).then(function(bytes) { + var valid = WebAssembly.validate(bytes); + console.log("The given bytes are " + + (valid ? "" : "not ") + "a valid wasm module"); +}); +</pre> + +<h2 id="Specifications">Specifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('WebAssembly JS', '#webassemblyvalidate', 'validate()')}}</td> + <td>{{Spec2('WebAssembly JS')}}</td> + <td>Initial draft definition.</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">Browser compatibility</h2> + +<div> + + +<p>{{Compat("javascript.builtins.WebAssembly.validate")}}</p> +</div> + +<h2 id="See_also">See also</h2> + +<ul> + <li><a href="/en-US/docs/WebAssembly">WebAssembly</a> overview page</li> + <li><a href="/en-US/docs/WebAssembly/Concepts">WebAssembly concepts</a></li> + <li><a href="/en-US/docs/WebAssembly/Using_the_JavaScript_API">Using the WebAssembly JavaScript API</a></li> +</ul> |