CSSに抽象化の手法を導入したら便利じゃね? のまとめ
前のエントリが長くなったので、仕切りなおし。
前回までのまとめ
はやみず | CSSで、部分的に共通なスタイルを持つ要素があるときに、いちいち繰り返し書くのが面倒だ! |
---|---|
はやみず | いくつかのスタイルをカプセル化(抽象化)して、オブジェクト指向のクラスの継承みたいに適用できたら、便利だ! |
観客 | それ、共通部分は複数のセレクタでスタイル定義して、非共通部分は個別にスタイル定義すればよくね? |
はやみず | それで問題解決できるね。ありがとうエロい人。 |
はやみず | あれ?ちょっと待てよ。複数セレクタで解決はできるけど、やっぱり抽象化できたほうがよくね?←今ここ |
セレクタが複数指定できる件の追記(前のエントリからコピペ)
セレクタが複数指定できることで、一応の解決策は見つかった。しかし、あとから実践してみると、この方法だとなんかやりにくい。↑に「多分慣れの問題」と書いたけど、
名前重要
という言葉がふと浮かんできた。抽象化のメリットは、プリミティブなものを一まとめにして名前を付けることができる、という点にあるんじゃなかろうか。セレクタを複数指定する方法だと、名前が付けられない点が、わかりにくさにつながっているんじゃないか。
例えば、「イケメンで、茶髪で、背が低くて、服をはだけた人を"ジャニーズ系"と呼ぶ」という抽象化を行う。すると、「AくんとBくんとCくんとDくんは、イケメンで、茶髪で、背が低くて、服をはだけている」というところを、「AくんとBくんとCくんとDくんはジャニーズ系」と言うことができる。後者のほうが分かりやすくない?
つまり、名前重要。抽象化は名前重要の原則に適っている(よね?)。コメントにある変数という考え方も、名前を付ける抽象化方法だし。
セレクタ複数指定で問題は解決できるが、抽象化したほうが人間フレンドリー。