Math.round(数値) 四捨五入する
Math.floor(数値) 切り捨てる
Math.ceil(数値) 切り上げる
Math.trunc(数値) 数値の整数部分を返す
Math.random() 浮動小数点の疑似乱数を返す（0以上1未満）
crypt.getRandomValues(型付き配列) 乱数の配列を返す
ラジアン = (度 * Math.PI) / 180
文字列.trim() 文字列の両端の空欄を取り除く
対象の文字列.indexOf(検索したい文字列) 文字列が最初に現れるインデックス
対象の文字列.search(正規表現) 正規表現にマッチする文字列のインデックス
対象の文字列.includes(検索したい文字列) 文字列が含まれているかどうか
文字列.charAt(インデックス) 指定インデックスの文字を取得する
文字列.substr(開始インデックス) 指定範囲内の文字列を取得する
${文字列1}${文字列2}${文字列3} 文字列1,2,3を結合する、変数の利用
正規表現パターン
| 文字 | 説明 |
|---|---|
| [ABC] | A,B,Cのいずれか１文字にマッチ |
| [^ABC] | A,B,C以外のいずれか１文字にマッチ |
| [A-Z] | A~Zの間の１文字 |
| | 次の文字をエスケープしてくれる。 | |
| ^ | 行の先頭にマッチする。 |
| $ | 行の末尾にマッチする。 |
| * | 直前の文字の０回以上の繰り返しにマッチする。 |
| + | 直前の文字の１文字以上の繰り返しにマッチする。 |
| ? | 直前の文字０回か１回の出現にマッチする。 |
| {n} | 直前の文字をn回一致 |
| {n,} | 直前の文字をn回以上と一致 |
| {m,n} | 直前の文字をm~n回一致 |
| . | 改行文字以外のどの１文字にもマッチする。 |
| \w | 大文字/小文字の英字、数字、アンダースコアに一致。"[A-Za-z0-9]"と同意。 |
| \W | 文字以外に一致。"[^\w]"と同意。 |
| \d | 数字に一致。"[0-9]"と同意 |
| \D | 数字以外に一致。"[^0-9]"と同意 |
| \n | 改行に一致 |
| \r | 復帰に一致 |
| \t | タブ文字に一致 |
| \s | 空白文字に一致 |
| \S | 空白以外の文字に一致。"[^\s]"と同意。 |
| ~ | 「~」で表される文字 |
/パターン/.test(文字列) 文字列がパターンにマッチするかどうか
配列.forEach(コールバック関数) 配列の各要素についてコールバックを行う
for (const 要素 of 配列) {} for...ofでループ
配列.unshift(要素1, 要素2, ...) 先頭に要素を追加する
配列.push(要素1, 要素2, ...) 末尾に要素を追加する
配列.shift() 先頭の要素を取り除く
配列.pop() 末尾の要素を取り除く
配列.splice(追加位置, 取り出す数, 要素1, 要素2, ...) 指定位置から要素を取り出しつつ、要素を追加
配列1.concat(配列2, 配列3, ...) 配列1に配列2、3を結合する
配列.join() 配列の各要素を結合して文字列にする
配列.find(コールバック関数) コールバック関数に合格する最初の要素
文字列.localComparaere(文字列2) 文字列1と文字列2を比較する
配列.map(コールバック関数) コールバック関数によって新しい配列を生成する
配列.filter(コールバック関数) コールバック関数に合格した配列を生成する
配列.reduce(コールバック関数) 各要素を左から右に処理して単一の値を生成する
[...変換対象] or Array.from(変換対象) 配列に変換する
配列のシャッフル
const array = [1, 2, 3, 4, 5]
const arrayLength = array.length
// Fisher-Yatesのアルゴリズム
for (let i = arrayLength - 1; i >= 0; i--) {
const randomIndex = Math.floor(Math.random() * (i + 1))
[array[i], array[randomIndex]] = [array[randomIndex], array[i]]
}
Object.assign({}, コピー元オブジェクト) オブジェクトをコピーする
オブジェクト.hasOwnProperty(キー名) 値があるかどうか 戻り値：真偽値
visibilitychange ブラウザのタブ表示状態が変わった時
resizeイベントはウインドウサイズが変わるたびに実行されるが、matchMedia()を使うケースでは一度だけ処理されるため処理負荷を軽減できる
イベント.preventDafault() イベントのデフォルトの挙動をキャンセルする
JSON.perse(文字列) JSON形式の文字列をJSONオブジェクトに変換
JSON.stringify(obj) JavascriptオブジェクトをJSON文字に変換
JSON.stringify(obj, null, ' ') Javascriptオブジェクトをインデント付きでJSON文字に変換
// fetch()メソッドでJSONを読み込む
async function load() {
// ファイルを読み込む
const data = await fetch('sample.json')
// JSONとして解析
const obj = await data.json()
}
new Woker(ファイルパス) Web Wokerのインスタンスを作成する
Web WorkerはメインスレッドのJavascriptと分離して処理が実行される
navigator.serviceWorker.register() サービスワーカーを登録する
サービスワーカーは開いているウェブページの裏側で常に起動するスクリプト
localStorageは様々なデータを保存できるのが特徴だが、Cookieは１次元の文字列しか保存できない、またクライアントサイド、サーバーサイドでも読み書き変え可能
navigator.geolocation.getCurrentPosition(成功時の関数, 失敗時の関数) 位置情報取得する
<script src="path" async> JSファイルを非同期で読み込み即座に実行
<script src="path" defer> JSファイルを非同期で読み込みHTMLの解析終了後に実行する
オブジェクト.Symbol.iterator イテレーターを取得する
イテレーター.next() 次のイテレーターを取得する
Symbol(文字列または数値) シンボルを作成する
シンボルは、他と重複しない値（ユニークなデータ）を扱える