WEBVTT

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

2
00:00:00.967 --> 00:00:05.320
今回はオブジェクト・フロム・エントリーズを紹介します。

3
00:00:05.320 --> 00:00:11.930
これは、キーと値の組を並べたデータから、新しいオブジェクトを作る静的メソッドです。

4
00:00:11.930 --> 00:00:16.122
たとえば、変換処理を終えた設定の一覧を、再び使いやすいオブジェクトの形へ戻す、

5
00:00:16.122 --> 00:00:20.314
といった場面で活躍します。

6
00:00:20.314 --> 00:00:26.843
この動画では、書き方と引数と戻り値、記事の基本例と境界例、重複したキーの上書き、

7
00:00:26.843 --> 00:00:33.372
変換と組み合わせる実践的な使い方、そして例外の扱いまで、実行結果と一緒に学びます。

8
00:00:33.372 --> 00:00:39.660
配列とオブジェクトの間を行き来する変換は、データ処理の要になる大切な操作です。

9
00:00:39.660 --> 00:00:44.980
変換の前後でデータの形がどう変わるかを意識しながら聞いてください。

10
00:00:44.980 --> 00:00:46.979
まず動作環境を確認します。

11
00:00:46.979 --> 00:00:53.283
オブジェクト・フロム・エントリーズは、二千十九年頃の仕様で導入されたメソッドです。

12
00:00:53.283 --> 00:00:57.819
クロームでは七十三以降、エッジでは七十九以降、ファイアーフォックスでは六十三以降、

13
00:00:57.819 --> 00:01:02.355
サファリでは十二・一以降で使えます。

14
00:01:02.355 --> 00:01:06.968
ノード・ジェイエスでは十二・ゼロ・ゼロ以降に対応しています。

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

16
00:01:11.427 --> 00:01:20.191
対応範囲は広いものの、オブジェクト・アサインほど古くはないため、公開するコードでは対象環境を先に確認してください。

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

18
00:01:25.880 --> 00:01:27.398
書き方を確認します。

19
00:01:27.398 --> 00:01:35.141
オブジェクトと書き、続けてフロム・エントリーズと書いて、カッコの中に、キーと値の組の集まりを渡します。

20
00:01:35.141 --> 00:01:42.580
引数は一つだけで、配列の配列でも、マップでも、組を取り出せる反復可能なデータであれば受け付けます。

21
00:01:42.580 --> 00:01:47.589
各組では、添字ゼロの要素がキー、添字一の要素が値として読まれます。

22
00:01:47.589 --> 00:01:51.385
戻り値は、組から作成された新しいオブジェクトです。

23
00:01:51.385 --> 00:01:54.269
渡した元のデータ自体は変更されません。

24
00:01:54.269 --> 00:01:58.065
スライドの例では、エーが一、ビーが二という二組からオブジェクトが作られることを、

25
00:01:58.065 --> 00:02:01.860
実機で確認しました。

26
00:02:01.860 --> 00:02:03.494
記事の基本例を見ます。

27
00:02:03.494 --> 00:02:08.323
テーマがダーク、言語がジェイエーという、二つの設定を、キーと値の組として並べた配列を用意し、

28
00:02:08.323 --> 00:02:13.151
フロム・エントリーズへ渡すコードです。

29
00:02:13.151 --> 00:02:17.163
実行結果は、テーマがダーク、ラングがジェイエーを持つオブジェクトとなり、

30
00:02:17.163 --> 00:02:21.174
ノードの実機結果とも一致しています。

31
00:02:21.174 --> 00:02:24.963
配列の中の一つ一つの組が、そのままオブジェクトのプロパティへ変換される、

32
00:02:24.963 --> 00:02:28.751
という対応関係が読み取れます。

33
00:02:28.751 --> 00:02:33.208
設定一覧のように、組の形でデータが手元にあるとき、そのままオブジェクトへ戻せるのが、

34
00:02:33.208 --> 00:02:37.665
このメソッドの素直な使いどころです。

35
00:02:37.665 --> 00:02:42.568
組の順番とオブジェクトの項目が対応している点にも注目してください。

36
00:02:42.568 --> 00:02:45.258
もっとも実践的な使い方を見ます。

37
00:02:45.258 --> 00:02:51.982
まずオブジェクト・エントリーズで、オブジェクトをキーと値の組の配列へ変換します。

38
00:02:51.982 --> 00:02:56.520
次にマップで各組の値を二倍に変換し、最後にフロム・エントリーズでオブジェクトへ戻す、

39
00:02:56.520 --> 00:03:01.059
という三段階の処理です。

40
00:03:01.059 --> 00:03:05.934
実行結果はエーが二、ビーが四となり、実機とも一致しました。

41
00:03:05.934 --> 00:03:12.994
この往復変換は、オブジェクトのすべての値に同じ加工を施したいときの定番パターンです。

42
00:03:12.994 --> 00:03:22.576
オブジェクトのままでは一括変換しにくい処理も、組の配列にすれば、配列の便利なメソッドをフルに使えるようになります。

43
00:03:22.576 --> 00:03:28.628
この型を覚えると、設定値の一括補正や表示用データの整形にも応用できます。

44
00:03:28.628 --> 00:03:30.688
記事の境界条件の例を見ます。

45
00:03:30.688 --> 00:03:35.545
同じキーであるエーに対して、一と二という二つの組を渡すコードです。

46
00:03:35.545 --> 00:03:39.960
実行結果はエーが二となり、記事の期待出力とも一致しています。

47
00:03:39.960 --> 00:03:45.552
つまり、同じキーが複数あると、例外にはならず、後ろの組の値で上書きされます。

