0
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

JavaScript自己学習(文字列操作編)

Last updated at Posted at 2022-10-09

JavaScriptを勉強し始めたのでアウトプット兼ねて記事を書いてみる。
今回はString(文字列)の処理で基本的なもの、よく使いそうなものを書いていく。

文字長

length

文字の長さはlengthプロパティで取れる。

length.js
let str = "JavaScript";
console.log(str.length)
// -> 10

文字列検索

includes ( [検索したい文字] )

引数の文字列が含まれていればtrue、なければfalseを返す。

include.js
let str = "Hi,JavaScript World!";
console.log(str.includes("Java"));
// -> true
console.log(str.includes("python"));
// -> false

indexOf ( [検索したい文字] )

includesと似ているがこちらは文字列が含まれていた場合に文字位置を数値で返す。
含まれていない場合は-1を返す。

indexOf.js
let str = "Hi,JavaScript World!";
console.log(str.indexOf("Java"));
// -> 3
console.log(str.indexOf("python"));
// -> -1

if(str.includes(~)) ⇒ if(str.indexOf(~) > 0) とも置き換えられる。

文字列抽出

substring ( [開始位置] (, [終了位置]) )

部分文字列を切り出す処理
開始位置は0から数える?1から数える?とかめちゃくちゃ迷う
文字列先頭に0から「01234...」と番号を振って数えるとわかりやすいと思う。
・開始位置 ⇒ 開始文字の番号
・終了位置 ⇒ 終了文字の番号+1

第2引数の終了位置を省略した場合は開始位置から文字列末尾まで切り出す。

substring.js
let str = "Hi,JavaScript World!";
// 番号振る 01234567890123456789
// "Java"を切り出したい時は番号 3456 なので 引数は(3, 6+1)
console.log(str.substring(3, 7));
// -> "Java"

// 第2引数の終了位置を省略した場合は末尾まで
console.log(str.substring(3));
// -> "JavaScript World!"

slice ( [開始位置] (, [終了位置]) )

使い方はsubstringと同じ
[開始位置]>[終了位置]の場合の挙動が異なる。
・substring ⇒ 第1引数と第2引数を入れ替えた時と同等
・slice ⇒ 空文字を返す

slice.js
let str = "Hi,JavaScript World!";
// substringの場合はsubstring(3, 7)と同等
console.log(str.substring(7, 3));
// -> "Java"

// sliceの場合は空文字
console.log(str.slice(7, 3))
// -> ""(空文字)

substr ( [開始位置], [文字数] )

substrという関数も存在する。(まぎらわしい)
substringやsliceと違い第2引数に文字数を指定する。(まぎらわしい)
※ただし今後削除予定の処理のため使用は非推奨(MDN Web Docs [String.prototype.substr()])

試験とかの引っ掛け問題で出るかもしれないから覚えたけど実務で使うことはないでしょう。

文字列加工

padStart ( [加工後の文字列の長さ] (, [付加する文字]) )

文字列の左側に指定長さ分だけ文字を付加する。
先頭0パディングするときなどに使う。
第2引数を省略した場合は半角スペース埋めされる。

padStart.js
let str = "12345";
console.log(str.padStart(10, "0"));
// -> "0000012345"
console.log(str.padStart(10));
// -> "     12345"

padEnd ( [加工後の文字列の長さ] (, [付加する文字]) )

padStartと逆で文字列の右側に指定長さ分だけ文字を付加する。

padEnd.js
let str = "12345";
console.log(str.padEnd(10, "0"));
// -> "1234500000";
console.log(str.padEnd(10));
// -> "12345     ";

toLowerCase()

小文字に変換する。

toLowerCase.js
let str = "JavaScript";
console.log(str.toLowerCase())
// -> "javascript"

toUpperCase()

大文字に変換する。

toUpperCase.js
let str = "JavaScript";
console.log(str.toUpperCase())
// -> "JAVASCRIPT"

trim()

文字列の先頭と末尾の全角半角スペースを削除する。
文字の間にあるスペースは削除しない。

trim.js
let str = "  Java Script   ";
console.log(str.trim());
// -> "Java Script"
0
1
2

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?