web-dev-qa-db-ja.com

ES6 Raw String Accessの実際の用途は何ですか?

ECMAScript 6で導入されたString.raw Raw String Accessの実際の用途は何ですか?

// String.raw(callSite, ...substitutions)

function quux (strings, ...values) {
    strings[0] === "foo\n"
    strings[1] === "bar"
    strings.raw[0] === "foo\\n"
    strings.raw[1] === "bar"
    values[0] === 42
}

quux `foo\n${ 42 }bar`

String.raw `foo\n${ 42 }bar` === "foo\\n42bar"

以下のドキュメントを読みました。

http://es6-features.org/#RawStringAccess

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/template_strings

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/raw

http://www.2ality.com/2015/01/es6-strings.html

https://msdn.Microsoft.com/en-us/library/dn889830(v = vs.94).aspx

私が理解している唯一のことは、テンプレート文字列の生の文字列形式を取得するために使用され、テンプレート文字列のデバッグに使用されることです。

これがリアルタイム開発で使用できるのはいつですか?彼らはこれをタグ関数と呼んでいました。どういう意味ですか?

どの具体的なユースケースが欠けていますか?

29
Venkat.R

String.rawの最も良い、そしてほとんど唯一の使用例は、重要なバックスラッシュを含むテキストを受け入れるSteven Levithanの XRegExp library のようなものを使用しようとしている場合と考えることができます。 String.rawを使用すると、JavaScript自体の正規表現リテラルのように、バックスラッシュを2倍にすることを考える必要がなく、意味的に明確な何かを書くことができます。

たとえば、私がサイトでメンテナンスを行っていて、これを見つけたとします。

var isSingleUnicodeWord = /^\w+$/;

...これは、文字列に「文字」のみが含まれているかどうかを確認するためのものです。 2つの問題:A)人間の言語の領域には\wが認識しない "Word"文字が何千もあり、その定義は英語中心であるためです。 B)_が含まれています。これは、多くの(Unicodeコンソーシアムを含む)が「手紙」ではないと主張します。

したがって、サイトでXRegExpを使用している場合、\pL(Unicodeカテゴリの場合は\p、 "文字"の場合はL)をサポートしていることがわかっているため、すぐに次のように置き換えます。

var isSingleUnicodeWord = XRegExp("^\pL+$"); // WRONG

次に、文字列リテラルによって消費されているため、なぜ機能しないのか、facepalm、戻ってそのバックスラッシュをエスケープします。

単純な正規表現では十分簡単ですが、複雑なものでは、バックスラッシュを2倍にすることを覚えておくことは、メンテナンスの面倒です。 (Java使用しようとしているプログラマ Pattern と尋ねるだけです。)

String.rawを入力してください:

let isSingleUnicodeWord = XRegExp(String.raw`^\pL+$`);

例:

let isSingleUnicodeWord = XRegExp(String.raw`^\pL+$`); // L: Letter
console.log(isSingleUnicodeWord.test("Русский"));      // true
console.log(isSingleUnicodeWord.test("日本語"));        // true
console.log(isSingleUnicodeWord.test("العربية"));      // true
console.log(isSingleUnicodeWord.test("foo bar"));      // false
<script src="https://cdnjs.cloudflare.com/ajax/libs/xregexp/3.1.1/xregexp-all.min.js"></script>

今、私はただキックバックして、私が意味することを書きます。置換を行うためにテンプレートリテラルで使用されている${...}構造について心配する必要はありません。なぜなら、量化子{...}を行末のアサーション($)は...低いです。だから私は置換をうまく使うことができ、それでもバックスラッシュを心配する必要はありません。素敵です。


とは言っても、もし私がそれをたくさんやっていたら、関数を書いて、String.raw自体ではなくタグ付きテンプレートを使用したいと思うでしょう。しかし、正しく行うのは驚くほど厄介です。

