Predefined Core Objects

この章では、コア JavaScript で定義済みのオブジェクトである Array、Boolean、Date、Function、Math、Number、RegExp、String について説明します。

Array オブジェクト

JavaScript には、配列を表す明確なデータ型はありません。しかし、定義済みの Array オブジェクトとそのメソッドを使用することで、アプリケーションで配列を扱うことができます。Array オブジェクトには、さまざまな方法で配列を操作するメソッドがあります。例えば、配列の要素をつなぎ合わせたり、逆転したり、ソートしたりするものがあります。また、配列の長さを決定するプロパティや、正規表現とともに使用するプロパティもあります。

配列 とは、その個々の値を名前やインデックスで参照する順序集合です。例えば、従業員番号でインデックス付けした、従業員の名前からなる emp という配列を作ることができます。すると、emp[1] は従業員番号 1 を、emp[2] は従業員番号 2 を、というように指します。

配列の作成

Array オブジェクトは、次のようにして作成します。3 つの文は等価です:

var arr = new Array(element0, element1, ..., elementN);
var arr = Array(element0, element1, ..., elementN);
var arr = [element0, element1, ..., elementN];

element0, element1, ..., elementN は、配列の要素の値からなるリストです。この形式を用いると、配列の要素は指定した値で初期化されます。また、配列の length プロパティに引数の個数がセットされます。

角括弧を用いる構文は "配列リテラル" または "配列初期化子" と呼ばれます。これは短縮表記であり、一般的に好まれています。配列リテラルの詳細については配列リテラルをご覧ください。

アイテムを持たないが長さが 0 ではない配列は、次のうちいずれかの方法で作成できます:

var arr = new Array(arrayLength);
var arr = Array(arrayLength);

// こちらも同じ効果がある
var arr = [];
arr.length = arrayLength;

注意: 上記のコードにおいて、arrayLength は Number でなければなりません。さもなければ、要素が 1 つ (与えられた値) の配列が作成されます。arr.length を呼び出すと arrayLength が返りますが、実際は配列には空 (undefined) の要素が含まれています。配列で for...in ループを実行しても、配列の要素は何も返されません。

これまで示したような新たに定義された変数に加えて、新規または既存のオブジェクトのプロパティとして配列を割り当てることもできます:

var obj = {};
// ...
obj.prop = [element0, element1, ..., elementN];

// または
var obj = {prop: [element0, element1, ...., elementN]}

要素が 1 つであり、またその要素が Number である配列を初期化したい場合は、括弧構文を使用しなければなりません。Array() コンストラクタまたは関数に Number の値が 1 つ渡されると、その値は単一の要素としてではなく arrayLength として解釈されます。

var arr = [42];
var arr = Array(42); // 要素はありませんが、arr.length は 42 である配列を作成

// 上のコードは以下と同じ
var arr = [];
arr.length = 42;

さらに要素が 1 つであり、またその要素の値が整数ではない Number (無視できない端数を持つ数値) である配列を作成する場合は、RangeError が発生します。要素が 1 つであり、そのデータ型が不定である配列をコード中で作成する可能性がある場合は、配列リテラルを使用する方法か、始めに空の配列を作成してから値を埋める方法が安全です。

var arr = Array(9.3);  // RangeError: Invalid array length

配列要素の格納

値を要素に代入することで、配列要素を格納することができます。例えば、

var emp = [];
emp[0] = "Casey Jones";
emp[1] = "Phil Lesh";
emp[2] = "August West";

注意: 上記のコードで配列演算子に整数ではない値を与えると、配列の要素ではなく、配列を表すオブジェクトでプロパティが作成されます。

 var arr = [];
arr[3.4] = "Oranges";
console.log(arr.length);                // 0
console.log(arr.hasOwnProperty[3.4]);   // true

配列作成時に要素を格納することもできます:

var myArray = new Array("Hello", myVar, 3.14159);
var myArray = ["Mango", "Apple", "Orange"]

配列要素の参照

要素の順番を表す数値を用いて、配列の要素を参照することができます。例えば、次の配列を定義したとします:

var myArray = ["Wind", "Rain", "Fire"];

配列の最初の要素は myArray[0] として、第 2 の要素は myArray[1] として参照できます。配列のインデックスは 0 から始まります。

