In JavaScript itself, there are lots of ways to write functions. Add TypeScript to the mix and all of a sudden it's a lot to think about. So with the help of some friends, I've put together this list of various function forms you'll typically need/run into with simple examples. Keep in mind that there are TONS of combinations of different syntaxes. I only include those which are less obvious combi
Popular Documentation PagesEveryday TypesAll of the common types in TypeScript Creating Types from TypesTechniques to make more elegant types More on FunctionsHow to provide types to functions in JavaScript More on ObjectsHow to provide a type shape to JavaScript objects NarrowingHow TypeScript infers types based on runtime behavior Variable DeclarationsHow to create and type JavaScript variables
TypeScriptでユーザー定義型ガードを定義する場合、引数をany型にして中を自由に書く方法と引数をunknown型にして中でasを駆使して書く方法があります。この記事では両者を比較考察します。結論としては、unknownとasを使うのが型安全性の面からおすすめです。また、うまく関数を分割することでasを消すことも可能で、これも有効です。 ユーザー定義型ガードとはTypeScriptのユーザー定義型ガードとは、型の絞り込み (type narrowing) に使うことができる関数です。ユーザー定義型ガードは返り値が引数名 is 型のような形の型述語 (type predicate) になっています1。このような関数は真偽値を返り値として返し、trueを返すならば引数名が型であることを表します。 例えば、与えられた値がstring | number型かどうか調べるユーザー定義型ガードは次
30th March 2021 Ever wondered if you can share interfaces, types and functions between TypeScript projects? I'm currently developing a project consisting of two separate TypeScript applications, one being a React.js dashboard and the other an Azure Function app written in Node.js. As part of the project, the dashboard calls an API in the Azure Function app. This got me thinking, as I'm in control
One way to think about TypeScript is as a thin layer around JavaScript that adds type annotations. Type annotations that make sure you don’t make any mistakes. The TypeScript team worked hard on making sure that type checking also works with regular JavaScript files. TypeScript’s compiler (tsc) as well as language support in editors like VSCode give you a great developer experience without any com
2021-01-21 TypeScript10 bad TypeScript habits to break this yearTypeScript and JavaScript have steadily evolved over the last years, and some of the habits we built over the last decades have become obsolete. Some might never have been meaningful. Here's a list of 10 habits that we all should break. If you are interested in more articles and news about web product development and entrepreneurship,
TypeScriptの型システムは、ユニオン型を始めとする様々な機能を持っているのが特徴的です。 その中でも、mapped typesとconditional typesは高度な機能として知られています。 ところが、その機能の膨大さゆえ、全てを使いこなす必要はない、TypeScriptの複雑な機能を無闇に使うべきではないという言説はたびたび現れます。 そのときに槍玉に上がりやすいのがmapped typesとconditional typesなのです。 筆者は、これらの機能は使えるだけ使い倒すべきであるという考えを持っています。 主張の根幹には、高度な型を使えばより正確にインターフェースを記述することができること、そして正確なインターフェースは使いやすさや正確な型推論結果に貢献することがあります。 正確なインターフェースや型推論結果は、コードの理解速度や開発効率を促進します。 これらは型シ
TypeScriptのユニオン型はとても強力な機能で、TypeScriptのコードベースでは広く利用されています。 例えば、次のようにすると「fooプロパティを持つオブジェクトまたはbarプロパティを持つオブジェクト」という型を表現できます。 type FooObj = { foo: string }; type BarObj = { bar: number }; type FooOrBar = FooObj | BarObj; const fooObj: FooOrBar = { foo: "uhyohyo" }; const barObj: FooOrBar = { bar: 1234 };無いかもしれないプロパティ上のFooOrBar型を持つオブジェクトは、fooプロパティを持つ(FooObj)かもしれないし持たない(BarObj)かもしれません。 これはbarも同じで、つまり「ある
Monorepo 環境で、yarn workspace を使って、create-react-app --typescript した client ワークスペースと、prisma2 で作成した server ワークスペースを共存させる手順のメモです。Lint, Prettier, Husky の設定も行います。 前提条件完成品手元で同様の手順を踏んだリポジトリを、GitHub 上に公開していますので、併せてご参照ください。 https://github.com/suzukalight/monorepo-react-prisma2 動作環境MacNode.js v10.16.0npm v6.9.0create-react-app (react-script v3.1.1)prisma2 v2.0.0-preview-5TypeScript v3.5.3Lint, Prettier, Husky
gistfile1.md TypeScriptでの値オブジェクトとフロントエンド・バリデーション 2019/12/05 にQiitaに投稿した記事のアーカイブです この記事はトレタ Advent Calendar 2019の5日目です。 こんにちは、奥野賢太郎 ( @okunokentaro ) です。私は株式会社トレタの社員ではなく、フリーランスのデベロッパーなのですが、今年一年トレタ社のお仕事のお手伝いをさせていただいて、縁がありましてゲスト寄稿的にカレンダーに参加しています。 要約 トレタ社では様々な種類の入力フォームを備えたアプリケーションを運用しています バリデーション処理の分散は修正漏れやバグに直結するので、共通化しましょう 単なる共通化では問題があるため、値オブジェクトに集約しましょう TypeScriptでの値オブジェクトの定義には一工夫が必要です constructor
Skip to the content. clean-code-typescript TypeScriptの為のクリーンコード clean-code-javascriptを見て閃きました。 Table of Contents Introduction Variables Functions Objects and Data Structures Classes SOLID Testing Concurrency Error Handling Formatting Comments Translations Introduction Robert C. Martinの書籍 Clean CodeをTypeScriptに対応させたソフトウェア工学の原則です。 翻訳書籍(amazonへのリンク) これはスタイルガイドではありません。 TypeScriptで可読性が高く、再利用可能であり、リファクタ
In one of my recent PRs I changed all interfaces to types because there were already more types than interfaces. In the review, I was asked to revert the change. I did it, but as well I wondered what the actual difference between interface and type. Let’s figure out this. I use the latest TS (v3.5.1) for examples in this post. Similarities #Records #
プロジェクトで使われている技術と ESModule の状況について UIT では、 SPA 開発のプロジェクトにおいて Vue.js と React が多く利用されており、既存の多くは Babel を利用した JavaScript で、新規のプロジェクトでは TypeScript を利用して開発が行われています。 FYI: 【LINE DEV DAY 2019 番外編】UIT Front-end Tooling Survey 2019 技術選定は勿論、プロジェクトにおける細かなコーディングルールについては、プロジェクトのコードオーナーに委ねられており、プロジェクトごとに裁量を持った意思決定を行っています。 その上で、私が携わるプロジェクトにおいては、 default export を可能な限り避けるように心がけています。 import 側の裁量で対象を自由に命名できてしまう 今回は「『Da
フロントエンドエンジニアの今村です。TypeScriptではenumを使わずunion型を使いましょう、という話を書きます。 モチベーション 何を今さら、と思う方もいるかもしれません。 TypeScriptのunion型はenum的なものを表現可能であり、基本的にenumよりもunion型を使うべき、という意識を持っているTypeScriptプログラマーはすでに少なからずいるのではないかと思います。しかし、ではenumの使用はいかなる場合も避けるべきなのか、そうでないとしたらどのような基準でenumとunion型を使い分けるべきなのか、といった点について、広く合意の取れたガイドラインはなさそうです(少なくとも私は知りません)。この結果、コードレビューなどで少しやりづらさを感じることがあったので、白黒つけてしまいたいという気持ちからこのブログを書いています。 結論としては、enumは全面的に
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く