WEBVTT

1
00:00:00.000 --> 00:00:00.865
こんにちは。

2
00:00:00.865 --> 00:00:03.314
今回はスターツウィズを紹介します。

3
00:00:03.314 --> 00:00:08.790
これは、文字列が指定した文字列から始まっているかどうかを調べるメソッドです。

4
00:00:08.790 --> 00:00:14.841
たとえばファイル名がドラフトの下書き用接頭辞から始まるか、といった分類で活躍します。

5
00:00:14.841 --> 00:00:19.212
この動画では、書き方と引数と戻り値、記事の基本例であるファイル名のチェックと、

6
00:00:19.212 --> 00:00:23.583
開始位置を指定する境界例、大文字と小文字の区別や正規表現が使えない注意点まで、

7
00:00:23.583 --> 00:00:27.954
実行結果と一緒に学びます。

8
00:00:27.954 --> 00:00:35.590
前回のパッドスタートで文字列の見た目を整えた流れで、今回は文字列の中身を判定する基本操作を押さえましょう。

9
00:00:35.590 --> 00:00:39.481
真か偽かで答えが返る、とても分かりやすいメソッドです。

10
00:00:39.481 --> 00:00:44.380
合っているか合っていないかだけを知りたい場面に、ぴったりの道具です。

11
00:00:44.380 --> 00:00:46.188
まず動作環境を確認します。

12
00:00:46.188 --> 00:00:50.498
スターツウィズはイーエス二千十五で加わった文字列メソッドです。

13
00:00:50.498 --> 00:00:54.252
クロームでは四十一以降、エッジでは十二以降、ファイアーフォックスでは十七以降、

14
00:00:54.252 --> 00:00:58.006
サファリでは九以降で使えます。

15
00:00:58.006 --> 00:01:02.039
ノード・ジェイエスでは四・ゼロ・ゼロ以降に対応しています。

16
00:01:02.039 --> 00:01:06.071
記事の互換性情報はエムディーエヌのデータに基づく目安です。

17
00:01:06.071 --> 00:01:09.756
現在の主要環境ではほぼ心配ありませんが、古いブラウザーを対象にする場合は、

18
00:01:09.756 --> 00:01:13.441
先に対応状況を確認してください。

19
00:01:13.441 --> 00:01:19.280
追加の読み込みは不要で、空文字列にも関数として備わっていることを実機で確認済みです。

20
00:01:19.280 --> 00:01:24.008
迷ったときは、実際に使う環境で小さなコードを試してみるのが確実です。

21
00:01:24.008 --> 00:01:25.649
書き方を確認します。

22
00:01:25.649 --> 00:01:32.215
対象の文字列に続けてスターツウィズと書き、カッコの中に探したい文字列を渡します。

23
00:01:32.215 --> 00:01:36.647
第一引数が検索文字列、第二引数が比較を始める位置です。

24
00:01:36.647 --> 00:01:41.079
第二引数を省略すると、先頭のゼロ文字目から比較します。

25
00:01:41.079 --> 00:01:48.630
戻り値は、始まっていればトゥルー、そうでなければフォルスで、元の文字列自体は変更されません。

26
00:01:48.630 --> 00:01:53.801
スライドの例では、ハローがエイチイーで始まるのでトゥルー、エルオーでは始まらないのでフォルスになることを、

27
00:01:53.801 --> 00:01:58.971
実機で確認しました。

28
00:01:58.971 --> 00:02:03.731
位置はゼロから数える添字で考える点も覚えておいてください。

29
00:02:03.731 --> 00:02:08.820
検索文字列が対象より長い場合は、当然ながらフォルスになります。

30
00:02:08.820 --> 00:02:10.779
記事の基本例を見ます。

31
00:02:10.779 --> 00:02:20.217
ファイル名ドラフト・レポート・エムディーが、ドラフト・ハイフンという接頭辞から始まるかを調べるコードです。

32
00:02:20.217 --> 00:02:28.053
実行するとトゥルーと表示され、記事の期待出力と一致し、ノードの実機結果とも一致しました。

33
00:02:28.053 --> 00:02:32.327
記事が紹介するように、ファイル名の接頭辞や内部的な識別子を分類する場面で、

