es6の新機能であるはずの、変数の埋め込みが効きません

Question

こんばんは
es6から、文字列の中に変数を埋め込めると伺ったのですが、

var name = 'hoge';
console.log('私の名前は${name}'); //私の名前は${name}（そのまま）

になってしまいます。

どこが間違っているのかを教えてください。
よろしくお願いいたします。

Comments

[退会済みユーザー]

テスト環境を示してください。

[mpyw]

本題から逸れますが，基本的には，変数宣言にはlet，定数宣言にはconstを使いましょう．

[dialbird]

CertaiNさん
ご返答ありがとうございます。

失礼いたしました。気をつけます

Answer 1

バッククォートを使って下さい。

var name = 'hoge';
console.log(`私の名前は${name}`);  // "私の名前はhoge"

Re: dialbird さん

Comments

[dialbird]

think49さん
ご返答ありがとうございます。

アドバイス通りにやってみたのですが、結果に変化がありませんでした........
シングルクォートをバッククォートに変えるだけでいいのですよね？

[think49]

バッククォートで括るだけで私の環境では正常動作しています。
回答のコードをコピペしてJavaScriptが他にない状態にしても期待通りに動作しないなら環境を疑った方がよいと思います。
https://jsfiddle.net/53w3asb9/

[dialbird]

返信が大変遅れて申し訳ありません

改めて試したところ、普通にできました。

？？バベルの変換ができていなかったのか、正直なところわかりませんが、結局のところ実現はする様になったので解決しました！ありがとうございます！

Answer 2

ES6はBabelなどを使ってES5に変換してください。

babel Try it out

ES2015(ES6)はstageで分かれていて、どれを使うかによって実装される機能が違います。

Comments

[dialbird]

sakanabiscuitさん
ご返答ありがとうございます！

こんなページがあったとは........
参考になります！

Answer 3

jsファイルの一番上に'use strict';
宣言してますか？

それと、Chrome devツール上のコンソールで何かしらエラーは出ていませんか？
その辺りを確認した結果も質問内容に書いた方が、どこまで検証しているのかこちらも把握できます。

Comments

[think49]

> jsファイルの一番上に'use strict';
GC v49.0.2623.112 m, Fx v45.0.1 では sloppy mode でも期待通りに動作しました。
https://jsfiddle.net/53w3asb9/1/

[dialbird]

yamato_hikawaさん
ご返答ありがとうございます！

エラーは出ていませんでした！

下にも記載しましたが、結局バッククォートで囲んだだけで出た様です。
何が原因だったかはちょっとわからないのですが........

Answer 4

ES6 Template StringsはChromeなら41以上、Firefoxなら34以上でサポートされている模様です。
Windows 10ならEdgeで実装されているかもしれません。
他のブラウザにおいても実装されているかどうかは不明です。

Comments

[dialbird]

m6uさん
早速のご返答ありがとうございます。

私はchromeを使っていて、概要をみたところ、
バージョン 49.0.2623.110 (64-bit)
と出ましたが、これは41以上ということなのでしょうか？
だとしたら出ているはずなのですが........