點燈坊

失くすものさえない今が強くなるチャンスよ

使用 startsWith() 判斷是否以特定 String 開始

Sam Xiao's Avatar 2020-07-24

實務上常須判斷 String 是否以特定 String 開始,這種常見需求,該如何實現呢 ?

Version

macOS Catalina 10.15.6
VS Code 1.47.2
Quokka 1.0.309
Ramda 0.27.0

substring()

let data = 'FP in JavaScript'

let startsWith = prefix => s => s.substring(0, prefix.length) === prefix

startsWith('FP')(data) // ?

最直覺方式是透過內建的 String.prototype.substring() 取得部分 String 比較。

startswith000

slice()

let data = 'FP in JavaScript'

let startsWith = prefix => s => s.slice(0, prefix.length) === prefix

startsWith('FP')(data) // ?

也可以透過 String.prototype.slice() 回傳部分 String 比較。

startswith001

indexOf()

let data = 'FP in JavaScript'

let startsWith = prefix => s => s.indexOf(prefix) === 0

startsWith('FP')(data) // ?

也可以透過 String.prototype.indexOf() 判斷 String 是否存在,不過這種寫法較不直覺。

startswith006

Regular Expression

let data = 'FP in JavaScript'

let startsWith = prefix => s => new RegExp(`^${prefix}`).test(s)

startsWith('FP')(data) // ?

當然也可以透過 RegExp^ 表示一行的開始。

startswith002

startsWith()

let data = 'FP in JavaScript'

let startsWith = prefix => s => s.startsWith(prefix)

startsWith('FP')(data) // ?

ES6 新增了 String.prototype.startsWith(),可直接進行比較,語意更佳。

startswith007

Functional

import { pipe, take, equals } from 'ramda'

let data = 'FP in JavaScript'

let startsWith = prefix => pipe(
  take(prefix.length),
  equals(prefix)
)

startsWith('FP')(data) // ?

撇開 ECMAScript 內建 function,若以 functional 角度思考:

  • 使用 take() 先取得 prefix 長度的 String

  • 使用 equals() 比較 take() 所回傳 String 是否與 prefix 相等

最後以 pipe() 整合所有流程,非常清楚。

startswith008

Ramda

import { startsWith } from 'ramda'

let data = 'FP in JavaScript'

startsWith('FP')(data) // ?

事實上 Ramda 已經內建 startsWith(),可直接使用。

startsWith()
String → String → Boolean
判斷 String 是否以特定 String 開始

String:要判斷的特定 String

String:data 為 String

Boolean:回傳判斷結果

startswith003

Conclusion

  • startsWith() 大都用在 String,其實也能用在 Array
  • ES6 的 startsWith() 與 Ramda 的 startsWith() 功能相同,只是 ES6 為 OOP,而 Ramda 為 FP
  • Ramda 的 startsWith() 底層也是使用 take()equals() 組合而成

Reference

Samantha Ming, String startsWith() Method in JavaScript
MDN, String.prototype.substring()
MDN, String.prototype.slice()
MDN, String.prototype.indexOf()
MDN, String.prototype.startsWith()
Ramda, startsWith()
Ramda, pipe()
Ramda, take()
Ramda, equals()