${}占位符需要和模板字符串配合使用。
ES2015新增此语法结构。
浏览器支持：
（1）.IE9+浏览器支持占位符。
（2）.edge浏览器支持占位符。
（3）.火狐浏览器支持占位符。
（4）.谷歌浏览器支持占位符。
（5）.opera浏览器支持占位符。
（6）.safria浏览器支持占位符。
上面已经对占位符做了简单的介绍，但是还需要明晰如下两个问题：
一.什么是占位符：
首先解决第一个问题，大家知道站位是什么意思，比如让同学在自习室占个座位。
占位符的功能大致也是如此，${}占位符也是为某一个数据结构占据位置。
二.占位符必要性：
在ES2015之前，如果在字符串中插入一个JavaScript表达式，需要使用如下形式：
|
1
2
|
let
address=
"北京"
;
let
str=
"船长位于"
+address+
"，哈哈哈"
|
上面代码将变量address插入到字符串中，需要使用+进行字符串连接。
如果插入的数量较多，或者说较为复杂的操作，那么上面的方式将十分繁琐，不人性化。
再来看一下利用占位符对上面功能的实现，代码实例如下：
|
1
2
3
|
let
address=
"北京"
;
let
str=`船长位于${address}，哈哈哈`;
console.log(str);
|
代码运行效果截图如下：
| 船长位于北京，哈哈哈 |
上面代码很自然的利用占位符将变量插入到字符串中。
特别说明：这里的字符串不是普通字符串，而是模板字符串。
|
1
2
3
4
5
|
let
func=(url)=>{
return
url;
}
console.log(str);
|
代码运行效果截图如下：
| 本站的url地址是https://www.cnblogs.com/watermelons |
占位符中的表达式是对函数的调用，函数返回一个字符串。
|
1
2
3
|
let
arr = [
"是"
,
"船"
,
"长"
,
"啊"
];
let
str = `${arr}`;
console.log(str);
|
代码运行效果截图如下：
| 是，船，长，啊 |
输出值是"是，船，长，啊"，可能会有朋友对这个结果有疑问。
占位符中是数组，但是这个数组所处的上下文环境是字符串。
那么就隐身调用toString方法将其转换为字符串。