JavaScript勉強会(初心者向け)に参加してきた

Doorkeeperにアカウント登録してから勉強会を探すのが趣味になりつつありますが、今回はJavaScriptの勉強会に参加させて頂きました。

コロナの影響でオンラインイベントやリモートワークが急速に普及したという側面は社会にとって良い変化だなと思っています。これまでは東京一強、勉強会も最新の技術シェアする会も圧倒的に東京の数がえぐい、みたいな印象でしたが(私の中では)、何をするにも○○社一強とか東京一極集中とかよりもたくさんの母数で切磋琢磨した方が健全な競争社会になっていくんじゃないかなと私個人は思っています。(一強のところがだめ!という意味ではないです)

話は逸れましたが要するにオンライン勉強会が増えて、距離関係なく興味のある技術やデザインについて学ぶ機会が増えている現状に喜んでいます。

今回参加した勉強会はこちら↓

after-school-in-osaka.doorkeeper.jp

内容

学んだこと

配列やif文・for文についてはすでに自分で学習をしており基本的な使い方等は理解していましたが、やっぱり知らないこともたくさんあってとても勉強になったし、イベントハンドラに関しては自分が思いつかない(デザイン設計時にアイデアとして浮かばない)機能もお話を聞くことができて「引き出し広がった!!!」感がすごかったです。

配列、連想配列について

  • 配列の中にも配列が入れる(二次元配列)
  • そしてその中にも配列が入りうる(多次元配列)
  • 記述は改行してインデントした方が圧倒的に見やすいので推奨(JSON方式)
  • 多次元配列は可能な限り使わない方が良い(システムは動いても人間が理解するのが難しいから)
    自分が分かるからって書くと他人がメンテできない独りよがりなコードになってしまうので注意
    ネストが深くなるとシンプルにアクセスしづらくて重くなるというのもある 連想配列を設計するということ → データベースを設計するということとほぼ同義
  • JSONの文法は絶対に覚えておいた方が良い
    http://www.tohoho-web.com/ex/json.html
  • 配列は「どうにかしてもっとシンプルにならないか?」を考え続けることが大切
  • 変数は「値」渡し、配列は「参照」渡し

イベントハンドラ

f:id:yuuri_03:20201127150536p:plain

  • onclickイベントは実はHTML内で記述することができる
  • マウスクリックしたとき、離したとき、など細かくイベント発生のタイミングを指定することができる
  • onKeyUpとかで入力された文字数をカウントしたりできる
  • lengthとかvalueと組み合わせて入力文字数を確認できる
  • 入力フォームの全角を半角に置換したりチェックしたりもJSでできる
  • イベントハンドラはキー入力系、ブラウザ全体系(スクロールとか)の主に2つに分類される

今回はとてもアットホームな勉強会で、技術的な説明もゆっくり進めて頂けて、とても分かりやすかったです。ありがとうございました!

イベントハンドラの話題で触発されて作った文字カウントツール

textcounter.netlify.app