Search
  1. 関数
  2. コメント文
  3. return文
  4. break文〔現在のループまたは文を終了する〕
  5. continue文〔現在のループを抜け、ループの先頭に戻ってループを続行する〕
  6. while文〔条件が満たされるまで処理を繰り返す〕
  7. do...while文〔条件がtrueの間処理を繰り返す〕
  8. for文〔条件がtrueの間処理を繰り返す〕
  9. for...in文〔すべての値に処理を繰り返す〕
  10. if文〔条件分岐〕
  11. switch文〔条件分岐〕
  12. with文
  13. throw文〔例外エラーを発生サセ、キーワードをcatch文に渡す〕
  14. try...catch...finally文〔エラーをキャッチしてエラー処理を実装する〕
  15. this文

関数

unknown

function 関数名([引数[,引数, ...]] ) { 処理 };

関数名には、任意の関数の名前を指定します。 関数名に予約語は指定できませんので注意してください。

引数はオプション(省略可)です。 引数を複数指定する場合は、カンマ区切りで指定します。 引数は、最大255個まで指定可能です。

<script type="text/javascript">
    function fAlert(str){
        alert(str);
    }
</script>

コメント文

unknown

//
/* ~ */

一行コメントの場合は文の先頭に//を付けると行末までがコメント扱いされます。
複数行コメントの場合は、/**/でコメントしたい文を囲みます。

// 1行コメント

/*
複数行をコメントする場合は、
開始タグと終了タグで囲みます。
*/

return文

unknown

return[値];

現在の関数の実行を終了し、戻り値を返します。 return文は、関数内でのみ使用可能です。

<script type="text/javascript">
    function frmChk(frmObj){
        if(frmObj.getElementById("username").value!=""){
            return true;
        }else{
            alert("ユーザー名を入力してください");
            return false;
        }
    }
</script>

break文
現在のループまたは文を終了する

unknown

break [ ラベル ];

現在のループを終了して、終了したループの直後の文から処理を再開します。

オプションのラベルには、終了する文のラベルを指定します。 ラベルを指定した場合は、関連する文を終了し、終了した文の直後の文から処理が再開されます。

break文は、switch文の条件分岐から抜け出す場合やwhile文for文for...in文do...while文などのループから抜け出す場合に使用します。

<script type="text/javascript">
    /* ループを抜ける */
    var cnt=0;
    while(true){
        cnt++;
        document.write(cnt+" "); /* 実行結果:1 2 3 */
        if(cnt==3) break; /* 3の時、ループを抜ける */
    }
</script>

continue文
現在のループを抜け、ループの先頭に戻ってループを続行する

unknown

continue [ ラベル ];

現在のループを抜けて、現在のループ処理の先頭に戻って、次のループを続行します。 オプションのラベルには、continueを適用する文を指定します。

continue文は、while文for文for...in文do...while文の中でのみ使用可能です。

<script type="text/javascript">
    /* ループを飛ばす */
    for(var cnt=0; cnt<3; cnt++){
        if(cnt==1) continue; /* 1の時、ループを飛ばす */
        document.write(cnt+" ");  /* 実行結果:0 2 */
    }
</script>

while文
条件が満たされるまで処理を繰り返す

unknown

while ( expression ) {
  処理
}

条件がTRUEの間、処理をを繰り返し実行します。

条件には、ループ処理の前に評価する条件式を指定します。 この条件式の評価がTRUEの場合にループを実行し、FALSEの場合にループ処理を終了します。

do while文との違い、条件が満たされていない場合は、一度も処理が実行されません。

<script type="text/css">
    /* ループ */
    var cnt=0;
    while(cnt<5){
        document.write(cnt+" "); /* 実行結果:0 1 2 */
        cnt++;
        if(cnt==3) break; /* cntが3になったら抜ける */
    }
</script>

do...while文
条件がtrueの間処理を繰り返す

unknown

