欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

JavaScript實現(xiàn)字符串截取的三個方法總結(jié)

 更新時間:2023年02月27日 16:09:39   作者:天行無忌  
在?JavaScript?中,可以使用?substr()、slice()?和?substring()?方法截取字符串。這篇文章就來通過一些示例和大家聊聊這些方法的具體操作,需要的可以參考一下

在 JavaScript 中,可以使用 substr()slice()substring() 方法截取字符串。

substring()

substring() 方法返回一個字符串在開始索引到結(jié)束索引之間的一個子集,或從開始索引直到字符串的末尾的一個子集。語法如下:

str.substring(indexStart[, indexEnd])

參數(shù)說明:

  • indexStart:需要截取的第一個字符的索引,該索引位置的字符作為返回的字符串的首字母。
  • indexEnd:可選。一個 0 到字符串長度之間的整數(shù),以該數(shù)字為索引的字符不包含在截取的字符串內(nèi)。

如果 startIndex 大于 endIndex,則會交換它們的位置。來看一段示例代碼:

let str = "深耕WEB開發(fā)10+年,擁有一顆工匠的心";

console.log(str.substring(7)); // 10+年,擁有一顆工匠的心
console.log(str.substring(0, 5)); // 深耕WEB
console.log(str.substring(7, 5)); // 開發(fā)
console.log(str.substring(5, 5)); // 空

substr()

substr() 方法返回一個字符串中從指定位置開始到指定字符數(shù)的字符。語法如下:

str.substr(start[, length])

第一個參數(shù)是截取開始的位置,第二個參數(shù)是截取的長度。如下代碼:

let str = "深耕WEB開發(fā)10+年,擁有一顆工匠的心";
let result = str.substr(1, 4);
console.log(result); // 耕WEB

上述代碼的 1 表示從第二個字符開始截取,4 表示截取的長度為 4 個字符。

substr() 方法在截取字符串時是基于字符位置的,如果截取長度超過了字符串的長度,它會一直截取到字符串的末尾。如果第一個參數(shù)是負數(shù),則從字符串的末尾開始計數(shù)。

如果可以的話,建議使用 substring() 來取代 substr()

slice()

slice() 方法提取某個字符串的一部分,并返回一個新的字符串,且不會改動原字符串,與 substring() 方法類似。語法如下:

str.slice(startIndex, endIndex)

其中,startIndex 表示要截取的子字符串的起始位置(包含該位置),endIndex 表示要截取的子字符串的結(jié)束位置(不包含該位置)。如果只傳入 startIndex,則會從該位置一直截取到字符串末尾。如果 startIndex 大于 endIndex,則會返回空字符串。例如:

let str = "深耕WEB開發(fā)10+年,擁有一顆工匠的心";

console.log(str.slice(7)); // 10+年,擁有一顆工匠的心
console.log(str.slice(0, 5)); // 深耕WEB
console.log(str.slice(7, 5)); // ""
console.log(str.slice(5, 5)); // ""

substring()和substr()的區(qū)別

substring()substr() 都是截取字符串的方法,但它們有以下區(qū)別:

  • 參數(shù)不同substring() 方法的第一個參數(shù)是起始位置,第二個參數(shù)是終止位置(不包括該位置的字符);substr() 方法的第一個參數(shù)是起始位置,第二個參數(shù)是截取的長度。
  • 負數(shù)處理不同substring() 方法不接受負數(shù)參數(shù),如果傳入負數(shù),會被自動轉(zhuǎn)換為0;substr() 方法可以接受負數(shù)參數(shù),表示倒數(shù)計數(shù)。
  • 返回值不同substring() 方法返回從起始位置到終止位置之間的字符;substr()方法返回從起始位置開始指定長度的字符。

ES6中新增了 slice() 方法,但它和 substring() 方法非常相似,也是接受起始位置和終止位置作為參數(shù),不同之處是slice() 方法可以接受負數(shù)參數(shù),表示從字符串末尾開始計數(shù)。substr() 雖然沒有被完全遺棄,但還是建議使用 substring() 來取代 substr()

方法補充

除了上述的方法,小編還為大家整理了其他的實現(xiàn)方法,希望對大家有所幫助

Javascript截取字符串中包含中文的方法

第一種方法:

String.prototype.sub=function(n){ 
  var r=/[^\x00-\xff]/g; 
  if(this.replace(r,"mm").length<=n){return this;} 
  var m=Math.floor(n/2); 
  for(var i=m;i<this.length;i++){ 
    if(this.substr(0,i).replace(r,"mm").length>=n){ 
      return this.substr(0,i)+"..."; 
    } 
  } 
  return this; 
} 

第二種方法:

截取字符串 包含中文處理,參數(shù)含義:(字符串,截取長度,是否增加...) 

