JavaScriptステートメントの理解と使用

ステートメントは、JavaScriptでプログラムフローを制御するために使用されます。基本的にそれらを所有するオブジェクトに関連付けられているプロパティ、メソッド、およびイベントとは異なり、ステートメントはJavaScriptオブジェクトとは独立して機能するように設計されています。つまり、ドキュメントオブジェクト、ウィンドウオブジェクト、履歴オブジェクト、またはその他のオブジェクトを操作しているかどうかに関係なく、ステートメントを使用できます。言語として、JavaScriptは比較的少数のステートメントをサポートします-通り抜けるのにちょうど十分です。ただし、完全に機能するアプリケーションを構築するために必要な最小限のステートメントを提供します。

JavaScriptは現在、次の11のステートメントをサポートしています。コメント、var、newなど、これらの一部は善意のステートメントではありませんが、多くの場合、そのように扱われることに注意してください。完全を期すために、これらはこの説明に含まれています。

  • //コメント
  • ブレーク
  • 継続する
  • にとって
  • のために...で
  • 関数
  • if ... else
  • 新着
  • 戻る
  • var
  • 一方

Javaで提供されるステートメントのいくつかは、JavaScriptに特に欠けています。これには、switchステートメントだけでなく、すべての形式のエラートラップステートメント(catchやthrowなど)が含まれます。JavaScriptはこれらのステートメントを予約語として保持し、おそらく将来のバージョンで実装される予定です。

