WEB開発者にとってブラウザによるサポートの差や細かい解釈の違いは大きな関心ごとです。そしてそれは常に混乱しているので、度々大きな波紋を投げかけることになります。 # Can I use この命令をつかっても大丈夫だろうか？――という不安を解消する、各種ブラウザの対応状況を確認できるサイト、それが [Can I use](https://caniuse.com/) です。 たとえば、javascriptの「var」に代わるものとしてES6から追加された「const」と「let」。その「const」を [Can I use](https://caniuse.com/?search=const) に入力するとこんな結果が得られます。 https://www.chaordic.co.jp/memorandum/user/chaordicdesign/img/16/0001.png テーブルの凡例は、赤色が「未対応」、緑色が「対応」、オリーブ色が一応使えるけど条件があるよという「中途半端な対応」を示すものになっています。 中途半端な対応が一番やっかいなところで（ほんとうにやめてほしいが）、オリーブ色の凡例をマウスオーバーすることで、その条件を確認することができますので前向きに対応していきましょう。 例えばIE11をマウスオーバーすると、以下のようになります。 https://www.chaordic.co.jp/memorandum/user/chaordicdesign/img/16/0002.png 「Notes」でハイライトしている「Not supported in for-in and for-of loops」が伝えるように、IE11 で const はループの中では使えない仕様になっていることがわかります。 また、このサイトは、javascriptだけでなく、CSSのプロパティやHTMLのタグも確認することができます。 # Polyfill 現在、IE11をサポートしなければブラウザの差をあまり意識せずコーディングできるようになりました。それでもIE11を完全にサポートから外すことはまだできませんし、ブラウザは日々バージョンし続けます。 例えば、javascriptの新しいバージョンである「ES6」の各ブラウザの対応状況は、 [ココ](https://kangax.github.io/compat-table/es6/) で確認できます。 https://www.chaordic.co.jp/memorandum/user/chaordicdesign/img/19/0001.png この各ブラウザごとの差をスクリプトで補完できるのが Polyfill です。実装は簡単で、＜head＞内で読み込むどのスクリプトよりも先に読み込めばOK。 URL末尾の引数「?features=es6」で、ES6としてまとめて指定することもできますが、必要最小限で済ませたければ個別に指定することもできます。その時は [URLビルダー](https://polyfill.io/v3/url-builder/) をつかうと簡単です。 たとえばIE11で動かない「Intersection Observer」の Polyfill を読み込む場合、以下のようになります。