とあるプログラマーの技術ブログ

技術情報

JavaScriptの配列のソートの話 (3) – lodash _.orderBy()

前回の記事 lodashのorderByについて書くのを忘れていたので簡単に。sortByよりも柔軟なソートを手軽に行うことができる。 it('_.orderBy()でソートできる', () => { // Act const sortedUsers = _.orderBy(users, , ); // Assert expect(sortedUsers).toEqual() }); 上の例は、第1ソートがuserプロパティの値の昇順、第2ソートがageプロパティの値の降順であることを示している。以下のようにネストされたプロパティの指定もできる。 it('_.or…
2021-01-24

JavaScriptの配列のソートの話 (2) – lodash _.sortBy()

https://blog.ynkb.xyz/296/ の続き。Array.prototype.sort() は操作が破壊的である点や、柔軟なソートに耐えられないという決定があり、多くの場面では使いづらい。 プリミティブ要素のソート まずは _.sortBy() から。_.orderBy() はまた次の投稿にて。 null と undefined の扱いは Array の場合と異なる。null と文字列の 'null' は同一視されない。 null は undefined よりは前に来る。 it('nullとundefinedの扱い', () => { // Arrange…
2021-01-19

JavaScriptの配列のソートの話 (1) – Array.prototype.sort()

JavaScriptでの配列のソートについて簡単にまとめてみた。 問題：以下の操作を行った場合の配列要素の並びは？（答えは最後）.sort() Array.prototype.sort() 配列自体のsortメソッドには通常比較関数を渡すが、何も渡さなかった場合は要素が文字列に変換されてUTF-16のコード順でソートされる。配列自体が書き換わる破壊的操作である点に注意が必要だ。 it('文字列の配列をソートできる', () => { // Arrange const array = ; // Act array.sort(); // Assert expect(array…
2021-01-18

Jestを試してみる

インストールとテスト実行 Jestを使ったことがなかったので、create-react-appを使って簡単に試してみたメモ書き。 プロジェクトの作成。 $ npx create-react-app try-jest --template typescript $ cd try-jest $ code . App.tsx に対するテスト App.test.tsx が既に存在している。 ターミナルからテストを実行。 $ yarn test ウォッチモードで実行されるので、aを選ぶ。 テストが成功する。 App コンポーネントに表示される文字列を変更してみる。テストの期待値を修正。 test(…
2021-01-12

Azure Static Web Apps にReactアプリをデプロイする方法

簡単なサンプルアプリを作成してデプロイする手順のメモ。※2020年11月時点で未だにプレビュー版なので、手順は大きく変わる可能性もあり 前提条件： nodeがインストール済みVS Codeがインストール済みAzure Functions Core Toolsがインストール済み Reactアプリの作成 プロジェクトのルートを作成。 $ mkdir hello-static-webapps-sample && cd hello-static-webapps-sample create-react-appでサクッと作成。 $ npx create-react-app hello-app VS Cod…
2020-11-17

Spockでジェネリックなインターフェースをモックするには

Spockは標準機能としてスタブ／モックを内包しているのでとても便利。以下のように簡単にモックを作成し、期待する振る舞いを定義できる。 // モックの作成 def mock = Mock(Foo) // エクスペクテーション 1 * mock.bar() >> 99 モック／スタブの対象としたいクラスが、型引数を持つジェネリックなインターフェースやクラスだったらどうすればよいか？以下のようにTypeTokenを使えばOKだ。（java.util.Funcitionインターフェースをスタブするコード例） // スタブの作成 def stub = Stub(type: new Type…
2020-04-17

TypeScriptでMaterial-UI練習帳 — Hello, world! —

Reactの基本はなんとなく理解できてきた（気がする）。自分はUIデザインのセンスがク○レベルなので、ちょっとしたサンプルを作る上でも、次はMaterial-UIを使えるようになりたい。React＋TypeScriptの情報ってまだまだ少ないので、一から手探りになってしまうのがつらみ。 create-react-appのコマンドはもう覚えたぞ。 $ npx create-react-app --typescript material-ui-hello --typescriptはdeprecatedになったから今後は--template typescriptを使えと言われた。覚えておこう。 $ …
2020-02-01