JavaScriptのbindpolyfillモジュールについて現役エンジニアが解説【初心者向け】

JavaScriptのbindpolyfillモジュールについて、TechAcademyのメンター（現役エンジニア）が実際のコードを使って初心者向けに解説します。

そもそもJavaScriptについてよく分からないという方は、JavaScriptとは何なのかについて解説した記事を読むとさらに理解が深まります。

 

なお本記事は、TechAcademyのオンラインブートキャンプJavaScript/jQuery講座の内容をもとにしています。

 

 

目次

• bindpolyfillモジュールとは
• bindpolyfillモジュールの使い方
• 実際に使ってみよう
• まとめ

 

bindpolyfillモジュールとは

bindpolyfillモジュールとは、サーバーサイドでも使われるNode.jsというJavaScriptの実行環境で使える部品の1つです。

bindpolyfillモジュールは、名前がそのまま意味を表しているので用語を分解して説明します。

bindは、JavaScriptのbindメソッドのことでthisの値を指定した関数を生成するものです。polfill（ポリフィル）は、古いブラウザなどで非対応になっている機能を動作するようにするものです。

モジュールは、機能や処理が集まった部品です。つまりbindpolyfillモジュールは、bindメソッドに対応していない環境で、bindを使えるようにするNode.jsで使う部品ということになります。

Node.jsの初期の頃のバージョンにはbindに対応していないものがあります。このような場合に、bindpolyfillモジュールを使うことでbindが使えるようになります。

Node.jsのバージョンと対応している機能の一覧は下記で確認できます。
https://node.green/

[PR] フロントエンドで副業する学習方法を動画で公開中

bindpolyfillモジュールの使い方

bindpolyfillモジュールは、MDNサイトのbindページに記載しているPolyfillのコードをモジュールにしたものになります。そのため、読み込むだけで特に処理を記述する必要はありません。

読み込んだソースの中でbindが使えるようになります。ほとんどの環境でbindは使えるので、bindが非対応な環境でbindを使いたい場合にbindpolyfillモジュールの使用を検討していみてください。

Node.jsで開発したソースを、ビルドツールを使ってブラウザで実行する場合はCan I useのサイトでブラウザの対応状況を確認できます。

IE8以前やChrome6以前のような赤くなっているバージョンが非対応になります。

実際に使ってみよう

まずは、bindpolyfillモジュールをインストールします。

コマンドラインツールで下記のコマンドを実行してください。

npm install bindpolyfill

インストールが終わったら、requireを使って読み込みます。Node.jsでモジュールを使う場合は、requireの引数にモジュール名、または、モジュールのパスを渡すことで読み込む事ができます。

下記のような記述になります。

require('bindpolyfill');

読み込むだけでbindが使えるようになるモジュールなので、requireで読み込んだファイルを変数に格納する必要もありません。

これでbindをサポートしていない環境で実行される場合でも、bindを使って処理を記述できるようになりました。

まとめ

bindpolyfillモジュールを紹介しました。

他にもモジュールはたくさんあります。npmの公式サイトでモジュールを検索することができます。

筆者プロフィール

横山茂雄（よこやましげお） フリーエンジニアとして活動中。サーバーサイドからフロントまで時代の波に合わせてスキルを変化させてきました。 言語、フレームワーク、DB、現場、いずれも転々としながら、筋トレも欠かさない体育会系エンジニアです。TechAcademyジュニアのゲームアプリコースを担当しています。

 

 

TechAcademyでは、初心者でもJavaScript・jQueryを使ったWebサービス公開を習得できるオンラインブートキャンプJavaScript/jQuery講座を開催しています。

挫折しない学習方法を知れる説明動画や、現役エンジニアとのビデオ通話とチャットサポート、学習用カリキュラムを体験できる無料体験も実施しているので、ぜひ参加してみてください。