SlideShare a Scribd company logo
1 of 17
Download to read offline
JavaScriptからTypeScriptへの
       置き換えで見る
   TypeScriptのいいところ
          丸山 和秀
概要
• 2012/10/01にマイクロソフトが突如発表
• JavaScriptにコンパイルする新プログラミング言語
 • 俗に言う(もしくは今はやりの)AltJS
• TypeScriptコンパイラ(tsc)自身もTypeScriptで書かれてる
 • Node.jsもしくはWSHでコンパイルできる
 • Visual Studio の拡張も提供されている
• エディタがあれば開発できる
 • Visual Studio があればとっても便利
 • WebStorm6 とかいろいろ対応開発環境増殖中
JavaScriptが(ほぼ)そのまま動く!
• JavaScriptのスーパーセット
 • ES3 / ES5に対応
 • 学習が容易
型が定義できる!
インターフェイスも!
変数の型を指定できる!
   型推論も!
既存のライブラリも使える!
• classとかinterfaceとか
• d.tsによる型定義とか
  • WinJSとかjQueryとか
  • 有志による型定義もどんどん追加中
    • https://github.com/borisyankov/DefinitelyTyped
    • http://www.tsdpm.com/
• 型定義があるからコンパイル時の検証が(多くの場合)できる
モジュールも定義できる!
• .NETでいうところの名前空間に近い感じのことができる
  • どちらかといえば静的なオブジェクト、VBのモジュールに近いかな?
• import xxx = module(“yyyy”)
  • CommonJSのモジュールとAMDのモジュールに対応
• 複数人で開発しやすい
その他にもうれしいところが!
アロー関数式!
var foo = function(x){
    return x + x;
}




var bar = (x) => x + x;
ほんとにTypeScriptっていいの?
• プロジェクトにはいろんな人がいてる
 • プログラム大好きな人や、あまり好きでない人、新人や熟練者
 • C#やJavaやPL/SQLやCOBOLやいろいろ
 • JavaScriptを理解してゴリゴリかける人なんてまだまだ少数派
• HTML5の盛り上がりでブラウザ上のJavaScriptで実装する規模
  が増大中
 • Node.jsとかサーバーサイドもあるよね
最後に宣伝です。
ご清聴ありがとうございました。

More Related Content

What's hot

初心者 × AngularJS × TypeScript
初心者 × AngularJS × TypeScript初心者 × AngularJS × TypeScript
初心者 × AngularJS × TypeScriptYuta Matsumura
 
DefinitelyTyped良いという話
DefinitelyTyped良いという話DefinitelyTyped良いという話
DefinitelyTyped良いという話gyoh_k
 
TypeScript 1.0 Released!
TypeScript 1.0 Released!TypeScript 1.0 Released!
TypeScript 1.0 Released!Horuchi Hiroki
 
Google Glassでできること XE12版 最新開発情報 Mirror API & GDK
Google Glassでできること XE12版 最新開発情報 Mirror API & GDKGoogle Glassでできること XE12版 最新開発情報 Mirror API & GDK
Google Glassでできること XE12版 最新開発情報 Mirror API & GDKMasahiro Wakame
 
デザパタIntro
デザパタIntro デザパタIntro
デザパタIntro Yuto Suzuki
 
Js frameworkの紹介
Js frameworkの紹介Js frameworkの紹介
Js frameworkの紹介Ryo Shimada
 
だれも教えてくれないJavaの世界。 あと、ぼくが会社員になったわけ。
だれも教えてくれないJavaの世界。 あと、ぼくが会社員になったわけ。だれも教えてくれないJavaの世界。 あと、ぼくが会社員になったわけ。
だれも教えてくれないJavaの世界。 あと、ぼくが会社員になったわけ。なおき きしだ
 
人類は如何にして大切な データベースを守るべきか
人類は如何にして大切な データベースを守るべきか人類は如何にして大切な データベースを守るべきか
人類は如何にして大切な データベースを守るべきかMikiya Okuno
 
141115 making web site
141115 making web site141115 making web site
141115 making web siteHimi Sato
 