注意: 配列演算子 (角括弧) は、配列のプロパティにアクセスするためにも使用できます (配列は JavaScript のオブジェクトでもあります)。例えば、

 var arr = ["one", "two", "three"];
arr[2];  // three
arr["length"];  // 3

長さの把握

実装レベルにおいて、JavaScript の配列はその要素を、インデックスをプロパティ名として用いる標準的なオブジェクトプロパティとして保存します。length プロパティは、常に最後の要素のインデックスを返す特別なプロパティです。JavaScript の配列のインデックスはゼロベースであることを忘れないようにしてください。1 ではなく、0 から始まります。よって、length プロパティは配列に保存されている最大のインデックスより 1 大きい値になります。

var cats = [];
cats[30] = ['Dusty'];
print(cats.length); // 31

length プロパティに代入することもできます。保存されているアイテムの数より小さい値を書き込むと、配列が切り詰められます。0 を書き込むと、完全に空になります:

var cats = ['Dusty', 'Misty', 'Twiggy'];
console.log(cats.length); // 3

cats.length = 2;
console.log(cats); // "Dusty,Misty" と表示。Twiggy は削除された

cats.length = 0;
console.log(cats); // 何も表示されない。配列 cats は空

cats.length = 3;
console.log(cats);  // [undefined, undefined, undefined]

配列全体への反復処理

配列の各値に何らかの処理を行って、全体に反復処理を行うことは一般的な操作です。これを行うもっとも単純な方法は、以下のとおりです:

var colors = ['red', 'green', 'blue'];
for (var i = 0; i < colors.length; i++) {
  console.log(colors[i]);
}

配列内に真偽値コンテキストで false に評価される要素がないことがわかっている (例えば、配列が DOM ノードのみで構成されている) 場合は、より効率的な手法を使用できます:

var divs = document.getElementsByTagName('div');
for (var i = 0, div; div = divs[i]; i++) {
  /* div に何らかの処理を行う */
}

この方法は配列の length を確認するオーバーヘッドを削減し、また利便性を高めるため div 変数に、ループの各回でカレントのアイテムが再割り当てされることを確実にします。

JavaScript 1.6 で導入された forEach() メソッドは、配列全体に反復処理を行う別の方法です:

var colors = ['red', 'green', 'blue'];
colors.forEach(function(color) {
  console.log(color);
});

forEach に渡された関数は配列の全アイテムを対象として、関数の引数として渡された配列のアイテムに対して 1 回ずつ実行されます。未代入状態の値は forEach ループで反復処理が行われません。

JavaScript の配列要素は標準的なオブジェクトプロパティとして保存されることから、JavaScript の配列では for...in ループによる反復処理を行わないことが賢明です。これは、通常の要素とすべての列挙可能なプロパティがともに一覧化されるためです。

Array のメソッド

Array オブジェクトには以下のメソッドがあります:

• concat() は 2 つの配列を結合し、新しい配列を返します。

  var myArray = new Array("1", "2", "3");
  myArray = myArray.concat("a", "b", "c"); // myArray は ["1", "2", "3", "a", "b", "c"] となる
  

• join(deliminator = ",") は配列の全要素を結合し、文字列にします。

  var myArray = new Array("Wind", "Rain", "Fire");
  var list = myArray.join(" - "); // list は　"Wind - Rain - Fire" となる
  

• push() は 1 つ以上の要素を配列の最後に追加し、追加後の配列の長さを返します。

  var myArray = new Array("1", "2");
  myArray.push("3"); // MyArray は ["1", "2", "3"] となる
  

• pop() は配列から最後の要素を取り除き、その要素を返します。

  var myArray = new Array("1", "2", "3");
  var last = myArray.pop(); // MyArray は ["1", "2"] となり、last = "3" となる
  

• shift() は配列から最初の要素を取り除き、その要素を返します。

  var myArray = new Array ("1", "2", "3");
  var first = myArray.shift(); // MyArray は ["2", "3"] となり、first は "1" となる
  

• unshift() は 1 つ以上の要素を配列の先頭に追加し、その配列の新しい長さを返します。

  var myArray = new Array ("1", "2", "3");
  myArray.unshift("4", "5"); // myArray は ["4", "5", "1", "2", "3"] となる

