TypeScript のリファクタリング

リファクタリングを実行する

シンボルにキャレットを置き、リファクタリングするコードフラグメントを選択するか、ツールウィンドウ内の項目を選択します。
次のいずれかを実行します。
- メインメニューから ReSharper | リファクタリングを選択し、目的のリファクタリングを選択します。このメニューで使用できるリファクタリングのリストは、現在のコンテキストによって異なります。 ReSharper がコンテキストのリファクタリングを提案できない場合、メニュー全体が無効になります。
- エディター、ファイル構造ウィンドウ、またはその他の ReSharper ウィンドウで、変換したい項目を右クリックし、コンテキストメニューからリファクタリングを選択して、必要なリファクタリングを選びます。
- メインメニューから ReSharper | リファクタリング | リファクタリングを選択するか、 Control+Shift+R を押して、適用可能なリファクタリングのリストを表示し、そのうちの 1 つを選択します。選択項目のコンテキストメニューでリファクタリングを選択することもできます。
- 特定のリファクタリングに割り当てられているデフォルトのキーボードショートカットを使用するか、お気に入りのリファクタリングコマンドにカスタムショートカットを割り当てます。
選択したリファクタリングにユーザー入力が必要な場合は、リファクタリングウィザードが開きます。ウィザードのダイアログはモーダルではないため、ウィザードが開いている間にコードを編集できます。
リファクタリングアクションをロールバックするために、ウィザードにはオプション元に戻すを有効にするには、変更のあるすべてのファイルを編集用に開くが用意されています。このオプションを選択すると、ReSharper は変更されたファイルをすべて新しいエディタータブで開き、リファクタリングのロールバックを有効化できます。この場合、変更を自分で保存する必要があります。このオプションが選択されていない場合、 ReSharper は変更された ファイルを開かずに自動的に保存します。
リファクタリング操作によってコードの競合 (名前の重複、可視性の競合など) が発生する場合、ウィザードはリファクタリングを適用する前の最後のステップで競合のリストを表示します。一部の競合については、ウィザードがクイックフィックスを提案することもできます。詳細については、リファクタリングの競合を解決するを参照してください。

一部のリファクタリングは、エディターでコードを変更した直後に使用できます。詳細については、インプレースリファクタリングを参照してください

型をコピー

このリファクタリングでは、選択した型のコピーを作成し、指定されたモジュールに配置することができます。

フィールドの導入

このリファクタリングでは、選択した式に基づいて新しいフィールドを作成し、式またはコンストラクターで初期化し、現在の型の式の出現を新しく導入されたフィールドへの参照に置き換えることができます。

専用のショートカット Control+Alt+D を使用してこのリファクタリングを呼び出すこともできます。

以下の例では、このリファクタリングを使用して、同じ文字列の 2 つの出現箇所を新しい定数フィールドに置き換えます。

class ErrorHandler {

    alertError() {
        alert("Something has failed...");
    }

    logError() {
        if (typeof window.console != 'undefined') {
            console.log("Something has failed...");
        }
    }
}
                    
   

class ErrorHandler {
    private static errorMessage= "Something has failed...";

    alertError() {
        alert(ErrorHandler.errorMessage);
    }

    logError() {
        if (typeof window.console != 'undefined') {
            console.log(ErrorHandler.errorMessage);
        }
    }
}
                    
   

型エイリアスの導入

このリファクタリングにより、型の組み合わせの型エイリアスを作成し、現在選択されている組み合わせまたは現在のスコープ内のすべての類似の組み合わせをエイリアスに置き換えることができます。

このリファクタリングを呼び出すには、型の交差または結合、リテラル、エイリアス化できるその他のエンティティを選択し、 Control+Shift+R を押すか、メインメニューから ReSharper | リファクタリング | リファクタリング… を選択して、リファクタリングポップアップで型エイリアスを導入するを選択します。現在のコンテキストで選択したエンティティが複数出現する場合は、現在のエンティティを置き換えるか、すべてのエンティティを置き換えるかを選択できます。

型エイリアスのインライン化

このリファクタリングを使用すると、選択した型のエイリアスを削除し、すべての用途をその定義に置き換えることができます。

