その他

よく使われるJavaScriptのコツ(1行だけ解決する!)

この記事は約4分で読めます。

配列の生成

const createArr = (n) => Array.from(new Array(n), (v, i) => i)
const arr = createArr(100) //0-99の配列

<span class="red">or</span>

const createArr = (n) => new Array(n).fill(0).map((v, i) => i)
createArr(100) // 0 - 99の配列

配列をシャッフルする

const randomSort = list => list.sort(() => Math.random() - 0.5)
randomSort([0,1,2,3,4,5,6,7,8,9])

配列の重複削除

const removeDuplicates = list => [...new Set(list)]
removeDuplicates([0, 0, 2, 4, 5]) // [0,2,4,5]

複数の配列の共通部分

const intersection = (a, ...arr) => [...new Set(a)].filter((v) => arr.every((b) => b.includes(v)))

intersection([1, 2, 3, 4], [2, 3, 4, 7, 8], [1, 3, 4, 9]) // [3, 4]

最大値のIndexを検索する

const indexOfMax = (arr) => arr.reduce((prev, curr, i, a) => (curr > a[prev] ? i : prev), 0);
indexOfMax([1, 3, 9, 7, 5]); // 2

最小値のIndexを検索する

const indexOfMin = (arr) => arr.reduce((prev, curr, i, a) => (curr < a[prev] ? i : prev), 0)
indexOfMin([2, 5, 3, 4, 1, 0, 9]) // 5

Telの正規表現

const formatPhone = (str, sign = '-') => str.replace(/(\W|\s)/g, "").split(/^(\d{3})(\d{4})(\d{4})$/).filter(item => item).join(sign)

formatPhone('11111111111') // '111-1111-1111'

余分な空白を削除する

const setTrimOut = str => str.replace(/\s\s+/g, ' ')
const str = setTrimOut('hi,      dude') // hi, dude

テキストの貼り付け

const copy = (text) => navigator.clipboard?.writeText && navigator.clipboard.writeText(text)
copy('コピーしたいテキスト')

今日かどうかを判定する

const isToday = (date) => date.toISOString().slice(0, 10) === new Date().toISOString().slice(0, 10)

Dateのフォーマット(YYYY-MM-DD)

const formatYmd = (date) => date.toISOString().slice(0, 10);
formatYmd(new Date())

Cookieを取得する

const getCookie = () => document.cookie
    .split(';')
    .map((item) => item.split('='))
    .reduce((acc, [k, v]) => (acc[k.trim().replace('"', '')] = v) && acc, {})
getCookie()