コンテンツにスキップ

JavaScript/ECMAScriptの変遷

出典: フリー教科書『ウィキブックス(Wikibooks)』

ECMAScriptは、JavaScriptの標準規格を定義する仕様です。以下は、ECMAScriptの主なバージョンにおける変遷の要点です。

ECMAScript 1(1997年)
最初のバージョンで、JavaScriptが初めて標準規格として定義されました。
ECMAScript 2(1998年)
軽微な修正が加えられ、仕様が一部改善されました。
ECMAScript 3(1999年)
大規模なアップデートで、try/catch文や正規表現、新しいエラーオブジェクトなどが導入されました。
ECMAScript 4が不採用となったため、このバージョンが長らく標準として使われ、ブラウザ上のJavaScriptエンジンや開発者の間で広くサポートされました。
ECMAScript 4(不採用)
制定されず、中断された仕様です。このバージョンの仕様策定が難航し、その後の進展がなかったため、採用されませんでした。
ECMAScript 5(2009年)
大規模なアップデートではなく、ECMAScript 3の改訂版としてリリースされました。
Strict Modeの導入
ECMAScript 5では、strict mode(厳格モード)が導入されました。Strict Modeでは、一部の不安全な操作や悪いプラクティスがエラーとして検出されるようになります。コードの先頭か関数の先頭に "use strict"; を追加することで有効にできます。
"use strict";
// strict modeでのコード
新機能
ECMAScript 5では、新機能として、Object.createObject.definePropertyArray.isArrayなどが導入されました。これらの新機能を活用することで、より効率的なコーディングが可能です。
// ECMAScript 3
var obj = {};

// ECMAScript 5
var obj = Object.create(proto);
JSON オブジェクトの追加
ECMAScript 5では、JSON オブジェクトが標準でサポートされました。これにより、JSONのエンコードおよびデコードが簡単に行えるようになりました。
// ECMAScript 3
var data = eval('(' + jsonString + ')');

// ECMAScript 5
var data = JSON.parse(jsonString);
Function.prototype.bind の使用
Function.prototype.bind メソッドが導入され、関数の this の値を永続的にバインドできるようになりました。
// ECMAScript 3
var boundFunction = functionToBind.bind(context);

// ECMAScript 5
var boundFunction = functionToBind.bind(context);
get および set アクセサの使用
ECMAScript 5では、オブジェクトのプロパティに対して get および set アクセサを使用できるようになりました。これにより、プロパティへのアクセスや変更に特別な処理を追加できます。
// ECMAScript 5
var obj = {
    get myProperty() {
        return this._myProperty;
    },
    set myProperty(value) {
        this._myProperty = value;
    }
};
Object.freezeObject.sealObject.preventExtensions の利用
ECMAScript 5では、Object.freezeObject.sealObject.preventExtensions などのメソッドが追加され、オブジェクトの不変性や封印、拡張を制御できるようになりました。
// ECMAScript 5
var sealedObject = Object.seal(myObject);
ECMAScript 6(2015年) / ECMAScript 2015
大規模な変更が行われ、クラス、アロー関数、let/const、プロミス、ジェネレータなど多くの新機能が導入されました。
モジュールシステムも正式に採用され、JavaScriptの言語機能が大幅に強化されました。
新しい構文の導入
ECMAScript 6では、クラス、アロー関数、let/constなど、新しい構文が導入されました。これらの新構文を理解し、適切に使用する必要があります。
// ECMAScript 5
var x = function(x) {
    return x * 2;
};

// ECMAScript 6
const x = (x) => x * 2;
letおよびconstの使用
letconst は ECMAScript 6 で導入された変数宣言の新しいキーワードです。これらを使用することで、変数のスコープや再代入の挙動が従来の var とは異なります。
// ECMAScript 5
var counter = 0;

// ECMAScript 6
let counter = 0;
Arrow Functionの注意
アロー関数(Arrow Function)は、this の挙動が通常の関数と異なります。アロー関数内での this は、関数が定義されたコンテキストを捕捉します。
// ECMAScript 5
var self = this;
var func = function() {
    console.log(self);
};