• slice(start_index, upto_index) は配列の一部分を抽出し、新しい配列として返します。

  var myArray = new Array ("a", "b", "c", "d", "e");
  myArray = myArray.slice(1, 4); /* インデックス 1 からスタートし、インデックス 3 までの
    全要素を抽出する。[ "b", "c", "d"] を返す */
  

• splice(index, count_to_remove, addelement1, addelement2, ...) は配列から要素を取り除き、そして (任意で) それらを置き換えます。
  

  var myArray = new Array ("1", "2", "3", "4", "5");
  myArray.splice(1, 3, "a", "b", "c", "d"); // MyArray は ["1", "a", "b", "c", "d", "5"] となる
    // このコードはインデックス 1 ("2" があるところ) からスタートし、そこから 3 要素を取り除き、 
    // その場所に連続した要素をすべて挿入する
  

• reverse() は配列の要素を逆順に並び替えます。最初の配列要素は最後に、最後のものは最初にきます。

  var myArray = new Array ("1", "2", "3");
  myArray.reverse(); // 配列を並び替え、myArray = [ "3", "2", "1" ] となる
  

• sort() は配列の要素をソートします。

  var myArray = new Array("Wind", "Rain", "Fire");
  myArray.sort(); // 配列をソートし、myArrray = [ "Fire", "Rain", "Wind" ] となる
  

  sort() は、配列の要素をどのようにソートするかを定めるコールバック関数を引数にとることもできます。関数は 2 つの値を比較し、3 つの値のうち 1 つの値を返します:

  • ソートシステムにとって a が b より小さい場合、-1 (または任意の負数) を返します。
  • ソートシステムにとって a が b より大きい場合、1 (または任意の正数) を返します。
  • a と b が等価とみなされる場合、0 を返します。

  例えば、次のコードは配列の最後の文字によってソートします:

  var sortFn = function(a, b){
    if (a[a.length - 1] < b[b.length - 1]) return -1;
    if (a[a.length - 1] > b[b.length - 1]) return 1;
    if (a[a.length - 1] == b[b.length - 1]) return 0;
  }
  myArray.sort(sortFn); // 配列をソートし、myArray = ["Wind","Fire","Rain"] となる

古いブラウザ向けの互換性を持つコードは、各機能の個別ページに掲載しています。さまざまなブラウザにおけるこれらの機能のネイティブサポート状況は、 こちらで確認できます。

• indexOf(searchElement[, fromIndex]) は配列で searchElement を検索して、最初にマッチした要素のインデックスを返します。

  var a = ['a', 'b', 'a', 'b', 'a'];
  alert(a.indexOf('b')); // 1 がアラート表示される
  // 前回マッチした場所の後ろから再び検索
  alert(a.indexOf('b', 2)); // 3 がアラート表示される
  alert(a.indexOf('z')); // -1 がアラート表示される。'z' は見つからないため。
  

• lastIndexOf(searchElement[, fromIndex]) は indexOf と同様に動作しますが、配列の最後から前に向けて検索します。

  var a = ['a', 'b', 'c', 'd', 'a', 'b'];
  alert(a.lastIndexOf('b')); // 5 がアラート表示される
  // 前回マッチした場所の前から再び検索
  alert(a.lastIndexOf('b', 4)); // 1 がアラート表示される
  alert(a.lastIndexOf('z')); // -1 がアラート表示される
  

• forEach(callback[, thisObject]) は callback をすべての配列アイテムに対して実行します。

  var a = ['a', 'b', 'c'];
  a.forEach(alert); // 順番にアラート表示を実行
  

• map(callback[, thisObject]) はすべての配列アイテムに対して callback を実行し、その戻り値による新たな配列を返します。

  var a1 = ['a', 'b', 'c'];
  var a2 = a1.map(function(item) { return item.toUpperCase(); });
  alert(a2); // A,B,C をアラート表示
  

• filter(callback[, thisObject]) は、callback が true を返すアイテムを含む新たな配列を返します。

  var a1 = ['a', 10, 'b', 20, 'c', 30];
  var a2 = a1.filter(function(item) { return typeof item == 'number'; });
  alert(a2); // 10,20,30 をアラート表示
  

