---
# System prepended metadata

title: Untitled

---

### drill01 - 変数
変数 num を作成し、数値で100の値を入れコンソール画面に以下の内容で出力すること。
変数名や値が変わった場合にも反映される様に出力時に工夫すること。

[表示内容]
変数numの値は100です

oogaki
```
let num = 100  ;
console.log("変数numの値"+ num +"です");
```

oosawa
```
let num = 100;
console.log( `変数numの値は${ num }です` );
```

setu
```
let num ;
num = 100;
console.log("変数numの値は"+num+"です。");
```

suzaki
```
let num;
console.log("変数numの値は100です");

```

### drill02 - 配列
配列 arr を作成し、以下の出力になる様にデータを変更すること

[表示内容]
[]
[200]
[200,300]
[300]

ex
```
let arr = [];
console.log(arr);
arr[0] = 200;
console.log(arr);
arr.push();
console.log(arr);

console.log(arr);

```


oogaki
```
let array = [200,300] ;
console.log("[]");

console.log(`[${array[0]}]`);

console.log(`[${array}]`);

console.log(`[${array[1]}]`);
```


oosawa
```
let arr = ['[]','[200]','[200,300]','[300]'];
console.log(arr[0]);

console.log(arr[1]);

console.log(arr[2]);

console.log(arr[3]);
```


setu
```
let arr = [0,200,300];
console.log(arr[0]);

console.log(arr[1]);

console.log(arr[1],arr[2]);

console.log(arr[2]);
```



suzaki
```
let arr;
console.log("[]");

console.log("[200]");

console.log("[200,300]");

console.log("[300]");
```


### drill03 - 配列2
オセロの盤を作成したい。
table(#reversi)内に8x8のマス（td要素）を作成すること
中央4x4マスには
黒（●）と白（○）を配置しておくこと
[表示内容]中央位置は下記の様にマスを設定しておく

横（a〜h）
縦（1〜8）と過程すると、
d/4 には ○
d/5 には ●
e/4 には ●
e/5 には ○
を配置し、中央の4マスには黒石と白石が置かれている状況を作成すること
○ ●
● ○
oogaki
```
const tab = document.getElementById("reversi");
console.dir(tab);
const tr = document.createElement("tr");


const num = document.getElementsByTagName("tbody");
console.log(num);
for(let i=0; i<7; i++){
    // console.log(i);
    tab.innerHTML += 
    `<tbody>
        <tr>
            <td></td>
            <td></td>
            <td></td>
            <td>○</td>
            <td>●</td>
            <td></td>
            <td></td>
            <td></td>
        </tr>
    </tbody>`
};

tab.innerHTML+=`<tr>`
for(let i=0; i<6; i++){
    // for(let j=0; j<7; j++){
        tab.querySelector("tr").innerHTML+=`<td></td>`
        // tab.querySelector("tr").innerHTML+=`<td></td>`
    // }
}
tab.innerHTML+=`</tr>`
```


oosawa
```
const reversi = document.getElementById('reversi');
console.log(reversi);

for( i = 0; i < 7; i++ ){
  reversi.innerHTML += `<td></td>`;
}

```


setu
```
let d = document;
const rev = d.querySelector('#reversi tbody');
console.log(rev);

let ary = [];

for(let i=0; i<8; i++){
    let ele = '<td>'
    ary[i] = i;
    for(let j=0; j<7; j++){
        ele += '<td>'
        ele += '</td>'
        // ele += `<td>${(i+1)*(j+1)}</td>`;
    }
    ele +='</tr>';
    rev.innerHTML += ele;

}
```



suzaki
```

```




