2019/09/05_`char_only`

※ タイトルのchar_onlyはプログラミングと全く関係ないです。
すいません…
そうなんだーと思ったので、タイトルにしてみました。
（詳しくは、最後の方にあるjQueryの説明を御覧ください。）

やったこと

• チャットアプリの実装が一応完了しました。
• 今はデプロイに向けて、サーバーやAWSの学習してます。

---

最近学んだこと

javascript

表示しているページのURLを取得(locationオブジェクト）

使用場面

• チャット画面の自動更新実装時、setIntervalをチャット画面にのみ限定するために使用。 (条件分岐とmatchと正規表現を使って、特定のURLの時のみsetIntervalが有効になるように設定）

例

window.location.href
//今のページのURLを取得できる

• ↑はlocationオブジェクトのhrefプロパティを使用
• 今回は、window.location.href.match(/正規表現/)で現在のURLを検査した。

setInterval

使用場面

• チャットアプリのチャット画面で、メッセージの自動更新をするために実装

例

setInterval(event, 1000)

//`event`は関数名
// １秒ごとに`event`関数を繰り返し行う

• 公式化：setInterval(関数, 時間)
• 時間の単位はミリ秒
  • 例）５秒は5000と記載

関連(setTimeout)

• 似たメソッドにsetTimeoutがある。
• 両者の比較は、以下のとおり

メソッド名	処理
setInterval	指定した時間経過の度、繰り返し処理を実行
setTimeout	指定した時間の経過後、１回だけ処理を実行

---

jQuery

１番下の子要素の指定方法

使用場面

• チャットアプリの自動更新時、画面上、１番最新のメッセージ情報を取得するために使用した。

例

html

<div id="char_only">
  <p>ザク</p>
  <p>ゲルググ</p>
  <p>ズゴック</p>
</div>

↑このシャア専用モビルスーツ一覧から、ズゴックを指定したとき

jQuery

$('#char_only p:last')

とする

解説

• 公式化すると$('親 子:last')
• １番上の子要素（例でいうと「ザク」）を指定したいときは、$('#char_only p:first')とする

感想

• セレクタに２つ値入れることできたんだ！
  （単なる基礎の欠如です…）
• 「シャア」って「char」って書くんだ！
  （どうしても、ギタリストとたむらけんじが頭をちらつきます…）