timg (1).jpg
ES6中允许使用反引号 `` 来创建字符串
可以嵌入变量
可以原生输出
1、拼接字符串
<script type="text/javascript">
var num=Math.random()
console.log('你想要的数字是'+num) //ES5拼接字符串
console.log(`你想要的数字是${num}`<br>) //ES6拼接字符串
</script>
</body>
image.png
2、运算输出
（1）ES5输出
<script type="text/javascript">
//es5
var a=5
var b=15
var res=a+'+'+b+'='+(a+b)
document.write(res+'<br>')
</script>
image.png
（2）ES6输出
<script type="text/javascript">
//es6
var a=15
var b=30
var res1=`${a}+${b}=${a+b}`
document.write(res1)
</script>
image.png
（3）小案例 获取随机颜色 用ES6来获取变量
<div></div>
<div></div>
<div></div>
<div></div>
<script type="text/javascript" src="jquery-3.3.1.min.js"></script>
<script type="text/javascript">
$(function () {
var len=$('div').length;
for(var i=0;i<len;i++){
//rgb()里面的三个值
var x=Math.random()*255;
var y=Math.random()*255;
var z=Math.random()*255;
$('div').eq(i).css('background-color',`rgb(${x},${y},${z})`);
}
})
</script>
<style type="text/css">
div{
display: inline-block;
margin:50px 50px;
width: 100px;
height: 100px;
border-radius: 50px;
box-shadow: 0px 5px 20px #999;
}
</style>
</body>
image.png
