WEBVTT

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

2
00:00:01.097 --> 00:00:04.207
今回はパース・イントを紹介します。

3
00:00:04.207 --> 00:00:11.523
これは、文字列の先頭から整数として読める部分を読み取るためのグローバル関数です。

4
00:00:11.523 --> 00:00:20.303
たとえば、四十二ピクセルのような単位付きの文字列から、数値の部分だけを取り出す場面で活躍します。

5
00:00:20.303 --> 00:00:26.338
この動画では、書き方と引数と戻り値、記事の基本例、先頭から読んで途中で止まる仕組み、

6
00:00:26.338 --> 00:00:32.374
基数の指定方法、失敗したときの扱い、マップへ直接渡す落とし穴、そして入力検証の実例まで、

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

8
00:00:38.410 --> 00:00:44.812
前回学んだパース・フロートと並ぶ、文字列を数値へ変える入口の関数です。

9
00:00:44.812 --> 00:00:46.735
まず動作環境を確認します。

10
00:00:46.735 --> 00:00:53.392
パース・イントは、オブジェクトを通さず関数名を直接書いて使う、古くからある標準の関数です。

11
00:00:53.392 --> 00:00:59.900
クロームとファイアーフォックス、サファリでは初代の版から、エッジでは十二以降で使えます。

12
00:00:59.900 --> 00:01:04.930
ノード・ジェイエスではゼロ・十・ゼロという古い版から対応しています。

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

14
00:01:09.220 --> 00:01:14.101
現在使われている環境であれば、ほぼどこでもそのまま使えるでしょう。

15
00:01:14.101 --> 00:01:19.574
追加の読み込みは不要で、関数として備わっていることを実機でも確認済みです。

16
00:01:19.574 --> 00:01:23.864
迷ったときは、使う環境で一度実行して確かめるのが確実です。

17
00:01:23.864 --> 00:01:25.577
書き方を確認します。

18
00:01:25.577 --> 00:01:30.886
関数名を書いて、カッコの中に読み取りたい値と、基数を渡します。

19
00:01:30.886 --> 00:01:34.483
基数とは、何進数として読むかを示す数です。

20
00:01:34.483 --> 00:01:40.649
十進数を読む場合は、第二引数に十を明示するのが記事でも勧める書き方です。

21
00:01:40.649 --> 00:01:43.218
戻り値はナンバー型の整数です。

22
00:01:43.218 --> 00:01:52.124
スライドの例では、四十二という文字列が、数値の四十二になり、型もナンバーであることを実機で確認しました。

23
00:01:52.124 --> 00:01:56.406
大切なのは、文字列全体が数値でなくてもよい点です。

24
00:01:56.406 --> 00:02:00.688
先頭に整数があれば、その部分だけが取り出されます。

25
00:02:00.688 --> 00:02:06.169
逆に、先頭から読めなければ、例外ではなくナンという値が返ります。

26
00:02:06.169 --> 00:02:09.252
まずはこの基本の形を覚えてください。

27
00:02:09.252 --> 00:02:11.001
記事の基本例を見ます。

28
00:02:11.001 --> 00:02:18.156
四十二ピクセルという、数値に単位が付いた文字列を、基数十でパース・イントへ渡すコードです。

29
00:02:18.156 --> 00:02:22.608
実行結果は四十二で、ノードの実機結果とも一致しています。

30
00:02:22.608 --> 00:02:28.332
末尾の単位の文字は無視され、先頭の整数だけが数値として取り出されました。

31
00:02:28.332 --> 00:02:34.852
読み方はシンプルで、単位付きデータから計算に使える整数を抜き出す、ということです。

32
00:02:34.852 --> 00:02:36.760
ただし注意点もあります。

33
00:02:36.760 --> 00:02:40.735
単位が正しいかどうかまで、この関数は確認しません。

34
00:02:40.735 --> 00:02:45.823
ピクセルなのか別の単位なのかといった検証は、別の処理で必要です。

35
00:02:45.823 --> 00:02:53.296
まずはこの例をコンソールかノードで実行し、数値の部分を変えて予測してから確かめてみてください。

36
00:02:53.296 --> 00:02:56.044
先頭から読む仕組みを詳しく見ます。

37
00:02:56.044 --> 00:02:59.924
まず、文字列の先頭にある空白は読み飛ばされます。

38
00:02:59.924 --> 00:03:05.906
そのあとにマイナスの符号があれば符号として読み、数字の並びを読み取ります。

39
00:03:05.906 --> 00:03:14.797
スライドの一行目では、空白とマイナス記号の付いた文字列から、マイナス十二が取り出せたことを実機で確認しました。

40
00:03:14.797 --> 00:03:22.719
二行目が大切で、小数点を含む文字列を渡しても、小数点の手前で止まり、十二という整数だけが返ります。

41
00:03:22.719 --> 00:03:27.892
四捨五入ではなく、小数部分は切り捨てられる点に注意してください。

42
00:03:27.892 --> 00:03:34.844
どこから数値が始まり、どこで止まるかという先頭の読み方が、結果を左右するポイントです。

43
00:03:34.844 --> 00:03:37.851
読み取りが途中で止まる動きを確認します。

44
00:03:37.851 --> 00:03:42.210
パース・イントは、先頭から整数として読める間だけ読み進め、読めない文字が出た時点で止まり、

45
00:03:42.210 --> 00:03:46.570
そこまでの部分を返します。

46
00:03:46.570 --> 00:03:53.786
スライドの一行目では、途中に文字を含む文字列が、十二まで読んで止まったことを実機で確認しました。

