关于ES6的学习：_()=>console.log

变量提升实例：
num=6；var num = 7；
量值的修改就是要改变内存地址；
let:
使用let声明的变量，其作用域范围为该语句所在函数内部，且存在变量提升现象（不存在变量提升，值可更改）；

if(ture){
	let a = 10;
if(ture){
	let a=20;
}
console.log(a);
}
/*这段代码就很好的体现了何为块级作用域的概念*/
1
2
3
4
5
6
7
8

const:
使用const声明的是常量，且后面出现的代码中不能再修改常量的值（不存在变量提升，值不可更改）；在声恒定不变的值的时候，推荐使用const声明变量，效率更高；
1.简单数据类型：简单数据类型的值不可更改；

const a= 2;
const a =3;
console.log(a);

2.复杂数据类型：复杂数据类型值可更改，但不可从新赋值；
var arry = [1,2,3,4];
arry[0]=2;
console.log(atty[0]);
/*输出是没有问题的，而且值也被改变*/
arry=[];
/*报错，不可从新赋值*/

1
2
3
4
5
6
7
8
9
10
11
12
13

var:
使用var声明的变量，其作用域为该语句所在的函数内，且存在变量提升现象（存在变量提升，值可更改）；

num = 1;
//变量提升
var num = 2 ;
//值更改
var num = 3;
1
2
3
4
5

解构赋值：按照一一对应的关系从数组中赋值给变量；

数组解构：

let art = [1,2,3,4];
let [a,s,d,f] = art;
console.log(a);
console.log(s);
console.log(d);
console.log(f);
但如果存在：
let art = [a,s,d,f,g,h,j];
/*那么,g,h,j输出的值为undefined*/		

1
2
3
4
5
6
7
8
9
10
11

对象解构：利用变量名匹配对象属性，匹配成功后将对象属性值赋值给给变量

let pet = [name:'1',age:'12'];
let {name,age} = name;
console.log(name);
console.log(age);
另外一种赋值：用右边的变量值赋值给左边对象值，
let pet = [name:'1',age:'12'];
let {name:myname,age:muage} = name;
console.log(myname);
console.log(muage);
1
2
3
4
5
6
7
8
9
10

箭头函数：用于简化函数定义的语法 方法体()=>{}
实例：

const fn = ()=>{
console.log(123);
}
/*调用箭头函数*/
fn();
/*如果箭头函数中，只有一句代码，并且代码的执行结果就是函数的返回值，那么函数的大括号可以省略*/
const num = (n,m)=> n + m;
/*如果箭头函数中，只有一个形参，那么函数的小括号可以省略*/
const fn = v =>{
console.log(v);
}
1
2
3
4
5
6
7
8
9
10
11
12

箭头函数的this指向问题：

/*箭头函数不绑定this，箭头函数没有自己的this关键字，this关键字将指向箭头函数定义位置中的this*/
function fn(){
	console.log(this);
if(ture){
	()=>{console.log(this);}
	}
}
constobj = {name:'cole'}
/*fn()继承obj,改变指向*/
const like = fn().call(obj);
like();	
1
2
3
4
5
6
7
8
9
10
11
12

经典题目：

var obj ={
	age:'12',
	say: ()=>{console.log(this.age);}
}
/*调用函数里面的方法，求输出的值*/
obj.say();
/*结果毫无疑问输出undefined,因为对象里面是没有作用域的，所以肯定不能产生this，那么this就指向了window，而window里面是没有age属性的，只能输出undefined*/
1
2
3
4
5
6
7
8

剩余参数：
从名字上就知道肯定是实参大于形参产生的情况，在ES6中，若一个函数中形参的数量少于实参，最后一个形参会以数组形式存储多余的实参；
实例：

/*在新形参前面加三个点变为数组*/
Const arr = (...n)=>{
	Let num = 0;
	N.forEach(item => num + = item);
	Return num;
};
Console.log(arr(10,20));
Console.log(arr(10,20,30,40));

