Freecodecamp: ES6：テンプレートリテラルを使用して文字列を作成する-テストが失敗する-テンプレート文字列を検出しない

更新：キャンピングカーの1人による調査の結果、ステージングブランチで問題が修正されたようですが、ベータ版には移植されていません。

ステージングで機能することは確認できますが、説明には少し説明が必要だと思います。

同様の問題がありました。 systimoticに同意します。 次のように提案されたテストケースのテキスト変更：

現在：テンプレート文字列が使用されました
提案：テンプレート文字列がmap（）で使用されました

私は今日これを調べましたが、チャレンジは.map（）の使用が必要であることを示しておらず、.map（）を使用する場合と使用しない場合で解決/完了できました。 したがって、これには変更が必要だとは思いませんか？

ポール（@ PolarisTLX）とカイル（@ jklemon17）

最近、 @ mstellalunaのソリューションを使用してこれをチェックし、 ました。 マップを使用することは、おそらくこの課題を完了するための最も簡潔な方法ですが、それをどのように行うかはユーザーに任せるべきだと思います。 makeList関数が何を返すかをユーザーに通知するため、説明に変更が必要かどうかはわかりません。

新しいバージョンでmapが唯一の受け渡しメソッドになっているようです。 次の2つの方法が失敗しました 'テンプレート文字列が使用されました'：

const resultDisplayArray = [
  `<li class="text-warning">${arr[0]}</li>`,
  `<li class="text-warning">${arr[1]}</li>`,
  `<li class="text-warning">${arr[2]}</li>`
];

const resultDisplayArray = [];
  for (let i = 0; i < arr.length; i++) {
    resultDisplayArray.push(`<li class="text-warning">${arr[i]}</li>`)
  }

@yoizfefisch 、その通りです。 これらは両方とも有効な解決策ですが、合格しません。

テンプレートリテラルのテストケースは十分に柔軟ではないようです。

