【JavaScript】命令一覧
注釈(コメント)
// 一行の注釈
/* ～ */ 複数行の注釈
注釈(コメント)です。注釈部分は処理されず無視されます。
//は１行のみ、/*～*/は複数行に渡って注釈することができます。
説明
プログラムになにかを処理しているのか、使用にあたっての必要事項などを記述する場合に使います。
プログラム例
<html>
<head>
<title>sample</title>
<script language="JavaScript">
<!--
// alert("S1");
/*
alert("S1");
*/
// -->
</script>
</head>
<body>
コメント
</body>
</html>ブラウザ表示
サンプルダウンロード
ループ構造
break ループ/ブロックから脱出
continue 先頭に戻りループ/ブロック継続
ラベル ラベル名説明
breakはfor,swich, do..while,while,if...elseのループ/ブロック処理から抜けます、continueはループ/ブロックの先頭に処理をもどします。
break,continueともにラベルを使用することができます。
ラベルはアルファベットで始まりアルファベット、数字、アンダーバーで構成される文字列で最後に:(コロン)を付加する必要があります。
if ( a == 1 ) break
aが1だったらループ処理を抜ける
if ( b == 2 ) break
bが2だったらループ処理を抜ける
サンプル
<html>
<head>
<title>サンプル</title>
</head>
<body>
<p>
break , continue
</p>
<p>
<script language="JavaScript">
<!--
for(i = 0 ; i < 9; i++) {
if(i < 7 ) continue;
document.write(i,"<br />");
}
for(i = 0 ; i < 9; i++) {
if(i < 7 ) break;
document.write(i,"<br />");
}
// -->
</script>ブラウザ表示
サンプルダウンロード
繰り返し処理
do ... while 条件を満たしている間隔を繰り返す
for 指定回数を繰り返す
for ... in プロパティ数回繰り返す
while 条件を満たしている間隔を繰り返す説明
do ... while,whileは条件を満たすまで{ }内の処理を繰り返します。
do .. whileは条件を満たしていない場合でも最低1回は{ }内が処理されます。
whileの場合は条件を満たしていない場合は一度も{ }内は処理されません。
forは指定回数{ }内の処理を繰り返します。
例
do {
alert("ヒット!");
} while(n > 10)
説明：
nが10未満の場合「ヒット!」とアラートダイアログに表示する
for( i = 0; i < 10; i++) {
// 10回繰り返す
}
説明：
10回繰り返す
for( i in document )
説明：
documentオブジェクトに含まれるプロパティ数回処理を繰り返す。
サンプル
<html>
<head>
<title>サンプル</title>
</head>
<body>
<p>new , this, with</p>
<script language="JavaScript">
<!--
n = 1;
do {
document.write(n,"<br />");
n++;
}
while( n < 5 )
for(i = 8 ; i < 9 ;i++ )
{
document.write(i,"<br />");
}
for( i in window)
{
document.write(i,"<br />");
}
//-->
</script>
</body>
</html>
サンプルダウンロード
関数定義/リターン
function 関数定義
return 関数から戻る説明
functionは関数を定義します。returnは関数内から呼び出し元に処理を展開。
returnは呼び出し元に値を返すこともできます
例
function abc (){
aaa = 1000;
}
説明：
abcという名前の関数を定義する。
function abc(gn) {
return 2020;
}
説明：
abcという関数を定義し、2020(数値)を返す。
サンプル
<html>
<head>
<title>サンプル</title>
</head>
<body>
<p>
function ... return
</p>
<script language="JavaScript">
<!--
function abc(nm) { return "popup is "+nm; }
data = prompt("popup is","");
document.write(abc(data));
// -->
</script>
</body>
</html>サンプルダウンロード
条件分岐
if ... else 条件分岐
switch ... case ...default 値による分岐説明
if ... elseは条件分岐処理を行います。if( b == 1 ) a = 0; else a = 9;の場合、bが1であれば a = 0が実行され、そうでない場合 a = 9 が実行されます。else は省略することができます。switchは1つの変数が複数の値により分岐する場合に有効です、defaultはcaseで指定された値以外の場合に続く命令を実行する。
例
if ( a == 0 ) b = 1;
説明：
aが0の場合bに1を代入する。
if ( a == 0 ) b = 1; else b = 2;
説明：
aが0の場合bに1、そうでない場合bに2を代入する。
switch(age) {
case 10; alert(" 10歳ですね"); break;
case 20; alert(" 20歳ですね"); break;
case 30; alert(" 30歳ですね"); break;
}
説明：
age の値により分岐する。
サンプル
<html>
<head>
<title>サンプル</title>
</head>
<body>
<p>
function ... return
</p>
<script language="JavaScript">
<!--
data = prompt("数字を入れてください","1");
if(!data)
{
alert("データを入れてください");
} else {
switch(data)
{
case 1: alert("1ですね。"); break;
case 2: alert("2ですね。"); break;
case 3: alert("3ですね。"); break;
default: alert("1,2,3以外ですね。");
}
}
// -->
</script>
</body>
</html>注意
case文の最後はbreakでブロックから抜けるようにしてください。
breakで抜けない場合は以後に続く命令まで実行してしまいます。
サンプルダウンロード
オブジェクト/生成/省略
new オブジェクト生成
this オブジェクト自身
with オブジェクト名省略説明
newは新しくオブジェクトを生成します。
thisはオブジェクト自身を示します。
withを使用すると指定したオブジェクト名を省略できます。
例
theDate = new Date()
説明：
変数theDateに新しく生成されたDateオブジェクトを代入する。
ths.myage = 4
説明：
オブジェクトのmyageプロパティに数値4を代入する。
with(Math) { ～ }
説明：
Mathオブジェクト名を省略する。
サンプル
<html>
<head>
<title>サンプル</title>
</head>
<body>
<p>
new,this,with
</p>
<script language="JavaScript">
<!--
function obj(n)
{
this.N = n * 2;
}
newObj = new obj(3);
with(document)
{
write("newObj.N = ",newObj.N);
}
//-->
</script>
</body>
</html>サンプルダウンロード
変数宣言
var 変数宣言説明
変数の宣言を行います。省略することもできます。
変数名は英数字で始まり0～9、英数字,_(アンダーバー)で構成されています。日本語を変数にすることはできません。
グローバル変数はどこでも参照や変更ができます。
ローカル変数は関数内でのみ参照/変更することができます。
ローカル変数は関数内でvarを付けて宣言します。
例
fname = 1
説明：
変数fnameに数値1を代入する。
myName = "Y.Sekino"
説明：
変数myNameに文字列Y.Sekinoを代入する。
theDate = new Date()
説明：
変数theDateに新しく生成されたDateオブジェクトを代入する
<html>
<head>
<title>サンプル</title>
</head>
<body>
<p>
new,this,with
</p>
<script language="JavaScript">
<!--
var a = 1;
var b = 2;
var c = 3;
d = 10;
function change()
{
var b = 4;
c = 5;
var d = 11;
}
change();
with(document)
{
write("a = ",a,"<br />");
write("b = ",b,"<br />");
write("c = ",c,"<br />");
write("d = ",d,"<br />");
}
//-->
</script>
</body>
</html>サンプルダウンロード
もっとJavaScriptを学びたい人は！こちらの本がおすすめです
#JavaScript #JavaScript初心者 #JavaScript学習 #プログラミング #プログラミング学習 #プログラミング初心者
この記事が気に入ったらサポートをしてみませんか？