CodingTips+ 基礎編
CodingTips+ 基礎編CodingTips+ 基礎編
CodingTips+ 基礎編Yusuke Ito
 

What's hot (11)

初心者 × AngularJS × TypeScript
初心者 × AngularJS × TypeScript初心者 × AngularJS × TypeScript
初心者 × AngularJS × TypeScript
 
DefinitelyTyped良いという話
DefinitelyTyped良いという話DefinitelyTyped良いという話
DefinitelyTyped良いという話
 
TypeScript 1.0 Released!
TypeScript 1.0 Released!TypeScript 1.0 Released!
TypeScript 1.0 Released!
 
Google Glassでできること XE12版 最新開発情報 Mirror API & GDK
Google Glassでできること XE12版 最新開発情報 Mirror API & GDKGoogle Glassでできること XE12版 最新開発情報 Mirror API & GDK
Google Glassでできること XE12版 最新開発情報 Mirror API & GDK
 
Fundamental Java
Fundamental JavaFundamental Java
Fundamental Java
 
デザパタIntro
デザパタIntro デザパタIntro
デザパタIntro
 
Js frameworkの紹介
Js frameworkの紹介Js frameworkの紹介
Js frameworkの紹介
 
だれも教えてくれないJavaの世界。 あと、ぼくが会社員になったわけ。
だれも教えてくれないJavaの世界。 あと、ぼくが会社員になったわけ。だれも教えてくれないJavaの世界。 あと、ぼくが会社員になったわけ。
だれも教えてくれないJavaの世界。 あと、ぼくが会社員になったわけ。
 
人類は如何にして大切な データベースを守るべきか
人類は如何にして大切な データベースを守るべきか人類は如何にして大切な データベースを守るべきか
人類は如何にして大切な データベースを守るべきか
 
141115 making web site
141115 making web site141115 making web site
141115 making web site
 
CodingTips+ 基礎編
CodingTips+ 基礎編CodingTips+ 基礎編
CodingTips+ 基礎編
 

Viewers also liked

Elmで始めるFunctional Reactive Programming
Elmで始めるFunctional Reactive Programming Elmで始めるFunctional Reactive Programming
Elmで始めるFunctional Reactive Programming Yasuyuki Maeda
 
TypeScriptについて
TypeScriptについてTypeScriptについて
TypeScriptについてechigoya-jp
 
これからはじめるための JavaScript 開発環境
これからはじめるための JavaScript 開発環境これからはじめるための JavaScript 開発環境
これからはじめるための JavaScript 開発環境Ryo Higashigawa
 
サーバーサイドDartを試してみる
サーバーサイドDartを試してみるサーバーサイドDartを試してみる
サーバーサイドDartを試してみるSatoshi KOBAYASHI
 
TypeScript による今風の web アプリ開発
TypeScript による今風の web アプリ開発TypeScript による今風の web アプリ開発
TypeScript による今風の web アプリ開発靖 陣内
 
15分でわかった気になるdart
15分でわかった気になるdart15分でわかった気になるdart
15分でわかった気になるdartSatoshi KOBAYASHI
 
Visual Studioで始めるTypeScript開発入門
Visual Studioで始めるTypeScript開発入門Visual Studioで始めるTypeScript開発入門
Visual Studioで始めるTypeScript開発入門Narami Kiyokura
 
Angular+Dart=より快適なSPA開発
Angular+Dart=より快適なSPA開発Angular+Dart=より快適なSPA開発
Angular+Dart=より快適なSPA開発Satoshi KOBAYASHI
 
はじめよう TypeScript - 入門から実践まで - 素の JavaScript とはさようなら!
はじめよう TypeScript - 入門から実践まで - 素の JavaScript とはさようなら!はじめよう TypeScript - 入門から実践まで - 素の JavaScript とはさようなら!
はじめよう TypeScript - 入門から実践まで - 素の JavaScript とはさようなら!Jun-ichi Sakamoto
 
Angular 4がやってくる!? 新機能ダイジェスト
Angular 4がやってくる!? 新機能ダイジェストAngular 4がやってくる!? 新機能ダイジェスト
Angular 4がやってくる!? 新機能ダイジェストMasahiko Asai
 

