- 追加された行はこの色です。
- 削除された行はこの色です。
「[[マイクロソフト系技術情報 Wiki>http://techinfoofmicrosofttech.osscons.jp/]]」は、「[[Open棟梁Project>https://github.com/OpenTouryoProject/]]」,「[[OSSコンソーシアム .NET開発基盤部会>https://www.osscons.jp/dotNetDevelopmentInfrastructure/]]」によって運営されています。
-[[戻る>JavaScript]]
* 目次 [#f65c17a8]
#contents
*概要 [#f976406b]
**OSS [#x2db84da]
-オープンソース。ライセンスは Apache License 2.0。
**[[AltJS>https://dotnetdevelopmentinfrastructure.osscons.jp/index.php?JavaScript#d11cd6c3]] [#m4adcefd]
-ECMAScript 6 規格
--JavaScriptのスーパーセット
--静的型付けなJavaScript
--クラス・インターフェイスとその継承
--内部モジュールなどなど。
--Java に近い記述が採用
-JavaScript を生成する。
--コンパイルすると JavaScript に変換される。
--変換後の JavaScript も読み易い。
**Microsoft [#je8d6f5a]
-Microsoftが開発。
-Visual Studioでサポートされる。
-C#作者が開発している。
**その他 [#qbae1618]
-拡張子は *.ts、*.tsx
-仕組は、[[npm>https://dotnetdevelopmentinfrastructure.osscons.jp/index.php?npm]]などのNode.js系ツールと同じ。
*書き方 [#qbe79ea7]
**型注釈 [#zd9d34fe]
http://goo.gl/jKVeHw
**クラス [#o62f1bdb]
http://goo.gl/l3zjBi
**インタフェース [#g50dcb6b]
http://goo.gl/GQD89G
**内部モジュール [#q2e52b0a]
http://goo.gl/gvjgTU
**ジェネリクス [#ud6ba0a4]
**アロー関数式（[[≒ラムダ式>ラムダ式って]]） [#h365f1e3]
**チートシート [#cf8a6122]
-TypeScript早わかりチートシート【1.5.3対応】 - Build Insider~
https://www.buildinsider.net/language/quicktypescript/01
***TypeScriptの基本的な言語仕様： [#h3945ea7]
-変数の型注釈と型推論
-クラスを利用する
-get／setアクセサを利用する
-インタフェース
-enum（列挙型）
-オブジェクト型リテラル
-いろいろな型注釈の書き方
-構造的部分型
-総称型（ジェネリクス）
-namespace（内部モジュール）
-アロー関数式
-コンストラクタと引数プロパティ宣言
-アンビエント宣言
-型定義ファイル
-可変長引数
-省略可能引数とデフォルト値付き引数
-publicとprivateとprotected
-オーバーロード
-型アサーション
-型クエリ
-外部モジュール
-タプル型
-共用型
-type alias（型の別名）
***TypeScriptとECMAScript 2015（6）、7： [#pc4a5a98]
-let／const
-template literals
-shorthand properties
-destructuring
-spread operator
-ES6 modules
-for...of
-symbols
-computed properties
-decorators
*TypeScript & JavaScript [#x0e0cf15]
既存JSのライブラリ資産の活用可能。
*既存JSのライブラリ資産の活用 [#x0e0cf15]
**型定義ファイル [#ja140013]
***[[DefinitelyTyped>https://github.com/borisyankov/DefinitelyTyped]] [#v4326a89]
型定義ファイルを集積しているサイト。
https://github.com/borisyankov/DefinitelyTyped
***既存JSに型を後付けする [#vb238b07]
Moment.jsに型を後付けする*.tsらしい。
Moment.jsに型を後付けする*.d.tsらしい。
https://gist.github.com/vvakame/c50ddbe213cfa758593c
※ このように、自作のライブラリにも~
型情報を与えることでTypeScriptでの利用が可能になる。
*使い方 [#w6ac68bc]
**[[Visual Studio]]を使用しない場合。 [#o54ab8be]
***インストール [#xa09148b]
-npm~
[[コチラ>https://dotnetdevelopmentinfrastructure.osscons.jp/index.php?npm#maa2da9f]]を参考にする。
-typescript
npm install -g typescript
***JavaScriptライブラリの取り込み [#yb246161]
-[[npm>https://dotnetdevelopmentinfrastructure.osscons.jp/index.php?npm]]を使用する。
npm install --save @types/jquery
***設定（tsconfig.json） [#i8eac09b]
[[tsconfig.json>#t8b60dde]]に、ビルドの方法とビルド対象の*.tsファイルを設定する。
[[tsconfig.json>#t8b60dde]]に、[[コンパイル>#nbd8c30c]]の方法と対象の*.tsファイルを設定する。
***ビルド [#nbd8c30c]
-任意の*.tsファイルをビルド。
***コンパイル [#nbd8c30c]
-任意の*.tsファイルをコンパイル。
tsc *.ts
-[[tsconfig.json>#i8eac09b]]の内容に従って、*.tsファイルをビルド。
-[[tsconfig.json>#i8eac09b]]の内容に従って、*.tsファイルをビルコンパイル。
tsc
-参考
--TypeScript2系のコンパイラのオプション一覧~
https://qiita.com/IganinTea/items/f88bea469bff56cfbda6
**[[Visual Studio]]を使用する場合。 [#a9a61a4b]
***JavaScriptライブラリの取り込み [#o8d813b7]
-NuGetを使用する。
Install-Package jQuery
Install-Package jquery.TypeScript.DefinitelyTyped
***その他は自動的 [#t595618c]
-Visual Studioプロジェクトに、*.tsのTypeScriptファイルを追加する。
-（[[tsconfig.json>#i8eac09b]]の設定なども裏で行われている）
-このファイルを保存すれば即座にJavaScriptに変換され*.jsファイルに保存される。
*移行 [#y2748bb6]
-[[コンパイル>#nbd8c30c]]によって他の言語に移行可能
tsc *.ts -t VERSION
tsc *.ts --target VERSION
-VERSION~
コンパイル出力のECMAScriptのバージョンを指定できる。
--ES3 (default)
--ES5
--ES2015
--ES2016
--ES2017
--ESNEXT
*参考 [#p916fbaa]
-TypeScript - Wikipedia~
https://ja.wikipedia.org/wiki/TypeScript
-TypeScript - JavaScript that scales.~
http://www.typescriptlang.org/index.html
--Quick Start~
http://www.typescriptlang.org/samples/index.html
--Documentation~
http://www.typescriptlang.org/docs/index.html
--Download~
http://www.typescriptlang.org/index.html#download-links
--Connect~
http://www.typescriptlang.org/community/index.html
--Playground~
http://www.typescriptlang.org/play/index.html
-TypeScript 日本語ハンドブック | js STUDIO~
http://js.studio-kingdom.com/typescript/
-TypeScriptを導入する前に『覚悟』したほうが良いこと 4項目 - タオルケット体操~
https://hachibeechan.hateblo.jp/entry/I-cannot-say-typescript-is-easy
-TypeScript入門以前ガイド - mizchi's blog~
https://mizchi.hatenablog.com/entry/2018/10/03/195854
**Qiita [#a233796b]
-TypeScriptを使う理由~
https://qiita.com/mugichan3/items/a0f17d9f4f757d88a83a
-TypeScriptの型定義ファイルを共有しよう！~
https://qiita.com/vvakame/items/1980d4b6cc222e03fdcb
-TypeScript2系のコンパイラのオプション一覧~
https://qiita.com/IganinTea/items/f88bea469bff56cfbda6
**slideshare [#ua47b9a1]
-TypeScriptをオススメする理由~
https://www.slideshare.net/yusukenaka52/typescript-46347901
-TypeScriptは明日から使うべき~
https://www.slideshare.net/vvakame/typescript-39466009
**tsconfig.json [#t8b60dde]
-tsconfig.json · TypeScript~
https://www.typescriptlang.org/docs/handbook/tsconfig-json.html
-tsconfig.json | TypeScript 日本語ハンドブック | js STUDIO~
http://js.studio-kingdom.com/typescript/project_configuration/tsconfig_json
-TypeScript tsconfig.json について | tyablog.net~
https://tyablog.net/2017/05/01/typescript-tsconfig-json/
***験なきものを思はずは [#z2458f49]
-TypeScript の tsconfig.json を 考える~
https://azriton.github.io/2017/09/07/TypeScript%E3%81%AEtsconfig.json%E3%82%92%E8%80%83%E3%81%88%E3%82%8B/
-TypeScript の tsconfig.json を 考える - コンパイル・オプション編~
https://azriton.github.io/2017/09/10/TypeScript%E3%81%AEtsconfig.json%E3%82%92%E8%80%83%E3%81%88%E3%82%8B-%E3%82%B3%E3%83%B3%E3%83%91%E3%82%A4%E3%83%AB%E3%83%BB%E3%82%AA%E3%83%97%E3%82%B7%E3%83%A7%E3%83%B3%E7%B7%A8/
----
Tags: [[:プログラミング]], [[:ASP.NET]], [[:ASP.NET Web API]], [[:ASP.NET SPA]]
Tags: [[:プログラミング]], [[:ASP.NET]], [[:ASP.NET Web API]], [[:ASP.NET SPA]], [[:JavaScript]]
![[PukiWiki]](image/pukiwiki.png "[PukiWiki]")