function subString(str, len, hasDot){ 
  var newLength=0; 
  var newStr=""; 
  var chineseRegex=/[^\x00-\xff]/g; 
  var singleChar=''; 
  var strLength=str.replace(chineseRegex,'**').length; 
  for(var i=0;i < strLength;i++){ 
  singleChar=str.charAt(i).toString(); 
  if(singleChar.match(chineseRegex) != null){ 
    newLength+=2; 
  }else{ 
    newLength++; 
  } 
  if(newLength>len){ 
    break; 
  } 
  newStr+=singleChar; 
  } 
   
  if(hasDot && strLength>len){ 
    newStr+='...'; 
  } 
  return newStr; 
} 

到此這篇關(guān)于JavaScript實現(xiàn)字符串截取的三個方法總結(jié)的文章就介紹到這了,更多相關(guān)JavaScript字符串截取內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!

相關(guān)文章

  • 頁面縮放兼容性處理方法(zoom,Firefox火狐瀏覽器)

    頁面縮放兼容性處理方法(zoom,Firefox火狐瀏覽器)

    下面小編就為大家?guī)硪黄撁婵s放兼容性處理方法(zoom,Firefox火狐瀏覽器)。小編覺得挺不錯的,現(xiàn)在就分享給大家,也給大家做個參考。一起跟隨小編過來看看吧
    2017-08-08
  • js中的數(shù)組對象排序分析

    js中的數(shù)組對象排序分析

    這篇文章為大家分析一下js中的數(shù)組對象排序的一些知識,方便大家在以后使用中知道這些排序的原理
    2018-12-12
  • Echarts圖表如何利用formatter自定義tooltip的內(nèi)容和樣式

    Echarts圖表如何利用formatter自定義tooltip的內(nèi)容和樣式

    這篇文章主要給大家介紹了關(guān)于Echarts圖表如何利用formatter自定義tooltip的內(nèi)容和樣式的相關(guān)資料,echarts的圖表配置非常的靈活自由,但是不熟悉的時候容易不知道怎么配置,需要的朋友可以參考下
    2023-06-06
  • JS圖片懶加載的優(yōu)點及實現(xiàn)原理

    JS圖片懶加載的優(yōu)點及實現(xiàn)原理

    這篇文章主要介紹了JS圖片懶加載的優(yōu)點及實現(xiàn)原理,文中通過示例代碼介紹的非常詳細,對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友可以參考下
    2020-01-01
  • echarts中tooltip添加點擊事件代碼示例

    echarts中tooltip添加點擊事件代碼示例

    這篇文章主要給大家介紹了關(guān)于echarts中tooltip添加點擊事件的相關(guān)資料,echarts tooltip點擊事件是指當(dāng)用戶點擊圖表中的提示框(tooltip)時觸發(fā)的事件,需要的朋友可以參考下
    2023-07-07
  • Js實現(xiàn)自定義右鍵行為

    Js實現(xiàn)自定義右鍵行為

    本文主要給大家分享的是一則javascript實現(xiàn)的自定義右鍵行為的小技巧,非常的簡單實用,有相同需求的小伙伴可以參考下。
    2015-03-03
  • javascript獲取本機操作系統(tǒng)類型的方法

    javascript獲取本機操作系統(tǒng)類型的方法

    關(guān)于我們使用電腦的操作系統(tǒng),我們通過鼠標(biāo)點擊就能獲取,如果我們想用腳本怎么實現(xiàn)javascript獲取本機操作系統(tǒng)類型的方法呢,下面給大家分享javascript獲取本機操作系統(tǒng)類型的方法,需要的朋友可以參考下
    2015-08-08
  • BootStrap 附加導(dǎo)航組件

    BootStrap 附加導(dǎo)航組件

    Bootstrap 是一個用于快速開發(fā) Web 應(yīng)用程序和網(wǎng)站的前端框架,主要基于 HTML、CSS、JAVASCRIPT 的。接下來通過本文給大家介紹BootStrap 附加導(dǎo)航組件的知識,感興趣的朋友一起學(xué)習(xí)吧
    2016-07-07
  • js獲取input長度并根據(jù)頁面寬度設(shè)置其大小及居中對齊

    js獲取input長度并根據(jù)頁面寬度設(shè)置其大小及居中對齊

    這篇文章主要介紹了js獲取input長度并根據(jù)頁面寬度設(shè)置其大小及居中對齊的方法,需要的朋友可以參考下
    2014-08-08
  • JS模擬酷狗音樂播放器收縮折疊關(guān)閉效果代碼

    JS模擬酷狗音樂播放器收縮折疊關(guān)閉效果代碼

    這篇文章主要介紹了JS模擬酷狗音樂播放器收縮折疊關(guān)閉效果代碼,涉及JavaScript響應(yīng)鼠標(biāo)事件控制頁面元素樣式變換的相關(guān)技巧,具有一定參考借鑒價值,需要的朋友可以參考下
    2015-10-10

最新評論