JavaScript ES5
ES5とも呼ばれるECMAScript 2009は、JavaScriptの最初のメジャーリビジョンです。
この章では、ES5の最も重要な機能について説明します。
ES5 の機能
- "use strict"](#mark_use_strict){.underline}
- String[number[ access
- Multiline strings
- String.trim()
- Array.isArray()
- Array forEach()
- Array map()
- Array filter()
- Array reduce()
- Array reduceRight()
- Array every()
- Array some()
- Array indexOf()
- Array lastIndexOf()
- JSON.parse()
- JSON.stringify()
- Date.now()
- Date toISOString()
- Date toJSON()
- Property getters and setters
- Reserved words as property names
- Object methods
- Object defineProperty()
- Function bind()
- Trailing commas
ブラウザのサポート
ES5
最新のすべてのブラウザーで完全にサポートされています。Chrome | IE | Edge | Firefox | Safari | Opera |
Yes | 9.0 | Yes | Yes | Yes | Yes |
「use strict」ディレクティブ
"use strict"
JavaScript コードを「strict mode」で実行する必要があることを定義します。
strict modeでは、たとえば、宣言されていない変数を使用できません。
すべてのプログラムでstrict modeを使用できます。宣言されていない変数の使用を防ぐなど、よりクリーンなコードを作成するのに役立ちます。"use strict"
単なる文字列式です。古いブラウザーは、理解できなくてもエラーをスローしません。
詳細については、JS Strict モードを参照してください。
Property Access on Strings
このcharAt()
メソッドは、文字列内の指定されたインデックス(位置)にある文字を返します。
ES5では、文字列のプロパティアクセスが許可されます。
文字列のプロパティアクセスは、少し予測できない場合があります。詳細については、JS 文字列メソッドを参照してください。
Strings Over Multiple Lines
メソッドはユニバーサル サポートされていない可能性があります。古いブラウザでは、バックスラッシュの前後のスペースの扱いが異なる場合があります。一部の古いブラウザーでは、\ 文字の後ろにスペースを使用できません。
文字列リテラルを分割するより安全な方法は、文字列加算を使用することです。
Reserved Words as Property Names
ES5では、予約語をプロパティ名として使用できます。
String trim()
このtrim()
メソッドは、文字列の両側から空白を削除します。
詳細については、JS 文字列メソッドを参照してください。
Array.isArray()
このisArray()
メソッドは、オブジェクトが配列かどうかをチェックします。
例
詳細については、JS 配列を参照してください。
Array forEach()
このforEach()
メソッドは、配列要素ごとに関数を1回呼び出します。
例
詳細については、JS 配列反復メソッドを参照してください。
Array map()
この例では、各配列値を2で乗算します。
例
詳細については、JS 配列反復メソッドを参照してください。
Array filter()
この例では、18より大きい値を持つ要素から新しい配列を作成します。
例
詳細はこちらJS 配列反復メソッド
Array reduce()
この例では、配列内のすべての数値の合計を見つけます。
例
詳細はこちらJS 配列反復メソッド
Array reduceRight()
この例では、配列内のすべての数値の合計も求めています。
例
詳細はこちらJS 配列反復メソッド
Array every()
この例では、すべての値が18を超えているかどうかを確認します。
例
詳細はこちらJS 配列反復メソッド
Array some()
この例では、一部の値が18を超えているかどうかを確認します。
例
詳細はこちらJS 配列反復メソッド
Array indexOf()
要素値の配列を検索し、その位置を返します。
詳細はこちらJS 配列反復メソッド
Array lastIndexOf()
lastIndexOf()
とindexOf()
は同じです、しかし配列の最後から検索します。
詳細はこちらJS 配列反復メソッド
JSON.parse()
JSONの一般的な用途は、Web サーバーからデータを受信することです。
Webサーバーから次のテキスト文字列を受け取ったとします。
JavaScriptの関数JSON.parse()
は、テキストをJavaScript オブジェクトに変換するために使用されます。
詳しくはJSON チュートリアルを参照して下さい。
JSON.stringify()
JSONの一般的な用途は、Webサーバーにデータを送信することです。
データをWebサーバーに送信する場合、データは文字列でなければなりません。
JavaScriptに次のオブジェクトがあるとします。
JSON.stringify()
を使用し、それを文字列に変換します。
結果は、JSON表記に従った文字列になります。
myJSONが文字列になり、サーバーに送信する準備が整いました。
例
詳しくは、JSON チュートリアルを参照して下さい。
Date.now()
Date.now()
は、ゼロの日付(1970年1月1日 00:00:00 UTC)からのミリ秒数を返します。
Date.now()
は、Date
オブジェクトに対して実行されたgetTime()と同じものを返す。
詳くはこちらJS datesを参照してください。
Date toISOString()
toISOString()
メソッドは、ISO標準形式を使用してDateオブジェクトを文字列に変換します。
Date toJSON()
toJSON()
Dateオブジェクトを、JSON dateとしてフォーマットされた文字列に変換します。
JSON dateの形式は、ISO-8601 standardと同じです: YYYY-MM-DDTHH:mm:ss.sssZ:
Property Getters and Setters
ES5では、プロパティを取得または設定するような構文でオブジェクトメソッドを定義できます。
この例では、fullName というプロパティのgetterを作成します:
例
この例では、languageプロパティの*setter*と*getter*を作成しています:
例
この例では、setterを使用して言語の大文字の更新を保護します。
例
GetterとSetterの詳細については、JS オブジェクト アクセサーを参照して下さい。
Object.defineProperty()
Object.defineProperty()
は、ES5の新しいObjectメソッドです。
オブジェクトのプロパティを定義したり、プロパティの値やメタデータを変更したりできます。
例
var person = {
firstName: "John",
lastName : "Doe",
language : "NO",
};
// Change a Property:
Object.defineProperty(person, "language", {
value: "EN",
writable : true,
enumerable : true,
configurable : true
});
// Enumerate Properties
var txt = "";
for (var x in person) {
txt += person[x] + " ";
}
document.getElementById("demo").innerHTML = txt;
次の例は、言語プロパティを列挙から隠していることを除いて、同じコードです。
例
var person = {
firstName: "John",
lastName : "Doe",
language : "NO",
};
// Change a Property:
Object.defineProperty(person, "language", {
value: "EN",
writable : true,
enumerable : false,
configurable : true
});
// Enumerate Properties
var txt = "";
for (var x in person) {
txt += person[x] + " ";
}
document.getElementById("demo").innerHTML = txt;
この例では、setterとgetterを作成して、言語の大文字の更新を保護します。
例
var person = {
firstName: "John",
lastName : "Doe",
language : "NO"
};
// Change a Property:
Object.defineProperty(person, "language", {
get : function() { return language },
set : function(value) { language = value.toUpperCase()}
});
// Change Language
person.language = "en";
// Display Language
document.getElementById("demo").innerHTML = person.language;
E5 ObjectMethods
ES5では、JavaScriptに多くの新しいオブジェクトメソッドが追加されました。
オブジェクトの管理
オブジェクトの保護
詳くはこちらオブジェクト ECMAScript5を参照して下さい。
Function Bind()
bind()
メソッドを使用すると、オブジェクトは別のオブジェクトからメソッドを借用できます。
この例では、2つのオブジェクト(個人とメンバー)を作成します。
memberオブジェクトはpersonオブジェクトからfullnameメソッドを借用します。
例
詳くはこちら関数 bind()を参照して下さい。
Trailing Commas
ES5では、オブジェクトと配列の定義で末尾のコンマを使用できます。
オブジェクトの例
配列の例
警告 !!!
JSONは、末尾のコンマを使用できません。
JSONオブジェクト:
JSON 配列:
プログラミング学習を加速させる
プログラミングをプロの講師に教えてもらいませんか。