JS高级语法基础（四）

ES6新增语法

let的使用

特点：
1、用let声明的变量只在块级作用域内有效（防止循环变量变成全局变量）；
2、没有变量提升（必须先声明，再使用）；
3、暂时性死区（全局变量传不进来）

const的使用

特点：
1、具有块级作用域；
2、声明变量时必须赋值；
3、常量赋值后，值不能更改，但可以更改数据结构内的值，比如：

const array = [100,200];
array[0] = 'a';
array[1] = 'b';
console.log(array);//['a','b']

但不能更改为：array = [‘a’,‘b’]

解构赋值

ES6中允许从数组或对象中提取值，按照对应的位置进行赋值。

解构赋值有两种方式：
1、数组解构

let [a,b,c] = [1,2,3];//a=1,b=2,c=3

2、对象解构

let info = {
      uname: 'zs',uage:20};
let {
     uname,uage} = info;
console.log(uname,uage);//'zs' 20

let {
     uname:myName,uage;myAge} = info;
console.log(myName,myAge);//'zs' 20

箭头函数

作用：简化函数定义语法

语法：const fn = (参数) => {函数体}

特点;
1、若函数体只有一句话，且其结果就是返回值，则可以省略大括号，如：const sum = (a,b) => a+b;
2、若形参只有一个参数，则可以省略小括号，如：
const square = a => a*a;
3、箭头函数不绑定this关键字，指向函数定义位置的上下文this

剩余参数

将不定数量的参数转换为数组

const sum = (first,...args) =>{
     
	console.log(args);//[2,3]
	};
sum(1,2,3);

与解构配合

let laughter = ['haha','hehe','xixi'];
let [x,...y] = laughter;
console.log(x,y);//'haha' ['hehe','xixi']

拓展运算符

将数组或对象转换为用逗号分隔的参数序列，如：

let arry = [1,2,3];
console.log(...arry);//1 2 3相当于console.log(1,2,3)

合并数组：

let arry1 = [1,2,3];
let arry2 = [4,5,6];
let arry3 = [...arry1,arry2];//方法一
let array4 = arry1.push(...arry2);//方法二

将伪数组或遍历对象转换为数组

let divs = documnet.querySelectorAll('div');
divs = [...divs];

转换为数组的作用：可以方便调用数组API

Array的构造函数方法

let obj = {
     
	"0": 1,
	"1": 2,
	"2": 3,
	length: 3
	};
let arry = Array,from(obj,item => item * 2);
	

Array的查找方法

find():找第一个符合条件的数组成员，没找到则返回undefined，如：

let array = [{
     id:1,name:'zs'}];
let result = array.find(item =>item.id == 1);

findIndex():找出第一个符合条件的成员的位置，没有则返回-1

let array = [10,20,30];
array,findIndex(item =>item >15);//1

includes:是否包含某个值，返回布尔值

[1,2,3].includes(2);//True
[1,2,3].includes(4);//False

String的扩展方法

创建模板字符串：

let name = `zhangshan`;
let sayhello = `hello,my name is ${
       name}`;//可以解析变量
let module = `

	

		
haha
		
hehe
	
`;//可以换行
const fn = () =>`我是111`;
let html = `${
       fn()}`;

两种字符串方法：
startsWith()：判断参数字符串是否在原字符串头部，返回布尔值
endWith()：判断参数字符串是否在原字符串尾部，返回布尔值

repeat(n):重复n次，返回新的字符串

Set数据结构

特点：成员值唯一，无重复值，类似数组
语法：const s1 = new Set([‘a’,‘b’]);
使用：
1、数组去重
2、实例方法
add(value)——添加一个值，返回Set本身
delete(value)——删除一个值，返回布尔值
has(value)——判断是否含有某个值，返回布尔值
clear()——清楚所有成员
3、遍历

let s1 = new Set(['a','b']);
s1.forEach(item =>{
     
	console.log(item)
	});// a b