34
00:02:32.327 --> 00:02:36.601
そのまま使える形です。

35
00:02:36.601 --> 00:02:42.834
たとえば下書きだけを一覧から選び分けたり、処理を分岐させたりできます。

36
00:02:42.834 --> 00:02:50.313
全体の構造まで厳密に確認したい場合は、専用の解析や追加の条件と組み合わせてください。

37
00:02:50.313 --> 00:02:56.368
接頭辞のハイフンまで含めて調べると、似た名前との取り違えを防げます。

38
00:02:56.368 --> 00:03:00.850
実践的な使い方として、ファイル名の一覧を分類する例を見ます。

39
00:03:00.850 --> 00:03:05.855
ドラフト・エー、ファイナル、ドラフト・ビーという三つのファイル名にフィルターをかけ、

40
00:03:05.855 --> 00:03:10.860
ドラフト・ハイフンで始まるものだけを残しています。

41
00:03:10.860 --> 00:03:16.239
結果はドラフト・エーとドラフト・ビーの二件となり、実機とも一致しました。

42
00:03:16.239 --> 00:03:22.365
条件式にスターツウィズをそのまま渡せるのは、戻り値がトゥルーかフォルスだからです。

43
00:03:22.365 --> 00:03:27.519
ユーアールエルがエイチティーティーピーエスから始まるかの確認や、注文番号の頭文字での振り分けなど、

44
00:03:27.519 --> 00:03:32.674
接頭辞で分類する処理全般に応用できます。

45
00:03:32.674 --> 00:03:37.604
並び順は元の配列の順序がそのまま保たれる点も、実機で確認済みです。

46
00:03:37.604 --> 00:03:41.035
第二引数である開始位置の動きを確認します。

47
00:03:41.035 --> 00:03:46.508
ジャバスクリプトという文字列は、先頭からではスクリプトで始まりませんが、

48
00:03:46.508 --> 00:03:51.981
四文字目から比較するとスクリプトと一致してトゥルーになります。

49
00:03:51.981 --> 00:03:59.170
ハロー・ワールドで六文字目からワールドを探す例もトゥルーで、どちらも実機と一致しました。

50
00:03:59.170 --> 00:04:05.705
つまり第二引数は、文字列を切り出すのではなく、比較を始める場所をずらす指定です。

51
00:04:05.705 --> 00:04:10.769
決まった接頭辞の後ろにある部分だけを確かめたい場合に便利です。

52
00:04:10.769 --> 00:04:16.161
位置の数え方はゼロ始まりなので、実際に数えながら指定してください。

53
00:04:16.161 --> 00:04:21.552
開始位置を省略した場合は、ゼロを指定した場合と同じ動きになります。

54
00:04:21.552 --> 00:04:23.750
記事の境界条件の例を見ます。

55
00:04:23.750 --> 00:04:29.874
エービーシーという文字列を位置一から調べ、ビーで始まるかを確認するコードです。

56
00:04:29.874 --> 00:04:36.154
一文字目がビーなのでトゥルーとなり、実行結果は記事の期待出力とも一致しています。

57
00:04:36.154 --> 00:04:41.728
あわせて、検索文字列に空文字列を渡すと常にトゥルーになること、開始位置を文字列の長さより大きくするとフォルスになることも、

58
00:04:41.728 --> 00:04:47.302
実機で確認しました。

59
00:04:47.302 --> 00:04:52.562
空文字列が常に一致する点は、入力チェックで空の条件を素通りさせてしまう落とし穴になるため、

60
00:04:52.562 --> 00:04:57.822
空でないことの確認と組み合わせると安全です。

61
00:04:57.822 --> 00:05:03.004
境界の動きを先に知っておくと、想定外のトゥルーに驚かずに済みます。

62
00:05:03.004 --> 00:05:06.131
よく似たメソッドとの使い分けを整理します。

63
00:05:06.131 --> 00:05:14.916
スターツウィズが先頭を調べるのに対して、エンズウィズは末尾を調べ、インクルーズは場所を問わず含まれているかを調べます。

