吐槽Javascript系列一：slice()、substr()和 substring()

moddx發表於2019-02-16
JavaScript

實不相瞞，對於字串中的slice()、substr()和 substring()這三個方法，我自己很長一段時間都是理不清的，每次用都得查一下文件，因為他們長得實在是太像了。

特性

我們先來溫習一下，他們的特性如下：

  • 這三個方法都會返回被操作字串的一個子字串，而且也都接受一或兩個引數
  • 這三個方法都不會改變原字串
  • 第一個引數指定子字串的開始位置，第二個引數（在指定的情況下）表示子字串到哪裡結束。具體來說，slice()和substring()的第二個引數指定的是子字串最後一個字元後面的位置，而substr()的第二個引數指定的則是返回的字元個數

我們來看幾個簡單的例子：

const str = `hello world`
console.log(str.slice(3)) // lo world
console.log(str.substring(3)) // lo world
console.log(str.substr(3)) // lo world

console.log(str.slice(3, 7)) // lo w
console.log(str.substring(3, 7)) // lo w
console.log(str.substr(3, 7)) // lo worl

吐槽

substring()：slice()和substr()二位兄臺，非在下自大，你們能做的，我都能做！我感覺你們沒有存在的必要！
slice()：我們在傳入負值的時候，是不一樣的。

console.log(str.slice(-3)) // rld
console.log(str.substring(-3)) // hello world

substring()：我們當然是有一些區別，但我想說的是你們能做的，我都能做！
substr()：非在下自大，我感覺你們能做的，我也都能做啊。
slice()：非在下自大，我感覺你們能做的，我也都能做啊。

點評

我們來看這樣一個例子：給定一個字串，要求去掉最後一個逗號。

let str = `a,b,`
let newStr = str.substring(0, str.length - 1)

上面是substring()的寫法，我們在來看看slice()的寫法：

let str = `a,b,`
let newStr = str.slice(0, str.length - 1)

再來看看substr()的寫法：

let str = `a,b,`
let newStr = str.substr(0, str.length - 1)

這三個方法都能做到，並且寫法也完全一樣，這正是讓人容易困惑的地方！
還有一個要命的地方在於，陣列中也有slice方法。
大膽假想一下，如果把substr()踢出去，就保留substring()和slice()，你還會懵嗎？
或者更大膽一點，把substr()和slice()都踢出去，就只保留substring()，我反正感覺整個世界都清靜了！

相關文章