ES6相关内容笔记（一）

1.var 和 let 区别

var和let都是用于对于变量声明的操作
但是let的声明与var相比会严格很多
①let作为块级作用域，声明的变量作用域在所在的"{}"中，或者找到最近的{
②let对于作用域内的同一个变量不可重复声明，会产生报错
③let没有变量提升的概念，而var有变量提升的概念
④let暂时性死区：在一个代码块内，如果有某个变量，会绑定该区域，不再受外界的影响
⑤var声明以后 let不能声明，声明也会存在重复声明报错的情况
⑥和let类似的声明const，声明值不可以改变的量 其余规则和let一样

2.字符串扩展

①模板字符串
在变量和常量拼接的时候使用 整个字符串使用${变量}

var stu={
				name:'zs',
				age:12
			}
			txt.innerHTML=`学生的姓名是${stu.name}，年龄是${stu.age}`;

②标签模板
模板字符串不仅仅可以按照上面的这种方式使用。还可以跟在一个函数后面。该函数将被调用来处理这个模板字符串

alert(123);
alert`123`;

以上两个alert弹窗弹出的内容一致

如果使用的是``的话出来的一整个数组

function add(x,y){
				console.log(x,y);
				console.log(arguments)
			}
			add(1,23);
			add`1,23`;

function add(x,y){
				console.log(x,y);
				console.log(arguments)
			}

let a=10;
let b=2;

add`hello${a}welcome${b}${a+b}`

如果使用的是模板字符串调用函数，如果参数是一个常量，此时会把参数解析成一个数组合并成一个参数

如果实参有变量有常量的时候，会自动解析 把常量(用变量隔开的)拼接成一个数组，每一个变量依次拼接到后面

3.解构
解构：es6中允许按照一定模式，从数组和对象中提取值，按照一定的规则，对变量进行赋值

①数组的解构赋值 按照数组的顺序一一赋值

let [a,b,c]=[1,2,4];
console.log(a,b,c);

②交换值

let m=12;
let n='hello';
// 通过解构可以直接交换值
[m,n]=[n,m];
console.log(m,n);

③对象的解构赋值
对象的解构赋值和数组有一个重要的不同，数组的解构是有顺序的，对象的解构没有顺序，由属性来决定
变量名字必须与属性名字一致，才能获取到正确的值

let stu={
	name:'zs',
	age:12
}
let {age,name,address}=stu;
// address相当于声明了，没有赋值
console.log(name,age,address);

④字符串的解构赋值
把字符串中的字符解析一一赋值。如果有多余的不会报错，只是没有对应变量赋值

let[x,y,z]='hello';
console.log(x,y,z);

⑤属性值解构赋值

			let {length:len}='hello';
			console.log(len);

⑥函数参数的解构赋值
类似于数组的解构赋值

function add([a,b]){
		console.log(a,b)
	}
		add([2,3])

4.数组扩展
①类数组转化为数组，forEach遍历数组

var btns=document.getElementsByTagName('button');
btns=Array.from(btns);
btns.forEach(function(item,index,arr){
		console.log(item,index,arr)
	})

forEach只能用来遍历数组，不能用来遍历集合，所以用Array.from(btns)，转化为数组
用forEach来遍历数组中的所有元素。

②声明数组Array.of()
创建10个空数组
var ar=new Array(10)
创建一个数组，包含内容10,20,30
var ar=Array.of(10,20,30)

③find和findIndex

数组.find(function(条件){书写具体条件})得到的结果是第一个符合条件的数组元素的值。查找顺序，从左到右

数组.findIndex(function(条件){书写具体条件})得到的结果是第一个符合条件的数组元素对应的下标。查找顺序，从左到右

④filter方法
数组.filter(function(条件){}) 可以把所有符合条件的数据过滤出来

⑤copyWithin方法

规则1：copyWithin(参数1，参数2，参数3) 复制数组中的一段元素，替换原来的元素 参数1:替换开始的位置 参数2：复制开始的位置 参数3：复制结束的位置 含开始不含结束

规则2：如果复制的元素，超出数组的长度，直接舍弃，不会扩展数组， 复制的元素把原来的元素是替换，不是插入

规则3：数组下标可以是负值 从右到左 最右边的是-1

let score=[98,97,96,86,79,79,80];
score.copyWithin(1,3,6);
console.log(score);
score.copyWithin(0,4,10);
console.log(score);
score.copyWithin(-3,-4,-1)
console.log(score);

5.函数的扩展
①参数的传递

function fn(x,y=3){
	console.log(x*y)
}
fn(3,20);

函数参数的默认值 如果y没有实参，默认值就是3。如果有实参，默认就是实参的值

② rest剩余参数
用于获取函数多余的实参,是一个数组 必须要放置在结尾。

			function add(x,y,...values){
				console.log(x+y);
				console.log(values);

				var arr=values.push(x,y);
				console.log(values)
			}
			// 获取用户所有输入的实参，放在一个数组里面
			add(1,2,3,4);

③箭头函数
去除function ()和{}之间用=>

			setInterval(()=>{
				console.log(111)
			},1000)

			var fn=(x,y)=>{
				console.log(x+y);
			}

			fn(2,3)

如果函数体，只有一句话，可以直接省略{}。如果这句话带有return省略return