ホームページ > 記事 > ウェブフロントエンド > JavaScript参照型入門_基礎知識
JavaScript参照型入門_基礎知識
- WBOYオリジナル
- 2016-05-16 17:50:59932ブラウズ
オブジェクト型
オブジェクト型は、JavaScript で最もよく使用される型です。 Object のインスタンスには多くの機能はありませんが、アプリケーション内でデータを保存および転送するには理想的です。
Object インスタンスを作成するには 2 つの方法があります。1 つ目は、new 演算子の後に Object コンストラクターを使用する方法です。
コードをコピーします コードは次のとおりです。
var person = new Object(); 🎜>person .name = "tt";
person.age = 12;
コードをコピー コードは次のとおりです:
var person = {
name : 'tt' ,
age : 12
}
さらに、オブジェクト リテラル構文を使用する場合、中括弧を空のままにすると、値にデフォルトのプロパティが含まれるオブジェクトを定義できます。と方法。 name : 'tt' ,
age : 12
}
var person = {}; // new Object() と同じ
person.name = "tt";
を使用することもできます前のメソッドはオブジェクトを定義するために導入されたメソッドのいずれかですが、開発者は 2 番目のメソッド (オブジェクト リテラル構文) を好みます。これは、この構文に必要なコードが少なく、データをカプセル化しているような感覚が得られるためです。実際、オブジェクト リテラルは、多数のオプションのパラメーターを関数に渡すための推奨される方法でもあります。たとえば、次のようになります。コードは次のとおりです。
function showInfo(args)
{ if(args.name != unknown) { alert(args.name); } if(args.age != 未定義) {
alert(args.age); }
}
showInfo({
name:'name',
age:12
});
showInfo({name:'name'});
一般的にはドットが使用されます。オブジェクトのプロパティにアクセスするときの表記法。これは多くのオブジェクト指向言語でも一般的な構文です。ただし、角かっこ表記を使用して、JavaScript でオブジェクトのプロパティにアクセスすることもできます。例:
コードをコピー
コードは次のとおりです:
}
showInfo({
name:'name',
age:12
});
showInfo({name:'name'});
一般的にはドットが使用されます。オブジェクトのプロパティにアクセスするときの表記法。これは多くのオブジェクト指向言語でも一般的な構文です。ただし、角かっこ表記を使用して、JavaScript でオブジェクトのプロパティにアクセスすることもできます。例:
コードをコピー
コードは次のとおりです:
alert(person.name) ;
alert(person['name']); 機能の観点からは、オブジェクトのプロパティにアクセスするこれら 2 つの方法に違いはありません。ただし、角括弧構文の主な利点は、変数を通じてプロパティにアクセスできることです。
コードをコピーします
コードは次のとおりです。
コードは次のとおりです。
var propertyName = 'name'; >alert( person[propertyName]); JavaScript の配列は、他のほとんどの言語の配列とはまったく異なります。 JavaScript 配列は、他の言語の配列と同様、順序付けられたデータのリストですが、他の言語とは異なり、JavaScript 配列の各項目は任意のタイプのデータを保持できます。つまり、配列の最初の位置を使用して文字列を保存し、2 番目の位置を使用して値を保存し、3 番目の位置を使用してオブジェクトを保存できます。さらに、JavaScript 配列のサイズは動的に調整できます。つまり、新しいデータに対応するためにデータが追加されると自動的に拡張できます。
配列を作成するには 2 つの基本的な方法があります。 1 つ目は、Array コンストラクターを使用することです。
コードをコピーします
コードは次のとおりです。
var Colors1 = new Array(); 🎜>var Colors2 = new Array(20);
var Colors3 = new Array('red','blue',' yellow'); コードをコピーします
コードは次のとおりです。
var Colors2 = ['red','blue',' yellow'];
コードは次のとおりです:
var Colors = ['red','blue',' yellow']; //文字列配列を定義します
alert(colors[0]); //最初の項目を表示します
[2] = 'green'; //3 番目の項目を変更します
colors[3] = 'black' //4 番目の項目を追加します
配列の長さは、 length プロパティを使用すると、このプロパティは常に 0 以上の値を返します。
コードをコピー コードは次のとおりです:
var Colors = ['red','青', '黄色'];
var names = [];
alert(colors.length); //0
コードをコピー コードは次のとおりです:
var Colors = ['red',' blue', ' yellow'];
colors.length = 2;
alert(colors[2]); //未定義
この例の配列の色は最初は 3 つの値を持っています。 length プロパティを 2 に設定すると、最後の項目が削除され、その結果、colors[2] にアクセスすると、未定義と表示されます。 colors.length = 2;
alert(colors[2]); //未定義
length 属性を使用すると、配列の末尾に新しい項目を簡単に追加することもできます。
コードをコピー コードは次のとおりです:
var Colors = ['red',' blue', ' yellow'];
colors[colors.length] = 'green'; //位置 3 に色を追加します
colors[colors.length] = 'black';位置 4 カラー
配列内の最後の項目のインデックスは常に length-1 であるため、次の新しい項目の位置は length になります。 colors[colors.length] = 'green'; //位置 3 に色を追加します
colors[colors.length] = 'black';位置 4 カラー
変換メソッド
すべてのオブジェクトには toLocaleString()、toString()、および valueOf() メソッドがあります。このうち、配列の toString() メソッドと valueOf() メソッドを呼び出すと、同じ値、つまり配列内の各値の文字列を連結して形成されたカンマ区切りの文字列が返されます。実際、この文字列を作成するには、配列内の各項目の toString() メソッドが呼び出されます。
コードをコピー コードは次のとおりです:
var Colors = ['red','青', '黄色'];
alert(colors.toString()); //red,blue, yellow
alert(colors.valueOf()); (colors) ; //red, blue, yellow
まず、toString() メソッドと valueOf() メソッドを明示的に呼び出して、配列の文字列表現を返します。各値の文字列表現は次のとおりです。カンマで区切られた文字列に連結されます。コードの最後の行は、配列をalert()に直接渡します。 alert() は文字列パラメータを受け取るため、バックグラウンドで toString() メソッドを呼び出します。これにより、 toString() メソッドを直接呼び出した場合と同じ結果が得られます。
alert(colors.toString()); //red,blue, yellow
alert(colors.valueOf()); (colors) ; //red, blue, yellow
まず、toString() メソッドと valueOf() メソッドを明示的に呼び出して、配列の文字列表現を返します。各値の文字列表現は次のとおりです。カンマで区切られた文字列に連結されます。コードの最後の行は、配列をalert()に直接渡します。 alert() は文字列パラメータを受け取るため、バックグラウンドで toString() メソッドを呼び出します。これにより、 toString() メソッドを直接呼び出した場合と同じ結果が得られます。
さらに、toLocaleString() メソッドは、toString() および valueOf() メソッドと同じ値を返すことがよくありますが、常にそうとは限りません。配列の toLocaleString() メソッドが呼び出されると、配列値のカンマ区切り文字列も作成されます。最初の 2 つのメソッドとの唯一の違いは、今回は各項目の値を取得するために、toString() メソッドの代わりに各項目の toLocaleString() メソッドが呼び出されることです。例:
コードをコピー コードは次のとおりです:
var person1 = { toLocaleString: function (){
return "person1 : toLocaleString";
toString : function(){
return "person1 : toString"
};
var person2 = {
toLocaleString : function(){
return "person2 : toLocaleString";
},
toString : function(){
return "person2 : toString";
}
};
var people = [person1,person2]
alert(people); //person1 : toString,person2 : toString
alert(people.toString()); //person1 : toString,person2: toString
alert(people.toLocaleString()); //person1: toLocaleString,person2: toLocaleString
配列継承 toLocaleString()、toString() およびvalueOf() メソッドはすべて、デフォルトで配列項目をカンマ区切りの文字列として返します。 join() メソッドを使用すると、さまざまな区切り文字を使用してこの文字列を構築できます。
return "person1 : toLocaleString";
toString : function(){
return "person1 : toString"
};
var person2 = {
toLocaleString : function(){
return "person2 : toLocaleString";
},
toString : function(){
return "person2 : toString";
}
};
var people = [person1,person2]
alert(people); //person1 : toString,person2 : toString
alert(people.toString()); //person1 : toString,person2: toString
alert(people.toLocaleString()); //person1: toLocaleString,person2: toLocaleString
配列継承 toLocaleString()、toString() およびvalueOf() メソッドはすべて、デフォルトで配列項目をカンマ区切りの文字列として返します。 join() メソッドを使用すると、さまざまな区切り文字を使用してこの文字列を構築できます。
コードをコピー
コードは次のとおりです:
var Colors = ['red','blue',' yellow'];
alert(colors.join(',')); //red,blue, yellow
alert( Colors.join('||')); //red||blue|| yellow
注: 配列内の項目の値が null または未定義の場合、その値が追加されます。 in join ()、toString()、toLocaleString()、および valueOf() メソッドによって返される結果は、空の文字列で表されます。
スタック メソッド
JavScript 配列は、配列を他のデータ構造のように動作させる方法も提供します。具体的には、配列は項目の挿入と削除を制限できるデータ構造であるスタックのように動作できます。スタックは後入れ先出しのデータ構造です。スタック内の項目の挿入 (プッシュと呼ばれる) と削除 (ポップと呼ばれる) は、スタックの最上部という 1 つの場所でのみ発生します。 JavaScript には、同様のスタック動作を実現するための Push() メソッドと Pop() メソッドが用意されています。
Push() メソッドは、任意の数のパラメータを受け取り、それらを配列の末尾に 1 つずつ追加し、変更された配列の長さを返すことができます。 Pop() メソッドは、配列の末尾から最後の項目を削除し、配列の長さを減らし、削除された項目を返します。
var Colors = new Array() / /配列を作成します
var count = Colors.push('red','blue') //2 つのアイテムをプッシュします
alert(count); //2
count = Colors.push(' yellow'); ') ; //別のアイテムをプッシュします
alert(count); //3
var item = color.pop() //最後のアイテムを取得します
alert(item); >alert(colors.length); //2
キューメソッド
キューデータ構造のアクセスルールは先入れ先出しです外。キューはリストの最後に項目を追加し、リストの先頭から項目を削除します。 Push() は配列の末尾に項目を追加するメソッドであるため、キューをシミュレートするために必要なのは、配列の先頭から項目を取得するメソッドだけです。これを行う配列メソッドは、shift() です。これは、配列内の最初の項目を削除して返し、配列の長さを 1 つ減らします。 shift() メソッドと Push() メソッドを組み合わせると、配列をキューのように使用できます。
並べ替えメソッド
配列の並べ替えに直接使用できるメソッドがすでに 2 つあります。 reverse() と sort() です。 reverse() メソッドは反転します。配列項目の順序を変更します。
例の値の順序が正しい場合でも、sort() メソッドはテスト文字列の結果に基づいて元の順序を変更することがわかります。値 5 は 10 より小さいにもかかわらず、文字列を比較する場合、「10」が「5」の前にあるためです。したがって、sort() メソッドはパラメータとして比較関数を受け取ることができるため、どの値がどの値の前に来るかを指定できます。
function Compare(value1,value2) ){
if(value1 < value2){
return 1;
} else if(value1 > value2){
return -1;
} else{
return 0 ;
}
}
var 値 = [0,1,5,10,15];
values.sort(values); ,10,5, 1,0
数値型、または valueOf() メソッドが数値型を返すオブジェクト型の場合は、より単純な比較関数を使用できます。この関数は主に 2 番目の値から 1 番目の値を減算します。
操作メソッド
JavaScript には配列を操作するためのメソッドが多数用意されています。その中で、concat() メソッドは、現在の配列内のすべての項目に基づいて新しい配列を作成できます。1 つ以上の配列が concat() メソッドに渡されると、メソッドはこれらの配列内の各項目を結果に追加します。配列内で。渡された値が配列でない場合、値は結果の配列の末尾に単純に追加されます。
削除 - 削除する最初の項目の位置と削除する項目の数の 2 つのパラメーターを指定することで、任意の数の項目を削除できます。たとえば、splice(0,2) は配列内の最初の 2 つの項目を削除します。
挿入 - 指定した位置に任意の数の項目を挿入できます。指定する必要があるのは、開始位置、0 (削除する項目の数)、および挿入する項目の 3 つのパラメータだけです。複数の項目を挿入する場合は、4 番目と 5 番目の項目、または必要な数の項目を渡すことができます。たとえば、 splice(2,0,'red','green') は、現在の配列の位置 2 から始まる文字列 'red' と 'green' を挿入します。
置換 - 指定した位置に任意の数の項目を挿入し、同時に任意の数の項目を削除できます。指定する必要があるのは、開始位置、削除する項目の数、および 3 つのパラメータのみです。挿入する項目の数は任意です。挿入されるアイテムの数は、削除されるアイテムの数と同じである必要はありません。たとえば、 splice(2,1,'red','green') は、現在の配列の位置 2 にある項目を削除し、文字列 'red' と 'green' を位置 2 から挿入します。
var Colors = ['red','blue',' yellow'];
alert(colors.join(',')); //red,blue, yellow
alert( Colors.join('||')); //red||blue|| yellow
注: 配列内の項目の値が null または未定義の場合、その値が追加されます。 in join ()、toString()、toLocaleString()、および valueOf() メソッドによって返される結果は、空の文字列で表されます。
スタック メソッド
JavScript 配列は、配列を他のデータ構造のように動作させる方法も提供します。具体的には、配列は項目の挿入と削除を制限できるデータ構造であるスタックのように動作できます。スタックは後入れ先出しのデータ構造です。スタック内の項目の挿入 (プッシュと呼ばれる) と削除 (ポップと呼ばれる) は、スタックの最上部という 1 つの場所でのみ発生します。 JavaScript には、同様のスタック動作を実現するための Push() メソッドと Pop() メソッドが用意されています。
Push() メソッドは、任意の数のパラメータを受け取り、それらを配列の末尾に 1 つずつ追加し、変更された配列の長さを返すことができます。 Pop() メソッドは、配列の末尾から最後の項目を削除し、配列の長さを減らし、削除された項目を返します。
コードをコピーします コードは次のとおりです。
var Colors = new Array() / /配列を作成します
var count = Colors.push('red','blue') //2 つのアイテムをプッシュします
alert(count); //2
count = Colors.push(' yellow'); ') ; //別のアイテムをプッシュします
alert(count); //3
var item = color.pop() //最後のアイテムを取得します
alert(item); >alert(colors.length); //2
キューメソッド
キューデータ構造のアクセスルールは先入れ先出しです外。キューはリストの最後に項目を追加し、リストの先頭から項目を削除します。 Push() は配列の末尾に項目を追加するメソッドであるため、キューをシミュレートするために必要なのは、配列の先頭から項目を取得するメソッドだけです。これを行う配列メソッドは、shift() です。これは、配列内の最初の項目を削除して返し、配列の長さを 1 つ減らします。 shift() メソッドと Push() メソッドを組み合わせると、配列をキューのように使用できます。
コードをコピー コードは次のとおりです。以下のように:
var Colors = new Array(); //配列を作成します
var count = Colors.push('red','blue'); //2 つの項目をプッシュします
alert(count); //2
count = Colors.push(' yellow'); // 別のアイテムをプッシュします
alert(count); //3
var item = Colors.shift ( ); //最初の項目を取得します
alert(item); //red
alert(colors.length) //2
JavaScript は配列の unshift も提供します方法。名前が示すように、unshift() はshift() の逆のことを行います。配列の先頭に任意の数の項目を追加し、新しい配列の長さを返します。したがって、unshift() メソッドと Pop() メソッドを同時に使用すると、逆方向にキューをシミュレートできます。つまり、配列の先頭に項目を追加し、配列の末尾から項目を削除します。次に例を示します。 >var count = Colors.push('red','blue'); //2 つの項目をプッシュします
alert(count); //2
count = Colors.push(' yellow'); // 別のアイテムをプッシュします
alert(count); //3
var item = Colors.shift ( ); //最初の項目を取得します
alert(item); //red
alert(colors.length) //2
コードをコピー コードは次のとおりです。
var Colors = new Array(); // 配列を作成しますvar count = Colors .unshift('red','blue') // 2 つのアイテムをプッシュします
alert(count) //2
count = Colors.unshift(' yellow'); //もう 1 つのアイテムをプッシュします
alert(count); //3
var item = Colors.pop() //最初のアイテムを取得します
alert(item);
alert(colors.length); //2
注: IE の JavaScript の実装には差異があります。その unshift() メソッドは、配列の新しい長さの代わりに常に未定義を返します。 。
alert(count) //2
count = Colors.unshift(' yellow'); //もう 1 つのアイテムをプッシュします
alert(count); //3
var item = Colors.pop() //最初のアイテムを取得します
alert(item);
alert(colors.length); //2
注: IE の JavaScript の実装には差異があります。その unshift() メソッドは、配列の新しい長さの代わりに常に未定義を返します。 。
並べ替えメソッド
配列の並べ替えに直接使用できるメソッドがすでに 2 つあります。 reverse() と sort() です。 reverse() メソッドは反転します。配列項目の順序を変更します。
コードをコピー コードは次のとおりです:
var 値 = [1,2 ,3,4, 5]; values.reverse();
alert(values); //5,4,3,2,1
デフォルトでは、 () メソッドは、配列項目を昇順に並べ替えます。つまり、最小値が先頭にあり、最大値が末尾にあります。並べ替えを実装するには、sort() メソッドで各配列項目の toString() 変換メソッドを呼び出し、結果の文字列を比較して並べ替え方法を決定します。配列内の各項目は数値であっても、sort() メソッドは以下に示すように文字列を比較します。
alert(values); //5,4,3,2,1
デフォルトでは、 () メソッドは、配列項目を昇順に並べ替えます。つまり、最小値が先頭にあり、最大値が末尾にあります。並べ替えを実装するには、sort() メソッドで各配列項目の toString() 変換メソッドを呼び出し、結果の文字列を比較して並べ替え方法を決定します。配列内の各項目は数値であっても、sort() メソッドは以下に示すように文字列を比較します。
コードをコピーコードは次のとおりです。
varvalues = [0,1,5,10,15]; /0,1 ,10,15,5 例の値の順序が正しい場合でも、sort() メソッドはテスト文字列の結果に基づいて元の順序を変更することがわかります。値 5 は 10 より小さいにもかかわらず、文字列を比較する場合、「10」が「5」の前にあるためです。したがって、sort() メソッドはパラメータとして比較関数を受け取ることができるため、どの値がどの値の前に来るかを指定できます。
コードをコピー コードは次のとおりです。
function Compare(value1,value2) ){
if(value1 < value2){
return 1;
} else if(value1 > value2){
return -1;
} else{
return 0 ;
}
}
var 値 = [0,1,5,10,15];
values.sort(values); ,10,5, 1,0
コードをコピー コードは次のとおりです。
function Compare(value1,value2){
return value2 - value1;
}
return value2 - value1;
}
操作メソッド
JavaScript には配列を操作するためのメソッドが多数用意されています。その中で、concat() メソッドは、現在の配列内のすべての項目に基づいて新しい配列を作成できます。1 つ以上の配列が concat() メソッドに渡されると、メソッドはこれらの配列内の各項目を結果に追加します。配列内で。渡された値が配列でない場合、値は結果の配列の末尾に単純に追加されます。
コードをコピー コードは次のとおりです:
var Colors = ['red','緑', '青'];
var Colors2 = Colors.concat('黄色',['黒' , '茶色']); //赤、緑、青
alert(colours2); //赤、緑、青、黄、黒、茶色
スライス() メソッドは、現在の配列内の 1 つ以上の項目に基づいて新しい配列を作成できます。 lice() メソッドは、返される項目の開始位置と終了位置である 1 つまたは 2 つのパラメータを受け入れることができます。引数が 1 つだけの場合、slice() メソッドは、その引数で指定された位置から始まり、現在の配列の末尾で終わるすべての項目を返します。 2 つの引数が指定された場合、このメソッドは開始位置と終了位置の前の項目を返しますが、終了位置の項目は含まれません。
var Colors2 = Colors.concat('黄色',['黒' , '茶色']); //赤、緑、青
alert(colours2); //赤、緑、青、黄、黒、茶色
スライス() メソッドは、現在の配列内の 1 つ以上の項目に基づいて新しい配列を作成できます。 lice() メソッドは、返される項目の開始位置と終了位置である 1 つまたは 2 つのパラメータを受け入れることができます。引数が 1 つだけの場合、slice() メソッドは、その引数で指定された位置から始まり、現在の配列の末尾で終わるすべての項目を返します。 2 つの引数が指定された場合、このメソッドは開始位置と終了位置の前の項目を返しますが、終了位置の項目は含まれません。
コードをコピー コードは次のとおりです。
var Colors = ['red ',' 緑','青','黄色','黒','茶色']; var Colors2 = Colors.slice(1);
var Colors3 = Colors.slice(1,4); ;
alert(colors2); //green,blue, yellow,black,brown
alert(colors3) //green,blue, yellow
スプライスを導入しましょう( ) メソッドと同様に、このメソッドはおそらく最も強力な配列メソッドです。 splice() の主な目的は配列の中央に項目を挿入することですが、このメソッドを使用する方法は 3 つあります。 var Colors3 = Colors.slice(1,4); ;
alert(colors2); //green,blue, yellow,black,brown
alert(colors3) //green,blue, yellow
削除 - 削除する最初の項目の位置と削除する項目の数の 2 つのパラメーターを指定することで、任意の数の項目を削除できます。たとえば、splice(0,2) は配列内の最初の 2 つの項目を削除します。
挿入 - 指定した位置に任意の数の項目を挿入できます。指定する必要があるのは、開始位置、0 (削除する項目の数)、および挿入する項目の 3 つのパラメータだけです。複数の項目を挿入する場合は、4 番目と 5 番目の項目、または必要な数の項目を渡すことができます。たとえば、 splice(2,0,'red','green') は、現在の配列の位置 2 から始まる文字列 'red' と 'green' を挿入します。
置換 - 指定した位置に任意の数の項目を挿入し、同時に任意の数の項目を削除できます。指定する必要があるのは、開始位置、削除する項目の数、および 3 つのパラメータのみです。挿入する項目の数は任意です。挿入されるアイテムの数は、削除されるアイテムの数と同じである必要はありません。たとえば、 splice(2,1,'red','green') は、現在の配列の位置 2 にある項目を削除し、文字列 'red' と 'green' を位置 2 から挿入します。
コードをコピー コードは次のとおりです:
var Colors = ['red',' green', 'blue']; var selected = Colors.splice(0,1); //最初の項目を削除します
alert(colors); //green,blue
alert(removed); //red
removed = Colors.splice(1,0,' yellow','black') //位置 1 から 2 つの項目を挿入
alert(colors); blue
alert(removed); //空の配列を返します
removed = Colors.splice(1,1,'red','brown') //2 つの項目を挿入し、1 つの項目を削除します
alert (色) ; //緑、赤、茶色、黒、青
アラート (削除されました) //黄色
日付型
JavaScript の日付型は、初期 Java の java.util.Date クラスに基づいて構築されています。これを行うために、Date タイプは、1970 年 1 月 1 日 0:00 UTC から経過したミリ秒数を使用して日付を保存します。このデータ ストレージ形式を使用する条件下では、Date 型で保存される日付は、1970 年 1 月 1 日の前後 285,616 年まで正確になります。
日付オブジェクトを作成するには、new 演算子と Date コンストラクターを使用します。
var now = new Date();
パラメーターを渡さずに Date コンストラクターを呼び出すと、新しく作成されたオブジェクトは現在の日付と時刻を自動的に取得します。特定の日付と時刻に基づいて日付オブジェクトを作成する場合は、その日付を表すミリ秒数を渡す必要があります。この計算プロセスを簡略化するために、JavaScript には Date.parse() と Date.UTC() という 2 つのメソッドが用意されています。
このうち、Date.parse() メソッドは日付を表す文字列パラメータを受け取り、この文字列に基づいて対応する日付のミリ秒を返そうとします。 JavaScript では、Date.parse() がサポートする形式を定義していないため、このメソッドの動作は実装ごとに異なり、多くの場合、ロケールごとに異なります。地域が米国に設定されているブラウザは、通常、次の日付形式を受け入れます:
● 「月/日/年」、例: 6/13/2204
● 「英語の月名」 「日、年」、例: January 12,2004
● 「英語の曜日、英語の月名、日、年、時:分:第 2 タイムゾーン」、例: 火曜日 5 月 25 日 2004 00:00:00 GMT-0700
たとえば、2004 年 5 月 25 日の日付オブジェクトを作成するには、次のコードを使用できます:
var someDate = new Date(Date.parse) ("May 25, 2004"));
Date.parse() メソッドに渡された文字列が日付を表すことができない場合は、NaN が返されます。実際、日付を表す文字列を Date コンストラクターに直接渡すと、Date.parse() もバックグラウンドで呼び出されます。つまり、次のコードは前の例と同等です:
var someDate = new Date('May 25, 2004');
Date.UTC() メソッドは、次のように表される日付も返します。ミリ秒ですが、値を構築するときに Date.parse() とは異なる情報を使用します。 Date.UTC() のパラメータは、年と 0 から始まる月です (1 月は 0、2 月は 1 など)。日 (1 ～ 31)、時 (0 ～ 23)、分、秒、およびミリ秒。これらのパラメーターのうち、最初の 2 つ (年と月) のみが必要です。月の日数が指定されていない場合、その日数は 1 であるとみなされ、他のパラメータが省略されている場合は 0 であるとみなされます。
// GMT 時間 0:00 2000 年 1 月 1 日
var y2k = new Date(Date.UTC(2000, 0))
//GMT 時間、2005 年 5 月 5 日午後 5 時 55 分 55 秒
var allFives = new Date (Date.UTC (2005,4,5,17,55,55));
Date.parse() を模倣するのと同じように、Date コンストラクターも Date.UTC() を模倣しますが、明らかな違いが 1 つあります。日付と時刻は両方とも GMT ではなくローカル タイムゾーンに基づいています。前の例は次のように書き換えることができます。
// 現地時間 2000 年 1 月 1 日 0:00
var y2k = new Date(2000,0);
// 現地時間2005 年 5 月 5 日、午後 5 時 55 分 55 秒
var allFives = new Date(2005,4,5,17,55,55)
;
Date 型には、日付を文字列にフォーマットするための特別なメソッドもいくつかあります。これらのメソッドは次のとおりです。
● toDateString() - 曜日、月、日を実装固有の形式で表示します。と年
● toTimeString() - 実装固有の形式で時、分、秒、およびタイムゾーンを表示します
● toLocaleDateString() - 曜日、地域固有の形式で表示します月、日と年
● toLocaleTimeString() - 実装固有の形式で時、分、秒を表示します
● toUTCString() - 実装固有の形式で完全な UTC 日付
上記の文字列フォーマット方法の出力もブラウザごとに異なるため、ユーザー インターフェイスに一貫した日付情報を表示するために 1 つの方法を使用することはできません。
以下は日付型のすべてのメソッドです:
関数の型
JavaScript で最も興味深いのは関数だと思います。そしてその面白さの源は、関数が実際にはオブジェクトであるということです。各関数は Function 型のインスタンスであり、他の参照型と同じプロパティとメソッドを持ちます。関数はオブジェクトであるため、関数名は実際には関数オブジェクトへのポインタであり、関数にバインドされません。
関数は通常、次の例に示すように、関数宣言構文を使用して定義されます。
function sum(num1,num2)
{
return num1 num2;
これは、以下の関数式定義 メソッドはほぼ同じです:
関数を定義する最後の方法は、Function コンストラクターを使用することです。 Function コンストラクターは任意の数のパラメーターを受け取ることができますが、最後のパラメーターは常に関数本体とみなされ、前のパラメーターは新しい関数のパラメーターを列挙します。
var sum = Function('num1','num2','return num1 num2'); //このメソッドは推奨されません
関数名は関数への単なるポインタであるため、関数name オブジェクトへのポインターを含む他の変数と何ら変わりません。つまり、関数には複数の名前を付けることができます。例:
コードをコピー
コードをコピー
コードをコピーします
alert(colors); //green,blue
alert(removed); //red
removed = Colors.splice(1,0,' yellow','black') //位置 1 から 2 つの項目を挿入
alert(colors); blue
alert(removed); //空の配列を返します
removed = Colors.splice(1,1,'red','brown') //2 つの項目を挿入し、1 つの項目を削除します
alert (色) ; //緑、赤、茶色、黒、青
アラート (削除されました) //黄色
日付型
JavaScript の日付型は、初期 Java の java.util.Date クラスに基づいて構築されています。これを行うために、Date タイプは、1970 年 1 月 1 日 0:00 UTC から経過したミリ秒数を使用して日付を保存します。このデータ ストレージ形式を使用する条件下では、Date 型で保存される日付は、1970 年 1 月 1 日の前後 285,616 年まで正確になります。
日付オブジェクトを作成するには、new 演算子と Date コンストラクターを使用します。
var now = new Date();
パラメーターを渡さずに Date コンストラクターを呼び出すと、新しく作成されたオブジェクトは現在の日付と時刻を自動的に取得します。特定の日付と時刻に基づいて日付オブジェクトを作成する場合は、その日付を表すミリ秒数を渡す必要があります。この計算プロセスを簡略化するために、JavaScript には Date.parse() と Date.UTC() という 2 つのメソッドが用意されています。
このうち、Date.parse() メソッドは日付を表す文字列パラメータを受け取り、この文字列に基づいて対応する日付のミリ秒を返そうとします。 JavaScript では、Date.parse() がサポートする形式を定義していないため、このメソッドの動作は実装ごとに異なり、多くの場合、ロケールごとに異なります。地域が米国に設定されているブラウザは、通常、次の日付形式を受け入れます:
● 「月/日/年」、例: 6/13/2204
● 「英語の月名」 「日、年」、例: January 12,2004
● 「英語の曜日、英語の月名、日、年、時:分:第 2 タイムゾーン」、例: 火曜日 5 月 25 日 2004 00:00:00 GMT-0700
たとえば、2004 年 5 月 25 日の日付オブジェクトを作成するには、次のコードを使用できます:
var someDate = new Date(Date.parse) ("May 25, 2004"));
Date.parse() メソッドに渡された文字列が日付を表すことができない場合は、NaN が返されます。実際、日付を表す文字列を Date コンストラクターに直接渡すと、Date.parse() もバックグラウンドで呼び出されます。つまり、次のコードは前の例と同等です:
var someDate = new Date('May 25, 2004');
Date.UTC() メソッドは、次のように表される日付も返します。ミリ秒ですが、値を構築するときに Date.parse() とは異なる情報を使用します。 Date.UTC() のパラメータは、年と 0 から始まる月です (1 月は 0、2 月は 1 など)。日 (1 ～ 31)、時 (0 ～ 23)、分、秒、およびミリ秒。これらのパラメーターのうち、最初の 2 つ (年と月) のみが必要です。月の日数が指定されていない場合、その日数は 1 であるとみなされ、他のパラメータが省略されている場合は 0 であるとみなされます。
コードをコピー コードは次のとおりです:
// GMT 時間 0:00 2000 年 1 月 1 日
var y2k = new Date(Date.UTC(2000, 0))
//GMT 時間、2005 年 5 月 5 日午後 5 時 55 分 55 秒
var allFives = new Date (Date.UTC (2005,4,5,17,55,55));
Date.parse() を模倣するのと同じように、Date コンストラクターも Date.UTC() を模倣しますが、明らかな違いが 1 つあります。日付と時刻は両方とも GMT ではなくローカル タイムゾーンに基づいています。前の例は次のように書き換えることができます。
// 現地時間 2000 年 1 月 1 日 0:00
var y2k = new Date(2000,0);
// 現地時間2005 年 5 月 5 日、午後 5 時 55 分 55 秒
var allFives = new Date(2005,4,5,17,55,55)
Date 型には、日付を文字列にフォーマットするための特別なメソッドもいくつかあります。これらのメソッドは次のとおりです。
● toDateString() - 曜日、月、日を実装固有の形式で表示します。と年
● toTimeString() - 実装固有の形式で時、分、秒、およびタイムゾーンを表示します
● toLocaleDateString() - 曜日、地域固有の形式で表示します月、日と年
● toLocaleTimeString() - 実装固有の形式で時、分、秒を表示します
● toUTCString() - 実装固有の形式で完全な UTC 日付
上記の文字列フォーマット方法の出力もブラウザごとに異なるため、ユーザー インターフェイスに一貫した日付情報を表示するために 1 つの方法を使用することはできません。
以下は日付型のすべてのメソッドです:
| メソッド | 説明 |
|---|---|
| 日付() | 現在の日付と時刻を返します。 |
| getDate() | Date オブジェクトから日付 (1 ～ 31) を返します。 |
| getDay() | Date オブジェクトから曜日 (0 ～ 6) を返します。 |
| getMonth() | Date オブジェクトから月 (0 ～ 11) を返します。 |
| getFull Year() | Date オブジェクトから年を 4 桁の数値として返します。 |
| get Year() | 代わりに getFull Year() メソッドを使用してください。 |
| getHours() | Date オブジェクトの時間 (0 ～ 23) を返します。 |
| getMinutes() | Date オブジェクトの分 (0 ～ 59) を返します。 |
| getSeconds() | Date オブジェクトの秒数 (0 ～ 59) を返します。 |
| getミリ秒() | Date オブジェクトのミリ秒 (0 ～ 999) を返します。 |
| getTime() | 1970 年 1 月 1 日からのミリ秒数を返します。 |
| getTimezoneOffset() | 現地時間とグリニッジ標準時 (GMT) の差を分単位で返します。 |
| getUTCDate() | 世界時に基づいて Date オブジェクトから月の日 (1 ～ 31) を返します。 |
| getUTCDay() | 世界時に基づいて Date オブジェクトから曜日 (0 ～ 6) を返します。 |
| getUTCMonth() | 世界時に従って Date オブジェクトから月 (0 ～ 11) を返します。 |
| getUTCFul Year() | 世界時に基づいて Date オブジェクトから 4 桁の年を返します。 |
| getUTCHours() | 世界時 (0 ～ 23) に従って Date オブジェクトの時間を返します。 |
| getUTCMinutes() | 世界時 (0 ～ 59) に従って Date オブジェクトの分を返します。 |
| getUTCSeconds() | 世界時に従って Date オブジェクトの秒 (0 ～ 59) を返します。 |
| getUTCミリ秒() | 世界時に従って Date オブジェクトのミリ秒 (0 ～ 999) を返します。 |
| parse() | 1970 年 1 月 1 日の午前 0 時から指定された日付 (文字列) までのミリ秒数を返します。 |
| setDate() | Dateオブジェクトに日付(1～31)を設定します。 |
| setMonth() | Dateオブジェクトに月(0～11)を設定します。 |
| setFullyear() | Dateオブジェクトに年(4桁)を設定します。 |
| set Year() | 代わりに setFull Year() メソッドを使用してください。 |
| setHours() | Date オブジェクトに時間 (0 ～ 23) を設定します。 |
| setMinutes() | Dateオブジェクトに分(0～59)を設定します。 |
| setSeconds() | Date オブジェクトに秒を設定します (0 ～ 59)。 |
| setミリ秒() | Date オブジェクトにミリ秒 (0 ～ 999) を設定します。 |
| setTime() | Date オブジェクトをミリ秒単位で設定します。 |
| setUTCDate() | Date オブジェクトに世界時に従って日付 (1 ～ 31) を設定します。 |
| setUTCMonth() | 根据世界时设置 Date 对象中的月份 (0 ~ 11)。 |
| setUTCFullYear() | 根据世界时设置 Date 对象中的年份（四位数字）。 |
| setUTCHours() | 根据世界时设置 Date 对象中的小时 (0 ~ 23)。 |
| setUTCMinutes() | 根据世界时设置 Date 对象中的分钟 (0 ~ 59)。 |
| setUTCSeconds() | 根据世界时设置 Date 对象中的秒钟 (0 ~ 59)。 |
| setUTCMilliseconds() | 根据世界时设置 Date 对象中的毫秒 (0 ~ 999)。 |
| toSource() | 返回该对象的源代码。 |
| toString() | 把 Date 对象转换为字符串。 |
| toTimeString() | 把 Date 对象的时间部分转换为字符串。 |
| toDateString() | 把 Date 对象的日期部分转换为字符串。 |
| toGMTString() | 请使用 toUTCString() 方法代替。 |
| toUTCString() | 根据世界时，把 Date 对象转换为字符串。 |
| toLocaleString() | 根据本地时间格式，把 Date 对象转换为字符串。 |
| toLocaleTimeString() | 根据本地时间格式，把 Date 对象的时间部分转换为字符串。 |
| toLocaleDateString() | 根据本地时间格式，把 Date 对象的日期部分转换为字符串。 |
| UTC() | 根据世界时返回 1970 年 1 月 1 日 到指定日期的毫秒数。 |
| valueOf() | 返回 Date 对象的原始值。 |
関数の型
JavaScript で最も興味深いのは関数だと思います。そしてその面白さの源は、関数が実際にはオブジェクトであるということです。各関数は Function 型のインスタンスであり、他の参照型と同じプロパティとメソッドを持ちます。関数はオブジェクトであるため、関数名は実際には関数オブジェクトへのポインタであり、関数にバインドされません。
関数は通常、次の例に示すように、関数宣言構文を使用して定義されます。
コードのコピー コード
function sum(num1,num2)
{
return num1 num2;
コードをコピー コードは次のとおりです:
var sun = function(num1 ,num2){
return num1 num2;
};
上記のコードは変数 sum を定義し、関数として初期化します。 function キーワードの後に関数名がありません。これは、関数式を使用して関数を定義する場合、関数名を使用する必要がなく、変数 sum を通じて関数を参照できるためです。また、他の変数を宣言する場合と同様に、関数の末尾にはセミコロンがあることに注意してください。 return num1 num2;
};
関数を定義する最後の方法は、Function コンストラクターを使用することです。 Function コンストラクターは任意の数のパラメーターを受け取ることができますが、最後のパラメーターは常に関数本体とみなされ、前のパラメーターは新しい関数のパラメーターを列挙します。
var sum = Function('num1','num2','return num1 num2'); //このメソッドは推奨されません
関数名は関数への単なるポインタであるため、関数name オブジェクトへのポインターを含む他の変数と何ら変わりません。つまり、関数には複数の名前を付けることができます。例:
コードをコピーします コードは次のとおりです。
関数 sum(num1,num2)
{
return num1 num2;
alert(sum(10,10)); var anotherSum = sum; //20
sum = null; //20
注: 括弧なしで関数名を使用すると、関数を呼び出すのではなく、関数ポインターにアクセスします。
関数宣言と関数式
これまで、関数宣言と関数式を区別していませんでした。実際、パーサーはデータを実行環境にロードするときに、関数宣言と関数式を同等に扱いません。パーサーは、コードを実行する前に、まず関数宣言を読み取り、使用可能 (アクセス可能) にします。関数式については、パーサーがそれが配置されているコード行に到達するまで、実際には解釈され実行されません。
{
return num1 num2;
alert(sum(10,10)); var anotherSum = sum; //20
sum = null; //20
注: 括弧なしで関数名を使用すると、関数を呼び出すのではなく、関数ポインターにアクセスします。
関数宣言と関数式
これまで、関数宣言と関数式を区別していませんでした。実際、パーサーはデータを実行環境にロードするときに、関数宣言と関数式を同等に扱いません。パーサーは、コードを実行する前に、まず関数宣言を読み取り、使用可能 (アクセス可能) にします。関数式については、パーサーがそれが配置されているコード行に到達するまで、実際には解釈され実行されません。
コードをコピー
コードは次のとおりです。 alert(sum(10,10)) ; function sum(num1,num2) {
return num1 num2; }
上記のコードは正常に実行できます。コードの実行が開始される前に、パーサーはすでに関数宣言を読み取り、それを実行環境に追加しているためです。上記の関数宣言を以下の例のように変数の初期化に変更すると、実行時にエラーが発生します。
上記のコードは正常に実行できます。コードの実行が開始される前に、パーサーはすでに関数宣言を読み取り、それを実行環境に追加しているためです。上記の関数宣言を以下の例のように変数の初期化に変更すると、実行時にエラーが発生します。
コードをコピー
コードは次のとおりです。 alert(sum(10,10)) ; var sum = function(num1,num2) {
return num1 num2; }
JavaScript 自体の関数名なのでは変数であるため、関数を値として使用することもできます。つまり、パラメーターのように関数を別の関数に渡すだけでなく、別の関数の結果として関数を返すこともできます。
JavaScript 自体の関数名なのでは変数であるため、関数を値として使用することもできます。つまり、パラメーターのように関数を別の関数に渡すだけでなく、別の関数の結果として関数を返すこともできます。
コードをコピーします
コードは次のとおりです。 function callSomeFunction(someFunction, someArgument) { return someFunction(someArgument) }
;
この関数は 2 つのパラメーターを受け入れます。最初のパラメーターは関数である必要があり、2 番目のパラメーターは関数に渡される値である必要があります。次に、次の例のように関数を渡すことができます:
function add(num)
{
return num 10;
var result = callSomeFunction(add,10); // 20
もちろん、別の関数から関数を返すことも可能で、これも非常に便利なテクニックです。
コードをコピー
コードをコピーします
この関数は 2 つのパラメーターを受け入れます。最初のパラメーターは関数である必要があり、2 番目のパラメーターは関数に渡される値である必要があります。次に、次の例のように関数を渡すことができます:
コードをコピーします コードは次のとおりです:
function add(num)
{
return num 10;
var result = callSomeFunction(add,10); // 20
もちろん、別の関数から関数を返すことも可能で、これも非常に便利なテクニックです。
コードをコピー コードは次のとおりです。
function createSumFunction() {
return function(num1,num2){
return num1 num2>}
var sumFunction = createSumFunction(); ); / /20
関数の内部属性
関数内には、引数と this という 2 つの特別なオブジェクトがあります。このうち、arguments は関数に渡されるすべてのパラメータを含む配列のようなオブジェクトで、length 属性を使用して渡されるパラメータの数を決定できます。
return function(num1,num2){
return num1 num2>}
var sumFunction = createSumFunction(); ); / /20
関数の内部属性
関数内には、引数と this という 2 つの特別なオブジェクトがあります。このうち、arguments は関数に渡されるすべてのパラメータを含む配列のようなオブジェクトで、length 属性を使用して渡されるパラメータの数を決定できます。
コードをコピー
コードは次のとおりです。 function SayHi() { alert(arguments.length); //2
alert(arguments[0] ',' argument[1]) //hello,world }
sayHi('hello' ,'world ');
引数の主な目的は関数パラメータを保存することですが、このオブジェクトには、この引数オブジェクトを所有する関数へのポインタである callee と呼ばれる属性もあります。以下の非常に古典的な階乗関数を見てください:
sayHi('hello' ,'world ');
引数の主な目的は関数パラメータを保存することですが、このオブジェクトには、この引数オブジェクトを所有する関数へのポインタである callee と呼ばれる属性もあります。以下の非常に古典的な階乗関数を見てください:
コードをコピーします
コードは次のとおりです: 関数階乗 (数値) { if(数値 戻り 1;
コードをコピー
コードをコピーします
関数内のもう 1 つの特別なオブジェクトは、これです。これは、操作を実行するための関数データを指します。または、関数が実行されるスコープであるとも言えます ( Web ページのグローバル スコープ (スコープ内で関数が呼び出される場合、このオブジェクトはウィンドウを参照します)。以下の例を見てください:
コードをコピーします
コードは次のとおりです:
} else {
戻り 数値 *階乗 (数値-1);
}
}
関数に名前があり、関数内でその名前が変更されない場合、階乗関数を定義するには、通常、上記のコードのように再帰アルゴリズムを使用する必要があります。将来的にはこの定義で問題ありません。しかし、問題は、この関数の実行が関数名階乗と密接に関係していることです。この密結合現象を排除するには、次のように argument.callee を使用できます。
戻り 数値 *階乗 (数値-1);
}
}
関数に名前があり、関数内でその名前が変更されない場合、階乗関数を定義するには、通常、上記のコードのように再帰アルゴリズムを使用する必要があります。将来的にはこの定義で問題ありません。しかし、問題は、この関数の実行が関数名階乗と密接に関係していることです。この密結合現象を排除するには、次のように argument.callee を使用できます。
コードをコピー
コードは次のとおりです。 🎜> 関数階乗(num) { if(num return 1;
} else { return num * argument .callee (num-1);
}
}
この書き換えられたfactorial()関数の関数本体では、関数名factorialが引用符で囲まれなくなりました。このようにして、関数を参照するときにどのような名前が使用されても、再帰呼び出しは正常に完了することが保証されます。例:
}
}
この書き換えられたfactorial()関数の関数本体では、関数名factorialが引用符で囲まれなくなりました。このようにして、関数を参照するときにどのような名前が使用されても、再帰呼び出しは正常に完了することが保証されます。例:
コードをコピーします
コードは次のとおりです: var trueFactory =階乗; factorial = function(){ return 0; alert(trueFactory(5)); //0
関数内のもう 1 つの特別なオブジェクトは、これです。これは、操作を実行するための関数データを指します。または、関数が実行されるスコープであるとも言えます ( Web ページのグローバル スコープ (スコープ内で関数が呼び出される場合、このオブジェクトはウィンドウを参照します)。以下の例を見てください:
コードをコピーします
コードは次のとおりです:
window.color = 'red'; var o = {color:'blue'}; 関数 SayColor() { alert(this.color); }
sayColor(); //赤
o.sayColor = SayColor; //青
上記の関数sayColor()はグローバルスコープで定義されており、このオブジェクトを参照しています。 this の値は関数が呼び出される前に決定されないため、コードの実行中に異なるオブジェクトを参照する可能性があります。 SayColor() がグローバル スコープで呼び出される場合、これはグローバル オブジェクト ウィンドウを参照します。つまり、this.color の評価は window.color の評価に変換されるため、結果は「red」になります。この関数がオブジェクト o に割り当てられ、o.sayColor() が呼び出される場合、これはオブジェクト o を参照するため、this.color の評価は o.color の評価に変換され、結果は「blue」になります。
関数のプロパティとメソッド
JavaScript の関数はオブジェクトであるため、関数にもプロパティとメソッドがあります。各関数には、長さとプロトタイプという 2 つのプロパティが含まれています。このうち、length 属性は、関数が受け取りを希望する名前付きパラメータの数を示します。
function SayName(name)
{
alert(名前);
}
関数 SayHi()
{
alert('hi');
}
alert(sayName. length); //1
alert(sayHi.length); //0
JavaScript で最も興味深いのは、prototype 属性です。参照型の場合、プロトタイプはすべてのインスタンス メソッドが格納される実際の場所です。 toString() や valueOf() などのメソッドは、実際にはプロトタイプ名で保存されますが、それぞれのオブジェクトのインスタンスを通じてアクセスされます。カスタム参照型を作成し、継承を実装する場合、プロトタイプ属性の役割は非常に重要です (プロトタイプ属性については、ここでは詳しく紹介しません)。
各関数には、apply() と call() という 2 つの非継承メソッドが含まれています。これら 2 つのメソッドの目的は、特定のスコープで関数を呼び出すことです。これは、実際には関数本体でこのオブジェクトの値を設定することと同じです。まず、apply() メソッドは 2 つのパラメーターを受け入れます。1 つは関数が実行されるスコープで、もう 1 つはパラメーター配列です。このうち、2 番目のパラメーターは Array のインスタンスまたは引数オブジェクトにすることができます。例:
function sum( num1,num2)
{
return num1 num2;
function callSum1(num1,num2)
{
return sum.apply(this,arguments);
function callSum2(num1,num2)
{
return sum.apply(this,[num1,num2]);
}
alert(callSum1(10,10)); 20
alert(callSum2(10,10)); //20
上記の例では、callSum1() は sum() 関数の実行時にこれをスコープとして渡します (これは機能するため)グローバル ドメイン内で呼び出されるため、ウィンドウ オブジェクトと引数オブジェクトが渡されます。また、callSum2 も sum() 関数を呼び出しますが、これとパラメータ配列を渡します。
call() メソッドは apply() メソッドと同じ機能を持ちます。唯一の違いはパラメータの受け取り方法です。 call() メソッドの場合、最初のパラメーターのスコープは変わりません。変更されるのは、残りのパラメーターが関数に直接渡されることです。
o.sayColor = SayColor; //青
上記の関数sayColor()はグローバルスコープで定義されており、このオブジェクトを参照しています。 this の値は関数が呼び出される前に決定されないため、コードの実行中に異なるオブジェクトを参照する可能性があります。 SayColor() がグローバル スコープで呼び出される場合、これはグローバル オブジェクト ウィンドウを参照します。つまり、this.color の評価は window.color の評価に変換されるため、結果は「red」になります。この関数がオブジェクト o に割り当てられ、o.sayColor() が呼び出される場合、これはオブジェクト o を参照するため、this.color の評価は o.color の評価に変換され、結果は「blue」になります。
関数のプロパティとメソッド
JavaScript の関数はオブジェクトであるため、関数にもプロパティとメソッドがあります。各関数には、長さとプロトタイプという 2 つのプロパティが含まれています。このうち、length 属性は、関数が受け取りを希望する名前付きパラメータの数を示します。
コードをコピー コードは次のとおりです。
function SayName(name)
{
alert(名前);
}
関数 SayHi()
{
alert('hi');
}
alert(sayName. length); //1
alert(sayHi.length); //0
JavaScript で最も興味深いのは、prototype 属性です。参照型の場合、プロトタイプはすべてのインスタンス メソッドが格納される実際の場所です。 toString() や valueOf() などのメソッドは、実際にはプロトタイプ名で保存されますが、それぞれのオブジェクトのインスタンスを通じてアクセスされます。カスタム参照型を作成し、継承を実装する場合、プロトタイプ属性の役割は非常に重要です (プロトタイプ属性については、ここでは詳しく紹介しません)。
各関数には、apply() と call() という 2 つの非継承メソッドが含まれています。これら 2 つのメソッドの目的は、特定のスコープで関数を呼び出すことです。これは、実際には関数本体でこのオブジェクトの値を設定することと同じです。まず、apply() メソッドは 2 つのパラメーターを受け入れます。1 つは関数が実行されるスコープで、もう 1 つはパラメーター配列です。このうち、2 番目のパラメーターは Array のインスタンスまたは引数オブジェクトにすることができます。例:
コードをコピー コードは次のとおりです。
function sum( num1,num2)
{
return num1 num2;
function callSum1(num1,num2)
{
return sum.apply(this,arguments);
function callSum2(num1,num2)
{
return sum.apply(this,[num1,num2]);
}
alert(callSum1(10,10)); 20
alert(callSum2(10,10)); //20
上記の例では、callSum1() は sum() 関数の実行時にこれをスコープとして渡します (これは機能するため)グローバル ドメイン内で呼び出されるため、ウィンドウ オブジェクトと引数オブジェクトが渡されます。また、callSum2 も sum() 関数を呼び出しますが、これとパラメータ配列を渡します。
call() メソッドは apply() メソッドと同じ機能を持ちます。唯一の違いはパラメータの受け取り方法です。 call() メソッドの場合、最初のパラメーターのスコープは変わりません。変更されるのは、残りのパラメーターが関数に直接渡されることです。
コードをコピー コードは次のとおりです。
function callSum2(num1,num2) {
return sum.call(this,num1,num2);
}
alert(callSum2(10,10)); //20
パラメーターは適用されません ここで、() と call() が真の威力を発揮します。これらの真の力は、関数が動作する範囲を拡張する機能にあります。以下の例を見てください:
return sum.call(this,num1,num2);
}
alert(callSum2(10,10)); //20
パラメーターは適用されません ここで、() と call() が真の威力を発揮します。これらの真の力は、関数が動作する範囲を拡張する機能にあります。以下の例を見てください:
コードをコピーします コードは次のとおりです:
window.color = 'red'; var o = {color:'blue'};
関数 SayColor()
{
alert(this.color); }
sayColor(); //赤
sayColor.call(this); //赤
sayColor.call(o); //青
上記の例では、sayColor.call(o) を実行すると、関数本体の this オブジェクトが o を指しているため、関数の実行環境が異なり、結果は「青」と表示されます。
注: 各関数には非標準の caller 属性があり、現在の関数を呼び出した関数を指します。一般に、関数内では、呼び出しスタックのトレースは、arguments.callee.caller を通じて実装されます。現在、IE、FireFox、および Chrome はすべてこの属性をサポートしていますが、この属性はデバッグ目的で使用することをお勧めします。
組み込みオブジェクト
JavaScript には、Global と Math という 2 つの組み込みオブジェクトがあります。
Global オブジェクト
Global (グローバル) オブジェクトは、どの角度から見ても存在しないため、JavaScript で最も特殊なオブジェクトと言えます。 JavaScript の Global オブジェクトは、ある意味で究極の「キャッチオール オブジェクト」として定義されます。言い換えれば、他のオブジェクトに属さないプロパティとメソッドは、最終的にはそのオブジェクトのプロパティとメソッドになります。実際、グローバル変数やグローバル関数は存在せず、グローバル スコープで定義されたすべてのプロパティと関数は Global オブジェクトのプロパティです。 isNaN()、parseInt()、parseFloat() などは、実際にはすべて Global オブジェクトのメソッドであり、Global オブジェクトには他のメソッドも含まれています。
URI エンコード メソッド
Global オブジェクトの encodeURI() メソッドと encodeURIComponent() メソッドは、ブラウザに送信できるように URI をエンコードできます。スペースなどの特定の文字は、有効な URI に含めることはできません。これら 2 つの URI エンコード方法では、ブラウザが受け入れて理解できるように、すべての無効な文字を特別な UTF-8 エンコードに置き換えます。
このうち、encodeURI() は主に URI 全体 (例: http://www.test.com/test value.html) に使用され、encodeURIComponent() は主に特定のセグメントに使用されます。 URI (例: http://www.test.com/test value.html) 前の URI の test value.html) がエンコードされます。これらの主な違いは、encodeURI() は、コロン、スラッシュ、こんにちは、ポンド記号などの URI の一部である特殊文字をエンコードしないのに対し、encodeURIComponent() は、見つかった非標準文字をエンコードすることです。
var uri = "http: //www .test.com/test value.html#start";
//"http://www.test.com/test value.html#start"
alert(encodeURI(uri));
//"http://www.test.com/test value.html#start"
alert(encodeURIComponent(uri));
一般来说，使用encodeURIComponent()方法的时候要比使用encodeURI()更多，因为在实践中更常见的是对查询字符串参数而不是对基础URI进行编码。
与encodeURI()和encodeURIComponent()方法对应的两个方法分别是decodeURI()和decodeURIComponent()。其中，decodeURI()只能对encodeURI()替换的字符进行解码，同样，decodeURIComponent()只能对encodeURIComponent()替换的字符进行解码。
eval()方法
eval()方法大概是JavaScript中最强大的一个方法了，eval()方法就像是一个完整的JavaScript解析器，它只接受一个参数，即要执行的字符串。看下面的例子：
eval("alert('hi')");
这行代码的作用等价于下面这行代码：
alert('hi');
当解析器发现代码中调用eval()方法时，它会将传入的参数当做实际的JavaScript语句来解析，然后把执行结果插入到原位置。通过eval()执行的代码被认为是包含该次调用的执行环境的一部分，因此被执行的代码具有与该执行环境相同的作用域链。这意味着通过eval()执行的代码可以引用在包含环境中定义的变量，例如：
var msg = 'hello world';
eval('alert(msg)'); //hello world
可见，变量msg是在eval()调用的环境之外定义的，但其中调用的alert()仍然能够显示“hello world”。这是因为上面第二行代码最终被替换成了一行真正的代码。同样地，我们也可以在eval()调用中定义一个函数，然后再在该调用的外部代码中引用这个函数：
eval("function sayHi(){alert('hi')}");
sayHi();
注意：能够解释代码字符串的能力非常强大，但也非常危险。因此在使用eval()时必须极为谨慎，特别是在用它执行用户输入数据的情况下。否则，可能会有恶意用户输入威胁你的站点或应用程序安全的代码（即所谓的代码注入）。
Math对象
与我们在JavaScript直接编写的计算功能相比，Math对象提供的计算功能执行起来要快得多。Math对象还提供了辅助完成这些计算的属性。
Math オブジェクトには次のメソッドが含まれています:
関数 SayColor()
{
alert(this.color); }
sayColor(); //赤
sayColor.call(this); //赤
sayColor.call(o); //青
上記の例では、sayColor.call(o) を実行すると、関数本体の this オブジェクトが o を指しているため、関数の実行環境が異なり、結果は「青」と表示されます。
注: 各関数には非標準の caller 属性があり、現在の関数を呼び出した関数を指します。一般に、関数内では、呼び出しスタックのトレースは、arguments.callee.caller を通じて実装されます。現在、IE、FireFox、および Chrome はすべてこの属性をサポートしていますが、この属性はデバッグ目的で使用することをお勧めします。
組み込みオブジェクト
JavaScript には、Global と Math という 2 つの組み込みオブジェクトがあります。
Global オブジェクト
Global (グローバル) オブジェクトは、どの角度から見ても存在しないため、JavaScript で最も特殊なオブジェクトと言えます。 JavaScript の Global オブジェクトは、ある意味で究極の「キャッチオール オブジェクト」として定義されます。言い換えれば、他のオブジェクトに属さないプロパティとメソッドは、最終的にはそのオブジェクトのプロパティとメソッドになります。実際、グローバル変数やグローバル関数は存在せず、グローバル スコープで定義されたすべてのプロパティと関数は Global オブジェクトのプロパティです。 isNaN()、parseInt()、parseFloat() などは、実際にはすべて Global オブジェクトのメソッドであり、Global オブジェクトには他のメソッドも含まれています。
URI エンコード メソッド
Global オブジェクトの encodeURI() メソッドと encodeURIComponent() メソッドは、ブラウザに送信できるように URI をエンコードできます。スペースなどの特定の文字は、有効な URI に含めることはできません。これら 2 つの URI エンコード方法では、ブラウザが受け入れて理解できるように、すべての無効な文字を特別な UTF-8 エンコードに置き換えます。
このうち、encodeURI() は主に URI 全体 (例: http://www.test.com/test value.html) に使用され、encodeURIComponent() は主に特定のセグメントに使用されます。 URI (例: http://www.test.com/test value.html) 前の URI の test value.html) がエンコードされます。これらの主な違いは、encodeURI() は、コロン、スラッシュ、こんにちは、ポンド記号などの URI の一部である特殊文字をエンコードしないのに対し、encodeURIComponent() は、見つかった非標準文字をエンコードすることです。
コードをコピー コードは次のとおりです:
var uri = "http: //www .test.com/test value.html#start";
//"http://www.test.com/test value.html#start"
alert(encodeURI(uri));
//"http://www.test.com/test value.html#start"
alert(encodeURIComponent(uri));
一般来说，使用encodeURIComponent()方法的时候要比使用encodeURI()更多，因为在实践中更常见的是对查询字符串参数而不是对基础URI进行编码。
与encodeURI()和encodeURIComponent()方法对应的两个方法分别是decodeURI()和decodeURIComponent()。其中，decodeURI()只能对encodeURI()替换的字符进行解码，同样，decodeURIComponent()只能对encodeURIComponent()替换的字符进行解码。
eval()方法
eval()方法大概是JavaScript中最强大的一个方法了，eval()方法就像是一个完整的JavaScript解析器，它只接受一个参数，即要执行的字符串。看下面的例子：
eval("alert('hi')");
这行代码的作用等价于下面这行代码：
alert('hi');
当解析器发现代码中调用eval()方法时，它会将传入的参数当做实际的JavaScript语句来解析，然后把执行结果插入到原位置。通过eval()执行的代码被认为是包含该次调用的执行环境的一部分，因此被执行的代码具有与该执行环境相同的作用域链。这意味着通过eval()执行的代码可以引用在包含环境中定义的变量，例如：
var msg = 'hello world';
eval('alert(msg)'); //hello world
可见，变量msg是在eval()调用的环境之外定义的，但其中调用的alert()仍然能够显示“hello world”。这是因为上面第二行代码最终被替换成了一行真正的代码。同样地，我们也可以在eval()调用中定义一个函数，然后再在该调用的外部代码中引用这个函数：
eval("function sayHi(){alert('hi')}");
sayHi();
注意：能够解释代码字符串的能力非常强大，但也非常危险。因此在使用eval()时必须极为谨慎，特别是在用它执行用户输入数据的情况下。否则，可能会有恶意用户输入威胁你的站点或应用程序安全的代码（即所谓的代码注入）。
Math对象
与我们在JavaScript直接编写的计算功能相比，Math对象提供的计算功能执行起来要快得多。Math对象还提供了辅助完成这些计算的属性。
| 属性 | 描述 |
|---|---|
| E | 返回算术常量 e，即自然对数的底数（约等于2.718）。 |
| LN2 | 返回 2 的自然对数（约等于0.693）。 |
| LN10 | 返回 10 的自然对数（约等于2.302）。 |
| LOG2E | 返回以 2 为底的 e 的对数（约等于 1.414）。 |
| LOG10E | 返回以 10 为底的 e 的对数（约等于0.434）。 |
| PI | 返回圆周率（约等于3.14159）。 |
| SQRT1_2 | 返回返回 2 的平方根的倒数（约等于 0.707）。 |
| SQRT2 | 返回 2 的平方根（约等于 1.414）。 |
Math オブジェクトには次のメソッドが含まれています:
| 方法 | 描述 |
|---|---|
| abs(x) | 返回数的绝对值。 |
| acos(x) | 返回数的反余弦值。 |
| asin(x) | 返回数的反正弦值。 |
| atan(x) | 以介于 -PI/2 与 PI/2 弧度之间的数值来返回 x 的反正切值。 |
| atan2(y,x) | 返回从 x 轴到点 (x,y) 的角度（介于 -PI/2 与 PI/2 弧度之间）。 |
| ceil(x) | 对数进行上舍入。 |
| cos(x) | 返回数的余弦。 |
| exp(x) | 返回 e 的指数。 |
| floor(x) | 对数进行下舍入。 |
| log(x) | 返回数的自然对数（底为e）。 |
| max(x,y) | 返回 x 和 y 中的最高值。 |
| min(x,y) | 返回 x 和 y 中的最低值。 |
| pow(x,y) | 返回 x 的 y 次幂。 |
| random() | 返回 0 ~ 1 之间的随机数。 |
| round(x) | 把数四舍五入为最接近的整数。 |
| sin(x) | 返回数的正弦。 |
| sqrt(x) | 返回数的平方根。 |
| tan(x) | 返回角的正切。 |
| toSource() | 返回该对象的源代码。 |
| valueOf() | 返回 Math 对象的原始值。 |
声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。