大家好，又见面了，我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。
Jetbrains全系列IDE使用 1年只要46元 售后保障 童叟无欺
ES6 模板字符串与解构赋值
- 模板字符串
- 特点
模板字符串可以换行 - 模板字符串中变量表达方式
${变量/表达式}
<script>
//模板字符串
//特点：模板字符串可以换行
//模板字符串里变量的表达方式
//${变量}
//定义 用反引号``标识
let a='${}'
let b=`我是模板字符串 我可以换行 这是我的变量表示方式 ${
a} `
console.log(b);
</script>
例题
//有个数组，有三个路径，根据路径生成上面的li，将li放在ul上
let arry=[` <li>这是第一个li</li> <li>这是第二个li</li> <li>这是第三个li</li> `]
let ul=document.createElement('ul');
ul.innerHTML=arry.join('');
document.body.appendChild(ul);
- 解构赋值
- 特点：
- 可以定义默认值
- 可以嵌套
- 可以不完全解构
- 好处：
不通过遍历，方便快捷的将元素取出来
<script>
//解构赋值
//可以定义默认值
//可以嵌套
//可以不完全解构
//数组用法
let a=[1,2,3]
let [b,c,d]=a;
console.log(b,c,d)//1,2,3
//数组解构赋值时可以嵌套
let s=[[1,2],[3,4]]
let [[s1,s2],[s3,s4]]=s;
console.log(s1,s2,s3,s4)//1,2,3,4
//数组解构赋值可以定义默认值
let b1=[1,2,3]
let [b2,b3,b4=0]=b1;
console.log(b2,b3,b4)//1,2,3
//如果右面的值不为undefined的话，默认值会被覆盖
//两数交换
let num=3;
let num1=5;
[num,num1]=[num1,num]
console.log(num,num1)//5,3
//字符串用法
let str='哈，真的好'
let [a1,a2,a3]=str;
console.log(a1,a2,a3)// 哈 ，真
//对象写法
let p={
name:'xiaoxiao',
age:15
}
let {
name,age}=p //这两个变量不是随便起的，一定要与对象的属性名一致，如果想不一致的话，要在变量的前面加属性名:
console.log(name,age);//xiaoxiao 15
//错误写法
// let {fg,de}=p
// console.log(fg,de)
// 虽然不报错，但是值为undefined
//改正
let {
name:fg,age:de}=p
console.log(fg,de) //xiaoxiao 15
//函数写法
function fn2({
a,b,c}){
//默认，可选参数
console.log(a)//1
console.log(b)//2
console.log(c)//3
}
fn2({
b:2,
a:1,
c:3
})
</script>
- 展开运算符
- 功能：
- 将展开运算符后面的数组展开，也可以遍历
- 用法：
…
//展开运算符
//功能：将展开运算符后面的数组展开，也可以遍历
let num4=[1,2,3,4,5,6]
let num5=[...num4]
console.log(num5)//[1,2,3,4,5,6]
//例
let [num6,num7,...num8]=num4
console.log(num6);//1
console.log(num7)//2
console.log(num8)//[3,4,5,6]
var max=Math.max(...num4);
console.log(max)
例题
例：求数组的最大值
//例：求数组的最大值
let num4=[1,2,3,4,5,6]
var max=Math.max(...num4);
console.log(max)//6
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请联系我们举报，一经查实，本站将立刻删除。
发布者：全栈程序员-站长，转载请注明出处：https://javaforall.net/171830.html原文链接：https://javaforall.net
![树后台数据存储（採用webmethod）[通俗易懂]](https://javaforall.net/wp-content/uploads/2020/11/2020110817443450-480x300.jpg)
