首頁 > web前端 > js教程 > 主體

JS字串學習之怎麼傳回給定下標間的子字串

青灯夜游
發布: 2021-08-19 13:36:34
原創
2541 人瀏覽過

在上一篇文章《JS字串學習之計算給定字元的全部出現位置》中,我們介紹了使用indexOf()和lastIndexOf()函數結合while循環,取得給定子串在字串中全部位置的方法。那麼今天將繼續帶給大家JavaScript字串學習系列~

本文將為大家介紹一下JavaScript截取字串,取得指定位置間所有字元(即子字串)的兩種方法。

首先我們來看看第一個方法--用slice()

舉個栗子~

var str="Hello world!"; 
var n=str.slice(1,7);
console.log("原字符串:"+str);
console.log("截取下标1~7之间的子串:"+n);
登入後複製

我們來看看輸出結果:

JS字串學習之怎麼傳回給定下標間的子字串

因為字串下標是從0開始的,所以使用str.slice(1,7)截取下標1 ~7之間的字符,傳回的子字串是「ello w」。

我們來了解slice()函數

string.slice(start,end)方法可提取字串的某個部分,並以新的字串傳回被提取的部分;函數接受一個必需參數start和一個可省略的參數end。

  • start參數:表示起始下標;第一個字元位置為 0。如果為負數,則從尾部開始截取。

  • end參數:表示結束下標。如果沒有指定該參數,那麼切分的陣列包含從 start 到陣列結束的所有元素;如果這個參數是負數,那麼它規定的是從陣列尾部開始算起的元素。

var str="Hello world!"; 
var n=str.slice(1,-7);
console.log("原字符串:"+str);
console.log("截取到的子串:"+n);
登入後複製

輸出結果:

JS字串學習之怎麼傳回給定下標間的子字串

#接下來我們來看看第二種方法--使用substring()方法

舉個栗子~

var str="Hello world!"; 
var n=str.substring(1,7);
console.log("原字符串:"+str);
console.log("截取到的子串:"+n);
登入後複製

輸出結果:

JS字串學習之怎麼傳回給定下標間的子字串

substring()方法可以擷取字串中介於兩個指定下標之間的字元。我們使用str.substring(1,7)截取字串str下標1~7之間的字符,因此傳回的子字串是「ello w」。

我們來了解substring()函數。

string.substring(from, to)方法可接受一個必需參數from(非負的整數,指定開始下標),一個可省略的參數to(指定結束下標)。 substring() 方法傳回的子串包括 開始 處的字符,但不包括 結束 處的字符。

slice()和substring()的區別:

slice()和substring()都可根據指定的起止下標位置來截取字串,都可以包含兩個參數,第一個參數表示起始下標,第二個參數表示結束下標。

但如果第一個參數值比第二個參數值大,substring() 方法能夠在執行截取之前先交換兩個參數,而對於 slice() 方法來說,則被視為無效,並返回空字串。

var str="Hello world!"; 
var n1=str.substring(7,1);
var n2=str.slice(7,1);
console.log("原字符串:"+str);
console.log("截取到的子串:"+n1);
console.log("截取到的子串:"+n2);
登入後複製

輸出結果:

JS字串學習之怎麼傳回給定下標間的子字串

如果參數值為負值,slice() 方法能夠將負號解釋為從右側開始定位;而substring () 方法會視其為無效。

var str="Hello world!"; 
var n1=str.substring(1,-7);
var n2=str.slice(1,-7);
console.log("原字符串:"+str);
console.log("截取到的子串:"+n1);
console.log("截取到的子串:"+n2);
登入後複製

輸出結果:

JS字串學習之怎麼傳回給定下標間的子字串

好了,就說到這裡了,有需要的可以看:javascript高級教學

以上是JS字串學習之怎麼傳回給定下標間的子字串的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板