javascriptで数字と文字を一緒に出力したいのですができません

Question

<input type="text" id="k" value="">←好きな数字を入力してください<br>
答え：<input type="text" id="ans1" value=""><br>
<input type="button" value="計算" onclick="fncCalc();"><br>

<script>
function fncCalc(){
var x = 7823.38;

x = parseInt(x);

var k = document.getElementById('k').value;

document.getElementById('ans1').value = ( k - 300 ) * 28.8 + x;
}

上記のままだと数字は出力できるのですが
文字も一緒に出力したいと思ってるのですがなかなか上手くいきません

例えば

'料金は' + ans1 + '円です'　みたいにしてもうまくいきません

料金は1000円です←こんな感じしたいのですが

詳しい人教えてください

Comments

[yambejp]

「文字も一緒に出力したい」の意味がわかりません。説明をお願いします。（xに何らかの文字列が入っているのでしょか？）

[kei344]

（質問文は編集できます）質問文のコードはそれぞれコードブロックで囲んでいただけませんか？ ```（バッククオート3つ）で囲み、前後に改行をいれるか、コードを選択して「<code>」ボタンを押すとコードブロックになります。

[otn]

意味不明なので、「こういうコードを書くと、こういう結果になるが、自分が欲しいのはこういう結果である」という風に書いてください。

[m.ts10806]

現在の質問内容では要件が伝わりにくく回答が得られにくいように思います。質問テンプレートをご活用ください。https://teratail.com/help/question-tips#questionTips3-8

[otn]

『「こういうコードを書くと、こういう結果になるが、自分が欲しいのはこういう結果である」という風に書いてください』という意味が分からないんですかね？どう言えば伝わるんだろう？

[otn]

「'料金は' + ans1 + '円です'　みたいにしてもうまくいきません 」のコードとその結果を書いてください。かな？

Answer 1

ES2015(ES6)のテンプレート文字列は変数を埋め込むことができる、

`${}` // の中には、変数や計算式を入れることができます、 

例えば、

function fncCalc() {
  var k = 400; 
  var x = 'jpy'; //　例えば、'jpy'文字列を追加したい
  document.getElementById('ans1').value = `${(k - 300 ) * 28.8} ${x}`;　// テンプレート文字列
 }
// 出力は '2880 jpy'

Comments

[TreesShimi]

上手く出来ました！！
回答ありがとうごさいます！！