ES6知识点简单总结
简单的总结一下es6中新增的知识点，好久之前简单学过，最近又看视频自己学了一些，简单的总结一下。
1.let关键字
- let声明的变量只能在所处遇到的快级有效。
- 不存在变量提升。
- 暂时性死区，不受外部代码影响。
在一个大括号中使用let关键字声明的变量才具有块级作用域，var关键字不具有这个特点
2.const关键字（声明常量）
- 具有块级作用域。
- 使用const关键字声明的常量必须赋值。
- 常量赋值后值不能更改。
| var | let | const |
|---|---|---|
| 函数级作用域 | 块级作用域 | 块级作用域 |
| 变量提升 | 不存在变量提升 | 不存在变量提升 |
| 值可更改 | 值可更改 | 值不可更改 |
3.解构赋值
含义：es6中允许从数组中提取值，按照对应位置对变量赋值，对象也可以实现赋值
1.数据结构：允许我们按照一一对应的关系从数组中提取值然后将值赋值给变量。例如：
let ary = [1,2,3];
let [a,b,c] = ary;
console.log(a)//1
console.log(b)//2
console.log(c)//3
2.对象结构：对象结构允许我们使用变量的名字匹配对象的属性，匹配成功将对象属性的值赋值给变量。
例如：
let person = {
name:'lisi',
age:30,
sex:'男'
}
let {name , age, sex}=person;
console.log(person)
4.箭头函数
箭头函数：（）=> {函数体}
const fn =（）=> {
console.log(123)
}
fn();
函数体中只有一句代码，且代码的执行结果就是函数的返回值，‘{}’ 大括号可省略：
const sum = （n1,n2）=> {
return n1+n2;
};
等于
const sum =（n1,n2）=> n1+n2;
如果形参有一个，小括号也可省略，
function fn（v）{
return v;
}
等于
const fn = v => v;
箭头函数不定义this，箭头函数没有自己的this关键字，如果在箭头函数中使用this，this关键字将指向箭头函数定义位置中的this
5.剩余参数
function sum(first,...args){
console.log(first)
console.log(args)
}
sum(10,20,30)
…args将所有的剩下的参数接受
2.剩余参数与解构解构配合使用
let students = ['z','b','c']
let [s1,...s2] = students;
console.log(s1);//
console.log(s2)
6.扩展运算符
1.定义：可以将数组或者对象转换为用逗号分隔的参数序列
例：
let ary = [1,2,3];
console.log(...ary);
没有逗号了是因为逗号被当成console.log的参数分隔符了
2.可用于合并数组
法一
let ary1 = [1,2,3];
let ary2 = [3,4,5];
let ary3 = [...ary1,...ary2]
console.log(ary3)
法二
let ary1 = [1,2,3];
let ary2 = [3,4,5];
// let ary3 = [...ary1,...ary2];
// console.log(ary3)
ary1.push(...ary2);
console.log(ary1)
3.扩展运算符可将数组转换为真正的数组
<body>
<div>1</div>
<div>2</div>
<div>3</div>
<div>4</div>
<div>5</div>
<div>6</div>
<div></div>
<script>
var oDivs = document.getElementsByTagName('div');
console.log(oDivs)
var ary = [...oDivs];
console.log(ary);
</script>
</body>
7.Array扩展方法
1.构造函数方法：
let arraylike ={
'0':'a',
'1':'b',
'2':'c',
length:3
}
let arr2 = Array.from(arraylike)
console.log(arr2)
2.Array实例方法：find
用于找出第一个符合条件的数组成员，如果没有找到返回underfind
var arr = [{
id:1,
name:'张潮'
},{
id:2,
name:'老师'
}];
let target = arr.find(item => item.id == 2);
console.log(target)
3.Array实例方法：findIndex
用于找出第一个符合条件的成员的位置，如果没找到返回-1
let ary = [1,5,10,15]
let index = ary.findIndex((value,index)=> value>9);
console.log(index);
4.Array实例方法：includes
表示某个数组是否包含给定的值，返回布尔值
let ary = ['a','b','c'];
let result = ary.includes('a')
console.log(result)
8.模板字符串
let name= 'giao哥'
let sayHello = `你给我里giaogiao，大家好，我是${name}`;
console.log(sayHello)
1.模板字符串中可以调用函数
let result= {
name:'giao哥',
age:30,
sex:'男'
}
let html = `
${result.name}
${result.age}
${result.sex}
`;
console.log(html)
2.在模板字符串中可调用函数
const sayHello = function () {
return '小鸟伏特加，整这高';
};
let greet = `${sayHello()}`;
console.log(greet);
9.startswith与endswitch
startswith判定某参数字符串是否在字符串的头部
endswitch判定某参数字符串是否在字符串的尾部
let str = 'hello giao哥';
let e1 = str.startsWith('hello');
console.log(e1)
let e2 = str.endsWith('giao哥');
console.log(e2)
