4

コードをリファクタリングするときに変数の名前を変更する必要があることがよくありますが、現在は正規表現を使用してややハックな方法で行っています。 「require」などの類似した名前の副作用を回避します。

このことについて考えてみてください: これは正規表現を使用して DOM を変更するようなものです: それは機能しません。

Esprima のような AST とコード構造変更ツールについて学びました。変数の名前を変更するツール、Esprima ベースなどはありますか?

4

3 に答える 3

4

1.把握.js

http://graspjs.com/がまさにこれを行っているようです。

grasp selector --replace replacement file.js

たとえば、'el' を 'element' に名前変更するには:

grasp '#el' --replace 'element' index.js

公式の把握.置換ドキュメント。

2.vsコード

Visual Studio Codeには、実際の代替ツールも含まれています。トークンを右クリックして、シンボルの名前変更を選択するだけです。

ここに画像の説明を入力

于 2014-01-14T10:27:21.157 に答える
1

あなたが「ツール」を求めていることは知っています。しかし、esprima 自体と esprima の上にあるさまざまな汎用ツールだけを使用して、独自の名前変更プログラムを作成する方がよいと思います。とても簡単で、より細かく制御できるからです。以下は、わずか 12 行のコードの完全な例です。escodegen と estraverse の両方を github で使用しており、私が見る限り、esprima と組み合わせて使用​​する「標準」のようなものです。esprima は基本的に解析関数文字列 -> 抽象構文木を提供しますが、escodegen は基本的にその逆、つまり抽象構文木 -> 文字列を提供します。また、estraverse は traverse メソッドを使用して「ツリーをたどる」ため、分析または変更に役立ちます。

ここにコード：

function rename(code, renamingObj){
    var ast = esprima.parse(code);
    function callback(node){
        if (node.type==='Identifier') {
            if (node.name in renamingObj){
                node.name = renamingObj[node.name];
            }
        }
    }
    estraverse.traverse(ast, { enter: callback });
    return escodegen.generate(ast);
}

テストケース：

function blah(x,y){
    var difference = x + y;
    var product    = x - y;
    var sum        = x * y;
    return 42;
}
var renamingObj = {
    sum        : 'product',
    difference : 'sum',
    product    : 'difference'
};

それを実行します：

rename(blah.toString(), renamingObj)

出力：

function blah(x, y) {
    var sum = x + y;
    var difference = x - y;
    var product = x * y;
    return 42;
}

何か特別なことをしている場合は、ツールのドキュメントをふるいにかけるよりも、上記のコードを変更する方が簡単です。

于 2019-11-07T13:58:01.527 に答える