JavaScript

すぐに役立つテクニック & 学習向けのコンテンツ

レシピ

配列

  1. 配列を使う
  2. 配列の長さを取得する
  3. 配列に要素を追加する
  4. 配列の要素を取り出す
  5. 配列の空要素を削除する
  6. 配列のループ
  7. 配列の各要素に対して処理を実行する
  8. 配列の要素の一部を置き換える
  9. 複数の配列を連結する
  10. 配列の要素を連結して1つの文字列にする
  11. 配列から特定の値を持つ要素を検索する
  12. 配列の要素をソートする
  13. 配列の要素の並びを逆順にする
  14. すでにある配列から新しい配列を作る
  15. 配列の要素の合計を計算する
  16. 文字列を配列に変換する
  17. 配列の全要素に値を一括で代入する
  18. 配列の要素の並びをシャッフルする
  19. 配列から最大値と最小値を取得する

ブラウザ

  1. アラートメッセージを表示する
  2. 確認ウインドウを表示する
  3. テキスト入力欄を作る
  4. ブラウザのウインドウサイズを取得する
  5. 端末のピクセル比を取得する
  6. 端末がタッチ(タップ)に対応しているか確認する
  7. 指定したURIに移動する
  8. ページをリロード (再読み込み)する
  9. 現在のページの前ページ・次ページに移動する
  10. URIからハッシュを取得する
  11. 新しいウインドウを開く
  12. スクロールした量を取得する
  13. 指定した位置にスクロールする
  14. ページのタイトルを書き換える
  15. ページをフルスクリーンで表示/解除する
  16. ページ表示中にブラウザがオンライン/オフラインか確認する

データについて

  1. 値の型を調べる
  2. 型を変換する
  3. 変数の値渡しと参照渡し
  4. 変数が「undefined」になる事例と対処方法
  5. 特定のオブジェクトのインスタンスであるか調べる

イベント

  1. イベントリスナーを設定する
  2. マウスの各操作に対応したイベント一覧
  3. クリックしたときに処理を実行する
  4. タッチ(タップ)したときに処理を実行する
  5. 設定したイベントリスナーを解除する
  6. スワイプ/フリックしたときに処理を実行する
  7. マウスカーソルの位置座標を取得する
  8. タッチ(タップ)したときの位置座標を取得する
  9. スクロールしたときに処理を実行する
  10. ページが読み込まれたら処理を実行する
  11. テキストを選択したときに処理を実行する

HTML・DOM

  1. JavaScriptでHTMLを操作する
  2. html要素、head要素、body要素を取得する
  3. 特定のHTML要素の子要素、親要素、前後の要素を取得する
  4. 指定した位置にHTML要素を挿入する
  5. HTML要素が子要素を持つか確認する
  6. 新しいHTML要素を作成する
  7. 指定したHTML要素を削除する
  8. img要素を動的に作成して画像を表示する
  9. HTML要素を複製(コピー)する
  10. HTML要素を他のHTML要素に置き換える
  11. HTML要素内のテキストを取得、編集する
  12. HTML要素のソースコードを取得、編集する
  13. HTML要素の属性を取得、編集する
  14. HTML要素が特定の属性を持つか確認する
  15. 別タブを開くリンク「_blank」に「rel="noopener"」を付与する

数値

  1. 数値(Number)について
  2. ランダムな数値を取得する
  3. 四捨五入、切り捨て、切り上げ
  4. 浮動小数点数を指定した桁数にする
  5. 数値を指定した桁数の文字列に変換する
  6. 数値を指定した桁数の表記にする
  7. JavaScriptで数学の計算を実行する

オブジェクト

  1. オブジェクトの作成とアクセス方法
  2. オブジェクトを複製する
  3. オブジェクトが特定のプロパティを持っているか確認する
  4. オブジェクトの各キーごとに処理を実行する
  5. オブジェクトを編集できないようにする
  6. オブジェクトのプロパティを配列形式で取得する

正規表現

  1. JavaScriptの正規表現
  2. 正規表現で文字列から特定の文字を検索する
  3. 正規表現で文字列に含まれる特定の文字を置き換える
  4. 正規表現で文字列から空白を取り除く

文字列

  1. 文字列の長さを取得する
  2. 文字列の先頭、末尾にある空白を取り除く
  3. 文字列をURIエンコード(エスケープ)・デコードする
  4. 文字列の中で変数を展開する
  5. 文字列を検索する
  6. 文字列から指定した位置にある文字を取得する
  7. 文字列から指定した文字を取り出す
  8. 特定の文字を他の文字に置き換える
  9. アルファベットを大文字、小文字に変換する
  10. 文字列を分割する
  11. 文字列を結合する
  12. 文字列が指定した長さになるまで文字を追加する
  13. 文字列を置き換えてハイライト表示する

日付・時間

  1. 日付や時刻を取得する
  2. 指定した日時のDateインスタンスを作る
  3. 現時刻のタイムスタンプを取得する
  4. 指定した日時からタイムスタンプを取得する
  5. 2つの日時の差分を計算する
  6. 日付・時刻の計算
  7. 特定の日時から経過した時間を計算する