skillup

技術ブログ

JavaScript

JavaScriptのトランスパイルについて

投稿日:

今回はJavaScriptのトランスパイルについて。

JavaSciprtではwebpackでコンパイルなどをする時に同時にトランスパイルという処理を行います。

トランスパイルとは?

主にES2015以降の仕様で記述したJavaScriptが古いブラウザなどで動かなく危険性があるため、互換性のあるコードに変換をする処理。

ES2015以降では

  • let,constなどの変数定義
  • ブロックスコープ
  • アロー関数
  • thisの参照
  • Class構文
  • …etc

などの便利な機能が使えるため。

一般的にはBabelというライブラリを使います。

サンプルコード

https://github.com/umanari145/front_end_javascript/tree/master/webpack_sample

参考リンク

ES2015(ES6) 入門

JavaScriptのトランスパイルを知ろう

-JavaScript
-

執筆者:


  1. […] JavaScriptのトランスパイルについて […]

comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

関連記事

no image

npmでのjQueryライブラリの読み込み+datepickerメモ

npm経由でjQueryやDatepickerなど一般的なライブラリをrequireしてビルドする手法について。 以前も下記エントリーで書きましたが、再学習。 npmでのJSライブラリインストール&ビ …

no image

jquery multipleについて(基本編)

selectで複数選択をするときには通常のプルダウンでも可能ですが、プラグインを使うともっとスマートに対応できます。 今回私が実装したかったのがCSVアップロードorダウンロードで項目を自由に変更した …

no image

プルダウン連動のJS+動的要素のイベント追記(ライブラリのイベント)

JSがらみでちょっとした小ネタを。 Contents1 プルダウン連動2 動的要素へのイベント追加(ライブラリのイベントなど) プルダウン連動 大カテゴリ→小カテゴリなどとあった場合に、新規だけではな …

no image

package.jsonによるタスクの実行

前回の記事でgulpによるタスクの実行を書きましたが、package.jsonでこれを行うこともできます。 てっきり依存ライブラリの記述だけかと思いますしたが、様々なタスクを実行できるようですね。イメ …

no image

携帯のUIに関して

いまさらながらスマホのUI表示に苦戦してます。 まあ、現状のWEBサイトを作る場合、BtoCでもBtoBでもスマホ対策は必須ですよね。 私の場合、デザインが本業でないこともあり、ちょっとサボっていまし …