[typescript] タグが付いた質問
TypeScriptは、JavaScriptに上位互換性を保ちつつ静的型付けなどを加えた言語です。JavaScriptに変換されます。このタグは、TypeScriptに固有の質問用です。通常のJavaScriptの質問には使用されません。
220
質問
8
票
1
回答
1,389
閲覧数
TypeScript で文字列と数値の加算(連結)を禁止か検出したい
+ 演算子に文字列と数値を与えると、TypeScript でも JavaScript と同じように、数値が文字列に変換され、連結されます。
console.log( "123" + 456 )
// 出力 -> 123456
これを禁止するか、検出して警告を出すような事はできないでしょうか。
例えば、 * 演算子では文字列から数値への暗黙の型変換が行なわれず、...
8
票
2
回答
2,998
閲覧数
TypeScriptで初期値を指定して変数を設定すると==演算子でエラーになる時がある
TypeScriptが以下の挙動をする理由を教えてください。
TypeScriptのバージョンは2.2.1、Visual Studio Codeを使用しています。
var hoge:boolean = true;
var fuga = hoge==false ? 123 : 456;
このコードだとhoge==falseの部分がエラー
error TS2365: Operator '=...
5
票
2
回答
782
閲覧数
TypeScriptの配列インデックスにある"+"(プラス記号)は何を表す?
Angular(stable v8.2.9)のチュートリアル入門 - ルーティング - ルーティング情報を使う - セクション3をさらっています。下記のソースコードが載っているのですが、3行目の"+"はどういう意味があるのでしょうか。
"+"を除いてもうまく動作しているように見えます。
ngOnInit() {
this.route.paramMap.subscribe(params =&...
5
票
1
回答
3,420
閲覧数
デシリアライズしたプロパティからオブジェクトをつくりたい
サーバーとJSONを用いて通信するWebアプリケーションをTypescriptで書いています.JSONにシリアライズ/デシリアライズするとき,JSONにメソッドが含まれないので,デシリアライズしたデータを使ってオブジェクトを作ろうと考えたのですが,いい方法が分かりません.
今は次のようなコードを書いています.
class Pen{
constructor(public color: ...
5
票
1
回答
1,326
閲覧数
AngularをTypeScriptで書いているのですが、サービスをcontrollerに注入して関数を呼び出したいのですがうまくいきません。
AngularをTypeScriptで書いているのですが、サービスをcontrollerに注入して関数を呼び出したいのですがうまくいきません。
期待する定義と動作は
○サービスとコントローラclassを分ける。
○DIされたコントローラからサービスに定義されている関数を呼ぶ(ここではadd()です。)
○console.logとして出力されればいいです。
※...
4
票
1
回答
236
閲覧数
typescriptで指定した文字列のどれかを返す関数を定義したい
typescriptで書いています。あるアプリケーションでサポートする言語(locale)が限定されていて、システムがそれ以外のlocaleを返したらデフォルトのlocaleにフォールバックするための関数を書きたいです。
/* currentLocaleがSupportedLocaleだったら */はどう書けばいいのでしょうか?
type SupportedLocale = 'ja' | 'en';...
4
票
1
回答
384
閲覧数
カリー化された関数のJSDocの記述方法がわからない
例えば以下のようにカリー化された関数のJSDocはどのように記述すればよいのでしょうか?
export const someCurriedFunction = (arg1: number) => (
arg2: number,
arg3: number
) => (arg1 + arg2 + arg3);
3
票
2
回答
7,635
閲覧数
TypeScript で単一のクラスを import する方法
TypeScript で外部モジュールを使用しています。
あるモジュールの指定したクラスだけを使いたい場合にモジュール名を指定せずに済む方法はあるでしょうか。
具体例を挙げると、次のような形ではなく、
// mymodule.ts
export class Klass {}
// index.ts
import m = require('./mymodule');
klass = new ...
3
票
1
回答
218
閲覧数
Emacsのorg-babelでTypeScriptを書くとき、tsconfig.jsonはどこに置けば?
Emacsでorg-babelを使って、文書の中にTypeScriptのコード例を埋め込んでいます。
.emacs.d/init.elに追加したのは以下の行です。
(eval-after-load "org" '(org-babel-do-load-languages 'org-babel-load-languages '((typescript . t))))
(...
3
票
2
回答
2,333
閲覧数
TypeScriptで既存の型を拡張する場合にthisの型を考慮したい
typescriptで既存の型を拡張する場合 interfaceを使って例えばsum関数であれば
interface Array<T>{
sum():number;
}
Array.prototype.sum = function(){
return this.reduce((i,j)=>i+j)
};
このように書けますが、上記の場合 number|...
3
票
1
回答
506
閲覧数
babelでtypescriptをコンパイルするのとtscでtypescriptをコンパイルするのにどのような違いがありますか?
babelでもpluginを用いればtypescriptをコンパイルできますが、tscを用いてコンパイルするのとは何が違うのでしょうか?
jsとtsが混在していてもtypescriptのtsconfigで allowJs を有効にすればtscでjavascriptもtypescriptもコンパイルできるので、素人目にはほとんど同じことができるような気がしています。
...
3
票
1
回答
661
閲覧数
JESTでPromiseの再帰処理をテストする方法
JESTでPromiseの再帰処理をテストする方法がわかりません。
JESTを用いてテストを書いています。
このテストではPromiseが解決されるまで、再帰処理を行うretry関数がテストの対象です。
export function retry<T>(fn: () => Promise<T>, limit: number = 5, interval: ...
3
票
1
回答
1,075
閲覧数
TypeScript の名前空間を使った場合の外部モジュール設定
解決できそうで出来ないので質問させてください。
JSのライブラリとして提供するものを TypeScript でつくっています。
ライブラリ内部でファイル分割したいのですが
import したオブジェクト(名前空間?)に対して ts(2339) で型定義できないからと怒られてビルドできません。
次のようなことを行いたいと思っています。
hogeライブラリを使う場合には次のように動いてほしい。
...
3
票
1
回答
632
閲覧数
TypeScript + AngularJSでのng-file-uploadモジュールの使用方法
TypeScriptとAngularJS + ng-file-uploadモジュールを使った開発の質問です。
現在、以下のリポジトリで開発を行っています。
http://github.com/aiya000/EndrollMate.git
こちらの動作確認は以下の手順で行えます。
$ git clone http://github.com/aiya000/EndrollMate.git &...
3
票
1
回答
90
閲覧数
TypeScriptでenumを使用して型を当てたい。
enumをリテラル型のような使い方は出来ないのでしょうか?
enum UserIds {
'たけし' = 1,
'かける' = 2,
'みさと' = 3,
}
// 1, 2, 3以外の数値はエラーになってほしい
const userId: UserIds = 30;
console.log(userId);
リテラル型を type UserIds = 1 | 2 | 3; ...
3
票
1
回答
1,055
閲覧数
プロジェクトの外からTypeScriptで実装されたVueコンポーネントをインポートする時にエラーTS2345 を予防する
プロジェクト・ディレクトリの外からvue-property-decoratorで実装されたVueコンポーネントをインポートしてみて、TypeScriptコンパイルの時に下記のエラーが出ました:
TS2345: Argument of type '{ template: string; components: { SimpleCheckbox: typeof SimpleCheckbox; }; }...
2
票
2
回答
637
閲覧数
オブジェクトの型付けの際にプロパティ名にワイルドカードのようなものを使用できるか
以下のような感じでプロパティ名にワイルドカードをつけて型付けをする方法はあるのでしょうか。
※以下のコードはエラーがでます
type Image = {
url*: string;
[key: string]: string;
}
const images: Image[] = [{
url123: ["path/to/a", "path/to/b&...
2
票
2
回答
217
閲覧数
typescript で即値に対して型を制約したい
type Entry = [string, string]
上記のような、 Entry 型が定義されていたとします。
(実際的な想定としては、 config 系の型でよく見かける気がします。)
この type に対して、以下のコードは問題なく動きます。
type Entry = [string, string]
const entries1: Entry[] = [
['foo', ...
2
票
1
回答
248
閲覧数
HH/MMの型を'01' | '02' | '03' | ... | '60'で定義するTypeScriptの良い書き方募集
time {
HH: string
MM: string
}
のようなオブジェクトが存在していて、HHとMMはAPIから文字列で取得すると仮定します。
HHとMMには'01'...'60'のゼロ埋めされた文字列の数字のみが代入できるようにしたいです。
やろうと思えばHH: '1' or HH: 'aaaa'のようなゼロ埋めしてない文字列やアルファベットが入ってしまうのでいやです。
HH: ...
2
票
2
回答
175
閲覧数
TypeScriptアロー関数型の引数名 this
TypeScript3.8.3 と Visual Studio Code 1.44.2 を利用しています。
const div = document.createElement("div");
div.onclick = (arg1) => {};
としたとき、 arg1 の型は MouseEvent と推論されました。
次に、 div.onclick の定義を見てみると、lib....
2
票
1
回答
4,694
閲覧数
TypeScriptでインデックスアクセス時のundefinedを回避したい
下記のコードで、オブジェクトは 'undefined' である可能性があります。ts(2532)
と、test[i].vの部分でエラーになってしまうのですが、原因がさっぱりわかりません。
コードの書き方で回避する方法はありますでしょうか?
// test.ts
type TestArray = {
v: string;
}
let test: TestArray[] = [];
for (...
2
票
2
回答
924
閲覧数
@types/reactとreactのversionが違うと問題でしょうか
create react appで作られたversion 16のreact applicationにtypescriptを追加しています。
@types/reactと@types/react-domのversionについて、最新のv.18をインストールしたのですが、本体とversionが異なることが問題となるか教えていただきたいです。
2
票
1
回答
412
閲覧数
ルックアップ型と可変長引数の組み合わせで型推論がうまく行かない
困りごとから先に書くと、下記コードの return fn(...args); の部分でエラーが発生し、それがどうやっても取れません。原因は何でしょうか?
const table = {
add: (a: number, b: number) => a + b,
square: (a: number) => a * a,
} as const;
type Table = ...
2
票
2
回答
187
閲覧数
2つのnullableなプロパティが同時にnullにならない場合の型定義
TypeScriptの型定義に関する質問です。
ここに両者ともnullableなプロパティを持ったクラスがあったとします。
class Example {
foo: string | null;
bar: string | null;
}
このクラスでは、foo と bar が同時に null になることはなく、また逆に同時に string 型になることはあるとします。
...
2
票
1
回答
214
閲覧数
aws-sdk-js で定義されている型が正しいか分からない
AWSのS3クライアントモジュールにて、下記関数があるのですが、この書き方だとerrが確実にcallbackに入ってくるので、err?: Errorとなっているべきではないか、
と考えてしまいます。
upload(params: S3.Types.PutObjectRequest,
options?: ManagedUpload.ManagedUploadOptions,
...
2
票
1
回答
4,079
閲覧数
typescriptでdate-utilsモジュールのimportができない
import * as dt from 'date-utils'
単に上記のような形でimportを行った時に発生します。
エラーの内容から、tsconfig.jsonに問題があるように思えないのですが、何が原因なのでしょうか?
Error:(1, 21) TS2497: This module can only be referenced with ECMAScript imports/...
2
票
3
回答
478
閲覧数
継承先クラスでは実装されているかも知れないメソッドを基底クラス内で扱いたい
昔JavaScriptで書いた変なコードをTypeScriptに置き換えようとしています。ですが Property 'g' does not exist on type 'BaseClass'. というエラーを回避できません。
オリジナルのコードのロジックを改変せずに、型定義や修飾子の追加で移行する方法を知りたいです。
class BaseClass {
h() {
/*...
2
票
1
回答
516
閲覧数
TypeScriptのGenericsの使いどころや考え方?について
TypeScriptのドキュメント等を読んでいてGenericsの所まで来たのですが、どういったものなのかイマイチつかめず質問します。
(ActionScript3でのinterfaceとの違いやメリットが解らない?同じようなものなのか、全く違うものなのか)
たとえば_allLength変数に数値を足していくような処理を書くとして、TypeScriptでGenericsを使うと
var ...
2
票
1
回答
1,863
閲覧数
TypeScriptでAPIから返ってきたオブジェクトの配列に型を定義したい
下記のURLにアクセスするとGitHubリポジトリのデータがJsonファイルで返されるのですが、配列の中に複数オブジェクトが入ってる物にどのように型を定義すれば良いか教えて頂けないでしょうか?
https://api.github.com/repositories/354726603/contents/articles
この記事を参考に出来ると思ったのですが、返ってくるデータが[{},{},{}.....
2
票
1
回答
87
閲覧数
あるオブジェクト、型を限定したキー名を指定する型の書き方について
TypeScriptの型の指定で困っています。以下のような toMap という関数でコンパイルを通すことができません。
const toMap = <T extends {}>(items: T[], key: keyof T) => {
const map = {};
items.forEach((item) => {
map[item[...
2
票
1
回答
568
閲覧数
TypeScriptのgenericsを使ったReactコードのコンパイルが通らなくて困っています
再現コードは最小限にシンプルにしたので、意味自体はありません。
interface TextProps { data: { text: string }; }
interface ObjProps { data: object; }
const Para: React.FC<TextProps> = ({ data }) => <p>{data.text}</...
2
票
1
回答
104
閲覧数
noImplicitAny:true 設定時のobjectのアクセスについて教えて下さい
"noImplicitAny": trueの設定で以下のコードを書いています
let tables = [
'a',
'b',
'c'
];
let select_columns = {
'a': ['a1', 'a2'],
'b': ['b1', 'b2'],
'c': ['...
2
票
1
回答
476
閲覧数
IntelliJ IDEA の File Watcher で typescript を階層を維持してはき出したい
動画を参考にしたり、
Youtube: TypeScript Project Structure using File Watchers
「File Watcher」 の設定画面より Arguments 部分を下記に設定したりしていろいろ試したのですが、空ファイルで出力されてしまったり、特定ファイル以外はうまくはきだせないなど。うまくいく設定が見つかりませんでした。
--out
$...
2
票
0
回答
54
閲覧数
nuxt2 tiptapを導入してビルド(yarn build)が出来ない: Cannot find name 'type'
概要
nuxt.jsを使ってLP作成のエディタを作成しようとtiptapというエディタのライブラリを入れたのですがビルド時(yarn build)にエラーになるので解消したい。
仕様技術、前提
vue2
nuxt2
typescript
導入ライブラリ
package.jsonの差分を記載(yarn addで追加)
"@tiptap/extension-color":...
2
票
1
回答
173
閲覧数
Promise の配列に対して、それを早い順で resolve する async generator に変換したい
今、 Promise の配列があったとき、その resolve の早い順に await したいと思っています。 ES2021 に、 for await of の構文が導入されたので、 Promise の配列をその早い順に resolve してくれる async generator に変換するライブラリなどの関数があれば、やりたいことが実現できるな、と思っています。
// 例
const ...
2
票
1
回答
97
閲覧数
Typescript で作成しているアプリのクラスのメソッドが自分の想定通りに動きません。
学習のためReact+Typescriptでブラウザで動くチェスのアプリを作成しています。駒を動かす動きは自分の想定通りに動くものができたのですが、キャスリングの動き(キングとルークという二つの駒を同時に動かす)を実装しようとした際に作ったメソッドが自分の想定通りに動きません。
// --snip--
export abstract class Piece {
position: ...
2
票
0
回答
220
閲覧数
関数の戻り値を受けた変数が型推論されない
以下のコードで、関数の戻り値が Promise<Foo> なので await した foo の型は Foo になると思ったのですが any になってエラーが出ます。なぜですか。
コード
type Foo = {
bar: string | undefined;
};
const getFooPromise = async (prevBar?: string | undefined)...
2
票
0
回答
103
閲覧数
ジェネリクスのクラスを引数に取るとき、デフォルト引数を取る方法を教えてください。
ジェネリクスを new するには {new(): T} すればよいということを、以下のドキュメントで知りました。
https://github.com/Microsoft/TypeScript/wiki/FAQ#why-cant-i-write-typeof-t-new-t-or-instanceof-t-in-my-generic-function
しかし、ジェネリクスのクラスを引数に取るとき、...
2
票
0
回答
76
閲覧数
NestJS(TypeORM)でsyncronizeされてしまう
こんにちは。TypeORMを使用してNestJSで開発してます。
DB接続~開発まで問題なく繋がってはいるのですが。
この度、table(Entity)の即時反映を止め、Migrationで変更を管理しようとしています。本家ページを見るとsynchronize:trueに設定しているとEntityが変わったらBindingされDBにも即時適用されるとの事でこちらをfalseにしてみました。
ただ、...
2
票
1
回答
2,376
閲覧数
typescriptで循環import(WARNING in Circular dependency detected)を解決するには?
例えば下記のようなシンプルな循環参照があります。
DepartmentSearchDialogComponent.ts
import UserSearchDialogComponent from './user-search-dialog.component';
export class DepartmentSearchDialogComponent {
// ...
}
...
2
票
0
回答
96
閲覧数
vscodeのエクスプローラ表示で、任意のファイルの背景色だけを動的に変更する方法
下記関連ですが、
サイドバーのエクスプローラの背景色変更方法
vscodeのサイドバーのエクスプローラ上のソースツリーにて、
任意のファイルの背景色だけを動的に変更したいのですが、実現方法が分かりません。
typescriptのロジックイメージとしては、こんな感じです↓
エクスプローラ上のソースツリー内でファイルXXXを探索し、
ファイルが存在した場合、ファイルXXXの背景色表示だけを変更する。
...
1
票
3
回答
375
閲覧数
valueの型を指定したオブジェクトからkeyof typeofでkeyのユニオン型を作る
valueの型を指定したオブジェクトがあります。
export type SingleTextEditorParamList = {
title: string;
value: string | undefined;
onSubmit: (text: string) => Promise<void>;
note?: React.ReactNode;
};
...
1
票
1
回答
146
閲覧数
dialogタグを配置場所の理由が知りたい。
質問内容
提示コードの<!-- ここに置きました -->ですがこの場所に提示コード下部のコード<!--########-->部のコードを置いたのですが。プログラムは実行できdialogタグがJavascriptを通して画面に表示されるのですがその後閉じるタグである<buttonタグのクリックしても閉じません。しかし<!--########-->...
1
票
1
回答
9,128
閲覧数
javascript/typescriptにて文字列から特定の値を抜き出し変数に格納する
let title1 = "2017年 3月号 / No.98";
let title2 = "2017年 10月号 / No.105";
上記のような文字列を格納した変数があり、この中から年の値(2017)をyear、月の値(3 or 10)をmonth、No.の値(98 or 105)をnumberといった変数に格納する場合、どのような正規表現を利用し、取得すれば良いでしょうか?
...
1
票
1
回答
186
閲覧数
TypeScriptとjestの組み合わせでエラーが出る
TypeScriptをjestで単体テストを行うべく環境構築中ですが、下記のエラーが出ていて対策が分かりません。
「tests/index.test.ts」は空ファイルになっています。
FAIL tests/index.test.ts
● Test suite failed to run
/home/tatuto/Node-RED/jest-test/node_modules/...
1
票
2
回答
533
閲覧数
ReactでAxiosを使用し結果を表示する仕組みで、mapのエラー(TS105)となる
Reactを始めたばかりで質問がおかしければ申し訳ございません
単純にAxiosで取得した結果を画面に列挙するだけのを勉強しています
以下のコードです
import React, { useState } from 'react'
import axios from 'axios';
const searchGoogleBooks = async (searchString: string) =&...
1
票
1
回答
774
閲覧数
typeやinterfaceを使用せず、複数ある引数に型を付与したい。
typeやinterfaceを使用せず、複数ある引数に型を付与しする方法をご教示いただけないでしょうか。
下記は子コンポーネントにstateとsetStateを渡しているデモです。
demo
デモでは子コンポーネントの引数の型はtypeで記述しています。
引数が複数の場合かつ少ない場合だとtypeやinterfaceで定義するのは冗長かと思い、...
1
票
2
回答
274
閲覧数
TypeScriptでオプション引数を指定しつつ、Function#lengthに正規の値を入れる方法
JavaScript(ECMAScript)において、Function.prototype.length は必須パラメータの数を返します。
Function.length - JavaScript | MDN
ECMAScriptでオプション引数を指定するには、arguments もしくは「rest parameter」を使用する方法があります。
arguments は class ...
1
票
1
回答
762
閲覧数
typescriptでform要素を取得したい
実現したいこと
valueの取得
発生している問題・エラーメッセージ
プロパティ 'value' は型 'Element' に存在しません。
該当のソースコード
document.querySelector("#id").value
試したこと
補足情報(FW/ツールのバージョンなど)
typescript:4.7.4
tsc:4.6.4
esnext
1
票
2
回答
275
閲覧数
TypeScriptで引数のかっこが3つある関数
引数の括弧が3つある下記のような関数を見かけたのですが、これはどのような時に使用されるのでしょうか。
なぜ通常の const hoge =(h1, h2) => {} という書き方との違いはなんでしょうか。
何も出力されないです。
const hoge = (h1) => (h2) => () => {
console.log(h1);
console....