Javascript basic code

1. JavaScriptの基本構文で
ゲームを作るハンズオン(120分
)

2. 覚えること、これだけ
• if, for, 変数宣言, 関数宣言
• setTimeout, setInterval,
clearTimeout, clearInterval
• getElement(s)by ...
• JavaScriptのオブジェクトの仕組み

3. if
if 条件分岐 ()の中が条件を満たした時に、
{ ... } を実行する

4. if
// console.log … 動作確認用の履歴を出力する
if ( 10 > 5 ) {
console.log(“10は5より大きいです”);
}

5. for
for( 初期条件; 繰り返し条件; 後処理 ){
// 繰り返し実行したい処理
}

6. for
// 前提条件 i = 0 、i < 5を満たす限り繰り返す
// 繰り返すたびにiは+1される
// i … integer 慣用的に使われる
for(var i=0; i<5; i++){
console.log("res: " + i);
}

7. for
// 前提条件、後処理は省力できる
// res … result or response 慣用的に使われる
var i = 0;
for( ;i<5; ){
console.log("res: " + i);
i = i+1;
}

8. 変数宣言
• var (どこからでも参照可、なるべく使わない)
• let (ブロックスコープ、迷ったらこれ)
• const (定数、再代入不可)

9. 関数
function 関数名 (){ 処理 }

10. 関数
function method_name(){
console.log(“関数を実行”)
}

11. 関数(引数あり)
function 関数名 (引数1,引数2, …){ 処理 }

12. 関数(引数あり)
// arg … argument 慣用的に使われる
function method_name(arg1, arg2){
console.log(“結果: ” + arg1 + arg2)
}

13. オブジェクト
{ } 中括弧, : コロンで構造を表現
{
name: “松田”,
age: 33,
pet: {
name: “tama”,
type: “dog”
}
}

14. 関数オブジェクト
var kansuu = function(name){
console.log(“hello, ” + name);
}

15. setTimeout()
• 一定時間経過後に一回だけ処理を実行する`関数`
• setTimeout(関数function[, 一定時間の指定, 引数1,
引数2, …)

16. setInterval()
• 一定間隔で繰り返し処理を実行する`関数`
• setInterval(関数function, 一定時間の指定[, 引数1, 引
数2, …])

17. 関数の引数には色々と渡せる
• オブジェクトを渡してみる
• 関数オブジェクトを渡して実行してみる

18. getElementByID(“identify”)
• document.getElementByID(“sampleId”)
• document.getElementsByClassName(“sampleClassName”)
• document.getElementByTagName(“sampleTagName”)