// My one-time tag function
function xrex(strings, ...values) {
  let raw = strings.raw;
  let max = Math.max(raw.length, values.length);
  let result = "";
  for (let i = 0; i < max; ++i) {
    if (i < raw.length) {
      result += raw[i];
    }
    if (i < values.length) {
      result += values[i];
    }
  }
  console.log("Creating with:", result);
  return XRegExp(result);
}

// Using it, with a couple of substitutions to prove to myself they work
let category = "L";                                // L: Letter
let maybeEol = "$";
let isSingleUnicodeWord = xrex`^\p${category}+${maybeEol}`;
console.log(isSingleUnicodeWord.test("Русский"));  // true
console.log(isSingleUnicodeWord.test("日本語"));    // true
console.log(isSingleUnicodeWord.test("العربية"));  // true
console.log(isSingleUnicodeWord.test("foo bar"));  // false
<script src="https://cdnjs.cloudflare.com/ajax/libs/xregexp/3.1.1/xregexp-all.min.js"></script>

多くの場所で使用する場合は、面倒な価値があるかもしれませんが、簡単なものについては、String.rawの方が簡単なオプションです。

13
T.J. Crowder

テンプレート文字列は、以下で説明する多くの状況で役立ちます。これを考慮して、String.rawはエスケープが解釈されないようにします。これは、エスケープ文字を含めたいがエスケープしたくないテンプレート文字列で役立ちます。簡単な例は次のとおりです。

var templateWithBackslash = String.raw `someRegExp displayed in template /^\//`

内部には、テンプレート文字列について注意すべきいくつかの点があります。

  1. 問題なくエスケープされていない改行を含めることができます。
  2. 「$ {}」を含めることができます。これらの中括弧内では、代わりにJavaScriptが解釈されます。

(注:これらを実行すると、結果がコンソールに出力されます(ブラウザー開発ツールの場合))

改行を使用した例:

var myTemplate = `
<div class="myClass">
  <pre>
    My formatted text
    with multiple lines
    {
      asdf: "and some pretty printed json"
    }
  </pre>
</div>
`
console.log(myTemplate)

JavaScriptで通常の文字列を使用して上記を実行したい場合は、次のようになります。

var myTemplate = "\
<div class="myClass">\
  <pre>\
    My formatted text\
    with multiple lines\
    {\
      asdf: "and some pretty printed json"\
    }\
  </pre>\
</div>"
console.log(myTemplate)

最初のコードはおそらく見栄えがよくなります(改行をエスケープする必要はありません)。

2番目の場合は、同じテンプレート文字列を使用しますが、かなり印刷されたJSONも挿入します。

var jsonObj = {asdf: "and some pretty printed json", deeper: {someDeep: "Some Deep Var"}}
var myTemplate = `
<div class="myClass">
  <pre>
    My formatted text
    with multiple lines
    ${JSON.stringify(jsonObj, null, 2)}
  </pre>
</div>
`
console.log(myTemplate)
3
Goblinlord

まず、いくつかのこと:

  • テンプレート文字列は、テンプレートリテラルの古い名前です。
  • タグは関数です。
  • String.rawはメソッドです。
  • String.raw foo\n${ 42 }barはタグ付きテンプレートリテラルです。
  • テンプレートリテラルは、基本的には凝った文字列です。
  • テンプレートリテラルは補間できます。
  • テンプレートリテラルは、\を使用せずに複数行にすることができます。
  • エスケープ文字\をエスケープするには、String.rawが必要です。

改行文字を含む関数を介して、改行文字\nを含む文字列を入力してみてください。

console.log("This\nis\nawesome"); // "This\nis\nawesome"
console.log(String.raw`This\nis\nawesome`); // "This\\nis\\nawesome"

疑問に思っている場合、console.logはその1つではありません。しかし、alertはそうです。 http://learnharmony.org/ でこれらを実行してみてください。

alert("This\nis\nawesome");
alert(String.raw`This\nis\nawesome`);

