JavaScript
今回は「JavaScript」Setを用いてArray(配列)データの重複排除(ユニークに)する方法をエントリーしたいと思います。 サンプルデータ 適当に数値が重複したArrayを用意します。 const numbers = [1, 1, 1, 5, 5, 5, 3, 2, 10, 9] Setで重複排除 Setに用意…
今回は「JavaScript」Array.prototype.sort()で複数データ(Array、配列、数値、文字列)ソートする方法について解説したいと思います。 注意 今回はArray.sortを使ってソートを数値、文字列を降順、昇順でソートしますがArray.sortは破壊的な関数なため注意…
今回はReactアプリを作成する際にReferenceError: fetch is not definedエラーが出た際の解消方法をエントリーします。 ケースとしてはcreate react appではなくwebpackやviteでアプリを作成しアプリ内でfetchを使いAPIなどを利用したケースをJest + Testing…
今回はNode.js Express QueryString(クエリストリング)の取得方法についてエントリーします。 req.query.xxx(xxxはリクエスト時に指定したパラメータ名)で取得できます。 コード例 http://localhost:xxxx/sample?num=10とした場合res.json(req.query.num…
Node.js Expressでパスパラメータの取得方法 http://localhost:5000/sample/123でパスパラメータの123を取得したい場合"/sample/:id"でエンドポイントを定義しreq.params.idで取得できる。また123は文字列なのでabc,1b3なども取得できる。ただし/sample/123/…
今回はTypeScript + Express + ESLintの導入をしたので備忘録としてエントリーしたいと思います。 インストール 開発環境のみで利用するためnpmの場合は--save-dev、yarnの場合は-Dのオプションをつけます npmの場合 npm install --save-dev eslint yarnの場…
今回はJavaScriptのスプレッド構文(Spread Syntax)と残余引数(Respt Parameters)について解説します。 スプレッド構文(Spread Syntax) 配列、オブジェクトなどを展開できます。 const arr = [1,2,3,4,5] const newArr = [...arr,6] (6) [1, 2, 3, 4, 5…
今回はArray..prototype.reduce()の利用例についてエントリーしたいと思います。 足し算 1から5を足す計算例(initialValueとして0をaccに渡す) const arr = [1,2,3,4,5] const initialValue = 0 const result = arr.reduce((acc,cur) => acc += cur,initia…
今回はJavaScriptで文字列の中で特定の文字数を数えるプログラムを書いていきます。 サンプルデータ 今回はこのサンプルデータからaの文字数を数える "azbdobkdlaac" 前準備 Array.fromを使い文字列を配列にする(以降arrを利用する) const arr = Array.from(…
今回はArray(配列)に格納されているオブジェクトを特定のプロパティで抽出をArray.prototype.filter()を用いて行います サンプルデータ type ArrayObj = { id: number name: string category: 'a' | 'b' } const arrayObj = [ { id: 1, name: 'taro', catego…
今回はJavaScript(TypeScript) Arrayに連番でnumberの初期値の設定方法をmapとforを使って解説します。 解説では0オリジンで0から9までの10個の連番、1オリジンで1から10までの10個の連番を例で解説しています。 Array.prototype.map() 0オリジン const arra…
次世代フロントエンドツールと言われているViteのテンプレート機能を利用しReact + TypeScriptの開発環境の構築例 前提 node.js,npmが利用できること node -v v16.15.0 npm -v 8.5.5 環境構築 任意のディレクトリでviteで初期化 npm init vite@latest 設定は…
JavaScript、ASCII文字での大文字、小文字判定