スパルタコーディングクラブ　短期集中プログラミングコース　2週目

yeji

2023年9月12日 16:22

Java script, jQuery, Fetch

htmlは骨組み, cssは飾り付け, javascriptは動き!
Java scriptはブラウザが唯一理解できる言語
（ブラウザが認識できる言語を標準言語という）。

Javascript : ウェブを動かすコード。
jQuery: Bootstrapのようなもの。人が作ったコード集、ライブラリのこと。
Fetch：サーバーからもらったデータを自分のwebサイトに反映させることができるようにするもの

Java scriptは　<style></style>ではなく<script></script>を入力する

HTML接続ボタンをクリックするとポップアップが表示されるようにする。
→関数を入力する
function hey(){
alert('こんにちは');
}

ボタンに関数を接続する。ボタンを押すと関数が呼び出される。
<button onclick="hey()">映画を記録する</button>

変数

console.log

コーディングしたのが正しく出力されるのかを確認するために、開発者たちがあらかじめ出力してみる道具
<script></script>の中にconsole.log('')を入れる

let a =　数字を入力するときはそそまま数字を入れる
let b =　文字を入れるときは’’ の中に入れる
console.log( a + b )
→検証のconsoleページでa+bの結果がでる
リストを羅列する場合、let a = ['〇〇', '〇〇', '〇〇']のふうに入力する
リストの中で1番目のみ表示させたいときは
let a = ['〇〇', '〇〇', '〇〇']
console.log( a[0] )を入力する
（※プログラミングでは、数字を数えるとき１からではなく0から！）

連想配列ディクショナリ

: キー(key)-バリュー(value) 値の束
前に来るものがkeyコロンの後ろに来るのがvalue
ex) let a = {'name' : '太郎'}→nameがkey, 太郎がvalue

※リストの時とディクショナリの時のかっこについて
→かっこの違いには深い意味はないのでただ覚えるだけでOK!

リスト let a = [] console.log( a[] )

ディクショナリ let a ={} console.log( a[] )

２週目の動画3までの感想

変数の内容はなんとなく理解できただけなので、これからうまくいけるかが心配！

jQuery

jQueryとは、Javascriptとは別の特別なソフトウェアではなく、あらかじめ作成されたJavascriptコード。
コードが複雑で, ブラウザ間の互換性の問題も考慮するために、jQueryを使用。

名前をつける時divタグの中でclass=""ではなく、id=""を入力する

let a = 'りんご'
$('q1').test(a)
…
<div id="q1">テスト</div>
→　q1の位置にりんごが表示されるように命令したもの

java scriptの文法についてゆっくり勉強して身につけたい！

繰り返し文

：リストの中の要素を一つずつ取り出し実行させること

let fruits = ['りんご','なし','かき','みかん']
console.log(fruits[1])
let fruits = ['りんご','なし','かき','みかん']
console.log('りんご','なし','かき','みかん')
のように要素をいちいちうつのは大変なのでここで繰り返し文を使う
（※上の画像参照）