コメント(//)

//文字は、プログラムに説明コメントを含めることをJavaScriptに通知します。コメントは、最初に発生したハードリターンで終了します。JavaScriptは、コメントが終了する前にハードリターンがない限り、コメントの長さに制限を設けません。JavaScriptは、ハードリターン後のテキストが有効なコードであると想定します。

//これは簡単なコメントです

//これは複数行にまたがる別のコメントです。コメントは2行目に折り返されますが、テキスト編集プログラムでは1行目が「ソフトリターン」で終わります。ハードリターン文字は挿入されません。

//コメント文字は行のどこにでも配置できます。JavaScriptは、//の後のその行のすべてのテキストをコメントとして扱います。

MyVariable = "これはテストです" //テキスト変数MyVariableを割り当てます 

スクリプトの再生時にコメントが無視されるため、実行速度に大きな影響はありません。ただし、コメントが多いと、スクリプトのファイルサイズが大きくなり、ダイヤルアップインターネット接続を介してユーザーのコンピューターにダウンロードするのに時間がかかります。最良の結果を得るには、JavaScriptプログラムのコメントを短い1行に制限してください。

長いコメントを書くときは、代替のコメント文字/ *と* /を使用することをお勧めします。これらの文字の間のテキストはコメントとして扱われます。または、各行を//コメント文字で始めることもできます。

//このセクションでは、Enterキーが押されているかどうかを確認し、//続行します 

または

/ *このセクションでは、Enterキーが押されているかどうかを確認してから、続行します* / 

インデックスに戻る

ブレーク

breakステートメントは、JavaScriptに「制御された構造」を終了し、構造の後のポイントで実行を再開するように指示します。breakステートメントは、次のコマンドを使用して構築された構造体で使用されます。

  • にとって
  • のために...で
  • 一方

breakステートメントは、forループを途中で終了するために最も一般的に使用されます。例えば:

for(Count = 1; Count <= 10; Count ++){if(Count == 6)break; document.write( "

ループ: "+カウント+"

");}

この例は、1から10までカウントし、ループの各反復で数値を出力するforループを示しています。forループ内のifステートメントは、Count変数の値が6に等しいかどうかをテストするために使用されます。Countが6に等しい場合、breakステートメントが実行され、スクリプトはforループを終了します。この簡単な例で使用されているように、スクリプトは1から6までカウントされ、その後停止します。10までカウントする前に、forループを終了します。

インデックスに戻る

継続する

continueステートメントはJavaScriptに、for、for ... in、またはwhileループに続く可能性のあるすべての命令をスキップし、次の反復に進むように指示します。継続ステートメントの最も一般的な使用法は、ループ内の命令を条件付きでスキップすることですが、ループを終了することはありません(breakステートメントのように)。例えば:

for(Count = 1; Count <= 10; Count ++){if(Count == 6)continue; document.write( "

ループ: "+カウント+"

");}

上記の例は、1から10までカウントし、ループの各反復で数値を出力するforループを示しています。forループ内のifステートメントは、Count変数の値が6に等しいかどうかをテストするために使用されます。Countが6に等しい場合、continueステートメントが実行され、スクリプトは次の行のdocument.write命令をスキップします。しかし、ループは終了しません。代わりに、続行して残りの番号の行を出力します。この簡単な例で使用されているように、スクリプトは1から5までカウントし、6をスキップしてから、7から10を出力します。

インデックスに戻る

にとって

forステートメントは、命令のブロックを1回以上繰り返します。反復回数は、引数として指定された値によって制御されます。forステートメントの構文は次のとおりです。

for(InitVal; Test; Increment) 
  • InitVal is the starting value of the for loop. It is often 0 or 1, but it can be any number. InitVal is an expression that establishes the initial value and assigns that value to a variable. For example, Count=0 or i=1.

  • Test is the expression used by the for statement to control the number of iterations of the loop. As long as the Test expression is true, the loop continues. When the Test expression proves false, the loop ends. Example: Count<10 is true as long as the value in the Count variable is less than 10.

  • Incrementforループをどのようにカウントするかを示します-1、2、5、10など。これも式であり、通常はの形式を取りますCountVar++。ここCountVarで、はInitVal式で最初に割り当てられた変数の名前です。例:Count ++は、反復ごとにCount変数の値を1つずつ増やします。
JavaScriptの他のすべての構成とは異なり、forステートメントは、引数を区切るためにコンマではなくセミコロンを使用することに注意してください。これは、C、C ++、およびJavaで使用されている構文と一致しています。

Here's an example of a for loop that counts from 1 to 10, stepping one digit at a time. At each iteration, the script inserts some text and begins a new line. The JavaScript you wish to repeat is enclosed in { and } characters following the for statement; this forms the for statement block. You can provide one line or many within the { and } characters.

for (Count=1; Count<=10; Count++) { document.write ("Iteration: "+Count+"

"); }

Count is the variable name used to store the for loop counter. The for loop starts out with 1 and proceeds to 10. The test expression is Count<=10, which reads:

Count is less than or equal to 10 

As long as this expression is true, the for loop continues. Do note that the Increment argument is also an expression and in the example uses the Count variable to increment the for loop by 1 for each iteration. There's no law that says you must increment the for loop by ones. Here's just one of the many alternatives. This example counts by tens, from 10 to 100.

for (Count=1; Count<101; Count+=10) { document.write ("Iteration: "+Count+"

"); }

Back to index

For...in

The for...in statement is a special version of the for statement described in the previous section. For...in is used to display the property names and/or property contents of objects. It is mostly handy as a debugging and testing tool: If a portion of your JavaScript code isn't working properly, and you suspect it may be the fault of a JavaScript object you are trying to use, you can examine all of the properties for that object with the for...in statement.

Unlike the for statement, for...in doesn't use incrementing tests or other expressions. You provide the name of a holding variable (the name of the variable is up to you) and the object you want to use. The basic syntax for the for...in statement is:

for (var in object) { statements } 
  • var is the name of a variable
  • object is the object you wish to examine
  • statements are one or more JavaScript instructions you wish to execute for each property returned by the for...in loop

As an example, suppose you want to determine the properties of the navigator object (this object contains details about the Netscape Navigator or other browser you are using). The following code displays each property name in an alert box. When running the script, click OK to proceed to the next property name. The loop automatically ends when there are no more properties in the object.

for (temp in navigator) { alert (temp); } 

A variation of this example is shown below. It not only displays the property names but also displays the contents of each property (some properties are empty and therefore no contents are shown for them). The contents of the properties are displayed by using the syntax object[var], or in this case navigator[temp].

for (temp in navigator) { alert (temp + ": " + navigator[temp]); } 

The for..in loop can be used for all object types. You can use it to iterate through all the properties for a form in a document, for example, or through the properties of a user-defined object. For instance, to cycle through all the properties of a form, you'd use the for...in loop as in the following example (assume the form name is "myform"):

 function test() { for (temp in document.myform) { alert (temp); } }

Back to index

Function

The function statement lets you create your own user-defined functions (as well as user-defined objects and methods for those objects). Functions are self-contained routines that can be "called" elsewhere within your JavaScript code. For example, if you have a function named

writeMyName

, which displays your name in headline text, you can activate it by merely referring to the name

writeMyName

someplace within your JavaScript code. Here's a short

test

that shows how this might work:

  Function Test  function writeMyName () { MyName="John Doe" alert (MyName) }     

The writeMyName function is defined within ... tags. It is activated (otherwise known as "called") when the form button is pushed. This calling action is accomplished using the onClick event handler, defined in the tag for the form button.

Back to index

If...else

The if, along with its optional else, statement is used to build an "if conditional" expression. It is called a conditional expression because it tests for a specific condition.

  • If the expression is true, the script performs the instructions following the if statement.
  • If the expression is false, the script jumps to the instructions that follow the else statement. If there is no else statement, the script jumps past the if statement entirely and continues from there.

The syntax for if is:

if (expression) 

The result of the if expression is always either true or false. The following syntax is acceptable when there's only one instruction following the if and else statements:

if (ExampleVar == 10) Start(); else Stop(); 

Should more than one instruction follow the if or else statement, the { and } characters must be used to define an if statement block. With the { and } characters in place, JavaScript knows to execute all of the instructions within the block.

if (ExampleVar == 10) { Count = 1; Start(); } else { Count = 0; Stop(); } 

Expressions in if statements are not limited to the == equality operator. You can test if values are not equal to one another, greater than, less than, and more. For more information on the operators you can use, see the references list at the end of this column. It points to valuable JavaScript documentation, including documentation provided by Netscape.

Back to index

New

The new statement creates a new copy of an object. It is used in either of two ways:

  • To define a new Date object (Date is a built-in JavaScript object)
  • To define a new user-defined object

The syntax is the same with either use:

varname = new objectName(params); 
  • varname is the name of the new object. Acceptable names are the same as for JavaScript variables. In fact, you can consider the created object as a JavaScript variable.

  • objectName is the name of the object. When using the built-in Date object, you use the word Date (note the capitalization -- this is mandatory). When using a user-defined object function, you provide the name of the object function.

  • params are one or more parameters that you pass to the object function, if needed.

The following example shows how to use the new statement to create a copy -- otherwise known as an "instance" -- of the Date object:

now = new Date(); 

JavaScript変数と見なすことができるnowオブジェクトには、JavaScriptDateオブジェクトのすべてのプロパティとメソッドがあります。たとえば、nowオブジェクトを使用して、1日の現在の時間を決定します。

now = new Date(); HourNow = now.getHours();