Viewers also liked (14)

Elmで始めるFunctional Reactive Programming
Elmで始めるFunctional Reactive Programming Elmで始めるFunctional Reactive Programming
Elmで始めるFunctional Reactive Programming
 
About dart
About dartAbout dart
About dart
 
TypeScriptについて
TypeScriptについてTypeScriptについて
TypeScriptについて
 
はじめてのDart
はじめてのDartはじめてのDart
はじめてのDart
 
これからはじめるための JavaScript 開発環境
これからはじめるための JavaScript 開発環境これからはじめるための JavaScript 開発環境
これからはじめるための JavaScript 開発環境
 
サーバーサイドDartを試してみる
サーバーサイドDartを試してみるサーバーサイドDartを試してみる
サーバーサイドDartを試してみる
 
TypeScript による今風の web アプリ開発
TypeScript による今風の web アプリ開発TypeScript による今風の web アプリ開発
TypeScript による今風の web アプリ開発
 
15分でわかった気になるdart
15分でわかった気になるdart15分でわかった気になるdart
15分でわかった気になるdart
 
Visual Studioで始めるTypeScript開発入門
Visual Studioで始めるTypeScript開発入門Visual Studioで始めるTypeScript開発入門
Visual Studioで始めるTypeScript開発入門
 
Angular+Dart=より快適なSPA開発
Angular+Dart=より快適なSPA開発Angular+Dart=より快適なSPA開発
Angular+Dart=より快適なSPA開発
 
TypeScript超入門
TypeScript超入門TypeScript超入門
TypeScript超入門
 
はじめよう TypeScript - 入門から実践まで - 素の JavaScript とはさようなら!
はじめよう TypeScript - 入門から実践まで - 素の JavaScript とはさようなら!はじめよう TypeScript - 入門から実践まで - 素の JavaScript とはさようなら!
はじめよう TypeScript - 入門から実践まで - 素の JavaScript とはさようなら!
 
Angular 4がやってくる!? 新機能ダイジェスト
Angular 4がやってくる!? 新機能ダイジェストAngular 4がやってくる!? 新機能ダイジェスト
Angular 4がやってくる!? 新機能ダイジェスト
 
Server Side Dart
Server Side DartServer Side Dart
Server Side Dart
 

Similar to Type scriptのいいところ

サーバサイドエンジニアが 1年間まじめにSPAやってみた
サーバサイドエンジニアが 1年間まじめにSPAやってみたサーバサイドエンジニアが 1年間まじめにSPAやってみた
サーバサイドエンジニアが 1年間まじめにSPAやってみたItaru Kitagawa
 
TypeScript ファースト ステップ (v.0.9 対応版) ~ Any browser. Any host. Any OS. Open Sourc...
TypeScript ファースト ステップ (v.0.9 対応版) ~ Any browser. Any host. Any OS. Open Sourc...TypeScript ファースト ステップ (v.0.9 対応版) ~ Any browser. Any host. Any OS. Open Sourc...
TypeScript ファースト ステップ (v.0.9 対応版) ~ Any browser. Any host. Any OS. Open Sourc...Akira Inoue
 
7/7 WordBench kobe dreamweaver seminar
7/7 WordBench kobe dreamweaver seminar7/7 WordBench kobe dreamweaver seminar
7/7 WordBench kobe dreamweaver seminarAtushi Sugiyama
 
JavaScriptを使った開発を始めるなら!TypeScriptをはじめよう ~ ステップアップ
JavaScriptを使った開発を始めるなら!TypeScriptをはじめよう ~ ステップアップJavaScriptを使った開発を始めるなら!TypeScriptをはじめよう ~ ステップアップ
JavaScriptを使った開発を始めるなら!TypeScriptをはじめよう ~ ステップアップ慎一 古賀
 
JavaScriptトレンド総括(2014)
JavaScriptトレンド総括(2014)JavaScriptトレンド総括(2014)
JavaScriptトレンド総括(2014)VOYAGE GROUP
 