• every(callback[, thisObject]) は、配列内の全アイテムについて callback が true を返す場合に、true を返します。

  function isNumber(value){
    return typeof value == 'number';
  }
  var a1 = [1, 2, 3];
  alert(a1.every(isNumber)); // true がアラート表示される
  var a2 = [1, '2', 3];
  alert(a2.every(isNumber)); // false がアラート表示される
  

• some(callback[, thisObject]) は、配列内で少なくとも 1 つのアイテムについて callback が true を返す場合に、true を返します。

  function isNumber(value){
    return typeof value == 'number';
  }
  var a1 = [1, 2, 3];
  alert(a1.some(isNumber)); // true がアラート表示される
  var a2 = [1, '2', 3];
  alert(a2.some(isNumber)); // true がアラート表示される
  var a3 = ['1', '2', '3'];
  alert(a3.some(isNumber)); // false がアラート表示される
  

コールバック関数を引数にとる上記メソッドは、配列全体にわたってさまざまな方法で反復処理を行うことから、iterative methods として知られます。各々のメソッドは thisObject と呼ばれる、省略可能な第 2 引数をとります。これが与えられると、thisObject はコールバック関数の本体内で this キーワードが指す値になります。これが与えられない場合は、this はグローバルオブジェクト (window) を参照します。他の例として、明示的なオブジェクトコンテキストの外部で呼び出された場合も同様です。

コールバック関数は、実際は 3 つの引数を伴って呼び出されます。1 番目は現在のアイテムの値、2 番目は現在のアイテムの配列インデックス、3 番目は配列自身への参照です。JavaScript の関数はパラメータリストで名前がついていない引数を無視しますので、alert のように引数が 1 つだけのコールバック関数を与えても安全です。

• reduce(callback[, initialValue]) はアイテムのリストを単一の値に減らすために、callback(firstValue, secondValue) を適用します。

  var a = [10, 20, 30];
  var total = a.reduce(function(first, second) { return first + second; }, 0);
  alert(total) // 60 がアラート表示される
  

• reduceRight(callback[, initialValue]) は reduce() と似た動作をしますが、最後の要素から処理を始めます。

reduce および reduceRight は、配列の反復処理メソッドでは理解しにくいものです。これらは、一連の値を単一の値へ減らすため 2 つの値を再帰的に結合するアルゴリズムで用いるべきです。

多次元配列

配列は入れ子にすることができ、これは配列を別の配列の要素として収めることです。JavaScript の配列のこのような特徴を用いると、多次元配列を作成できます。

次のコードは、2 次元配列を作成します。

var a = new Array(4);
for (i = 0; i < 4; i++) {
  a[i] = new Array(4);
  for (j = 0; j < 4; j++) {
    a[i][j] = "[" + i + "," + j + "]";
  }
}

この例では、次の行を持つ配列が作成されます:

Row 0: [0,0] [0,1] [0,2] [0,3]
Row 1: [1,0] [1,1] [1,2] [1,3]
Row 2: [2,0] [2,1] [2,2] [2,3]
Row 3: [3,0] [3,1] [3,2] [3,3]

配列と正規表現

配列が正規表現と文字列との間のマッチ結果であるとき、その配列はマッチ内容についての情報を持つプロパティと要素を返します。配列は RegExp.exec()、String.match()、String.split() の戻り値です。正規表現とともに配列を使用することに関する情報は、正規表現をご覧ください。

配列状のオブジェクトを扱う

document.getElementsByTagName() が返す NodeList や関数の本体内で使用できる arguments オブジェクトなど一部の JavaScript オブジェクトは、表面上は配列のように振る舞いますが、すべてのメソッドを共有してはいません。例えば arguments オブジェクトは length 属性を持っていますが、forEach() メソッドは実装していません。

JavaScript 1.6 で導入された配列ジェネリクスは、他の配列状のオブジェクトに対して Array のメソッドを実行する手段を提供します。標準的な配列のメソッドはそれぞれ、Array オブジェクトに対応するメソッドを持っています。例えば:

 function alertArguments() {
   Array.forEach(arguments, function(item) {
     alert(item);
   });
 }

これらの一般的なメソッドは JavaScript の関数オブジェクトが提供する call メソッドを用いて、古いバージョンの JavaScript でより冗長な形でエミュレートできます:

 Array.prototype.forEach.call(arguments, function(item) {
   alert(item);
 });