针对数组的用法:剩余参数跟解构配合使用
Let arr = [1,2,3,4,5,6]
Let [‘a’,’s’,’d’,...’f’] = arr;

console.log(a)
console.log(s);
console.log(d);
console.log(f);
/*最后一个参数会以数组的方式把剩余的参数接受*/

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

扩展运算符：

声明数组：
Let arrt = [1,2,3,4]
Console.log(...arrt);
可以拆分为以逗号分隔的参数序列；
作用:合并数组；
实例：
Let  arry1 = [1,2,3]
Let  arry2 = [4,5,6]
Let  arry3 = [...arry1,...arry2]
也可以利用push()方法实现数组元素追加；
Let arry3 = arry1.push(...arry2);
可以将伪数组转变成真数组：
Var divs = document.getElememtsByTagName(‘div’);
Console.log(divs);
Divs.push(‘a’);
伪数组转变成真数组另外一个方法from()：
Var 		arrayLike = {
‘0’ : ‘’张三,
‘1’ : ‘’张四,
‘2’ : ‘’张五,
}
Var arry = Array.from(arrayLike);
Console.log(array);
From()方法也可以接受第二个参数：

Var 		arrayLike = {
‘0’ : ‘’张三,
‘1’ : ‘’张四,
‘2’ : ‘’张五,
}

Var arry = Array.from(arrayLike,item =>item*2);
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32

数组中的find()方法：

Var 	arrayLike = [
{id:1,name:’张三’},
{id:2,name:’张四’}
]

Var target = arrayLike.find( item => item.id==2 );
Console.log(target);
1
2
3
4
5
6
7

数组中的findIndex()方法：

Var arrt = [1,2,3,4,5]
Var lik= arrt.findIndex((value,index) => value>3);
Console.log(lik);

数组中的includes()方法：查询数组是否包含函数，包含返回true，反之false；
[1,2,3,4,5].includes(2);
[1,2,3,4,5].includes(6);

1
2
3
4
5
6
7
8

模板字符串：

1.方便对字符串的拼接
Let name = “老钟”;
Let con = `你叫$(name)嘛？`
Console.log(con);

1
2
3
4
5

2.模板字符串的拼接可以进行换行操作

Let result = {
name :”zhong”,
age : “20”
}
Let html = `
<div>
	<span>${result.name}</span>
	<span>${result.age}</span>
</div>	`;
Console.log(html);

1
2
3
4
5
6
7
8
9
10
11

3.模板字符串可以调用函数；

const fn = () => {
        return '我是模板'
    }
      	let html = `我是模板字符串${fn()}`;
        console.log(html);

1
2
3
4
5
6

判断字符串的开头跟结尾：

startsWith():表示参数字符串是否在原字符串的头部，返回布尔值；
endsWith():表示参数字符串是否在原字符串的尾部，返回布尔值；
let str = “asdasdsadsadsad”;
Str.startsWith(‘asda’);	
Str.endsWith(sad);
1
2
3
4
5

字符串的repeat()方法;

let kes = ‘xxx’;
Console.log(kes.repeat(10));
Repeat();形参为重复该字符串多少次；

1
2
3
4
5

Set（）

Const s1 = new Set();
Console.log(s1.size);
/*可以接受数组为形参*/
Const s2 = new Set([1,2,3,4,5]);
Console.log(s2.size);//输出为5，证明里面存储着五个数值
Const s3 = new Set([2,2,3,4,5]);
Console.log(s3.size)//输出为4。里面会自动过滤重复的数据
/*可以利用这个来建立新的数组*/
Const arry = [...s3];
Set()数据结构：
Add(value);
Const num =new set();
Num.add(1);

delete(value);
Const num =new set();
Num.delete(1);

has(value);
Const num =new set();
Num.delete(1);

clear();
Const num =new set();
Num.clear(1);

取set（）中的值：
Const s = new Set([1,2,3]);
S.forEach(value =>console.log(value););
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30