TypeScript part2 [転載禁止]©2ch.net

**デフォルトの名無しさん** · 2015/04/30(木) 18:37:29.98

http://www.typescriptlang.org/

TypeScript lets you write JavaScript the way you really want to.
TypeScript is a typed superset of JavaScript that compiles to plain JavaScript.
Any browser. Any host. Any OS. Open Source.

前スレ
http://peace.2ch.net/test/read.cgi/tech/1349187527/

**デフォルトの名無しさん** · 2017/02/16(木) 14:34:53.75

typescript ってclassの中でclassは定義できないの？

**デフォルトの名無しさん** · 2017/02/16(木) 16:54:40.22

>>556
innerClass = class { ... } の構文を使ってみては？

**デフォルトの名無しさん** · 2017/02/16(木) 18:23:19.49

>>557
さんきゅう。
その後、自分でも調べてそういう構文を見付けたのだが、
なぜ一般的な言語のようにclassをネスト出来ないのかな？

**デフォルトの名無しさん** · 2017/02/17(金) 10:02:26.32

構造的にESにないものは採用されないんじゃなかろうか
俺もprivate static Inner = class {...で試したけどあまり使えなさそうだからやめた

**デフォルトの名無しさん** · 2017/02/23(木) 21:12:34.52

Announcing TypeScript 2.2
https://blogs.msdn.microsoft.com/typescript/2017/02/22/announcing-typescript-2-2/
TypeScript 2.2.1 変更点
http://qiita.com/vvakame/items/eb6c054360868b88f9b1

**デフォルトの名無しさん** · 2017/03/19(日) 00:28:00.75

Chrome拡張機能を作ってる方結構いるみたいなので教えてほしいのですが
「chrome.～～～」のAPIが「Supplied parameters do not match any signature of call target.」とコンパイルエラーになります
「/// <reference path="./node_modules/@types/chrome/index.d.ts" />」でd.tsは指定しているのですが、他にも何か記述が必要ですか？

**デフォルトの名無しさん** · 2017/03/19(日) 02:18:51.51

>>561
そもそも今は/// <reference path=みたいな書き方はしない。
@types/XX npm install すれば使えるはず。

**デフォルトの名無しさん** · 2017/03/19(日) 02:40:46.59

インストしても明示的なインポートなしには使えんよ

**デフォルトの名無しさん** · 2017/03/19(日) 03:16:06.29

>>561
エラーしてる部分のソース貼るといいよ

**561** · 2017/03/19(日) 11:24:02.73

皆様ありがとうございます…解決しました…chrome.～～に引数が設定されてなくてエラーになるという超凡ミスでした…
エラーメッセージの意味をきちんと理解しないといけないですね…

--- コンパイルエラー ----------------------------------------------------------
if (window.location.href.indexOf('aaa.com') !== -1) {
chrome.pageAction.onClicked.addListener();
}
------------------------------------------------------------------------------

--- コンパイル正常 -----------------------------------------------------------
if (window.location.href.indexOf('aaa.com') !== -1) {
chrome.pageAction.onClicked.addListener(() => {

});
}
------------------------------------------------------------------------------
あと、仰る通り<reference path= />なくてもコンパイル通りました

皆様お騒がせしました

**デフォルトの名無しさん** · 2017/03/19(日) 13:25:11.81

>>565
エディター何使ってんの？
typescriptなら書いてるそばから検出できるエラーじゃないのか？

**デフォルトの名無しさん** · 2017/03/28(火) 10:03:39.39

ターゲットにWebAssemblyを追加する計画とか無いのかな

**デフォルトの名無しさん** · 2017/03/28(火) 14:44:15.57

interfaceの定義でArrayの要素が２つしかない場合の定義の仕方ってあるかな

interface Pair {
number[2]
}

interface Data {
pairs :Pair[]
}

みたいな感じで定義できないもんか。
諦めてnumber[]にするしかない？

**デフォルトの名無しさん** · 2017/03/28(火) 14:54:23.37

タプル使え

**デフォルトの名無しさん** · 2017/03/28(火) 17:30:18.19

>>569
thanks

type Pair = [number,number]
interface Data {
pairs :Pair[]
}

**デフォルトの名無しさん** · 2017/03/30(木) 23:49:26.09

index.htmlに直接CDNからreactとreact-domを読み込んで
npmからは@types/reactと@types/react-domをインストールし
tsxファイルからimport文を使わずにreactを使ったところ何の問題もなく動いた。

plotly.jsを同じように使おうとしたら自動では定義ファイルを読んでくれない。
この違いは一体何なのか？

と思って定義ファイルを見たところreactとreact-domには以下のような記載がある

export as namespace ReactDOM;
export as namespace React;

上記を真似て定義ファイルに
export as namespace Plotly;
を追加したら同じ挙動になった。

export as namespace XXX ってなんすか？

**デフォルトの名無しさん** · 2017/03/31(金) 01:47:51.53

そのモジュールのグローバル変数化宣言
公式wiki嫁

**デフォルトの名無しさん** · 2017/04/01(土) 20:31:37.83

型定義ファイルの書き方がよくわからなくてつんでいます

node-transmission
https://github.com/FLYBYME/node-transmission
の型定義ファイルが見当たらないので作っているんですが

もとのjsファイルのexport宣言が
var Transmission = module.exports = function (options) {

ってなっている場合に型定義ファイルとして以下のように書いても認識されないです。

declare interface transOptions {
port: number
host: string
}
declare class Transmission {
constructor(optins: transOptions)

}
export default Transmission

使う場合に
import * as Transmission from "transmission";
var transmission = new Transmission({
port : 9091,
host : '127.0.0.1'
});

って書いてもtransmission はany型のようです。
どう書くのが正解でしょうか？

**デフォルトの名無しさん** · 2017/04/01(土) 22:04:14.42

>>573
すいません。自己解決しました。
JSのモジュールまじしんどい

**デフォルトの名無しさん** · 2017/04/09(日) 14:34:29.06

>>41
partial classは不採用になったので一応

Suggestion Backlog Slog, 4/3/2017
https://github.com/Microsoft/TypeScript/issues/14990
https://github.com/Microsoft/TypeScript/issues/563#issuecomment-291300044

**デフォルトの名無しさん** · 2017/04/10(月) 14:18:00.18

Google社内の標準言語としてTypeScriptが承認される。ng-conf 2017
http://www.publickey1.jp/blog/17/googletypescriptng-conf_2017.html

**デフォルトの名無しさん** · 2017/04/10(月) 18:26:24.79

>>576
Dartどうすんだよ

**デフォルトの名無しさん** · 2017/04/10(月) 20:28:20.75

劣るうえ、使われてないdartは自動消滅。
ホントはわかってたこと。

**デフォルトの名無しさん** · 2017/04/11(火) 02:02:21.52

typescriptでreduxの実装書くのしんどいね

http://qiita.com/wadahiro/items/7c421b668f28a99e2a29
こいつを参考に書いてるけど。他にいい書き方があれば

**デフォルトの名無しさん** · 2017/04/11(火) 07:02:04.43

>>579
おまおれ

mapStateToPropsとかの引数も型どうしていいか分からん

**デフォルトの名無しさん** · 2017/04/11(火) 17:04:01.31

>>579
こんなの誰が何に使うの？

**デフォルトの名無しさん** · 2017/04/11(火) 19:22:39.80

ほんそれ

**デフォルトの名無しさん** · 2017/04/11(火) 22:09:52.06

TypeScriptでreact-router-reduxに手を出したら大変な目に遭った。

**デフォルトの名無しさん** · 2017/04/11(火) 22:24:37.23

単語が3つ以上入ってるパッケージに近寄りたくない

**デフォルトの名無しさん** · 2017/04/12(水) 19:01:00.44

>>576,577
もうjavaやめてtypescriptでandroidアプリ開発できるようにしてほしい。
でも本心はdart頑張れ。

**デフォルトの名無しさん** · 2017/04/12(水) 19:19:27.95

そういうフレームワーク色々あるやん

**デフォルトの名無しさん** · 2017/04/12(水) 20:26:06.76

>>579
これの2.0/2.1用ってのをやってみたら#defineが欲しくなった。
ストリングリテラルを置き換えられるマクロみたいなものってないのかな？

**デフォルトの名無しさん** · 2017/04/12(水) 20:47:03.00

>>587
何が欲しいのかよく解らんが
const ABC=”str”
じゃあかんのか？

**デフォルトの名無しさん** · 2017/04/12(水) 20:56:38.51

そのABCはストリングリテラル型には使えんわけよ。

**デフォルトの名無しさん** · 2017/04/12(水) 21:04:32.60

redux の冗長な書き方をtypescriptの機能でなんとかしてほしいってことなんだろうけど。
react見たくpropsをinterface定義すれば大体いい感じで使える。みたいにredux の方もstateのinterface定義だけでいい感じに出来上がるような仕組みがほしい。

**デフォルトの名無しさん** · 2017/04/12(水) 21:05:36.55

>>585
つreact native

**デフォルトの名無しさん** · 2017/04/12(水) 22:41:00.77

>>589
const ABC:"str" = "str";
こういうことか

**デフォルトの名無しさん** · 2017/04/12(水) 23:07:35.91

それ。
strが短いならそのまま書いても一緒だけど、actionのtypeって長くなりがちだから
二重に書くのがつらい。

**デフォルトの名無しさん** · 2017/04/12(水) 23:08:47.06

>>577
TypeScriptが標準言語になっても、Dartのことは忘れてませんよとGoogle担当者がフォロー
http://www.publickey1.jp/blog/17/typescriptdartgoogle.html

**デフォルトの名無しさん** · 2017/04/12(水) 23:50:07.42

constは型書かなくてもストリングリテラルに推論されるようになったんだが存知ない？

**デフォルトの名無しさん** · 2017/04/13(木) 00:12:31.67

2.1からだね。2.0でも使ってたんだろうか

**デフォルトの名無しさん** · 2017/04/13(木) 00:19:44.83

ストリングリテラルに推論されるって？
これ通らないでしょ？

const STR = "str";
const ABC: STR = STR;

**デフォルトの名無しさん** · 2017/04/13(木) 00:27:33.33

>>597
そりゃ二行目がストリングリテラルじゃないからね

**デフォルトの名無しさん** · 2017/04/13(木) 00:33:01.65

だからそれが書けないから>>593だってことだろ。
結局>>595は何の話をしてたんだ？

**デフォルトの名無しさん** · 2017/04/13(木) 00:34:18.77

なにがやりたいのかよく解らんが
const STR = "str";
const ABC1 = STR;
const ABC2:”str” = ABC1;
type STRT=”str”;
const ABC3:STRT=STR;
全部通るよ

**デフォルトの名無しさん** · 2017/04/13(木) 00:39:19.82

>>599
エラーメッセージも読めない奴がずいぶんと偉そうだな
ドキュメント100回読み直してこい

**デフォルトの名無しさん** · 2017/04/13(木) 00:40:44.33

>>600
やりたいのはそこで言うSTRTとSTRの共通化。
要は同じ"str"を重複して書きたくないってこと。

**デフォルトの名無しさん** · 2017/04/13(木) 00:44:07.45

変数の型の参照なんて初歩の初歩なんだが教えてやるまい

**デフォルトの名無しさん** · 2017/04/13(木) 01:00:49.62

>>602
えっ　普通推論させるから書かないでしょ
わざわざ書かなきゃならなくなるケースってどんな時よ

**デフォルトの名無しさん** · 2017/04/13(木) 01:13:36.05

const STR = "str";
type STRT = "str";
const ABC3: STRT=STR;

"str"を2回書かずにABC3が作れればそれでいいんだけど。

**デフォルトの名無しさん** · 2017/04/13(木) 01:20:51.05

>>605
const STR = "str";
const ABC3 = STR;

**デフォルトの名無しさん** · 2017/04/13(木) 06:09:08.50

type STRT = typeof STR

**デフォルトの名無しさん** · 2017/04/13(木) 08:01:19.65

すまん、確かに思い違いしていたようだ。ありがとう。

**デフォルトの名無しさん** · 2017/04/13(木) 13:00:24.68

恥ずかしか

**デフォルトの名無しさん** · 2017/04/13(木) 20:33:25.78

認めて謝って感謝してるだけ立派だよ

**デフォルトの名無しさん** · 2017/04/16(日) 20:56:40.61

TypeScriptでExpressを使う場合について教えてください。

express-generatorなどのサンプルコードだと new Error したオブジェクトにstatusを
突っ込んで返していたりしますが、ここ、TypeScript的にはどうするのが普通でしょう？
みなさん自前でErrorのサブクラスを定義しているんでしょうか？あるいはどこかに
定番のものがあったりするんでしょうか？

**デフォルトの名無しさん** · 2017/04/16(日) 22:51:14.41

「どうでもいい」が普通じゃない?
そんなもんエラーハンドラで受けて適当にトレースとエラーメッセージ出したら終わりなんだから
型なんぞ要らん
手段と目的を履き違えるな

**デフォルトの名無しさん** · 2017/04/16(日) 23:30:20.32

>>611
jsonとして扱えるようにインターフェース定義にしておいたほうが無難な気がする。
シリアライズしても簡単にもとに戻せるし。

**デフォルトの名無しさん** · 2017/04/17(月) 00:09:50.93

そういうもんですかね？
エラーを表示するだけとは言ってもstatusは正しくセットしなきゃならないわけで、
TypeScriptを使う以上そこも型安全にやりたいってのは自然だと思うんですが。
そこだけtslintの警告をネグるのも気持ち悪いし。

**デフォルトの名無しさん** · 2017/04/17(月) 00:24:52.52

アプリケーションの仕様としてエラー用のクラスを定義します。Errorのサブクラスだったり新規に自前のクラスを用意するかはケースバイケース。
当然途中で変わることもあり得ます。その際はきちんと他のメンバーと情報共有します。

**デフォルトの名無しさん** · 2017/04/17(月) 07:32:40.57

自分は簡単なアプリではHttpErrorみたいなクラスを定義して使ってる。
もっと複雑なアプリだと、業務エラーのコードとHTTPのエラーコードで
もう一階層作ったりもするけど。
だが、これが推奨なやり方なのかは分からん。俺も知りたい。

**デフォルトの名無しさん** · 2017/04/17(月) 08:40:01.39

ありがとうございます。
statusというプロパティにステータスを返すのは決まっているんだからどこかに
出来合いのものがあるかと思ったんですが、やっぱり自前なんですね。

**デフォルトの名無しさん** · 2017/04/20(木) 11:26:28.02

npm linkを駆使してtypescriptでビジネスロジックを外部モジュールにしてるんだけど
tsc -wで自動コンパイルはできるんだけど
定義ファイルも同時に生成するコマンドオプションってないかな？

**デフォルトの名無しさん** · 2017/04/20(木) 11:42:22.36

>>618
すんません -w -dですね。ホント申し訳ない

**デフォルトの名無しさん** · 2017/04/21(金) 21:22:59.73

TypeScriptで動的なキャストみたいなことってできるんでしょうか？

// どこかで定義されたclass
class X {}

interface AX extends X {
a: string;
}

func(x: X) {
if ( xが a: string というプロパティを持っていれば ) {
// ここではxをAXとして扱いたい
}
}

**デフォルトの名無しさん** · 2017/04/22(土) 00:25:56.48

>>620
let ax=<AX>x
でキャスト出来る。
インターフェースが存在するかどうかはチェックはされないから注意。

**デフォルトの名無しさん** · 2017/04/22(土) 10:55:16.81

>>621
ありがとうございました。うまくいきました。

**デフォルトの名無しさん** · 2017/04/26(水) 12:25:16.92

f8appのコード読んでんだけど
flowって驚くほどtypeScriptと似てるね。
んでReduxのアクションな書き方が参考になる。

type ParseObject = Object;

export type Action =
{ type: 'LOADED_ABOUT', list: Array<ParseObject> }
| { type: 'LOADED_NOTIFICATIONS', list: Array<ParseObject> }
| { type: 'LOADED_MAPS', list: Array<ParseObject> }

コレ普通にtypeScriptでも使えた。
interface宣言だとこういう書き方できなけどtype宣言だとできんのね。

**デフォルトの名無しさん** · 2017/04/27(木) 14:10:54.61

いやーTypeScriptって本当にいいものですよね
恥ずかしいソース書いてもコンパイルすればそれなりの形になってますし
全ソースが1つにまとまったjsファイルを見るとカタルシスを覚えます
javascriptを扱うのに最高の言語です

**デフォルトの名無しさん** · 2017/04/27(木) 16:28:37.55

開発用と納品用でコードわけられるとかありがたい

**デフォルトの名無しさん** · 2017/04/27(木) 17:45:10.06

minifyが出来なくて悩んでおります。
Targetをes5にしてもエラーが出る。

**デフォルトの名無しさん** · 2017/04/28(金) 08:31:59.89

>>626
結局該当箇所っぽいところの構造を変えて解決した

case 'Text':
{
let text: Text;
/* ごちゃごちゃした処理*/
text = {
type: 'Text',
value: node.value,
cache: nodeCache
};
return text;
}
ってなってるところで
なぜがtextという変数がminifyで消えずに残っていてエラーになっていたところ

case 'Text':
{
// let text: Text; <―削除
/* ごちゃごちゃした処理*/
let text:Text = {
type: 'Text',
value: node.value,
cache: nodeCache
};
return text;
}

ってしたら治った。

**デフォルトの名無しさん** · 2017/04/28(金) 09:00:40.63

すいませんminifyの件ですが一番の問題は

外部ライブラリとして別にパッケージを作ってnpm linkしていたんですが
その外部ライブラリのtsconfigの設定でtargetをes2015にしていたのが原因のようです。

npm上で公開してるライブラリってes2015のものとes5のものが混ざってるんですかね？もしそうならminifyのとき問題でそう。

そろそろブラウザもes2015に対応してきたし外部ライブラリもes2015でいいんじゃないかと思いましたがまだまだes5のほうがいいんですかねー

**デフォルトの名無しさん** · 2017/04/28(金) 15:19:33.29

Announcing TypeScript 2.3
https://blogs.msdn.microsoft.com/typescript/2017/04/27/announcing-typescript-2-3/

**デフォルトの名無しさん** · 2017/04/28(金) 21:52:24.09

>>628
ちゃんと設定すれば、TypeScriptが変換してくれるんじゃないの？

**デフォルトの名無しさん** · 2017/04/29(土) 00:20:26.49

>>630
targetをes5にしてlibに”dom”と”es2017”を設定したら
ちゃんとminifyもできつつasync await とかobject.assaignとか使えました。

typescriptの問題というよりuglify-jsの問題ってことすね。

**デフォルトの名無しさん** · 2017/04/29(土) 08:40:51.51

>>629
ギャー！！
適用したらエラーだらけになった！！

**デフォルトの名無しさん** · 2017/04/29(土) 09:01:35.78

アンインストールしたらVSでtsファイル開いても識別子の色分けとかインテリセンスが出てこなくなってVSぶっ壊れたわ
再インストールだなこりゃ

**デフォルトの名無しさん** · 2017/04/29(土) 09:05:24.76

2.3アンインストール後に再度2.3インストールしてもぶっ壊れたまま
迂闊に入れないほうがいいなこれ

**デフォルトの名無しさん** · 2017/04/29(土) 14:53:43.74

馬鹿には無理

**デフォルトの名無しさん** · 2017/04/30(日) 09:24:14.29

不細工ハゲが偉そうに

**デフォルトの名無しさん** · 2017/04/30(日) 11:46:36.73

不細工じゃねーし！

**デフォルトの名無しさん** · 2017/04/30(日) 12:00:27.54

相対パスでimportしようとすると from ’../../lib/a’ と書くことが多いのですが
..を何とかしようと思いtsconfigでbaseUrlを設定したところ
from ‘lib/a’とかけるようになって素敵だったんですが
生成したjs側で同じように相対パスを使わない方法にできずjs側からimportできなくなりました。
どうすればいいんですかね

**デフォルトの名無しさん** · 2017/04/30(日) 12:07:35.75

deployしてみ

**デフォルトの名無しさん** · 2017/04/30(日) 13:53:10.60

おい、>>637に突っ込めよ！

**デフォルトの名無しさん** · 2017/04/30(日) 14:18:46.56

ハゲに付ける薬なし

**デフォルトの名無しさん** · 2017/05/01(月) 13:56:45.49

jsonのデシリアライズ等で得られた任意のオブジェクトが指定のinterfaceに適合するかどうか
簡単に判定する方法ってないでしょうか？
実行コストがかかるのはしょうがないので、npmのライブラリでもあれば助かります。

**デフォルトの名無しさん** · 2017/05/01(月) 14:12:45.68

実行時に型情報は取得できないので無理

**デフォルトの名無しさん** · 2017/05/01(月) 14:56:45.23

>>642
俺は各interfaceの定義にtypeを入れてる。

**デフォルトの名無しさん** · 2017/05/01(月) 15:43:26.17

>>642
あーなるほどtypesciptのinterface要件を満たしてるかチェックするライブラリかー。
interfaceに対するメタプログラミングができる仕組みってtypescript側に用意されてんのかな

**デフォルトの名無しさん** · 2017/05/01(月) 16:42:03.86

ランゲージサービスから情報引っ張ってコード生成するまでやればできる

**デフォルトの名無しさん** · 2017/05/01(月) 18:22:52.40

>>642
初心者なんで教えて欲しいんですが
どう言う状況でそう言うのが必要に
なるんですか?

**デフォルトの名無しさん** · 2017/05/01(月) 22:27:57.85

>>643-647
回答ありがとうございます。
外部から入手したany型のオブジェクトに対して、一度型チェックしたらTypeGuardの下で
扱えたら便利だと思ったんですが、そう単純なものはなさそうですね。
interface毎にUser-Defined Type Guard Functionてのを用意するのが今のところ
いちばんシンプルですかね。

**デフォルトの名無しさん** · 2017/05/01(月) 23:04:54.13

>>646
interfaceをparseするの簡単にできたわ
ジェネレータは作れそう。後はObjectをチェックするコードをかければ、、、
そっちがよくわかんないな。

**デフォルトの名無しさん** · 2017/05/02(火) 00:15:01.17

JSON限定でいいならJSON Schema生成するだけじゃね

**デフォルトの名無しさん** · 2017/05/05(金) 00:50:33.95

webpackでtypescript使う時にts-loaderがtypeRootsオプションを認識してくれないような。
自作の定義ファイルを読みに行ってくれない。
結局nodes_modules/@types/においたらうごくんだけど。なんだかなぁ

**デフォルトの名無しさん** · 2017/05/05(金) 10:24:07.07

**デフォルトの名無しさん** · 2017/05/07(日) 12:47:49.44

redux のreducer書く時型付きじゃないと死ぬ。
素のjsでよく書ける人いるなぁ

**デフォルトの名無しさん** · 2017/05/10(水) 22:53:30.65

>>650
これやってみようかと思ったけど、class定義からschema生成するか逆にschemaから生成するか、
どっちがいいか悩ましいなぁ。

**デフォルトの名無しさん** · 2017/05/11(木) 06:23:41.84

JSON Schemaの方が表現力がずっと高いから、
実用的に意味があるのは後者だろうね
型だけなら全部空文字と0とfalseでもいいんだから

**デフォルトの名無しさん** · 2017/05/11(木) 06:40:52.39

JSON Schemaからのdts生成は既存のツールがいくつかあるみたいだな
逆はバリデーションとしてはほぼ無意味かと