配列の一般的なメソッドは文字列でも同様に用いることができます。これは、メソッドが配列へアクセスする方法と同様に、文字列の各文字へ順番にアクセスするためです:

Array.forEach("a string", function(chr) {
   alert(chr);
});

以下は配列のメソッドを文字列に適用する例であり、また JavaScript 1.8 の式クロージャを利用しています:

var str = 'abcdef';
var consonantsOnlyStr = Array.filter(str, function (c) !(/[aeiou]/i).test(c)).join(''); // 'bcdf'
var vowelsPresent = Array.some(str, function (c) (/[aeiou]/i).test(c)); // true
var allVowels = Array.every(str, function (c) (/[aeiou]/i).test(c)); // false
var interpolatedZeros = Array.map(str, function (c) c+'0').join(''); // 'a0b0c0d0e0f0'
var numerologicalValue = Array.reduce(str, function (c, c2) c+c2.toLowerCase().charCodeAt()-96, 0);
// 21 (reduce() は JS v1.8 以降で使用可能)

filter および map は戻り値として、自動的に文字列へ戻した文字集合を返さないことに注意してください。配列が返されますので、文字列へ戻すために join を使用しなければなりません。

配列内包

JavaScript 1.7 で導入された配列内包は、別のコンテンツを元にして新たな配列を構築する有用な近道を提供します。配列内包は一般に、map() および filter() を呼び出す代わりとして、あるいはそれら 2 つを結合する手段として用いることができます。

次の配列内包は数値の配列を取り込んで、その各数値を 2 倍した値による新しい配列を作成します。

var numbers = [1, 2, 3, 4];
var doubled = [i * 2 for each (i in numbers)];
alert(doubled); // 2,4,6,8 がアラート表示される

これは次の map() による操作と同等です:

var doubled = numbers.map(function(i) { return i * 2; });

配列内包は、特定の式にマッチするアイテムの選択に用いることもできます。以下は、偶数だけを選択する内包です:

var numbers = [1, 2, 3, 21, 22, 30];
var evens = [i for each (i in numbers) if (i % 2 == 0)];
alert(evens); // 2,22,30 をアラート表示

同じ目的で filter() を用いることができます:

var evens = numbers.filter(function(i) { return i % 2 == 0; });

map() および filter() 方式の操作を、ひとつの配列内包に統合することができます。以下は偶数だけをフィルタリングして、それらを 2 倍した値を含む配列を作成します:

var numbers = [1, 2, 3, 21, 22, 30];
var doubledEvens = [i * 2 for each (i in numbers) if (i % 2 == 0)];
alert(doubledEvens); // 4,44,60 がアラート表示される

配列内包の角括弧は、スコープ目的の暗黙的なブロックをもたらします。新しい変数 (上記の例における i ) は、let を用いて宣言されたかのように扱われます。つまり、それらの変数は配列内包の外部で使用できません。

配列内包の入力自体は、配列である必要はありません。イテレータおよびジェネレータ も使用できます。

文字列を入力とすることもできます。(配列状のオブジェクトにおいて) 前出の filter や map の動作を実現するには以下のようにします:

var str = 'abcdef';
var consonantsOnlyStr = [c for each (c in str) if (!(/[aeiouAEIOU]/).test(c))  ].join(''); // 'bcdf'
var interpolatedZeros = [c+'0' for each (c in str) ].join(''); // 'a0b0c0d0e0f0'

繰り返しになりますが入力データの形式は維持されませんので、文字列へ戻すために join() を使用しなければなりません。

Boolean オブジェクト

Boolean オブジェクトは、プリミティブな真偽値型のラッパです。Boolean オブジェクトを作成するには次の構文を使用します:

var booleanObjectName = new Boolean(value);

プリミティブな真偽値型の true と false を、Boolean オブジェクトの true や false という値を混同しないでください。false という値を持つ Boolean オブジェクトを含む、値が undefined、null、0、NaN、空文字列のどれでもないあらゆるオブジェクトは、条件文に通されると true に評価されます。詳しくは if...else 文を参照してください。

Date オブジェクト