64
00:05:14.916 --> 00:05:20.500
スライドのハロー・ワールドの例では、ハローで始まること、ワールドを含むこと、

65
00:05:20.500 --> 00:05:26.084
ワールドで終わることの三つが、すべてトゥルーになり、実機とも一致しました。

66
00:05:26.084 --> 00:05:31.742
ファイルの拡張子を確認したいならエンズウィズ、キーワードがどこかに入っているかだけ知りたいならインクルーズ、

67
00:05:31.742 --> 00:05:37.400
というように、調べたい場所で選んでください。

68
00:05:37.400 --> 00:05:39.931
引数の形は三つともよく似ています。

69
00:05:39.931 --> 00:05:44.696
三つとも元の文字列は変更せず、真偽だけを返す点は共通しています。

70
00:05:44.696 --> 00:05:48.302
注意点として、大文字と小文字の扱いを見ます。

71
00:05:48.302 --> 00:05:51.580
スターツウィズは大小を厳密に区別します。

72
00:05:51.580 --> 00:05:55.596
大文字エイチで始まるハローに対して、小文字のハローを探すとフォルスになり、

73
00:05:55.596 --> 00:05:59.612
実機でも確認できました。

74
00:05:59.612 --> 00:06:08.791
利用者が入力した文字列は大小がばらつくことが多いため、そのまま比べると一致するはずのものを見逃す場合があります。

75
00:06:08.791 --> 00:06:15.184
大小を区別したくない場合は、両方を小文字にそろえてから比較する方法が確実です。

76
00:06:15.184 --> 00:06:22.232
逆に、識別子のように大小まで含めて厳密に分けたい場合は、この区別がそのまま役立ちます。

77
00:06:22.232 --> 00:06:25.347
目的に合わせて前処理を決めてください。

78
00:06:25.347 --> 00:06:30.756
ファイル名の拡張子など、大小が決まっている対象では区別が有利です。

79
00:06:30.756 --> 00:06:32.342
もう一つの注意点です。

80
00:06:32.342 --> 00:06:37.966
スターツウィズの第一引数に正規表現を渡すと、タイプ・エラーの例外が発生します。

81
00:06:37.966 --> 00:06:43.156
実機でも、正規表現は使えないという内容のエラーになることを確認しました。

82
00:06:43.156 --> 00:06:48.780
柔軟なパターンで調べたい場合は、正規表現のテストなど別の方法を選んでください。

83
00:06:48.780 --> 00:06:53.250
また記事も注意するように、ユーアールエルがエイチティーティーピーエスで始まることだけを根拠に、

84
00:06:53.250 --> 00:06:57.720
安全だと判断してはいけません。

85
00:06:57.720 --> 00:07:05.362
見た目が似た別ドメインも先頭は一致してしまうため、安全性の判断にはドメインの解析など追加の確認が必要です。

86
00:07:05.362 --> 00:07:09.976
先頭が合うことは必要条件の一つに過ぎない、と捉えるのが安全です。

87
00:07:09.976 --> 00:07:11.021
まとめです。

88
00:07:11.021 --> 00:07:18.860
スターツウィズは、文字列が指定の文字列から始まるかをトゥルーかフォルスで返すメソッドです。

89
00:07:18.860 --> 00:07:21.125
判断のポイントは三つです。

90
00:07:21.125 --> 00:07:26.351
まず、第一引数に検索文字列を指定し、戻り値で分岐できること。

91
00:07:26.351 --> 00:07:30.532
次に、第二引数で比較を始める位置をずらせること。

92
00:07:30.532 --> 00:07:35.758
そして、大文字と小文字を区別し、正規表現は渡せないことです。

93
00:07:35.758 --> 00:07:45.340
まずは記事の基本例と境界例を実行し、検索文字列や開始位置を一つ変えて、結果を予測してから確かめてみてください。

94
00:07:45.340 --> 00:07:51.959
次回のリプレイスオールと合わせると、文字列の判定と変換を組み合わせられます。

95
00:07:51.959 --> 00:07:53.527
お疲れさまでした。

96
00:07:53.527 --> 00:07:59.276
小さな判定を積み重ねることで、読みやすい分類処理が作れるはずです。