このリファクタリングを呼び出すには、型エイリアスの宣言または使用を選択し、 Control+Shift+R を押すか、メインメニューから ReSharper | リファクタリング | リファクタリング… を選択して、リファクタリングポップアップで型エイリアスのインライン化を選択します。

変数の導入

このリファクタリングでは、選択した式に基づいて新しいローカル変数または定数を作成し、式で初期化し、最後にメソッドの式のすべてを新しく導入した変数への参照に置き換えることができます。

専用のショートカット Control+Alt+V を使用してこのリファクタリングを呼び出すこともできます。

以下の例では、このリファクタリングを使用して、同じ文字列 "Something has failed..." の 2 つの出現を変数に置き換えます。

function logError() {
    alert("Something has failed...");
    if (typeof window.console != 'undefined') {
        console.log("Something has failed...");
    }
}
                
   

function logError() {
    var message = "Something has failed...";
    alert(message);
    if (typeof window.console != 'undefined') {
        console.log(message);
    }
}
                
   

部分文字列に変数を導入

このリファクタリングにより、文字列の一部を別の変数にすばやく移動できます。

TypeScript 1.4 以降が言語レベルとしてコード編集 | TypeScript | インスペクションページの ReSharper オプションで選択されている場合、リファクタリングによって抽出された部分文字列に新しいテンプレート引数が追加されます。言語レベルが TypeScript 1.3 以下の場合、文字列の連結が使用されます。

リファクタリング前	リファクタリング後 (TypeScript 1.4 以降)	リファクタリング後 (TypeScript 1.3 以前)
var helloWorld = "Hello, World";	let world = "World"; var helloWorld = `Hello, ${world}`;	var world = "World"; var helloWorld = "Hello, " + world;

変数のインライン化

このリファクタリングでは、コード内の変数のすべてをその初期化子で置き換えることができます。リファクタリングは、初期化後に変数値が変更されない場合にのみ適用される必要があることに注意してください。

専用のショートカット Control+Alt+N を使用してこのリファクタリングを呼び出すこともできます。

以下の例では、このリファクタリングを使用して reversed 変数をインライン展開します。

function reverseString(input) {
    var reversed = input.split("").reverse().join("");
    return reversed;
}
                    
   

function reverseString(input) {
    return input.split("").reverse().join("");
}
                    
   

別のファイルに移動する

このリファクタリングを使用すると、選択した型を現在のファイルから既存のファイルまたは新しいファイルに移動できます。新しいファイルに移動する場合は、新しいファイルが自動的に作成されます。現在のファイルにそれ以上型がない場合は、それを削除することができます。必要なすべてのインポートは、その型とともに移動されます。不要になったインポートはすべて元のファイルから削除されます。

フォルダーに移動

このリファクタリングにより、1 つまたは複数の型またはファイルを、ソリューションの任意の場所にある別のプロジェクトまたはフォルダーに移動できます。必要に応じて、リファクタリングが新しいターゲットフォルダーを作成します。移動した型が必要とするすべてのインポートは、新しい場所に固定されます。不要になったインポートはすべて元のファイルから削除されます。

リソースに移動

Visual Studio テンプレート（例: Apache Cordova）から作成された TypeScript プロジェクトでは、ReSharper により文字列リテラルをリソースファイルに移動できます。 ReSharper は、必要に応じて、目的のスコープ内のすべての同一文字列を検索し、リソース使用箇所に置き換えることができます。このリファクタリングを実行するには、プロジェクトに少なくとも 1 つのリソースファイル（通常は .resjson 拡張子）が必要です。

専用のショートカット F6 を使用してこのリファクタリングを呼び出すこともできます。

型を別のモジュールに移動する

このリファクタリングは、選択された型の周囲にモジュール宣言をラップします。

名前変更

TypeScript では、最も時間のかかるリファクタリングの 1 つがサポートされています。シンボルの名前を変更すると、手動で変更しようとすると、多くの問題が発生する可能性があります。 Rename リファクタリング（専用の F2 ショートカットでも利用可能）を呼び出すと、すべてのチェックが ReSharper によって実行されます。競合が存在しない場合はすべての変更がスムーズに実行されるか、必要な適切な変更のみが行われるように手動で解決できる競合のリストが表示されます。

2026 年 6 月 12 日