0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

【JavaScript入門】ES2015の概要

Last updated at Posted at 2021-07-07

参考書籍

ES2015について

ECMAScript

  • ES6やES2015のESと言うのはECMAScriptの略
  • ECMAScriptはEcma Internationalによって定められるJavaScriptの標準規格/言語仕様
  • JavaScriptはECMAScriptの仕様に基づいた言語のひとつ

標準化

  • どのようなプログラムを書いたらどのように動くのかを言語の仕様としてきちんと定義すること
  • ブラウザごとに動作が違う問題を、どの処理系でも動作を同じにすることで解決することが目的

ES2015で追加された構文

  • 文字列のテンプレートリテラル
  • let・constキーワードによる変数宣言(ブロックスコープ)
  • 関数の引数のデフォルトパラメータ
  • 関数の可変長引数
  • アロー関数
  • ジェネレータ関数(停止や再開ができる特殊な関数)
  • classキーワードによるクラス宣言
  • importとexportによるモジュール構文
  • 他にもArrayなどの既存のオブジェクトに対して様々な関数が追加され、機能が強化された

ES2015に追加されたオブジェクト

  • Promise: 非同期処理を抽象化するデザインパターン
  • Symbol: ユニークな値を表現する新たなプリミティブ型
  • Reflect / Proxy: オブジェクトの操作をカスタマイズするしくみ
  • Set / WeakSet: 一意なデータスタックを表すオブジェクト
  • Map / WeakMap: Key-Valueのデータ構造を表すオブジェクト

その他関連項目

  • トランスパイラ:新しいJavaScriptの記法を古いJavaScriptに変換するアプリケーション
  • Polyfill:古いブラウザに対して新しい機能の代替的な実装を追加するスクリプト

ES6ポリフィルとは、ES6の新しい組込みクラスやメソッドを古い環境でも使えるようにJavaScriptで実装したライブラリ。ポリフィルで実現できることは限られるが、ビルドが不要なためトランスパイラより手軽に導入できる。

テンプレート文字列

テンプレート文字列を利用することで、以下のような文字列表現が可能になる。

  • 文字列への変数の埋め込み
  • 複数行にまたがる(=改行文字を含んだ)文字列
script.js
let name = '鈴木';
// テンプレート文字列では、「\`」(バッククォート)で文字列をくくる
let str
  = `こんにちは、${name}さん。
  今日も良い天気ですね!`;
//改行文字を、テンプレート文字列ではそのまま表現
console.log(str);

定数

  • ES2015で標準化された(以前は一部のブラウザーによる拡張仕様)
  • 単語をアンダースコアで区切るのが一般的
  • 定数を利用することで値の意味が明確になり、コードの可読性が増す
  • 修正箇所が一箇所になり、修正漏れを未然に防ぐことができる
script.js
const TAX = 1.08;
var price = 100;

console.log(price * TAX); // 108
0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?