JavaScript には日付を表すデータ型がありません。しかしながら、Date オブジェクトとそのメソッドを使用することで、アプリケーションで日付と時刻を扱うことができます。Date オブジェクトには日付をセット、取得、操作するためのメソッドがたくさんあります。プロパティは一切ありません。

JavaScript は Java と同じように日付を扱います。これら 2 つの言語に共通する、日付に関するメソッドが多くあります。また、両言語ともに日付を 1970 年 1 月 1 日 00:00:00 からのミリ秒数として保持します。

Date オブジェクトの範囲は 1970 年 1 月 1 日 (UTC) を基準に -100,000,000 日から 100,000,000 日です。

Date オブジェクトは次のようにして作成します:

var dateObjectName = new Date([parameters]);

ここで dateObjectName は、作成する Date オブジェクトの名前です。すなわち、新しいオブジェクトの名前か、既存のオブジェクトのプロパティ名です。

new キーワードを伴わずに Date を呼び出すと、与えられた日付を文字列表現に変換します。

上記の構文で、parameters は次のどの形式で指定してもかまいません:

• 引数なし: 今日の日付と時刻を作成します。例えば、today = new Date();。
• 次の形式 "月 日, 年 時:分:秒" で日付を表した文字列。例えば、var Xmas95 = new Date("December 25, 1995 13:30:00")。時、分、または秒を省略すると、その値は 0 にセットされます。
• 年、月、日を表す整数値のセット。例えば、var Xmas95 = new Date(1995, 11, 25)。
• 年、月、日、時、分、秒を表す整数値のセット。例えば、var Xmas95 = new Date(1995, 11, 25, 9, 30, 0);。

JavaScript 1.2 以前
Date オブジェクトは以下のように振る舞います:

• 1970 年より前の日付は許されません。
• JavaScript はプラットフォーム特有の日付の機能や挙動に依存します。つまり、Date オブジェクトの挙動はプラットフォームごとに異なります。

Date オブジェクトのメソッド

Date オブジェクトの日付や時刻を扱うメソッドは、大まかに以下のカテゴリに分けることができます:

• "set" メソッド : 日付や時刻の値を Date オブジェクトにセットします。
• "get" メソッド : Date オブジェクトから日付や時刻の値を取得します。
• "to" メソッド : Date オブジェクトから文字列の値を返します。
• parse および UTC メソッド : Date 文字列をパースします。

"get" および "set" メソッドを用いることで秒、分、時、日にち、曜日、月、年を別々に取得したりセットしたりできます。曜日を返す getDay メソッドはありますが、これに対応する setDay メソッドはありません。なぜならば、曜日は自動的にセットされるからです。これらのメソッドは、それらの値の表現に整数を用います:

• 秒および分 : 0 から 59
• 時 : 0 から 23
• 曜日 : 0 (日曜) から 6 (土曜)
• 日にち: 1 から 31
• 月: 0 (1 月) から 11 (12 月)
• 年: 1900 年から数えた年

例えば、次の日付を定義したとします:

var Xmas95 = new Date("December 25, 1995");

すると、Xmas95.getMonth() は 11 を返し、Xmas95.getFullYear() は 1995 を返します。

getTime メソッドや setTime メソッドは、日付の比較に便利です。getTime メソッドは Date オブジェクトの、1970 年 1 月 1 日 00:00:00 からのミリ秒数を返します。

例えば、次のコードは今年の残りの日数を表示します:

var today = new Date();
var endYear = new Date(1995, 11, 31, 23, 59, 59, 999); // 日と月をセット
endYear.setFullYear(today.getFullYear()); // 今年が何年かをセット
var msPerDay = 24 * 60 * 60 * 1000; // 1 日のミリ秒数をセット
var daysLeft = (endYear.getTime() - today.getTime()) / msPerDay;
var daysLeft = Math.round(daysLeft); // 今年の残り日数を返す

この例では、今日の日付を保持する today という名前の Date オブジェクトを作成します。そして endYear という名前の Date オブジェクトを作成し、今年が何年かという値をセットします。さらに、1 日のミリ秒数を用いて today と endYear の間の日数を算出します。

parse メソッドは、日付を表す文字列から既存の Date オブジェクトに値を代入するのに便利です。例えば次のコードは、parse と setTime を用いて日付の値を IPOdate オブジェクトに代入します:

var IPOdate = new Date();
IPOdate.setTime(Date.parse("Aug 9, 1995"));

Date オブジェクトの使用例

次の例では、関数 JSClock() はデジタル時計のような形式で時刻を返します。

function JSClock() {
  var time = new Date();
  var hour = time.getHours();
  var minute = time.getMinutes();
  var second = time.getSeconds();
  var temp = "" + ((hour > 12) ? hour - 12 : hour);
  if (hour == 0)
    temp = "12";
  temp += ((minute < 10) ? ":0" : ":") + minute;
  temp += ((second < 10) ? ":0" : ":") + second;
  temp += (hour >= 12) ? " P.M." : " A.M.";
  return temp;
}

JSClock 関数はまず time という新しい Date オブジェクトを作成します。引数は与えられないため、現在の日付と時刻で time が作成されます。そして getHours、getMinutes、および getSeconds メソッドを呼び出し、現在の時、分、秒の値を hour、minute、second にそれぞれ代入します。

その次の 4 つの文は、時刻を元に文字列の値を構築します。最初の文は変数 temp を作成し、それに条件式を用いて値を代入します。hour が 12 より大きい場合は (hour - 12) を、それ以外の場合は単純に hour をそれぞれ代入します。ただし hour が 0 である場合は 12 とします。

その次の文は minute の値を temp に付け加えます。minute の値が 10 より小さい場合は、条件式が区切りのコロンと分の先頭のゼロを追加し、そうでない場合は区切りのコロンだけを追加します。そして同様にして second の値を temp に付け加えます。

最後に、条件式は hour が 12 以上の場合は "PM" を、そうでない場合は "AM" をそれぞれ temp に付け加えます。

Function オブジェクト

定義済みの Function オブジェクトは、関数としてコンパイルさせたい JavaScript コードの文字列を指定します。

Function オブジェクトを作成するには、次のようにします:

var functionObjectName = new Function ([arg1, arg2, ... argn], functionBody);

functionObjectName は、変数名または既存のオブジェクトのプロパティ名です。オブジェクトに小文字のイベントハンドラ名を続けて、window.onerror のように指定することもできます。

arg1, arg2, ... argn は、関数が仮引数名として使用する引数です。それぞれが JavaScript の識別子として妥当な文字列である必要があります。例えば、"x" や "theForm" などです。

functionBody は、関数の本体としてコンパイルさせたい JavaScript コードを表す文字列です。

Function オブジェクトは、使用されるたびに評価されます。これは関数を宣言し、それをコード内で呼び出す方法よりも非効率です。宣言された関数はコンパイルされるからです。

ここで説明した関数の定義方法に加えて、function 文 と関数式を用いることもできます。詳しくは JavaScript リファレンス を参照してください。

次のコードは関数を変数 setBGColor に代入します。この関数は、開いている文書の背景色をセットします。

var setBGColor = new Function("document.bgColor = 'antiquewhite'");

Function オブジェクトを呼び出すには、それがあたかも関数であるかのように変数名を指定すればよいのです。次のコードは setBGColor 変数で指定された関数を実行します:

var colorChoice="antiquewhite";
if (colorChoice=="antiquewhite") {setBGColor()}

次のどちらかの方法を使用することで、イベントハンドラに関数を割り当てることができます:

1. document.form1.colorButton.onclick = setBGColor;
   

2. <INPUT NAME="colorButton" TYPE="button"
     VALUE="Change background color"
     onClick="setBGColor()">
   

上記の変数 setBGColor を作成することは、次の関数の宣言と同じようなことです:

function setBGColor() {
  document.bgColor = 'antiquewhite';
}

関数を変数に代入することは関数を宣言することと似ていますが、異なる点もあります:

• var setBGColor = new Function("...") のようにして関数を変数に代入すると、setBGColor は new Function() を用いて作成した関数への参照を値に持つ変数になります。
• function setBGColor() {...} のようにして関数を作成すると、setBGColor は変数ではなく関数の名前になります。

関数を関数の中に入れ子にすることができます。内側の関数は外側の関数に対してプライベートになります:

• 内側の関数には、外側の関数の文からしかアクセスできません。
• 内側の関数は、外側の関数の引数や変数を使用できます。外側の関数は、内側の関数の引数や変数を使用できません。