ただし、それはString.rawの使用ではありません。

String.rawメソッドの可能な使用法:

  • バックスラッシュ文字(\ n、\ t)などを解釈せずに文字列を表示するには.
  • 出力のコードを表示します。 (以下の例のように)
  • \をエスケープせずに正規表現で使用されます。
  • \\をあまり使用せずに、windows director/sub-directoryの場所を印刷するには。 (彼らは\を覚えています。また、笑)

ここでは、出力とコードを単一のアラートウィンドウに表示できます。

alert("I printed This\nis\nawesome with " + Sring.raw`This\nis\nawesome`);

ただし、元の文字列を取得することが主な用途である可能性があれば、すばらしいと思います。のように:

var original = String.raw`This    is     awesome.`;

originalThis\tis \tawesome.になります。悲しいことにそうではありません。

参照:

2
user900360

使用

(必要な知識:tstring § ​​。)

の代わりに:

_console.log(`\\a\\b\\c\\n\\z\\x12\\xa9\\u1234\\u00A9\\u{1234}\\u{00A9}`); 
_

。あなたはできる:

_console.log(String.raw`\a\b\c\n\z\x12\xa9\u1234\u00A9\u{1234}\u{00A9}`);
_

「逃げる」

<_\\u_>は問題ありませんが、<_\u_>は「エスケープ」する必要があります。例:

_console.log(String.raw`abc${'\\u'}abc`);
_

.Dit <_\\x_>、<_\x_>、<console.log(String.raw`abc${`\\x`}abc`)>;

。<_\`_>、<_`_>、<console.log(String.raw`abc${`\``}abc`)>;

。<_\${_>、<_${&_>、<console.log(String.raw`abc${`$\{`}abc`)>;

。<_\\1_>(<_\\7_>まで)、<_\1_>、<console.log(String.raw`abc${`\\1`}abc`)>;

。<_\\_>、エンドユニット<_\_>、<console.log(String.raw`abc${`\\`}`)>。


Nb

新しい「latex」文字列もあります。 Cf § ​​。

0
Pacerier

NodeJSでは、ファイルパスの処理に関して非常に便利です。

var fs=require('fs');
var s =  String.raw`C:\Users\<username>\AppData\Roaming\SomeApp\someObject.json`;
var username = "bob"
s=s.replace("<username>",username)
fs.readFile(s,function(err,result){
    if (err) throw error;
    console.log(JSON.parse(result))
})

Windowsでのファイルパスの読みやすさが向上します。 \もかなり一般的なセパレータであるため、一般的にそれが役立つ理由がはっきりとわかります。しかし、それはかなり愚かです\はまだエスケープします `...したがって、最終的に:

String.raw`C:\Users\` //#==> C:\Users\`
console.log(String.raw`C:\Users\`) //#==> SyntaxError: Unexpected end of input.
0
Sancarn

RegExpsのテストに役立つことがわかりました。コメントを削除したいので、行末のコメントと一致するはずのRegExpがあるとします。しかし、///のような正規表現のソースコードと一致してはなりません。コードに///が含まれている場合、JavaScript構文の規則に従って、EOLコメントの始まりではなく、RegExpになります。

変数patEOLCのRegExpが以下と一致するかどうかをテストできます。

String.raw`/\//` .match (patEOLC)

つまり、ソースコードからメモリに読み込まれた後、すべてのバックスラッシュを削除してメモリに存在する方法ではなく、コードをソースコードに存在する方法でコードを「参照」できるようにする方法です。

これは「エスケープエスケープ」する方法ですが、文字列内のすべてのバックスラッシュに対して個別に行う必要はありませんが、それらすべてに対して同時に行うことができます。

これは、与えられた(逆引用符で囲まれた)文字列のバックスラッシュが他の文字と同じように動作し、特別な意味や解釈はないという言い方です。

0
Panu Logic