アナリティクスのgtag.jsを使用し、PDFファイルの閲覧数などを計測する方法についてご紹介しました。その際はまだコードを汎用化しておらずサイト全体で読み込むJavaScriptファイルにjQueryで記述をしていたのですが、今後も積極的に計測をしていきたいと考えており、簡単に計測が始められるようにコードを汎用化しました。コードの汎用化に当たって、以下の方針で記述してみました。IE11をサポートしなくてもよい時代が来た後もメンテナンスしやすいこと...ES2015を使ってみること誰でも簡単に使用できることjQuery非依存(もしかするとjQueryを使用しないプロジェクトへの対応)jQueryに非依存については、今はもうjQueryを使わないのが良い等とは思ってはなく、シングルページアプリケーションではないごく一般的な企業様のサイトではこれからもjQueryを使い続けるのかな、という気がしております。コードと使い方コードと使い方(README.md)はGitHubの「hideki-a/autotrack」に置いています。Autotrack(GA_TRACKING_ID);でAutotrackインスタンスを生成、autotrack.fileTracker();でPDFファイル等の閲覧数を計測したり、autotrack.bannerTracker({設定を書く});でバナーのクリック数計測をしたりするようにしました。ES2015(ES6)を使ってみてES2015(ES6)については以前から勉強していましたが、本格的に使ったのは久しぶりかもしれないという印象がしました。大きいのはクラス定義を使用したこと、アロー関数を使用したことでしょうか。クラスはJavaScriptにすでにあるプロトタイプベース継承の糖衣構文とは言え、コードが直感的に書きやすくなる、直感的に分かりやすくなることは間違いないでしょう。this;などと書かなくて良いのが助かります。Array.from()を使いたいけれど...querySelectorAll()で取得した要素をループで回してイベントを付ける、という処理はよく書くのではないでしょうか。この時、querySelectorAll()の返値はNodeListなのでforEach()が使用できません。そこでArray.from()を使いたくなるのですが、IE11が現状対応していません。ポリフィルを使おうかとなるのですが、コードが結構長くてサイズが増えそう...。結論として、[].forEach.call(elems)と書きました。[].forEach.call()は少々分かりづらさがある(.call()や.apply()は昔理解するのに時間がかかりました)、Array.from()は分かりやすいけれどIE11が足を引っぱる、という点はもやもやする所です。イベントを登録するからには削除できるようにもしたいaddEventListener()で登録したイベントを任意のタイミングで削除したいと考えremoveEventListener()を使おうとしました。その際、第2引数にはaddEventListener()の第2引数と同じ関数を渡す必要があるのですが、上手く書けませんでした。いうのも下記コードのように第2引数の外で定義している定数を第2引数内の関数で使用しているためです。function?に対する返答に要件を満たす回答があり助かりました。