47
00:03:53.786 --> 00:03:58.447
ここで、よく似た変換であるナンバーとの違いも押さえてください。

48
00:03:58.447 --> 00:04:02.205
ナンバーは文字列全体が数値でないとナンになります。

49
00:04:02.205 --> 00:04:05.888
単位付きの文字列を渡すと、ナンバーではナン、パース・イントでは四十二と、

50
00:04:05.888 --> 00:04:09.572
結果がはっきり分かれます。

51
00:04:09.572 --> 00:04:14.232
ゆるく先頭だけ読むのか、全体を厳密に読むのかで選んでください。

52
00:04:14.232 --> 00:04:16.305
失敗したときの動きを見ます。

53
00:04:16.305 --> 00:04:21.488
先頭が文字の文字列は、後ろに数字があっても読み取れず、ナンが返ります。

54
00:04:21.488 --> 00:04:23.413
空文字列も同じくナンです。

55
00:04:23.413 --> 00:04:31.410
どちらも例外は発生せず、値としてナンが返るだけなので、そのまま計算に使うと結果までナンに染まってしまいます。

56
00:04:31.410 --> 00:04:36.149
そこで判定には、以前学んだナンバー・イズ・ナンを組み合わせます。

57
00:04:36.149 --> 00:04:44.145
スライドの二行目では、空文字列の読み取り結果がナンかどうかを判定し、トゥルーになることを実機で確認しました。

58
00:04:44.145 --> 00:04:49.180
読み取った直後に必ず失敗を確かめる、という流れを習慣にしてください。

59
00:04:49.180 --> 00:04:51.815
第二引数の基数を詳しく見ます。

60
00:04:51.815 --> 00:04:56.031
基数に十六を指定すると、十六進数として読みます。

61
00:04:56.031 --> 00:05:03.410
スライドの一行目では、エフエフという文字列が二五五になったことを実機で確認しました。

62
00:05:03.410 --> 00:05:09.207
基数に二を指定すれば二進数として読み、一ゼロ一ゼロが十になります。

63
00:05:09.207 --> 00:05:13.247
色コードやビット列を扱うときに使う考え方です。

64
00:05:13.247 --> 00:05:15.882
逆に注意したいのがカンマです。

65
00:05:15.882 --> 00:05:22.909
三行目では、千を表すカンマ付きの文字列が、カンマの手前で止まって一になりました。

66
00:05:22.909 --> 00:05:29.409
桁区切りのカンマは読めないので、必要なら先に取り除く前処理をしてください。

67
00:05:29.409 --> 00:05:34.328
基数は省略せず、読む形式に合わせて明示するのが安全です。

68
00:05:34.328 --> 00:05:38.422
記事でも注意されている、有名な落とし穴を見ます。

69
00:05:38.422 --> 00:05:46.099
文字列の配列をマップへそのまま渡し、パース・イントを直接指定すると、思わぬ結果になります。

70
00:05:46.099 --> 00:05:54.287
マップはコールバックへ、要素だけでなく添字も渡すため、その添字が基数として使われてしまうのです。

71
00:05:54.287 --> 00:05:58.723
実機では、結果が十、ナン、二という配列になりました。

72
00:05:58.723 --> 00:06:05.717
二番目は基数一で読めずナン、三番目は基数二で読んだため二になった、というわけです。

73
00:06:05.717 --> 00:06:13.053
対策は記事の境界例のとおり、値を受け取って基数十を明示するラッパー関数を挟むことです。

74
00:06:13.053 --> 00:06:20.388
その場合は十、十、十と正しく変換できたことを、記事の期待出力とも合わせて確認しました。

75
00:06:20.388 --> 00:06:24.869
実務に近い実例として、入力値の変換と検証を見ます。

76
00:06:24.869 --> 00:06:32.756
フォームなどから届く個数や件数の値は文字列なので、まずパース・イントで整数へ変換します。

77
00:06:32.756 --> 00:06:41.718
スライドでは、二十五という文字列が数値の二十五になり、ナンではないことも合わせて実機で確認しました。

78
00:06:41.718 --> 00:06:47.633
もし結果がナンなら、計算へ進めずに入力ミスとして扱う流れにします。

79
00:06:47.633 --> 00:06:55.162
あわせて注意したいのは、この関数は先頭さえ数値なら後ろの文字を無視してしまう点です。

80
00:06:55.162 --> 00:07:01.614
厳密な検証が必要な場面では、全体を変換するナンバーと使い分けてください。

81
00:07:01.614 --> 00:07:07.888
また、小数が必要な場面では、前回のパース・フロートを選ぶのが基本です。

82
00:07:07.888 --> 00:07:08.843
まとめです。

83
00:07:08.843 --> 00:07:14.254
パース・イントは、文字列の先頭から整数を読み取るグローバル関数です。

84
00:07:14.254 --> 00:07:16.323
判断のポイントは三つです。

85
00:07:16.323 --> 00:07:22.689
まず、先頭の空白を読み飛ばし、符号と数字を、読める範囲まで読み取って止まること。

86
00:07:22.689 --> 00:07:29.532
次に、基数は省略せず十進数なら十を明示し、十六進数や二進数ではその基数を指定すること。

87
00:07:29.532 --> 00:07:38.126
そして、マップへ直接渡さずラッパー関数を使い、読み取った直後にナンバー・イズ・ナンで失敗を確認することです。

88
00:07:38.126 --> 00:07:46.084
まずは記事の基本例をコンソールで実行し、基数や単位を変えて、結果を予測してから確かめてみてください。

89
00:07:46.084 --> 00:07:47.516
お疲れさまでした。