48
00:03:45.552 --> 00:03:51.439
並び順が結果を決めるので、データの生成元で重複が起こり得る場合は注意が必要です。

49
00:03:51.439 --> 00:03:59.092
重複をエラーとして扱いたい場面では、フロム・エントリーズへ渡す前に、キーの重複を自分で検証してください。

50
00:03:59.092 --> 00:04:03.360
知らないうちに先の値が静かに消える、という事故を防げます。

51
00:04:03.360 --> 00:04:05.776
引数に渡せるデータの広さを確認します。

52
00:04:05.776 --> 00:04:10.227
マップはキーと値の組を取り出せるデータなので、そのまま渡すことができ、エックスが十、

53
00:04:10.227 --> 00:04:14.678
ワイが二十のオブジェクトになることを実機で確認しました。

54
00:04:14.678 --> 00:04:19.001
さらに、ユーアールエル・サーチ・パラムズも組の集まりとして渡せます。

55
00:04:19.001 --> 00:04:22.689
ただしこちらは値がすべて文字列になる点に注意してください。

56
00:04:22.689 --> 00:04:26.249
エーは数値の一ではなく、文字列の一として取り込まれます。

57
00:04:26.249 --> 00:04:31.082
数値として使いたい場合は、変換後に数値への変換を自分で加える必要があります。

58
00:04:31.082 --> 00:04:34.769
入力元の性質が結果の型に影響する、という点がポイントです。

59
00:04:34.769 --> 00:04:39.220
入力元が変わっても、呼び出し方は一つで済むのが設計の分かりやすさです。

60
00:04:39.220 --> 00:04:40.932
細かな仕様を確認します。

61
00:04:40.932 --> 00:04:45.355
空の配列を渡すと、例外にはならず、空のオブジェクトが返ります。

62
00:04:45.355 --> 00:04:49.350
データがない場合でも安全に呼べるのはありがたい性質です。

63
00:04:49.350 --> 00:04:55.199
次に、キーに数値を使うと、オブジェクトのキーとして扱うために文字列へ変換されます。

64
00:04:55.199 --> 00:05:00.621
スライドの例では、数値の一が文字列の一のキーになることを実機で確認しました。

65
00:05:00.621 --> 00:05:05.757
また、シンボルをキーに渡した場合は、そのままシンボルキーとして使えます。

66
00:05:05.757 --> 00:05:12.320
キーの型は、文字列かシンボルへそろえられる、と覚えておくと、取り出し時の食い違いを防げます。

67
00:05:12.320 --> 00:05:13.428
注意点を見ます。

68
00:05:13.428 --> 00:05:19.108
引数そのものにヌルやアンディファインドを渡すと、タイプ・エラーの例外が発生します。

69
00:05:19.108 --> 00:05:22.294
組を取り出せないデータも同様に例外になります。

70
00:05:22.294 --> 00:05:27.004
外部から受け取ったデータを渡すときは、事前に存在確認をしてください。

71
00:05:27.004 --> 00:05:29.359
もう一つ、値が欠けた組の扱いです。

72
00:05:29.359 --> 00:05:36.147
値のない組を渡すと、値はアンディファインドとなり、ジェイソン文字列化ではそのキーが表示されません。

73
00:05:36.147 --> 00:05:39.195
スライドの結果はどちらも実機で確認済みです。

74
00:05:39.195 --> 00:05:46.260
データの欠けが静かに進む場合があるので、組の形がそろっているかを、生成側でそろえておくことが大切です。

75
00:05:46.260 --> 00:05:54.211
実務に近い実例として、名前と年齢という項目の組から、利用者オブジェクトを作る例を見ます。

76
00:05:54.211 --> 00:06:03.247
組の配列をフロム・エントリーズへ渡すだけで、ドット記法で値を取り出せる通常のオブジェクトになります。

77
00:06:03.247 --> 00:06:12.102
年齢は文字列の三十として取り込まれるため、数値として計算したい箇所ではナンバーの変換を添えました。

78
00:06:12.102 --> 00:06:17.523
前回学んだオブジェクト・アサインとの違いも押さえてください。

79
00:06:17.523 --> 00:06:23.125
アサインは既存のターゲットを変更しますが、フロム・エントリーズは常に対象の新しいオブジェクトを返し、

80
00:06:23.125 --> 00:06:28.727
元データは変更しません。

81
00:06:28.727 --> 00:06:33.245
変換用途では、こちらのほうが意図が明確で安全です。

82
00:06:33.245 --> 00:06:39.208
項目が増えても、組を並べるだけで対応できる柔軟さも利点の一つです。

83
00:06:39.208 --> 00:06:40.345
まとめです。

84
00:06:40.345 --> 00:06:50.196
オブジェクト・フロム・エントリーズは、キーと値の組の集まりから新しいオブジェクトを作る静的メソッドです。

85
00:06:50.196 --> 00:06:52.659
判断のポイントは三つです。

86
00:06:52.659 --> 00:06:59.290
まず、引数は組を取り出せるデータであれば、配列でもマップでもよいこと。

87
00:06:59.290 --> 00:07:07.246
次に、同じキーは後ろの組が優先されるので、重複が問題になる場合は事前に検証すること。

88
00:07:07.246 --> 00:07:16.908
そして、エントリーズで組の配列へ分解し、加工してから戻す往復変換が、最も実践的な使い方であることです。

89
00:07:16.908 --> 00:07:25.623
まずは記事の基本例と境界例を実行し、組を一か所変えて結果を予測してから確かめてみてください。

90
00:07:25.623 --> 00:07:32.443
次に学ぶオブジェクト・エントリーズと合わせると、変換の理解が完成します。

91
00:07:32.443 --> 00:07:34.148
お疲れさまでした。