Javascript文字列補間

| | | | | |

文字列補間JavaScriptは、文字列の一部に式を埋め込むプロセスです。テンプレートリテラルは、式の埋め込みに使用されます。補間により、変数や数学などの値を文字列に追加できます。

JavaScript文字列に値を追加する必要がありますか?文字通りのパターン構文について説明しました。テンプレートリテラルを使用すると、複数行の文字列とネストされたJavaScript値を文字列内で簡単に操作できます。パターンリテラルはJavaScript文字列補間構文です。

このガイドでは、JavaScript文字列補間について説明します。それが何であるか、どのように機能するかを説明し、文字列補間の例を見て始めましょう。

これ以上面倒なことはせずに、始めましょう!

JavaScript補間文字列

テンプレートリテラルを使用して、JavaScript文字列に値を追加できます。これはドル記号の後に2つの中括弧が続きます。中括弧の中には、文字列に値を埋め込みたい式を含める必要があります。

パターンリテラルを使用すると、連結に依存せずに文字列に値をネストできます。パターンリテラルを宣言するには、文字列を二重引用符ではなく一重引用符( ")で囲む必要があります

次の構文を検討してください。

パターンリテラルを宣言しました。式は次のとおりです。

この式は9+10を返します。この式の結果は、ピリオドの前の文字列の最後に追加されます。実際、ピリオドの前に式を記述しました。

補間文字列JavaScriptなど

リテラルテンプレートを使用するとネストされた文字列で直接値に変換します。次のコードを検討してください:

コードの最初の行はプレミアアドレス番号を定義します。次に、リテラルテンプレートを使用します完全なアドレスを作成します。税金${}は、i値をチェーンに統合するために使用されます。文字列に「address_number」の値を追加しました

コードを実行してみましょう:

コードは2つの文字列をマージしました。

パターンリテラルを使用する場合、文字列の意味で値を埋め込むことができます。これには、文字列、数値、またはJavaScriptの数学的計算。テンプレートリテラルをテンプレートリテラルに埋め込まないでください。

リテラル文字列の主な利点の1つは、その構文が明確であり、埋め込むことができることです。 javascriptコードを文字列に直接

連結を使用して文字列を結合できますリング:。

プラス記号(+)を使用して2つの文字列を連結できます。

JavaScriptコンソールは次の値をフィンガープリントします:

2本の紐をつなぐチェーンの作成に成功しました。最終的には、連結演算子を使用して文にピリオド( "")を追加します

ただし、この構文には1つの欠点があります。文字列の最後に値を追加することはできません。これが、リテラルテンプレート構文の導入の背後にある大きな理由です。文字列の途中に値を追加するのが簡単になりました

文字列補間用のJavaScript。計算

テンプレートリテラルのコードはJavaScriptステートメントです。これは、パターンリテラルを使用して 計算を実行し、それらの値をプログラムに埋め込むことができることを意味します。

次のようなチェーンを作成しましょう。 Baréで2杯の飲み物の価格を計算し、結果をチェーンに入れます。

$ {}構文で、計算を追加しました。この計算では、2つのJavaScript変数の値が加算されます。変数はdrink1(2.30)とdrink2(2.20)です。このコードは、次の値の合計を含む文字列を返します。

文字列補間用のJavaScript:三項演算子

JavaScriptの三項演算子< / a>を使用すると、ステートメントが真であるか偽であるかを評価できます。これらは、ifステートメントを記述するためのより簡潔な方法です。三項演算子は、 ifステートメントの結果が1行のコードを取る場合に特に役立ちます

顧客がコーヒーに4.00ドル以上を費やした場合は、請求書に紹介され、カフェのロイヤルティに招待される必要があります。カードクラブ。それ以外の場合は、請求書に提示する必要があります。三元オペレーターを使用して、顧客の請求書のコストを確認できます。

リテラルパターンには、2つの組み込み式が含まれています。 「合計」の値をチェーン内に統合します。次に、三項演算子を使用して、顧客をポイントカードクラブカフェに招待する必要があるかどうかを確認します。

合計購入価格が$4.00を超える場合、コンソールは次のメッセージを出力します。

それ以外の場合、三項演算子はコロン( ":")の後に値を返します..これは、式はFalseと評価されます。

この例では、コロンの後の値は空の文字列です。これは、4.00ドル未満の場合、リテラルテンプレートの最初の文を顧客が購入した場合にのみ返されることを意味します。