TECH CAMP 29日目 新しい言語

自分用のアウトプット。

まぁ言葉をだらだら書いてくだけだからアウトプットとしての意義があるのかというと微妙だけど(今更

Active Model
モデルの機能を実現するために必要なオブジェクト。

Callbacksモジュール
データ保存時などの任意のタイミングで実行する処理(コールバック)を設定できる。

Validatesモジュール
データ保存時に検証する役割がある。

Serealizationモジュール
JASONなどで返却される値を整えることができる。

Formオブジェクト
フォームに関する処理を切り出す仕組み。

ORM(Object-Relational-Mapping)
RDBのデータを、オブジェクト指向言語でオブジェクトとして使用するために変換する技術。

SQL(Structured Query Language)
RDBの操作を行うための言語。

DDL
データを定義。

DML
データを操作。

DCL
データを制御。

↑これらの中でもまた細かく命令が分かれる。

dind_by_sqlメソッド
Ruby on RailsでSQL文を使用し、データを検索して取得するのに使う。

そしてここからは新たなる言語、JavaScriptへ。(名前だけはよく聞く)

rubyがサーバーサイドを担うものが多いのに対し、
JavaScriptはクライアントサイドを担うことが多い。

console.log(“文字列”) でコンソールに文字を表示させられる。

変数定義について

var
再定義、再代入可能な古い書き方。現在ではあまり使われない。

const
後から書き換えられない変数(定数)を定義する書き方。
再代入、再定義ともに不可。

let
後で書き換えることができる変数を定義する書き方。
再代入は可能で、再定義は不可。

constとletを使い分けることで、視覚的にコードの内容を理解しやすくなる。

テンプレートリテラル
バッククォートで囲むことで、文字列内に変数の中身を記述できる。
`私の名前は${name}で、年齢は${age}です`

条件分岐について

条件式は()でくくる
条件式後の{}内の処理が実行される
複数条件を指定する場合、else ifを使う

if (条件式) {
  処理の内容
} else if {
  処理の内容
}  else {
  処理の内容
}  というような記述。

配列の要素はRubyと同じような感じ。

for文
繰り返し処理を行う。
for (初期化式; 条件式; 加算式) {
  繰り返す処理の内容
}

function
関数を定義することができる。
Rubyと違い、戻り値のところにはretuenの記述が必要。

関数宣言は先に読み込まれるが、関数式は先に読み込まれることはない。

無名関数
関数名なしで関数を定義できる。(より簡潔なコードになる)

即時関数
関数を定義すると同時に処理が実行される。

アロー関数
function の代わりに ()=>という記述で、より簡潔になる。

オブジェクト
データや機能をまとめた情報そのもの。
名前と値をセットにしてデータを管理する。
JavaScriptにおけるオブジェクトは、Rubyのハッシュのようなもの。

プロパティ
そのオブジェクトが持つ属性を表す。

値を取り出す時は
オブジェクト名.プロパティ名と記述する。

オブジェクト名.プロパティ名 = ◯◯ で値を代入
オブジェクト名[`プロパティ名`] = ◯◯ でもよい。

humanオブジェクト内のtalkメソッドを実行するには、
human.talk() と記述する。

windowオブジェクト
ブラウザの情報を持っているオブジェクト。
最上位にこれがあり、この下にconsole.log()などがある。

documentオブジェクト
HTMLを操作できるオブジェクト。

DOM
HTMLを解析し、データを作成する仕組み。

DOMツリーからHTMLを取得する方法
①id名から
document.getElementById(“id名”)

②クラス名から
document.getElementsByClassName(“クラス名”)

③セレクタ名から
document.querySelectorAll(“セレクタ名”)
Allを無くすと、最初の1つだけを取得

②はHTML Collectionというオブジェクトを、③はNode Listというオブジェクトを戻り値として返す。これらは使えるメソッドが異なる。

script要素
実行できるコードを埋め込んだり参照したりするために使用されるHTML

HTMLファイルに、JavaScriptファイルを読み込む記述をする。
<script src=”xxxxx.js”></script>

JavaScriptのコードは、ブラウザ上での「何かが起きたら(イベント)」に応じて動くように記述される。

イベント
HTMLに対して行われた処理の要求。
イベントを認識してJavaScriptのコード(特に関数)が動き出すことをイベント発火という。

loadイベント…ページ全体が読み込まれたら。
clickイベント…指定された要素がクリックされたら。
mouse overイベント…マウスカーソルが指定された要素上に乗ったら。
mouse outイベント…マウスカーソルが指定された要素上から外れたら。

要素.addEventListener(`イベント名,関数`)
と記述する。

ここまで!
JavaScriptという新しいものに触れ始めて、また面白くなってきた。
今日も頑張ろう。

シェアする

  • このエントリーをはてなブックマークに追加

フォローする