Download as PDF, PPTX
![TypeScript Type System Example// Anyvar x: any; // 明示的var y; // y: any と同じvar z: { a; b; }; // z: { a: any; b: any; } と同じfunction f(x) { // f(x: any): void と同じconsole.log(x);}// Numbervar x: number; // 明示的var y = 0; // y: number と同じvar z = 123.456; // z: number = 123.456 と同じ// Booleanvar b: boolean; // 明示的var yes = true; // yes: boolean = true と同じvar no = false; // no: boolean = false と同じ// Stringvar s: string; // 明示的var empty = ""; // empty: string = "" と同じvar abc = 'abc'; // abc: string = 'abc' と同じ// Nullvar n: number = null; // 基本型は Null 設定可var x = null; // x: any = null と同じ// Undefinedvar n: number; // n: number = undefined と同じvar x = undefined; // x: any = undefined と同じ// Enumenum Color { Red, Green, Blue }var myColor = Color.Red;Console.log(Color[myColor]); // Red](/image.pl?url=https%3a%2f%2fimage.slidesharecdn.com%2ffukuazutypescriptvsc20160409-160409080634%2f75%2fTypeScript-Visual-Studio-Code-14-2048.jpg&f=jpg&w=240)
Uploaded byAkira Inoue
PDF, PPTX1,160 views
TypeScript と Visual Studio Code
ふくあず ～春の訪れは突然に あの日あの時あの場所で ～ Japan Azure User Group 福岡 の資料です。
Recommended
More Related Content
What's hot
Viewers also liked
![[予告篇] みんなで同時プレイするクイズWebアプリでCodeQuizに挑戦！](/image.pl?url=https%3a%2f%2fcdn.slidesharecdn.com%2fss_thumbnails%2fosc13do-jsakamoto-trailer-130905063238--thumbnail.jpg%3fwidth%3d640%26amp%3bheight%3d640%26amp%3bfit%3dbounds&f=jpg&w=240)
Similar to TypeScript と Visual Studio Code
More from Akira Inoue
TypeScript と Visual Studio Code
- 1.Microsoft Openness～ TypeScriptと Visual Studio Code ～井上 章 (いのうえ あきら)http://aka.ms/chack日本マイクロソフト株式会社デベロッパー エバンジェリズム統括本部 (DX)エバンジェリスト
- 2.井上 章 (いのうえあきら)エバンジェリストhttp://aka.ms/chack2008 年マイクロソフト入社。主に .NET/ASP.NET や Visual Studio,Microsoft Azure などの開発技術を専門とするエバンジェリストとして、技術書籍やオンライン記事などの執筆、さまざまな技術イベントでの講演などを行う。
- 3.HTML & Plug-insFlashSilverlightJavaAppletActiveX…
- 4.HTML5 & CSS3& JavaScript
- 5.HTML5 & CSS3& JavaScript(function ($) {var offsetX = 20, offsetY = 20;$.widget('qs.infobox', {options: {dataUrl: '', maxItems: 10},_create: function () {var that = this,name = this.name;},display: function (event, tagName) {$.ajax({url: url,dataType: 'jsonp',success: function (data) {},});},});} (jQuery));<div class="hoge" />.hoge {color: red;background-color: #b6ff00;border-radius: 8px;}
- 6.JavaScript is theAssemblyLanguage of the Web.by Scott Hanselman.
- 7.
- 8.Large scale JavaScriptdevelopment is hard.
- 9.TypeScriptAny browser. Anyhost. Any OS.Open Source.
- 10.Any browser. Anyhost. Any OS. Open Source.
- 12.Official Web Siteswww.typescriptlang.orgクイックスタートサンプルgithub.com/Microsoft/TypeScriptソースコードドキュメント
- 13.TypeScript compilation processTypeScriptファイル(*.ts)TypeScriptコンパイラ(tsc.js)JavaScriptファイル(*.js)TypeScript型定義ファイル(*.d.ts)JavaScript実行エンジン(Browser,…)Node.js またはWSH (WScript.Shell)で実行ECMAScript 3 またはECMAScript 5 で生成(ECMAScript 2015 試験的実装)Web ブラウザーやNode.js など
- 14.TypeScript Type SystemExample// Anyvar x: any; // 明示的var y; // y: any と同じvar z: { a; b; }; // z: { a: any; b: any; } と同じfunction f(x) { // f(x: any): void と同じconsole.log(x);}// Numbervar x: number; // 明示的var y = 0; // y: number と同じvar z = 123.456; // z: number = 123.456 と同じ// Booleanvar b: boolean; // 明示的var yes = true; // yes: boolean = true と同じvar no = false; // no: boolean = false と同じ// Stringvar s: string; // 明示的var empty = ""; // empty: string = "" と同じvar abc = 'abc'; // abc: string = 'abc' と同じ// Nullvar n: number = null; // 基本型は Null 設定可var x = null; // x: any = null と同じ// Undefinedvar n: number; // n: number = undefined と同じvar x = undefined; // x: any = undefined と同じ// Enumenum Color { Red, Green, Blue }var myColor = Color.Red;Console.log(Color[myColor]); // Red
- 15.TypeScript Interface, ClassesExampleinterface Dog {name: string;Talk: () => string;}class Corgi implements Dog {name: string;constructor(name: string) {this.name = name;}Talk(): string {return "Bow wow!";}}class myDog extends Corgi {constructor() {super("reo");}Talk(): string {return "Wan wan!";}}var reo = new myDog();alert(reo.Talk());
- 16.Generics : ParameterizedTypesclass Human<T> {constructor(public name: T) { }Talk(): T { return this.name; }}var me = new Human<string>("Akira");alert(me.Talk());
- 17.Arrow Function Expressionsvars1 = function (x: number) { return Math.sin(x); } // 標準式var s2 = (x: number) => { return Math.sin(x); }var s3 = (x: number) => Math.sin(x)var s4 = x => { return Math.sin(x); }var s5 = x => Math.sin(x)var s0: (x: number) => number;s0 = x => Math.sin(x)
- 18.Get Accessor /Set Accessorclass Who {private _name: string;get Name() { return this._name; }set Name(name: string) { this._name = name; }}var me = new Who();me.Name = "Akira Inoue";console.log(me.Name);
- 19.Google TypeScript +VS Code
- 20.Visual Studio Codehttp://code.visualstudio.com/Codeoptimized editorIntellisense, debugging, GITWindows + Mac + LinuxOpen Source
- 21.runtimes node.js, ASP.NETCore 1.0, Unity, Officeソースコントロールgitタスク実行gulpgrunt…エディタ30 以上の開発言語拡張機能 Debuggers, Languages Linters, Snippets, Themes ...
- 22. Yeoman (http://yeoman.io/)クロスプラットフォーム ツール群 Windows, Mac OS, Linux 下記のツールで構成 yo : スキャフォールディング ツール Bower, npm : パッケージ マネージャー Grunt, Gulp : タスクランナー/ビルドツール yo generator for ASP.NET Core ASP.NET Core プロジェクト生成ツールWeb 開発クライアント ツール
- 23.
- 25.Erich GammaDistinguished EngineerMicrosoftDesignPattern の GoF の一人Kent Beck とともに JUnit を開発IBM 時代は Eclipse JDT の設計リーダー2011 年 6 月から Visual Studio チームに参画
- 26.+ Squirrel をアプリケーションのアップデート機能に+FirstMate を TextMate シンタックス バンドリング サポートにクロスプラットフォームのデスクトップ アプリケーション シェル(旧 Atom Shell)
- 27.Visual StudioDev EssentialsANDMORE…http://aka.ms/vsfreejp開発ツールVisual Studio CommunityVisual Studio Codeクラウド サービスVisual Studio Team Services$25/month Azure creditsソフトウェアSQL Server Developer EditionR Server Developer EditionParallels for Mac Pro (3 か月間)Windows 10 Development VHD (60 日評価版)Office Online AppsPower BI / App Insights / HockeyApp Free Planトレーニング & サポートPluralsight (3 か月間)WintellectNOW (3 か月間)Xamarin UniversityMicrosoft Virtual Academy
- 28.インフラ技術者、開発者をはじめ、IT に携わるすべてのエンジニアのための技術コンファレンスhttp://aka.ms/decode162016 年5 月 24 日 ～ 25 日ザ・プリンス パークタワー東京
- 29.
- 30.