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

ejsのテンプレート

普段生のHTMLを書く機会はほとんどなく、画面側の仕事でもフレームワークを使うことがほとんどなので搭載されているテンプレートを使っています。 で、生のHTML/CSSの本を読んでいてejsなるテンプレ …

no image

HTML/JS/JavaScriptのキャッシュ機能の無効化に関して

AngularJSを使っていまして、更新したのにキャッシュ機能が働いていてブラウザでは変更が反映されてない・・・なんてことがちょいつづき、キャッシュを無効化する機能を調査しました。 まず通常のHTML …

no image

vueの環境構築

vueについて勉強したことなどを。 Contents1 vueとは?1.1 方法1 CDN1.2 方法2 npm+コンパイル vueとは? 近年のJavaScriptフレームワークの一種で「双方向デー …

no image

Angularモジュール間の読み込み

Angularで以前こちらで、複数のコントロールに分ける方法を書きましたが、コントローラーだけでなく、Factory,ServiceなどいろいろなタイプのサービスがAngularにはあります。 プログ …

no image

bootstrapでのJavaScriptエラーチェック

お問い合わせフォームの入力チェックというのは本来サーバーサイド側でやらなくてはいけないのですが、JavaScriptによってクライアント側でやることも可能です。 入力欄にフォーカスして、遷移したときに …