Math オブジェクト

定義済みの Math オブジェクトには、数学的な定数や関数を実現するプロパティやメソッドがあります。例えば、Math オブジェクトの PI プロパティは円周率の値 (3.141...) を表します。これはアプリケーションで次のように使用します。

Math.PI

同様に、標準的な数学関数が Math のメソッドになっています。これは三角関数、対数関数、指数関数などがあります。例えば、三角関数のサインを使用したい場合は次のように書きます。

Math.sin(1.56)

Math の三角関数のメソッドは、すべて引数をラジアンでとることに注意してください。

次の表で、Math オブジェクトのメソッドを簡単に説明します。

他の多くのオブジェクトとは異なり、決して自分用の Math オブジェクトを作成してはいけません。常に定義済みの Math オブジェクトを使用してください。

Number オブジェクト

Number オブジェクトには、最大値、非数、無限大といった数値定数を表すプロパティがあります。これらのプロパティの値を変更することはできません。これらは次のように使用します:

var biggestNum = Number.MAX_VALUE;
var smallestNum = Number.MIN_VALUE;
var infiniteNum = Number.POSITIVE_INFINITY;
var negInfiniteNum = Number.NEGATIVE_INFINITY;
var notANum = Number.NaN;

常に上記のようにして、定義済みの Number オブジェクトのプロパティを参照します。自分で作成した Number オブジェクトのプロパティとして参照するのではありません。

次の表では、Number オブジェクトのプロパティについて簡単に説明します。

Number のプロトタイプは、Number オブジェクトから情報をさまざまな形で取り出すメソッドを備えています。次の表では Number.prototype のメソッドについて簡単に説明します。

RegExp オブジェクト

RegExp オブジェクトを用いることで、正規表現を使用できるようになります。これは正規表現で説明しています。

String オブジェクト

String オブジェクトは、文字列のプリミティブデータ型のラッパです。文字列リテラルと String オブジェクトを混同してはいけません。例えば、次のコードは文字列リテラルの s1 と String オブジェクトの s2 を作成します:

var s1 = "foo"; // 文字列リテラルの値を作成
var s2 = new String("foo"); // String オブジェクトを作成

文字列リテラルで、String オブジェクトのあらゆるメソッドを呼び出すことができます。JavaScript が自動的に文字列リテラルを一時的な String オブジェクトに変換し、メソッドを呼び出し、その一時的な String オブジェクトを破棄するのです。String.length プロパティを文字列リテラルで使用することもできます。

特に String オブジェクトを使用する必要がない場合は、文字列リテラルを使うようにしてください。String オブジェクトは直感的でない挙動をとることがあるためです。例えば:

var s1 = "2 + 2"; // 文字列リテラル値を作成
var s2 = new String("2 + 2"); // String オブジェクトを作成
eval(s1); // 数値 4 を返す
eval(s2); // 文字列 "2 + 2" を返す

String オブジェクトにはプロパティが 1 つあります。それは length で、文字列中の文字の数を表します。例えば、次のコードは x に 13 という値を代入します。"Hello, World!" は 13 文字であるからです:

var mystring = "Hello, World!";
var x = mystring.length;

String オブジェクトには 2 種類のメソッドがあります。これは、substring や toUpperCase のように文字列そのものを変形させたものを返すメソッドと、bold や link のように文字列を HTML として整形したものを返すメソッドです。

例えば先の例を流用すると、mystring.toUpperCase() も "hello, world!".toUpperCase() も、"HELLO, WORLD!" という文字列を返します。

substring メソッドは 2 つの引数をとり、それら 2 つの引数の間の文字列のサブセットを返します。先の例を流用すると、mystring.substring(4, 9) は "o, Wo" という文字列を返します。詳しくは JavaScript リファレンスで、String オブジェクトの substring メソッドを参照してください。

String オブジェクトには、自動的に HTML に整形するメソッドも多くあります。これは太字のテキストを生成する bold や、ハイパーリンクを生成する link などがあります。例えば、link メソッドを用いて架空の URL へのハイパーリンクを生成するには次のようにします:

mystring.link("https://www.helloworld.com")

次の表で、String オブジェクトのメソッドについて簡単に説明します。