30歳からのプログラミングスマートフォン用の表示で見る30歳からのプログラミング30歳無職から独学でプログラミングを開始した人間の記録。構造的部分型という概念は、直感的で分かりやすい。プリミティブ型の挙動など、よく理解しておかないと戸惑ってしまうような挙動も多い。以下のコードがエラーにならないのか、最初は分からなかった。Symbol('a');また、下記のコードでbarだけがエラーになるのも分かりづらい。OKこの記事では、これらの挙動を理解できるようになることをゴールとし、その過程を通して、構造的部分型について学んでいく。v3.7.5で行っている。構造的部分型という考え方を採用している。つの構造体のプロパティをチェックし、それが一致すれば両者には互換性があると見做す。下記のコードでは、Personという型とBookという型を定義している。それぞれは独立した存在であり、継承関係などはない。greetという関数は、Person型を引数として受け取る。${person.name}.`);};しかしgreetにPersonではなくBookを渡しても、エラーにはならない。三体.これは、BookはPersonと互換性があると見做されるためである。stringというプロパティさえ持っていれば、その型はPersonと互換性があると判断される。Bookはnameの他にcategoryというプロパティを持っているが、これは問題にはならない。構造的部分型では、必要なプロパティ(Personの場合はname)さえ存在すれば、それ以外のプロパティの有無は問わないためである。「余分なプロパティは問題にならない」という性質上、空のオブジェクトは、どんなオブジェクトに対しても互換性を持つ。foo;プロパティの過剰が問題にならない一方、プロパティの不足は問題になる。Bookの場合、nameだけでなくcategoryもなければ、条件を満たさない。構造的部分型では余分なプロパティは問題にならない、と書いてきたが、例外もある。呼ばれる挙動で、オブジェクトリテラルに対しては型のチェックが厳しくなり、余分なプロパティが許容されなくなる。下記のコードでは全く同じ値をgreetに渡しているが、一度変数に代入しておいた場合はエラーにならず、オブジェクトリテラルをgreetに渡した場合のみエラーになっている。Errorなぜこのような紛らわしい挙動になっているのか分からなかったが、以下の記事を読んで納得できた。typescript-jp.gitbook.ioオブジェクトリテラルを渡す際にわざわざ余分なプロパティを書いていればそれは、勘違いやタイプミスである可能性が高い。そのため、エラーを出すようにしている。可読性を高める効果もある。以下のようなコードを許可してしまうと、わざわざcategoryを渡しているのだから、greetにcategoryを渡すことに意味があるように読めてしまう。実際には、この値はgreet内で全く使われない。このような挙動をしているのかは、分からなかった。1};プリミティブ型と構造的部分型{}型はどんなオブジェクトも許容するだけでなく、nullとundefined以外のプリミティブ型も許容する。undefined;この挙動を理解するためにまず、型としてのプリミティブ型について調べていく。これを利用することで、対象となる型がどんな名前のプロパティを持っているのか調べることができる。Point;これをプリミティブ型に対して使ってみる。symbol;この結果を見ると、プリミティブ型はプロパティを持った構造体でもある、と言える。このプロパティは、各プリミティブ型に対応するインスタンスオブジェクトのプロトタイプメソッドと、ほぼ一致する。数値型の場合、constructor以外は一致している。number;若干の差異はあるが、他のプリミティブ型も同様の結果になる。stringの結果にnumberが含まれるのは、文字列に対してはブラケット記法で数値を渡せるためである。'a'ここまでの内容をまとめると、プリミティブ型(nullとundefinedを除く)は、型のチェックを行う際、プリミティブ型そのものとしてだけでなく、インスタンスオブジェクトとしても、扱われる。どちらに対しても互換性を持った型になる。以下のoneは、number型であると同時に、toFixedというメソッドを持った構造体でもある。数値型はtoFixedメソッド以外にもtoExponentialなどのメソッドを持つが、構造的部分型では余分なプロパティは問題にならないため、HasToFixed型と互換性があると判断される。対象外なので、値を直接代入しても問題ない。OKなお、インスタンスオブジェクトはプリミティブ型に対して互換性を持たないので、注意する。Errorプリミティブ型(nullとundefinedを除く)は構造体としても扱われる、そして、{}はどのような内容の構造体でも受け入れる。そのため冒頭で示したように、{}はプリミティブ型(nullとundefinedを除く)と互換性を持つのである。undefined;ちなみに、「プリミティブな値は受け入れず、オブジェクトしか受け入れない型」は、object型で表現できる。Tes...2017-12-12Reactのコンポーネントにpropsを渡さない場合のFlowの書き方Flowのバージョンは0.61.0で確認している。はてなブログPro30歳無職から独学でプログラミングを開始した人間の記録。月別アーカイブスポンサーリンクはてなブログをはじめよう!numb_86さんは、はてなブログを使っています。ブログを報告するスターをつけました引用をストックしましたストック一覧を見る閉じる引用するにはまずログインしてくださいログイン閉じる引用をストックできませんでした。再度お試しください閉じる限定公開記事のため引用できません。