TypeScriptハンズオン第1回テキスト
TypeScriptハンズオン第1回テキストTypeScriptハンズオン第1回テキスト
TypeScriptハンズオン第1回テキストmizuky fujitani
 
Introduction to VSCode
Introduction to VSCodeIntroduction to VSCode
Introduction to VSCodeYuki Igarashi
 
TypeScript and Visual Studio Code
TypeScript and Visual Studio Code TypeScript and Visual Studio Code
TypeScript and Visual Studio Code Akira Inoue
 
JSの基本的なことをちょっと掘り下げてみる話シリーズ Chapter04. 〜 prototype編(やっと..!) 〜
JSの基本的なことをちょっと掘り下げてみる話シリーズ Chapter04. 〜 prototype編(やっと..!) 〜JSの基本的なことをちょっと掘り下げてみる話シリーズ Chapter04. 〜 prototype編(やっと..!) 〜
JSの基本的なことをちょっと掘り下げてみる話シリーズ Chapter04. 〜 prototype編(やっと..!) 〜Yukiko Tamiya
 
ちゃんとWeb会議スライド『Coffee script』
ちゃんとWeb会議スライド『Coffee script』ちゃんとWeb会議スライド『Coffee script』
ちゃんとWeb会議スライド『Coffee script』H2O Space. Co., Ltd.
 
javascript を Xcode でテスト
javascript を Xcode でテストjavascript を Xcode でテスト
javascript を Xcode でテストYoichiro Sakurai
 
Java エンジニアチームが始めやすい Scala コーディングスタイル #ichigayageek
Java エンジニアチームが始めやすい Scala コーディングスタイル #ichigayageekJava エンジニアチームが始めやすい Scala コーディングスタイル #ichigayageek
Java エンジニアチームが始めやすい Scala コーディングスタイル #ichigayageekKazuhiro Sera
 
TypeScriptへの入口
TypeScriptへの入口TypeScriptへの入口
TypeScriptへの入口Sunao Tomita
 
お手軽Ajaxアプリケーションの作り方
お手軽Ajaxアプリケーションの作り方お手軽Ajaxアプリケーションの作り方
お手軽Ajaxアプリケーションの作り方Shunji Konishi
 
Web制作勉強会 #2
Web制作勉強会 #2Web制作勉強会 #2
Web制作勉強会 #2Moto Yan
 
⑳CSSでアニメーション!その1
⑳CSSでアニメーション!その1⑳CSSでアニメーション!その1
⑳CSSでアニメーション!その1Nishida Kansuke
 
Visual Studio 2012 Web 開発 ~ One ASP.NET から TypeScript まで ~
Visual Studio 2012 Web 開発 ~ One ASP.NET から TypeScript まで ~Visual Studio 2012 Web 開発 ~ One ASP.NET から TypeScript まで ~
Visual Studio 2012 Web 開発 ~ One ASP.NET から TypeScript まで ~Akira Inoue
 
The seminar of asp.net at 201908 sakurug
The seminar of asp.net at 201908 sakurugThe seminar of asp.net at 201908 sakurug
The seminar of asp.net at 201908 sakurugSAKURUG co.
 
Javaな人が気を付けるべきJavaScriptコーディングスタイル
Javaな人が気を付けるべきJavaScriptコーディングスタイルJavaな人が気を付けるべきJavaScriptコーディングスタイル
Javaな人が気を付けるべきJavaScriptコーディングスタイルMaaya Ishida
 

Similar to Type scriptのいいところ (20)

サーバサイドエンジニアが 1年間まじめにSPAやってみた
サーバサイドエンジニアが 1年間まじめにSPAやってみたサーバサイドエンジニアが 1年間まじめにSPAやってみた
サーバサイドエンジニアが 1年間まじめにSPAやってみた
 
TypeScript ファースト ステップ (v.0.9 対応版) ~ Any browser. Any host. Any OS. Open Sourc...
TypeScript ファースト ステップ (v.0.9 対応版) ~ Any browser. Any host. Any OS. Open Sourc...TypeScript ファースト ステップ (v.0.9 対応版) ~ Any browser. Any host. Any OS. Open Sourc...
TypeScript ファースト ステップ (v.0.9 対応版) ~ Any browser. Any host. Any OS. Open Sourc...
 
