skillup

技術ブログ

JavaScript

ECMAScriptについて復習

投稿日:

ここ数年のJavaScript界隈は進化が激しく、私の知識はレガシーな状態で止まっているので、自分に備忘録として整理しておこうと思います。

ECMAScriptとは?

Ecma Internationalという団体が策定した、JavaScriptの標準仕様で、言ってみれば通常のJavaScriptのことです。

ECMAScript

ECMAScript2015(ES6)について

ECMAScriptというキーワードが話題になるときは新しい構文などの時で一般にはES6以上のことだと思います。

ES6とは2015年に仕様が決定されたJavaScriptの新しい仕様の事です。(6番目のバージョンであるためES6と言われます。ES2015とも言われるようです。ややこしい・・・)

それ以下のバージョンのJavaScriptの事はES5などと言われます。

メリット

大事なこととしては実装上のメリットとデメリットだと思います。

ES6以上では以下のような機能が使えます。

  • let,constなどの新しい定義方法
  • ブロックスコープ
  • テンプレートリテラル
  • アロー関数
  • thisの範囲が関数定義内になる
  • Class構文の変更(従来の書き方が代わり、継承が使えるようになった)
  • Promise(非同期処理が描きやすくなった)

ES2015(ES6)入門

デメリット

想像できるかと思いますが、古いブラウザで一部動かなかったりします。(特にIE11以下)

そのためES2015以降の記述を動きを変えずにES5以下の書き方に変更するツールがなければいけません。(CSSのベンダープリフィクスのようなもの。)そのような行為自体をトランスパイルといい、ES2015の場合は、babelが一般的です。

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

その他の総合的なリンク

新人にドヤ顔で説明できるか、今風フロントエンド開発ハンズオン(Git/Node.js/ES6/webpack4/Babel7)

-JavaScript
-,

執筆者:


comment

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

関連記事

no image

クロスドメインがらみのajax

ajaxで別ドメインに対して、プログラムを実行したい時に注意すべきことなどを。 Contents1 ログ、レスポンスヘッダをとにかく追う2 特定ドメインからの許可3 フレームワーク側での認証ロジック( …

no image

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

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

no image

ejsのテンプレート

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

no image

font-awesomeのインストール(タスクランナー経由)

fontawesomeをタスクランナー経由でインストールすることについて。 CDNでインストールするだけならURL張り付けるだけですが。 インストール まずnpmで下記コマンドでインストールをします。 …

no image

webpackについて再履修

webpackについて今まで見よう見まねでやってきましたが、おまじないのような感じでプロパティ内部までしっかり理解しているとは言い難いため、再履修です。インストールとかは省略。 今まで書いた既存のwe …