【ロピタルの学習記録 2/18】Javascriptのシングルスレッドの実行イメージ

今日は色々な企業さんが集まってやるガイダンスがありました。ITはいわゆるSIer企業しかありませんでした。ですが、ネットで流れている悪いイメージが染み付いていましたが、割とそこまでレガシーではないところもあったし、アットホームな会社さんもありました。

また、僕が行った3つの企業は親会社を持たない独立系という会社さんで、初めて独立系があることを知りました。ちなみに僕が知っていたのはユーザ系(鉄道や金融など)、メーカー系(日立や富士通など)でした

今まではSIer企業には入りたくないなと思ってたけど、そこまで悪くはないかなという印象でした。しかし年功序列はやはり気に食わない... 明日もあるので色々みてみます

Vue

Todoアプリ

この記事をみながら実際にTodoアプリを作ってみました

ToDoリストを作りながら学習しよう!

算出プロパティとウォッチャ👁

算出プロパティ

  • デフォルトではsetter関数的に動作する
  • 変更が予測されるデータを使用している場合は元のデータが変更された時点で実行される
  • 元のデータが変更されなければ再描画してもキャッシュを使用する

監視プロパティ(ウォッチャ)

  • 監視対象のプロパティを登録する
  • 監視対象のプロパティの変更をトリガーにし、関数を実行する

どちらも監視対象のプロパティの変更に応じて値を変更しますが、算出プロパティはこの値が変わったらアラートを表示するという処理はできないみたいです。

つまり、値の変更をトリガーに何かしらの動作を行いたい場合はウォッチャを使い、値が変更されたと同時に表示する値を変更するという処理は算出プロパティを使用する方が簡単に記述できるみたいです。

Javascript

シングルスレッドの実行イメージ

こちらの記事でシングルスレッドでの非同期関数の実行イメージについて学習しました☺️めちゃめちゃわかりやすかったです

dev.to

簡単に説明すると、 1. まずバックグランドで処理するためのAPIが存在します 2. イベントリスナーを見つけたらAPIに渡し、次のコードを実行します 3. SetTimeOutを見つけたらAPIに私、次のコードを実行します 4. イベントリスナーがイベントをキャッチしたらQueに追加します 5. APIは処理が終わったらQueに追加します 6. Queから出てきたものを順に実行します

ごめんなさい、なんかややこしくなったので上の記事を読むのをおすすめします💃

HistroyAPI

Ajaxなどによるコンテンツの更新ではURLの切り替えが発生しないため状態を記録することができない。そこでページ遷移をせずにURLのパスを切り替えるために使用するのがHistoryAPIらしい。ただ、あまりよくわからなかったのでまた復習します

明日

今日は眠たいし集中できないのでこのくらいにしておきます。明日は

  • チームで開発中のアプリでCORSの検証
  • プログラマのためのDocker教科書
  • Udemy VueJS入門決定版

をやりたいと思います。では、おやすみなさい😪