123 lines
12 KiB
HTML
Raw Blame History

This file contains invisible Unicode characters

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

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

<article id="wikiArticle">
<div></div>
<p><strong><code>slice()</code></strong> 方法提取一个字符串的一部分,并返回一新的字符串。</p>
<h2 id="Syntax" name="Syntax" style="margin-bottom: 20px; font-size: 2.14285714285714rem;">语法</h2>
<pre class="syntaxbox" style="font-size: 14px; white-space: normal;"><code><var>str</var>.slice(<var>beginSlice</var>[, <var>endSlice</var>])</code></code></pre>
<h3 id="Parameters" name="Parameters" style="font-size: 1.71428571428571rem;">参数</h3>
<dl>
<dt><code>beginSlice</code></dt>
<dd>从该索引(以 0 为基数)处开始提取原字符串中的字符。如果值为负数,会被当做 <code>sourceLength + beginSlice</code> 看待,这里的<code>sourceLength 是字符串的长度</code> (例如, 如果<code>beginSlice</code> 是 -3 则看作是: <code>sourceLength - 3</code>)</dd>
<dt><code>endSlice</code></dt>
<dd>可选。在该索引(以 0 为基数)处结束提取字符串。如果省略该参数,<code style="font-style: normal;">slice</code>会一直提取到字符串末尾。<span style="line-height: 1.5;">如果该参数为负数,则被看作是 sourceLength + endSlice这里的 sourceLength 就是字符串的长度(例如,如果 endSlice 是 -3则是, sourceLength - 3)。</span></dd>
</dl>
<h3 id="返回值">返回值</h3>
<p>返回一个从原字符串中提取出来的新字符串</p>
<h2 id="Description" name="Description" style="margin-bottom: 20px; font-size: 2.14285714285714rem;">描述</h2>
<p><code>slice()</code> 从一个字符串中提取字符串并返回新字符串。在一个字符串中的改变不会影响另一个字符串。也就是说,<code>slice</code> 不修改原字符串,只会返回一个包含了原字符串中部分字符的新字符串。</p>
<p><strong>注意</strong><code>slice()</code> 提取的新字符串包括<code>beginSlice</code><strong>不包括 </strong><code><strong>endSlice</strong></code></p>
<p>例1<code>str.slice(1, 4)</code> 提取新字符串从第二个字符到第四个 (字符索引值为 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="Example:_Using_slice_to_create_a_new_string" name="Example:_Using_slice_to_create_a_new_string" style="font-size: 1.71428571428571rem;">使用 <code>slice()</code> 创建一个新的字符串</h3>
<p>下面例子使用 <code>slice()</code> 来创建新字符串:</p>
<pre><code class="language-js language-js" style="padding: 1em 0px 1em 30px; font-size: 14px; white-space: normal;"><code class="language-js" style="font-family: Consolas, Monaco, 'Andale Mono', monospace; direction: ltr; white-space: pre;"><span class="keyword token" style="color: #0077aa;">var</span> str1 <span class="operator token" style="background: rgba(255, 255, 255, 0.498039); color: #a67f59;">=</span> <span class="string token" style="color: #669900;">'The morning is upon us.'</span><span class="punctuation token" style="color: #999999;">;</span>
<span class="keyword token" style="color: #0077aa;">var</span> str2 <span class="operator token" style="background: rgba(255, 255, 255, 0.498039); color: #a67f59;">=</span> str1<span class="punctuation token" style="color: #999999;">.</span><span class="function token" style="color: #dd4a68;">slice<span class="punctuation token" style="color: #999999;">(</span></span><span class="number token" style="color: #990055;">4</span><span class="punctuation token" style="color: #999999;">,</span> <span class="operator token" style="background: rgba(255, 255, 255, 0.498039); color: #a67f59;">-</span><span class="number token" style="color: #990055;">2</span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span>
console<span class="punctuation token" style="color: #999999;">.</span><span class="function token" style="color: #dd4a68;">log<span class="punctuation token" style="color: #999999;">(</span></span>str2<span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span><span class="comment token" style="color: #708090;"> // OUTPUT: morning is upon u</span></code></code></pre>
<h3 id="Example:_Using_slice_with_negative_indexes" name="Example:_Using_slice_with_negative_indexes" style="font-size: 1.71428571428571rem;">给 <code>slice()</code> 传入负值索引</h3>
<p>下面的例子在 <code>slice()</code> 使用了负值索引:</p>
<pre><code class="language-js language-js" style="padding: 1em 0px 1em 30px; font-size: 14px; white-space: normal;"><code class="language-js" style="font-family: Consolas, Monaco, 'Andale Mono', monospace; direction: ltr; white-space: pre;"><span class="keyword token" style="color: #0077aa;">var</span> str <span class="operator token" style="background: rgba(255, 255, 255, 0.498039); color: #a67f59;">=</span> <span class="string token" style="color: #669900;">'The morning is upon us.'</span><span class="punctuation token" style="color: #999999;">;</span>
str<span class="punctuation token" style="color: #999999;">.</span><span class="function token" style="color: #dd4a68;">slice<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;">3</span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span> <span class="comment token" style="color: #708090;"> // returns 'us.'
</span>str<span class="punctuation token" style="color: #999999;">.</span><span class="function token" style="color: #dd4a68;">slice<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;">3</span><span class="punctuation token" style="color: #999999;">,</span> <span class="operator token" style="background: rgba(255, 255, 255, 0.498039); color: #a67f59;">-</span><span class="number token" style="color: #990055;">1</span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span><span class="comment token" style="color: #708090;"> // returns 'us'
</span>str<span class="punctuation token" style="color: #999999;">.</span><span class="function token" style="color: #dd4a68;">slice<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="operator token" style="background: rgba(255, 255, 255, 0.498039); color: #a67f59;">-</span><span class="number token" style="color: #990055;">1</span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span> <span class="comment token" style="color: #708090;"> // returns 'The morning is upon us'</span></code></code></pre>
<h2 id="规范" style="margin-bottom: 20px; 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 3rd Edition.</td>
<td>Standard</td>
<td>Initial definition. Implemented in JavaScript 1.2.</td>
</tr>
<tr>
<td><a class="external" href="https://www.ecma-international.org/ecma-262/5.1/#sec-15.5.4.13" hreflang="en" lang="en" rel="noopener">ECMAScript 5.1 (ECMA-262)<br/><small lang="zh-CN">String.prototype.slice</small></a></td>
<td><span class="spec-Standard">Standard</span></td>
<td> </td>
</tr>
<tr>
<td><a class="external" href="https://www.ecma-international.org/ecma-262/6.0/#sec-string.prototype.slice" hreflang="en" lang="en" rel="noopener">ECMAScript 2015 (6th Edition, ECMA-262)<br/><small lang="zh-CN">String.prototype.slice</small></a></td>
<td><span class="spec-Standard">Standard</span></td>
<td> </td>
</tr>
</tbody>
</table>
<h2 id="浏览器兼容性" style="margin-bottom: 20px; font-size: 2.14285714285714rem;">浏览器兼容性 </h2>
<div><div class="blockIndicator warning"><strong><a class="external" href="https://github.com/mdn/browser-compat-data" rel="noopener">We're converting our compatibility data into a machine-readable JSON format</a></strong>.
This compatibility table still uses the old format,
because we haven't yet converted the data it contains.
<strong><a class="new" href="/zh-CN/docs/MDN/Contribute/Structures/Compatibility_tables" rel="nofollow">Find out how you can help!</a></strong></div>
<div class="htab">
<a id="AutoCompatibilityTable" name="AutoCompatibilityTable"></a>
<ul>
<li class="selected"><a>Desktop</a></li>
<li><a>Mobile</a></li>
</ul>
</div></div>
<div id="compat-desktop">
<table class="compat-table" 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><span style="color: #888;" title="Please update this with the earliest version of support.">(Yes)</span></td>
<td><span style="color: #888;" title="Please update this with the earliest version of support.">(Yes)</span></td>
<td><span style="color: #888;" title="Please update this with the earliest version of support.">(Yes)</span></td>
<td><span style="color: #888;" title="Please update this with the earliest version of support.">(Yes)</span></td>
<td><span style="color: #888;" title="Please update this with the earliest version of support.">(Yes)</span></td>
</tr>
</tbody>
</table>
</div>
<div id="compat-mobile">
<table class="compat-table" 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><span style="color: #888;" title="Please update this with the earliest version of support.">(Yes)</span></td>
<td><span style="color: #888;" title="Please update this with the earliest version of support.">(Yes)</span></td>
<td><span style="color: #888;" title="Please update this with the earliest version of support.">(Yes)</span></td>
<td><span style="color: #888;" title="Please update this with the earliest version of support.">(Yes)</span></td>
<td><span style="color: #888;" title="Please update this with the earliest version of support.">(Yes)</span></td>
<td><span style="color: #888;" title="Please update this with the earliest version of support.">(Yes)</span></td>
</tr>
</tbody>
</table>
</div>
<h2 id="See_also" name="See_also" style="margin-bottom: 20px; font-size: 2.14285714285714rem;">参见</h2>
<ul>
<li><a href="Reference/Global_Objects/String/substr" title="substr() 方法返回一个字符串中从指定位置开始到指定字符数的字符。"><code>String.prototype.substr()</code></a></li>
<li><a href="Reference/Global_Objects/String/substring" title="substring() 方法返回一个字符串在开始索引到结束索引之间的一个子集, 或从开始索引直到字符串的末尾的一个子集。"><code>String.prototype.substring()</code></a></li>
<li><a href="Reference/Global_Objects/Array/slice" title="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 https://github.com/mdn/interactive-examples and send us a pull request."><code>Array.prototype.slice()</code></a></li>
</ul>
<p> </p>
</article>