TypeScriptの次バージョン5.5で、開発者が長い間求めていた挙動が手に入ります。 現状のTypeScript (執筆時点で5.4)では、ユーザー定義型ガードを使う際には型述語(用語は後ほど解説します)の記述が必要です。 function isNumber(value: number | string): value is number { return typeof value === 'number'; }
![TypeScript 5.5で型述語を推論できて最高。配列のfilterも型安全に](https://cdn-ak-scissors.b.st-hatena.com/image/square/593499525e4f34689b1899d2a041087b2197de68/height=288;version=1;width=512/https%3A%2F%2Fres.cloudinary.com%2Fzenn%2Fimage%2Fupload%2Fs--Nvs8gkS6--%2Fc_fit%252Cg_north_west%252Cl_text%3Anotosansjp-medium.otf_55%3ATypeScript%2525205.5%2525E3%252581%2525A7%2525E5%25259E%25258B%2525E8%2525BF%2525B0%2525E8%2525AA%25259E%2525E3%252582%252592%2525E6%25258E%2525A8%2525E8%2525AB%252596%2525E3%252581%2525A7%2525E3%252581%25258D%2525E3%252581%2525A6%2525E6%25259C%252580%2525E9%2525AB%252598%2525E3%252580%252582%2525E9%252585%25258D%2525E5%252588%252597%2525E3%252581%2525AEfilter%2525E3%252582%252582%2525E5%25259E%25258B%2525E5%2525AE%252589%2525E5%252585%2525A8%2525E3%252581%2525AB%252Cw_1010%252Cx_90%252Cy_100%2Fg_south_west%252Cl_text%3Anotosansjp-medium.otf_34%3A%2525E9%2525B9%2525BF%2525E9%252587%25258E%252520%2525E5%2525A3%2525AE%252Cx_220%252Cy_108%2Fbo_3px_solid_rgb%3Ad6e3ed%252Cg_south_west%252Ch_90%252Cl_fetch%3AaHR0cHM6Ly9zdG9yYWdlLmdvb2dsZWFwaXMuY29tL3plbm4tdXNlci11cGxvYWQvYXZhdGFyL2VlOWMzMWRhODMuanBlZw%3D%3D%252Cr_20%252Cw_90%252Cx_92%252Cy_102%2Fco_rgb%3A6e7b85%252Cg_south_west%252Cl_text%3Anotosansjp-medium.otf_30%3AUbie%252520%2525E3%252583%252586%2525E3%252583%252583%2525E3%252582%2525AF%2525E3%252583%252596%2525E3%252583%2525AD%2525E3%252582%2525B0%252Cx_220%252Cy_160%2Fbo_4px_solid_white%252Cg_south_west%252Ch_50%252Cl_fetch%3AaHR0cHM6Ly9saDMuZ29vZ2xldXNlcmNvbnRlbnQuY29tL2EtL0FPaDE0R2hwRUMxbUtjVjZsX01lT2R6N1Nsejk1SXR4WUZoYjB2LTNOdzNjV3c9czI1MC1j%252Cr_max%252Cw_50%252Cx_139%252Cy_84%2Fv1627283836%2Fdefault%2Fog-base-w1200-v2.png)
TypeScriptの次バージョン5.5で、開発者が長い間求めていた挙動が手に入ります。 現状のTypeScript (執筆時点で5.4)では、ユーザー定義型ガードを使う際には型述語(用語は後ほど解説します)の記述が必要です。 function isNumber(value: number | string): value is number { return typeof value === 'number'; }
最近、配列に対して呼び出すことができる新しい相互運用可能なメソッド Array.prototype.with() がブラウザに追加されました。 この記事では、このメソッドの仕組みと、元の配列を変更せずに配列を更新する方法について説明します。 Array.prototype.with(index, value) の概要 Array.prototype.with(index, value) メソッドは、指定された新しい value に index を設定して、呼び出された配列のコピーを返します。 次の例は、年齢層の配列を示しています。配列の新しいコピーを作成し、第 2 の年齢を 15 から 16 に変更します。 const ages = [10, 15, 20, 25]; const newAges = ages.with(1, 16); console.log(newAges); // [1
ES2023その2 / ES2023 / ES2022 / ES2021 先日ES2023では新機能が2個しかなかったという話をしましたが、どういうわけか2023/01/30になってからES2023が2個追加されました。 よくわかりませんが、どうやら1月までは前年のESになるみたいです。 なんで。 これらは2023/01/30に行われたTC39ミーティングで決定したようです。 他にIntl.NumberFormat V3もStage4への議題に上がったみたいですが、こちらは却下されたみたいです。 なんでそんなふわふわな言及なのかってまだアジェンダしかないから詳しいことがわからねえんだよ。 Finished Proposals Change Array by copy 配列を破壊せずに操作するメソッドを追加します。 既存の配列操作メソッドは、変更後の値を返すと同時に元の値も変更してしまいます
TypeScript 5.5 にて Array.filter による型の絞り込みがビルトインでサポートされるようになります。 この記事で紹介している例も、 nonNullable に相当するユーザー定義の型ガードがなくても期待する型の絞り込みが行えます。 const arr = [0, 1, 'hello', false, null, undefined]; const result = arr.filter((item) => item != null); // js: [0, 1, 'hello', false] // ts: (string | number | boolean)[] 🎉
JavaScriptの配列操作。 調べるのがいつも面倒なので、利用頻度の高いものをまとめました。 「もとの配列を変化させない」ことがポイント。 https://t.co/EXU0EoTK8L
ディレクトリ内のファイルやディレクトリを列挙する(一階層のみ) Node.js の標準モジュールである fs モジュールの readdir() を使用して、指定したディレクトリ内のファイル、ディレクトリを列挙することができます。 fs.readdir function 見つかったファイル群は、コールバックの第 2 引数に配列の形で渡されます。 ドット (.) で始まるファイルやディレクトリは検索対象になりますが、カレントディレクトリ (.) や、親ディレクトリ (..) は結果に入りません。 下記は、カレントディレクトリ内のファイルとディレクトリを列挙するサンプルです。 sample.js var fs = require('fs'); fs.readdir('.', function (err, files) { if (err) { console.error(err); } else
ゲンゾウ用ポストイット シェル / Bash / Linux / Kubernetes / Docker / Git / クラウドのtipsを発信。 はじめにJavaScriptで値のユニークな配列を利用する方法(Set) のエントリに関連して。 「ES2015」で新たに用意された便利なコレクションオブジェクトとして Map があります。 他言語だと、例えばJavaのMapのように組み込みの連想配列機能が用意されています。 Map を利用すると、それまでは Object で代用してきた連想配列機能を実現することができます。 とはいえ今まで Object で実現できていたのならそれで良いのではないか?という疑問が浮かびました。 そこで Object ではなく Map を使う際の違いやメリットを調べてみました。 検証環境$ node --version v12.5.0従来のObjectを使った
はじめに 「配列」は、プログラミング初学者の最初の関門のひとつであり、 そして一生の付き合いでもあります。 本記事は、PHPで配列を操作する演習問題集です。 ここに掲載している問題は全て for / foreach を使えば解けます。 初学者の方は、すぐにスマートな方法が思いつかなければ、 まずは for / foreach を使って解決してみてください。 それだけでも、十分配列の理解は深まります。 ただし、ここに掲載している問題は全て for / foreach を使わずに解けます。 ステップアップを目指す方は、ループ処理を使わない方法も考えてみてください。 使用方法 各問題のソースコードを手元のエディタに全文コピペします。 末尾の var_dump() の出力が、コメントの通りになるように、 // SOME CODE HERE // の箇所に、 処理を記述してください。 難易度:低 問
var a = [5,3,9,1,10] a.sort(function(a,b){ if( a < b ) return -1; if( a > b ) return 1; return 0; }); 結果:1,3,5,9,10 var a = [5,3,9,1,10] a.sort(function(a,b){ if( a > b ) return -1; if( a < b ) return 1; return 0; }); 結果:10,9,5,3,1 //フルーツの名前と価格。価格でソートする var fruits = [ {name:"apple",price:100}, {name:"orange",price:98}, {name:"banana",price:50}, {name:"melon",price:500}, {name:"mango",price:398} ]
【forが嫌い!可読性を上げたい!】楽するために学ぶ配列の高階関数(map, filter, reduce等)JavaScriptリーダブルコード高階関数 複雑すぎるforの処理に悩まされたことはありませんか? プログラミング習いたての頃、forに悩まされた記憶はありませんか? また、業務で複雑すぎるfor文を見て、これくらい理解できないとやっていけないのか…と悩んだ記憶はありませんか? 実はそのfor…もっと読みやすい書き方が出来て、簡単に読めるとしたら楽じゃないですか? いやいや、単にもっと楽したくありませんか? 今回は個人的に「苦手なfor文」の書き換え(map, filter, reduce等)について、短くなるだけじゃないところを紹介したいと思います。 コードを読む事に神経をとがらせて疲弊したくない人には、オススメしています。(頭を使う労力が減ってると信じたい...) 本記事につ
気づいたことやミスしたことなどメモしていたので確認作業。細かい仕様だったり暗黙のルールだったり、テクニックだったり。JSに慣れていたら当たり前なことばかりかもしらん。 追記のところはid:os0xさんより。ありがとうございます! undefined var a; alert(a) // undefined 宣言だけだとundefined。undefinedというのは、宣言している変数に値が入っていませんよ、ということ。 そしてオブジェクトには無いプロパティとか参照すると出てくる。 var a = 100; alert(a.length); // undefined さらに引数も。 function func(val) { alert(val); } func() // undefined 引数はCallオブジェクトってのに格納される。このオブジェクトはローカルの変数が格納されるオブジェクト
【書き方1】 配列名 = new Array(要素数); 配列名[0] = "要素1"; 【書き方2】 配列名 = new Array("要素1","要素2","要素3",…,"要素n"); 【書き方3】 配列名 = ["要素1","要素","要素3",…,"要素n"]; 配列の値が文字列の場合は、引用符で括ります。 配列の値が数値の場合は不要です。 あらかじめ配列の要素数を指定する場合は、配列名 = array(要素数)とします。 要素数の指定を省略した場合は、自動的に要素の数に合わせて配列の大きさが変化します。 JavaScriptで配列を作成する場合、new演算子でArrayオブジェクトを生成します。 ただし、配列名 = ['要素名1', ... ]の形式であれば、new Array()を省略できます。 配列の要素の値を取得するには、配列名[参照番号] = 値のようにしま
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く