getUserInput => assert(getUserInput('index').match(/\\`<li class=\"text-warning\">\\$\\{\\w+\\}<\\/li>\\`/g)

正規表現は、次の中括弧の前に角かっこを予期していません。ソリューションによってテストが失敗します。 十分に単純な修正である必要があります。 私は正規表現が得意ではありませんが、これにより、上記のようなさまざまなソリューションが可能になります。

\`<li \s*class\s*=\s*(\"\s*text-warning\s*\"|\'\s*text-warning\s*\')\s*>\s*\$\s*\{(\s*\w+\s*|\s*\w+\s*\[\s*[\w]+\s*\]\s*)\}\s*<\s*\/li\s*>\`

ただし、現在のテストのように、一部の文字を2つのスラッシュで二重エスケープする必要がある場所は正確にはわかりません。 このテストを更新してPRを提出することに興味がある人はいますか？

また、問題のチャレンジへの更新されたリンクは次のとおりです。
https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/es6/create-strings-using-template-literals

また、これがまだ問題であることを報告したいのですが、マップは解決策として機能します。

今週初めに展開されたばかりのFCC上のES6の安定バージョンで同じ問題が発生していることを考えると、コードを検討することに疑問があります。誰かが私を助けてくれますか？

これが私のコードです： https ：

この演習ではプッシュは機能しません（または機能しないか、私ではないようです
その他）、. mapメソッドを使用してテストに合格します。

マーククラインハウス
[email protected] [email protected]
206-234-4887

6:10の日、2018年6月3日には、aenkirch [email protected]は書きました：

FCC上のES6の安定バージョンで同じ問題があることを考えると
今週初めに導入されたばかりですが、
コード..誰かが私を助けることができますか？

これが私のコードです： https ：

—
あなたがコメントしたのであなたはこれを受け取っています。
このメールに直接返信し、GitHubで表示してください
https://github.com/freeCodeCamp/freeCodeCamp/issues/16358#issuecomment-394161176 、
またはスレッドをミュートします
https://github.com/notifications/unsubscribe-auth/AQdgL5WB3BsARAzpDfgyWHG8VsYm29yaks5t4-A3gaJpZM4ROiPm
。

それらは、パラメーターとしてresult.failureを渡します。

正解は

//この行の下のコードを変更します
const resultDisplayArray = arr.map（x => <li class="text-warning">${x}</li> ）;

確認済み：

const resultDisplayArray = arr.map((a) => {
  return `<li class="text-warning">${a}</li>`
});

動作します
だが

const resultDisplayArray = [
  `<li class="text-warning">${arr[0]}</li>`,
  `<li class="text-warning">${arr[1]}</li>`,
  `<li class="text-warning">${arr[2]}</li>`
];

動作しません。 また、レッスンではマップについての言及はありません。また、このセクションの後に続く関数型プログラミングのセクションまで、マップはカリキュラムに導入されていません。

@ P1xt同じ問題があります。 ありがたいことに、私だけではありません。

const result = {
  success: ["max-length", "no-amd", "prefer-arrow-functions"],
  failure: ["no-var", "var-on-top", "linebreak"],
  skipped: ["id-blacklist", "no-dup-keys"]
};
function makeList(arr) {
  "use strict";

  // change code below this line
  const resultDisplayArray =
 [`<li class="text-warning">${arr[0]}</li>`, 
  `<li class="text-warning">${arr[1]}</li>`, 
  `<li class="text-warning">${arr[2]}</li>`];
  // change code above this line

  return resultDisplayArray;
}
/**
 * makeList(result.failure) should return:
 * [ <li class="text-warning">no-var</li>,
 *   <li class="text-warning">var-on-top</li>, 
 *   <li class="text-warning">linebreak</li> ]
 **/
const resultDisplayArray = makeList(result.failure);****

私は同じ問題を抱えています

@ richa031上で指摘したように、Array.mapを使用する必要がありますが、アプローチは機能しません。

私が間違って書いたものはありますか？ なぜここでマップ関数を使用しているのですか？

これはばかげた問題ですが、一重引用符も許容できる解決策である場合は、文字列リテラルの間に二重引用符も必要です。

https://github.com/freeCodeCamp/freeCodeCamp/issues/16358#issuecomment -396369730に続き、
これはどちらも機能しないことを付け加えたいと思います。

const resultDisplayArray = [];
  for (let i = 0; i < arr.length; i++) {
    resultDisplayArray[i] = `<li class="text-warning">${arr[i]}</li>`
  }

@kanexteありがとう

チャイムを鳴らして、私も同じ問題を抱えていると言いたかっただけです。 それが私ではないと聞いてうれしいです。 それがすぐに修正されることを願っています。

同じ問題に直面しています。 私はこの挑戦を公式に未完成のままにして、先に進む必要があると思います。 IM（H）O-この課題の範囲では、配列要素をインデックスで参照することが最も洗練されたソリューションであり、マップ/ループを使用するとコードが煩雑になります。

私もこの問題を抱えています。 マップを使用しようとしましたが、次のようなエラーが発生します。

Reactが定義されていません

私もこれを手に入れていると思っていましたが、ここに地図を投げると不必要に難しくなります。

どのようにして問題を解決しましたか@ richa031

P1xtは厳密な配列です。mapはこの課題の鍵ですが、パラメーターとして関数を受け取ることを忘れないでください。

@Tirjasdyn私は同じ問題を抱えています、fccEs6セクションはとても壊れています。 非常に少ない指示。 以前のチャレンジでもmap（）、filter（）、reduce（）の使用方法についての説明はありません。

この問題に対する適切な解決策はありますか？

@ Omerdogan3チャレンジを見ると、これは正しい方法ではありません。目的の出力は
makeList（result.failure）は以下を返す必要があります：

• [
• no-var
、
• var-on-top
、
• 改行
]
ソリューションがコンマまたは '、'を出力しなかったため。

テストケースの正規表現が制限的すぎるという@scissorsneedfoodtooに同意します。

私は正規表現の専門家ではありませんが、これが私が思いついたものです/ <li class="text-warning">\$\{[\w\[\]]+\}<\/li> / g（文字列のバックスラッシュをエスケープせずに）。 これにより、現在の正規表現テストでは許可されていないように見えるブラケット表記arr [i]を使用して配列にアクセスしたループソリューションが可能になります。

const resultDisplayArray = arr.map（（a）=> {
<li class="text-warning">${a}</li>返す
}）; ``

まだInvalid regular expression flags取得しています

Invalid regular expression flags取得します

正しい解決策についてもエラーが発生します。

まだ>無効な正規表現フラグを取得しています

こんにちは、みんな。 この進行中の問題について更新するために時間を割いていただきありがとうございます。 このチャレンジの正規表現テストが最近更新されたので、まもなく本番環境に移行する必要があることを皆さんにお知らせしたいと思います。

まだ無効な正規表現フラグを取得しています：

const resultDisplayArray = arr.map（（a）=> {
<li class="text-warning">${a}</li>返す
}）;

@ mirkocoppola80ええ、それらのマージ/ビルドの頻度はわかりません。 5月30日以降は行われていないと思いますので、変更が有効になるのを待っています。

今日の正規表現フラグが無効で、更新を待っています...

マップやforループなどを試してみましたが、解決策が見つかりませんでした。 あなたはそれを見ることができます、多分重要なアイデアを見つけました。 https://www.youtube.com/watch?v=XzExdQye1Ls

@jsparadacelis私はそのビデオのコードに従います、それは機能しません

こんにちは、私はまだ無効な正規表現フラグを取得しています：

const resultDisplayArray = arr.map（item => <li class="text-warning">${item}</li> ）;

それはまだ機能していません。 ここにライトを頂けますか？

うん、まだこの課題に対する実用的な解決策を見つけることができません

無効な正規表現フラグエラーが発生します。

const resultDisplayArray = arr.map（（msg）=> {
<li class="text-warning">${msg}</li>返す;
}）;

また、以下の無効な正規表現フラグエラーが発生します。

まだ無効な正規表現フラグエラーが表示されます。
https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/es6/create-strings-using-template-literals/

マップとすべてで試してみましたが、無効な正規表現フラグが表示されます

まだ機能していないことを確認

まだ機能していない、むしろイライラする

現在、MAPメソッドも、より単純ですが長いアプローチも機能しません。同じエラー-他のテストに合格しても「無効な正規表現フラグ」

ねえ、誰かが方法を見つけたら、meeeeに言ってください、私はxDを進めることができません（私はそれをスキップできることを知っていますが、ああ私のOCD）

まだ私のために働いていません。

ねえ、私はそれがまだ機能しないと書くためのちょうど別の男です。

これはおそらく修正されており、まだ展開されていないことがわかりましたが、さらに情報が必要な場合に備えて投稿したいと思います。 console.log（）で正しい出力を確認しましたが、私のソリューションは「テンプレート文字列が使用されました」というテストに合格しません。
私のコード：

const resultDisplayArray = arr.map(x => `<li class="text-warning">${x}</li>`);
console.log(resultDisplayArray);

コンソール出力：

// running test
Invalid regular expression flags
// tests completed
<li class="text-warning">no-var</li>,<li class="text-warning">var-on-top</li>,<li class="text-warning">linebreak</li>

まだ動作していません。 const resultDisplayArray = arr.map(num => '<li class="text-warning">${num}</li>');
//テストを実行しています
無効な正規表現フラグ
//テストが完了しました

マップメソッドはまだ機能しません。 返品の有無にかかわらず。

まだ修正を待っています

const resultDisplayArray = arr.map（val => {return <li class="text-warning">${val}</li> }）;

無効な正規表現フラグが発生します。

const resultDisplayArray = arr.map（x => <li class="text-warning">${x}</li> ）;

const resultDisplayArray = [ <li class="text-warning">${arr[0]}</li> 、 <li class="text-warning">${arr[1]}</li> 、 <li class="text-warning">${arr[2]}</li> ];

どちらもうまくいきません。自分のコードだと思いましたが、何かが壊れているようです。

今日それを解決しようとしましたが、それでも機能しません。

エスケープマークも試してみました：

const resultDisplayArray = arr.map（x => <li class=\"text-warning\">${x}</li> ）;

しかし、それはまだ「無効な正規表現フラグ」です

私もそれを解決しようとしましたが、出力として同じ「無効な正規表現フラグ」を取得し続けます。 3つのテストのうち2つは合格ですが、メッセージは引き続き表示されます。

const resultDisplayArray = arr.map（val => <li class="text-warning">${val}</li> ）;

単純なforループも使用して、同じ結果を得ました

まだ修正されていません！ 😢

ええ、私はそれを4つの方法のように書いたのですが、うまくいきません。 そのバスト。 スキップして次に進みます

まだ動作していません..

同じ問題;

const resultDisplayArray = arr.map((a) => { return `<li class="text-warning">${a}</li>` });

「無効な正規表現フラグ」というエラーを返します

まだ機能していないことを確認します。
forEach、for loop、mapを試しました。このチャレンジで何が起こっているのかわかりません。

うん、まだ動作していません。 他の人と同じエラー「無効な正規表現フラグ」が表示されます。
map、forEachなどで試してみました。

できます！ 私は毎週マップで同じ解決策を試しましたが、今では合格です！ やったー！

私も働いた！ :)昨日は機能していませんでした。

確認済みで動作するようになりました

const resultDisplayArray = arr.map((msg) => {
  return `<li class="text-warning">${msg}</li>`;
});

修正していただきありがとうございます。

アレルヤ!! できます

alleluia.finallyは動作します

これは、通常のテンプレートリテラルを使用するだけで、map関数なしで機能するはずです。これにより、追加せずにスペースを保持する方法がわかります。
タグまたは＆nbsp;

以下に、機能するコードを示します:)：

const result = {
成功：["max-length"、 "no-amd"、 "prefer-arrow-functions"]、
失敗：["no-var"、 "var-on-top"、 "linebreak"]、
スキップ：["id-blacklist"、 "no-dup-keys"]
};
関数makeList（arr）{
"厳密に使用";

//この行の下のコードを変更します
const resultDisplayArray = [ <li class="text-warning">${arr[0]}</li> 、
<li class="text-warning">${arr[1]}</li> 、
<li class="text-warning">${arr[2]}</li> ];
//この行より上のコードを変更します

resultDisplayArrayを返します。
}
/ **

• makeList（result.failure）は以下を返す必要があります：
• [ <li class="text-warning">no-var</li> 、
• <li class="text-warning">var-on-top</li> 、
• <li class="text-warning">linebreak</li> ]
  ** /
  const resultDisplayArray = makeList（result.failure）;