模板字面量可以将它理解为加强版的字符串;通过反引号进行定义;
实例:
<script>
let model=`模板字面量利用反引号标识`
console.log(model);
// 模板字符串的写法可以直接用${value}嵌入表达式;
let a = 10,
b = 30;
result=`现在是上午 ${a} 点 ${b} 分 `;
console.log(result)
// 查看原始类型
console.log( typeof result)
</script>
控制台打印结果:
标签函数是用来定义模板字面量中插值的行为;第一个参数必须是模板字面量中原始字符串的内容组成的数组;从第二个开始,与模板字面量中的插值一一对应。
实例展示:
<script>
let people=6,
age=8;
str = `商品数量: ${people} 单价: ${age} 总计: ${people * age}`;
console.log(str);
function show(strings,people,age){
console.log(strings);
console.log(people,age);
let s = `${strings[0]}${people}
${strings[1]}${age}
${strings[2]}${people*age} `
return s;
}
let res = show `人数: ${people} 年龄:${age} 年龄一共:${people * age}岁`;
console.log(res);
</script>
控制台打印结果:
解构是es6的一种语法规则,将一个对象或数组的某个属性提取到某个变量中;
解构赋值是允许使用数组或对象字面量的语法将数组和对象的属性赋值给各种变量。
对象解构
实例:
<script>
// 对象解构
const user = {
name: "qing",
adress:"重庆",
};
let {name,adress}=user;
name= "qing";
adress="重庆";
console.log(name,adress);
</script>
打印结果:
数组结构
数组实质上就是一个对象,我们可以用解构对象的方式来解构数组;
实例:
<script>
// 数组解构
const number=[12,13,14,15,16];
let[n1,n2,n3,n4]=number;
console.log(n1,n2,n3,n4);
// 不完全解构
[a, ...b]=[1,2,3];
console.log(a,b);
[a,b,c,d]=[1,2,3]
console.log(a,b,c,d);
[a,b,c=666]=[1,2]
console.log(a,b,c);
</script>
打印结果: