33

たとえば、リクエストのいくつかの URL パラメータを記述する複数行の es6 Template-String があるとします。

const fields = `
    id,
    message,
    created_time,
    permalink_url,
    type
`;

そのバックティック Template-String 内にコメントを含める方法はありますか? お気に入り：

const fields = `
    // post id
    id,
    // post status/message
    message,
    // .....
    created_time,
    permalink_url,
    type
`;
4

4 に答える 4

86

オプション 1: 補間

空の文字列を返す補間ブロックを作成し、その中にコメントを埋め込むことができます。

const fields = `
  id,${ /* post id */'' }
  message,${ /* post status/message */'' }
  created_time,
  permalink_url,
  type
`;

console.log(fields);

オプション 2: タグ付きテンプレート

タグ付きテンプレートを使用すると、コメントをクリアして文字列を再構築できます。以下は、 、、および正規表現 (多少の作業が必要) を使用してコメントをクリアし、クリーンな文字列を返す単純なcommented関数です。Array.map()String.replace()

const commented = (strings, ...values) => {
  const pattern = /\/{2}.+$/gm; // basic idea

  return strings
    .map((str, i) => 
      `${str}${values[i] !== undefined ? values[i] : ''}`)
    .join('')
    .replace(pattern, '');
};

const d = 10;
const fields = commented`
  ${d}
  id, // post ID
  ${d}
  message, // post/status message
  created_time, // ...
  permalink_uri,
  type
`;

console.log(fields);

于 2016-10-14T15:39:56.680 に答える
14

私はそれが古い答えであることを知っていますが、上記の答えを見ると、純粋な質問に答え、次に質問者の質問の精神に答えなければならないと感じています.

テンプレートのリテラル文字列でコメントを使用できますか?

はい。はい、できます。しかし、それはきれいではありません。

const fields = `
    id, ${/* post ID */''}
    message, ${/* post/status message */''}
    created_time, ${/*... */''}
    permalink_url,
    type
`;

''Javascript に挿入する式があるように、 (空の文字列)を 中括弧に入れる必要があることに注意してください。${ } そうしないと、実行時エラーが発生します。引用符は、コメントの外のどこにでも置くことができます。

私はこれの大ファンではありません。ほとんどの IDE でコメントの切り替えが難しくなることは気にしないでください。

個人的には、可能な限りテンプレート文字列を使用します。テンプレート文字列は通常の文字列よりも数分の 1 効率的であり、必要なすべてのテキストをほとんどエスケープせずに文字通りキャプチャするためです。そこに関数呼び出しを入れることさえできます！

上記の例の文字列は少し奇妙で、探しているものには役に立たない可能性がありますが、最初の改行、カンマとコメントの間に余分なスペース、および余分な最後のスペースがあるためです。改行。その不要なスペースを削除すると、パフォーマンスがわずかに低下する可能性があります。ただし、速度と効率のために正規表現を使用できます...詳細は以下のとおりです...

.

質問の意図に答えるために：

すべての行にコメントを付けて、コンマ区切りのリスト文字列を作成するにはどうすればよいですか?

const fields = [
    "id", // post ID
    "message", // post/status message
    "created_time", //...
    "permalink_url",
    "type"
].join(",\n");

配列への参加は1つの方法です...（@jared-smithが提案したように）

ただし、この場合、配列を作成してから、join()関数の戻り値のみを割り当てると、整理されたデータをすぐに破棄します。それだけでなく、配列内の各文字列のメモリ ポインターを作成しています。これは、スコープの終わりまでガベージ コレクションされません。その場合、配列をキャプチャして、使用の指示に従ってその場で結合するか、テンプレート リテラルを使用して、ghostDoc スタイルのように実装に別のコメントを付ける方が便利な場合があります。

各行に引用符を付けたくないという欲求を満たすためにテンプレートリテラルのみを使用しているようで、URL とコードを参照する際の「文字列」クエリパラメーター間の認知的不協和を最小限に抑えています。これにより改行が保持されることに注意する必要があります。代わりに考えてみましょう:

/****************
 * Fields:
 *   id : post ID
 *   message : post/status message
 *   created_time : some other comment...
 */
const fields = `
    id,
    message,
    created_time,
    permalink_uri,
    type
`.replace(/\s/g,'');

これは、正規表現を使用してすべての空白を除外し、リストの読み取りと再配置を維持します。正規表現リテラルが行っているのは、空白をキャプチャすることだけであり、replace メソッドはキャプチャされたテキストを次のものに置き換えます''(g最後に、最初に見つかった一致 (この場合は最初の改行文字) で停止しないように正規表現に指示します)。

または、最も厄介なことに、コメントをテンプレートリテラルに直接入れて、正規表現でそれらを削除することもできます。

const fields = `
    id, // post ID
    message, // post/status message
    created_time, // ...
    permalink_uri,
    type
`.replace(/\s+\/\/.*\*\/\n/g,'').replace(/\s/g,'');

その最初の正規表現は、次のすべてのインスタンスを検索して空の文字列 ( ) に置き換え''ます: 2 つのスラッシュの前にある 1 つ以上の空白文字 (各スラッシュはバックスラッシュでエスケープされます) の後に空白と改行文字が続きます。コメントを使用したい場合/* multiline */、この正規表現はもう少し複雑になり.replace()、最後に別のものを追加する必要があります:

.replace(/\/\*.*\*\//g,'')

その正規表現は、\n改行を削除した後にのみ実行できます。そうしないと、正規表現が複数行ではないコメントと一致しなくなります。それは次のようになります。

const fields = `
    id, // post ID
    message, /* post/
                status message */
    created_time, // ...
    permalink_uri,
    type
`.replace(/\s+\/\/.*\n/g,'').replace(/\s/g,'').replace(/\/\*.*\*\//g,'');

上記のすべてにより、次の文字列が生成されます。

"id,message,created_time,permalink_uri,type"

正規表現を 1 つだけ使用してそれを行う方法はおそらくありますが、実際にはここでは範囲外です。さらに、自分で遊んで正規表現に夢中になることをお勧めします。

これについては、後でhttps://jsperf.com/をアップしようと思います。私は今とても興味があります！

于 2018-01-31T02:54:57.397 に答える
2

テンプレート文字列を使用しないでください。

const fields = [
    'id',  // comment blah blah
    'message',
    'created_time',
    'permalink_url',
    'type'
].join(',');

初期化時に配列とメソッド呼び出しのコストを支払います (JIT がそれを完全に最適化するほど賢くないと仮定します。

ssube が指摘したように、結果の文字列は改行や空白を保持しません。それがどれほど重要であるかによって異なります。必要に応じて手動で ' ' と '\n' を追加するか、インライン コメントはそれほど必要ないと判断します。

アップデート

プログラムデータを文字列に保存することは、一般的に悪い考えであることに注意してください。代わりに、名前付き変数またはオブジェクトプロパティとして保存してください。あなたのコメントは、あなたがたくさんのものをURLクエリ文字列に変換しているだけであることを反映しているので:

const makeQueryString = (url, data) => {
  return url + '?' + Object.keys(data)
    .map(k => `${k}=${encodeURIComponent(data[k))}`)
    .join('&');
};

let qs = makeQueryString(url, {
  id: 3,
  message: 'blah blah',
  // etc.
});

これで、変更、理解、再利用が容易になり、コード分析ツール (選択した IDE のツールなど) に対してより透過的なものになりました。

于 2016-10-14T15:28:45.277 に答える