7/7 WordBench kobe dreamweaver seminar
7/7 WordBench kobe dreamweaver seminar7/7 WordBench kobe dreamweaver seminar
7/7 WordBench kobe dreamweaver seminar
 
JavaScriptを使った開発を始めるなら!TypeScriptをはじめよう ~ ステップアップ
JavaScriptを使った開発を始めるなら!TypeScriptをはじめよう ~ ステップアップJavaScriptを使った開発を始めるなら!TypeScriptをはじめよう ~ ステップアップ
JavaScriptを使った開発を始めるなら!TypeScriptをはじめよう ~ ステップアップ
 
JavaScriptトレンド総括(2014)
JavaScriptトレンド総括(2014)JavaScriptトレンド総括(2014)
JavaScriptトレンド総括(2014)
 
TypeScriptハンズオン第1回テキスト
TypeScriptハンズオン第1回テキストTypeScriptハンズオン第1回テキスト
TypeScriptハンズオン第1回テキスト
 
Introduction to VSCode
Introduction to VSCodeIntroduction to VSCode
Introduction to VSCode
 
TypeScript and Visual Studio Code
TypeScript and Visual Studio Code TypeScript and Visual Studio Code
TypeScript and Visual Studio Code
 
JSの基本的なことをちょっと掘り下げてみる話シリーズ Chapter04. 〜 prototype編(やっと..!) 〜
JSの基本的なことをちょっと掘り下げてみる話シリーズ Chapter04. 〜 prototype編(やっと..!) 〜JSの基本的なことをちょっと掘り下げてみる話シリーズ Chapter04. 〜 prototype編(やっと..!) 〜
JSの基本的なことをちょっと掘り下げてみる話シリーズ Chapter04. 〜 prototype編(やっと..!) 〜
 
ちゃんとWeb会議スライド『Coffee script』
ちゃんとWeb会議スライド『Coffee script』ちゃんとWeb会議スライド『Coffee script』
ちゃんとWeb会議スライド『Coffee script』
 
javascript を Xcode でテスト
javascript を Xcode でテストjavascript を Xcode でテスト
javascript を Xcode でテスト
 
Java エンジニアチームが始めやすい Scala コーディングスタイル #ichigayageek
Java エンジニアチームが始めやすい Scala コーディングスタイル #ichigayageekJava エンジニアチームが始めやすい Scala コーディングスタイル #ichigayageek
Java エンジニアチームが始めやすい Scala コーディングスタイル #ichigayageek
 
TypeScriptへの入口
TypeScriptへの入口TypeScriptへの入口
TypeScriptへの入口
 
お手軽Ajaxアプリケーションの作り方
お手軽Ajaxアプリケーションの作り方お手軽Ajaxアプリケーションの作り方
お手軽Ajaxアプリケーションの作り方
 
Web制作勉強会 #2
Web制作勉強会 #2Web制作勉強会 #2
Web制作勉強会 #2
 
⑳CSSでアニメーション!その1
⑳CSSでアニメーション!その1⑳CSSでアニメーション!その1
⑳CSSでアニメーション!その1
 
Net fringejp2016
Net fringejp2016Net fringejp2016
Net fringejp2016
 
Visual Studio 2012 Web 開発 ~ One ASP.NET から TypeScript まで ~
Visual Studio 2012 Web 開発 ~ One ASP.NET から TypeScript まで ~Visual Studio 2012 Web 開発 ~ One ASP.NET から TypeScript まで ~
Visual Studio 2012 Web 開発 ~ One ASP.NET から TypeScript まで ~
 
The seminar of asp.net at 201908 sakurug
The seminar of asp.net at 201908 sakurugThe seminar of asp.net at 201908 sakurug
The seminar of asp.net at 201908 sakurug
 
Javaな人が気を付けるべきJavaScriptコーディングスタイル
Javaな人が気を付けるべきJavaScriptコーディングスタイルJavaな人が気を付けるべきJavaScriptコーディングスタイル
Javaな人が気を付けるべきJavaScriptコーディングスタイル
 