do {
  処理
while ( 条件 )

まず一度処理を実行し、条件がFALSEになるまで処理を繰り返します。 while文と異なり、条件が満たされていなくても必ず1度処理が実行されます。

<script type="text/css">
    /* ループ */
    var cnt=0;
    do{
        document.write(cnt+" "); /* 実行結果: 0 1 */
        cnt++;
    } while(cnt!=2); /* 2になるまで繰り返す */
</script>

for文
条件がtrueの間処理を繰り返す

unknown

for ( 初期値; 条件; インクリメントまたはデクリメント ) {
  処理
}

条件がTRUEの間、処理を繰り返します。 処理を指定回数繰り返したい場合に有用です。

<script type="text/javascript">
    /* ループ */
    for(var cnt=100; cnt<150; cnt+=10){
        document.write(cnt.toString()+" "); /* 実行結果:100 110 120 130 140 */
    }
</script>

for...in文
すべての値に処理を繰り返す

unknown

for ( [var] 変数 in オブジェクトまたは配列 ) {
  処理
}

オブジェクトまたは配列の各要素に対して、それぞれ処理を実行します。 JavaScriptにはPHPでいうところのforeach文はありませんが、このfor...in 文で同等の処理ができます。 連想配列を展開する時などに有用です。

<script type="text/javascript">
    /* ループ */
    /* JavaScript でいうところの foreach */
    var ary=new Array(1,2,3,4,5);
    for(i in ary) {
        document.write(ary[i]+" "); /* 実行結果:1 2 3 4 5 */
    }
</script>

if文
条件分岐

unknown

if ( 条件 ){
  条件がtrue(真)の場合の処理
[ }else{
  条件がfalse(偽)の場合の処理]
}

条件を評価し、条件に応じてた処理を実行します。 条件がTRUEの場合のみ処理を行いたい場合は、else以下を省略可能です。 条件をさらに指定したい場合は、else ifのようにelseの後にif文を続けて処理を分岐させることも可能です。

<script type="text/javascript">
    /* 条件がtrueの場合のみ処理を実行 */
    var a=100;
    if(a=100) document.write("aの値は100です。<br>");

    /* 条件分岐 */
    var num=Math.ceil(Math.random()*10)
    if(num%2==0){
        document.write("偶数です。<br>");
    }else{
        document.write("奇数です。<br>");
    }

    /* 条件分岐 */
    var now=new Date();
    var week=now.getDay();
    var weekStr="";
    if(week==0){
        weekStr="日曜日";
    }else if(week==6){
        weekStr="土曜日";
    }else{
        weekStr="平日";
    }
    document.write("今日は<em>"+weekStr+"<\/em>です");
</script>

switch文
条件分岐

unknown

switch ( 条件 ) {
  case ラベル1 :
   [ 処理1 ]
   [ break; ]
  [ ...
 [ case ラベルn :
   [ 処理n ]
   [ break; ]
 ]
 [ default :
   [ デフォルトの処理 ]
 ]
}

条件の値がラベルと一致した時に、一致したラベルにある処理を実行します。 条件には、条件式または変数名を指定可能です。 いずれのラベルにも一致しない場合は、ラベルdefaultに指定した処理が実行されます。

ラベルdefault以外の各ラベルの処理の最後には必ずbreak文を使用して、処理を終了する必要があります。 break文を記述するのを忘れると場合によっては、ラベルdefaultなど他のラベルの処理も実行されてしまうので注意して下さい。

<script type="text/javascript">
    /* 条件分岐 */
    var d=new Date();
    var str="";
    switch(now.getDay()){
        case 0:
            str+="日";
            break;
        case 1:
            str+="月";
            break;
        case 2:
            str+="火";
            break;
        case 3:
            str+="水";
            break;
        case 4:
            str+="木";
            break;
        case 5:
            str+="金";
        case 6:
            str+="土";
            break;
        default:
            str+="不正な";
            break;
    }
    document.write("今日は<strong>"+str+"曜日<\/strong>です");
</script>

with文

unknown

with ( オブジェクト ) {
  処理
}

文で使用する規定のオブジェクトを指定します。 オブジェクトの指定を省略できるため、ソースが読みやすくなり、ソースのダイエットにもなります。 何度も同じオブジェクトの記述がある場合に有用です。

<script type="text/javascript">
/*
with文を使用しない場合
document.write("このページのタイトル:<em>"+document.title+"<\/em><br \/>");
document.write("このページの最終更新日:<em>"+document.lastModified+"<\/em><br \/>");
*/

/* with文を使用して、documentを省略 */
with(document){
    write("このページのタイトル:<em>"+title+"<\/em><br \/>");
    write("このページの最終更新日:<em>"+lastModified+"<\/em><br \/>");
}
</script>

throw文
例外エラーを発生サセ、キーワードをcatch文に渡す

unknown

throw [ 式 ]

try ... catch...finally文で処理できるエラー条件を生成します。 には任意の式を指定します。

throw文は、catch文内にある場合のみ、引数を省略可能です。 引数を省略した場合は「外側のcatch文でキャッチされたエラー」を再び無視し、引数を指定した場合は「引数の値」を無視します。

<script type="text/javascript">
    function TryCatch(x){
        try{
            try{
                if(x == 0) throw "x は 0 と等しい";
                else throw "x は 0 と等しくない";
            }
            catch(e){
                if(e=="x は 0 と等しい") return(e); /* エラーメッセージを返す */
                else throw e;
            }
        }
        catch(e){
            return(e); /* エラーメッセージを返す */
        }
    }
    document.write(TryCatch(0)+ "<br>\n");
    document.write(TryCatch(1));
</script>

try...catch...finally文
エラーをキャッチしてエラー処理を実装する

unknown

try {
  [ try文 ]
} catch ( 変数名 ) {
  [ catch文 ]
} finally {
  [ finally文 ]
}

エラー処理機能を実装します。

try文には、エラーが発生する可能性のある文を指定します(省略可)。 変数名には、任意の変数名を指定します。 初期値は無視されたエラーの値です。

catch文には、try文で発生しているエラー処理をする文を指定します(省略可)。 finally文には、他のエラー処理が全て発生すると無条件に実行される文を指定します(省略可)。

<script type="text/javascript">
    function TryCatch(x){
        try{
            try{
                if(x==0) throw "x は 0 と等しい";
                else throw "x は 0 と等しくない";
            }
            catch(e){
                if(e=="x は 0 と等しい") return(e); /* エラーメッセージを返す */
                else throw e;
            }
        }
        catch(e){
            return(e); /* エラーメッセージを返す */
        }
    }
    document.write(TryCatch(0)+ "<br>\n");
    document.write(TryCatch(1));
</script>

this文

unknown

this.プロパティ名

プロパティ名には、現在のオブジェクトのプロパティの識別子を指定します。 通常、キーワードthisは、現在のオブジェクトを参照するための、コンストラクタとして使用されます。 参照するオブジェクトがない場合は、windowオブジェクトが参照されます。

<script type="text/javascript">
    function person(firstname,lastname,age){
        this.firstname=firstname;
        this.lastname=lastname;
        this.age=age;
    }
    var pj=new person("peach","john",20);
    document.write("type : "+pj.firstname+"<br \/>");
    document.write("type : "+pj.lastname+"<br \/>");
    document.write("type : "+pj.age+"<br \/>");
    </script>

    <hr />

    <script type="text/javascript">
    function Image(width,height,src){
        this.type="image object"
        this.width=width;
        this.height=height;
        this.src=src;
    }
    var obj=new Image("/content/img/bg/bg_anq.gif","43","58");
    document.write("type : "+obj.type+"<br \/>");
    document.write("width : "+obj.width+"<br \/>");
    document.write("height : "+obj.height+"<br \/>");
    document.write("src : "+obj.src+"<br \/>");
</script>

関連コンテンツ

Q. このサイトの情報はお役に立ちましたでしょうか?

投票する 投票結果を見る

管理人に【web拍手】を送るweb拍手(1行メッセージも送れます♪)

pagetop