Web系エンジニアのアウトプット練習場

エンジニアリングと書評が中心。たまに全然関係無い話もします。
  • thumbnail
  • 2020年01月22日

    URLSearchParamsで配列の検索パラメータを取り扱う

    Qiita
    URLSearchParamsとは? URLSearchParamsは、検索条件を指定する際に使用されるURL?以降の文字列を取り扱う際に、様々な便利機能を提供してくれるAPIです。 const params = new URLSearchParams('?type=test&status=done'); console.log(Object.fromEntries(params)); // => {type: "test", status: "done"} 検索パラメータとして配列を指定したい場合はどうするのか ?type=test&statuses=process&statuses=doneのstatusesのように同じkeyに複数の値を含めて、OR検索を行いたい場合があると思います。 // ステータスは配列で取得したい const isArrayField = (key: string) => key === 'statuses'; const params = new URLSearchParams('?type=test&statuses=process&statuses=done'); const keys = Array.from(new Set(searchParams.keys())); let q: { type?: string, statuses?: string[] } = {} for (const key of keys) { const values = params.getAll(key); if (values.length <= 0) { continue; } q = { ...q, [key]: isArrayKey(key) ? values : values[0] }; } console.log(q); // => {type: "test", statuses: ["process", "done"]} searchParams.keys()は上記の例の場合["type", "statuses", "statuses"]となっているので、Setを使って重複を弾いたあと、Array.fromで再び配列に戻しています。 --downlevelIterationフラグをtrueに設定すれば、配列に戻す必要はありません) getAll関数はstatusesに設定されている値の全てが配列で返してくれるので、配列で取得したいフィールドの場合は配列をそのまま格納すればOKです。 ちなみに、get関数もありますが、この関数は最初の1個目の値をstring型で返します。 console.log(params.get('statuses')); // => "process"
  • thumbnail
  • thumbnail
  • 2020年01月19日

    誕生日までに最強の作業デスクを手に入れる -プロローグ-

    約20日後の2月6日に28歳の誕生日を迎えるので、自分への誕生日プレゼントを何にするか身の回りを見渡しながら考えてみたところ、今使っている作業机が自分の体格に合っていないことに気づきました。 普段は在宅でリモートワークのために生活の約8割を机で過ごす私にとっては、これは致命的なのでは? 富士通が公開している理想の作業姿勢はこんな感じです。
    thumbnail