// ECMAScript 6
const func = () => {
    console.log(this);
};
クラスの導入
ECMAScript 6では、クラスの導入により、オブジェクト指向プログラミングのサポートが向上しました。これまでのプロトタイプベースの継承よりもシンプルで分かりやすいコードを書くことができます。
// ECMAScript 5
function MyClass() {
    // constructor
}

// ECMAScript 6
class MyClass {
    // constructor
}
モジュールの使用
ECMAScript 6では、モジュールシステムが標準でサポートされ、モジュールを定義してエクスポート・インポートすることができます。
// ECMAScript 5
// モジュールが標準でサポートされていないため、グローバルスコープで変数を使っていた

// ECMAScript 6
// モジュールを使ってコードを構造化
import { myFunction } from './myModule';
IteratorとGeneratorの活用
ECMAScript 6では、イテレータとジェネレータが導入されました。これにより、簡潔で効率的な反復処理が可能になります。
// ECMAScript 5
var arr = [1, 2, 3];
for (var i = 0; i < arr.length; i++) {
    console.log(arr[i]);
}

// ECMAScript 6
const arr = [1, 2, 3];
for (const item of arr) {
    console.log(item);
}
ECMAScript 2016(ES7)
毎年の小規模なアップデートの方針が始まり、ES6の拡張として導入された機能がいくつかありました。
ECMAScript 2017(ES8)
async/awaitObject.values/Object.entries などが追加されました。
ECMAScript 2018(ES9)
Rest/Spread Properties、Promise.prototype.finally などの新機能が導入されました。
ECMAScript 2019(ES10)
Array.prototype.flatArray.prototype.flatMap などが追加されました。
ECMAScript 2020(ES11)
BigInt型やPromise.allSettledなどが導入されました。
ECMAScript 2021(ES12)
String.prototype.replaceAllWeakRefFinalizationRegistryなどの新機能が導入されました。

ECMAScriptは現在も進化を続けており、毎年新しいバージョンがリリースされています。新しいバージョンでは、言語の機能やパフォーマンスが向上し、開発者がより効果的にコードを書けるようになります。

ECMAScriptとJavaScriptの関係

[編集]

ECMAScript(European Computer Manufacturers Association Script)は、JavaScriptの標準規格を定義したもので、JavaScriptはこの規格に基づいて作られています。言い換えれば、JavaScriptはECMAScriptの実装の一つであり、ECMAScriptがJavaScriptの基盤となっています。

以下に、ECMAScriptとJavaScriptの関係について簡単に説明します。

ECMAScriptは標準規格
ECMAScriptは、欧州コンピュータ製造業者協会(ECMA)によって標準規格として策定された言語仕様です。ECMAScriptはバージョンごとに進化しており、新しい機能や構文が追加されます。
JavaScriptはECMAScriptの実装
JavaScriptは、ECMAScriptの実装の一つです。具体的には、WebブラウザやNode.jsなどで実行されるJavaScriptエンジンが、ECMAScriptの仕様に基づいて動作しています。JavaScriptはECMAScriptの標準仕様に従っていれば、さまざまな実行環境で動作することが期待されます。
ブラウザとECMAScript
Webブラウザでは、ECMAScriptに基づくJavaScriptエンジンが実装されています。各ブラウザ(Chrome、Firefox、Safariなど)は、独自のJavaScriptエンジンを使用していますが、これらは共通のECMAScriptの仕様に準拠しています。
ECMAScriptの進化とJavaScriptの実装
ECMAScriptは進化し続け、新しいバージョンが定期的にリリースされます。ブラウザやNode.jsはこれらの新しい機能や仕様の一部を実装し、JavaScript開発者はこれを利用してよりモダンで効果的なコードを書くことができます。

総じて、ECMAScriptはJavaScriptの基本的な仕様を定義する標準であり、JavaScriptはその標準に基づいた実装の一つです。JavaScript開発者はECMAScriptの仕様に注意しながらコードを書き、最新の言語仕様を利用して開発を進めることが一般的です。