20201013_アウトプット(JavaScript)

アプトプット画像

学んだこと(1時間30分)

JavaScriptとは

JavaScriptプログラミング言語の一つで主にクライアントサイドにおいて力を発揮。「ブラウザ上でのアプリケーションの使いやすさ」「リクエストの送り方の工夫」を担う。

役割 内容
主な役割① ページの遷移なしで、画面の切り替えをすることが出来る
主な役割② 画面を更新せずに、サーバーと通信できる

Javascriptが実行できるツール(デベロッパーツール)

  • JavaScriptの実行はConsoleパネルにて行うことができる。

  • Google Chrome(ブラウザ)を立ち上げ後、⌘+option+Cあるいは、ファンクションキーを有効にしている場合にはF12で検証ツールを開く。

  • リロードすれば、定義していたものがいったん消える。

  • 2行目以降を書きたい時は、shift+Enterを押すと良い!(Enterだけだと実行されてしまう)

  • console.logブラウザのコンソールにテキストを表示させるメソッド。引数として情報を渡している。
console.log("Hello")

変数定義

constとletを使い分けることで、自分もしくは他の人が見た時に理解できるコードを実装できる。

変数定義 使うとき どういうことが分かる?
let 値が変わる変数を定義 この先、代入されている値が変わると分かる
const 値が変わらない変数を定義 変更を加えてはいけないと分かる
var 原則使用しない 視覚的にコードの内容を理解できないため

文字列の中に変数を含める方法

  • 「+で連結」か「テンプレートリテラル」の2つの方法がある。

  • テンプレートリテラルの方が、①変数を埋め込むことができる、②改行を入れることができる、③HTMLの要素を作成することができる、の3つの利点がある。

const name = "Tom"
const age = 25
const introduction = `私の名前は${name}、${age}歳です`
console.log(introduction)
// => 私の名前はTom、25歳です と出力される

条件分岐

Rubyと違うところ。

  • 条件式は()で括る。

  • 条件式の後に続く処理は{}で括る。

  • elsif使えない。(else ifになる。)



積み残し(復習したいこと)

  • devise rollback方法

  • カラム追加の方法

  • Rails勉強会



感想

  • 食事後お腹いっぱいで眠くなるが、その時に仮眠を取るのではなく、筋トレをすることが集中力アップと、眠気覚ましに繋がった。

  • 筋トレはやるまでは面倒くさいと感じるが、やってみると頭がすっきりして睡眠の質もアップするので生産性をあげるために取り入れていきたい。

  • デブサミの続きを見たいので今日は早めに切り上げる。