More from Kazuhide Maruyama

ビルドで情報を埋め込んでみた
ビルドで情報を埋め込んでみたビルドで情報を埋め込んでみた
ビルドで情報を埋め込んでみたKazuhide Maruyama
 
Way Of Multi Platform Desktop App Development By DotNet
Way Of Multi Platform Desktop App Development By DotNetWay Of Multi Platform Desktop App Development By DotNet
Way Of Multi Platform Desktop App Development By DotNetKazuhide Maruyama
 
夏時間対応始めました。 - .NET Conf関西 2018 LT
夏時間対応始めました。 - .NET Conf関西 2018 LT夏時間対応始めました。 - .NET Conf関西 2018 LT
夏時間対応始めました。 - .NET Conf関西 2018 LTKazuhide Maruyama
 
Microsoft bot frameworkを触ってみた
Microsoft bot frameworkを触ってみたMicrosoft bot frameworkを触ってみた
Microsoft bot frameworkを触ってみたKazuhide Maruyama
 
Typescriptの中のこと(浅め)
Typescriptの中のこと(浅め)Typescriptの中のこと(浅め)
Typescriptの中のこと(浅め)Kazuhide Maruyama
 
VSハッカソン TypeScript ハンズオン
VSハッカソン TypeScript ハンズオンVSハッカソン TypeScript ハンズオン
VSハッカソン TypeScript ハンズオンKazuhide Maruyama
 
ショートカットの勧め
ショートカットの勧めショートカットの勧め
ショートカットの勧めKazuhide Maruyama
 
Grid application テンプレートを紐解く
Grid application テンプレートを紐解くGrid application テンプレートを紐解く
Grid application テンプレートを紐解くKazuhide Maruyama
 
Developerのdeveloperによるdeveloperのためのmetro designの話
Developerのdeveloperによるdeveloperのためのmetro designの話Developerのdeveloperによるdeveloperのためのmetro designの話
Developerのdeveloperによるdeveloperのためのmetro designの話Kazuhide Maruyama
 

More from Kazuhide Maruyama (12)

ビルドで情報を埋め込んでみた
ビルドで情報を埋め込んでみたビルドで情報を埋め込んでみた
ビルドで情報を埋め込んでみた
 
Way Of Multi Platform Desktop App Development By DotNet
Way Of Multi Platform Desktop App Development By DotNetWay Of Multi Platform Desktop App Development By DotNet
Way Of Multi Platform Desktop App Development By DotNet
 
夏時間対応始めました。 - .NET Conf関西 2018 LT
夏時間対応始めました。 - .NET Conf関西 2018 LT夏時間対応始めました。 - .NET Conf関西 2018 LT
夏時間対応始めました。 - .NET Conf関西 2018 LT
 
Microsoft bot frameworkを触ってみた
Microsoft bot frameworkを触ってみたMicrosoft bot frameworkを触ってみた
Microsoft bot frameworkを触ってみた
 
Typescriptの中のこと(浅め)
Typescriptの中のこと(浅め)Typescriptの中のこと(浅め)
Typescriptの中のこと(浅め)
 
Room Metro 2014-03-01
Room Metro 2014-03-01Room Metro 2014-03-01
Room Metro 2014-03-01
 
roslyn
roslynroslyn
roslyn
 
What is xaml
What is xamlWhat is xaml
What is xaml
 
VSハッカソン TypeScript ハンズオン
VSハッカソン TypeScript ハンズオンVSハッカソン TypeScript ハンズオン
VSハッカソン TypeScript ハンズオン
 
ショートカットの勧め
ショートカットの勧めショートカットの勧め
ショートカットの勧め
 
Grid application テンプレートを紐解く
Grid application テンプレートを紐解くGrid application テンプレートを紐解く
Grid application テンプレートを紐解く
 
Developerのdeveloperによるdeveloperのためのmetro designの話
Developerのdeveloperによるdeveloperのためのmetro designの話Developerのdeveloperによるdeveloperのためのmetro designの話
Developerのdeveloperによるdeveloperのためのmetro designの話
 

Type scriptのいいところ