js 高级day04

ES6 语法

var和let的区别:

1.预解析:var声明提前到作用域最顶端

let 没有

var 有

2.块级作用域

let 有

var 没有

对象解构赋值:

解构赋值 ：

变量赋值的简写(解构精髓：当变量名 和 对象属性值一致的时候，只需要写一个)

1.取出对象的赋值给变量

let{变量名,对象名:变量名} = 对象名

2.取出变量的属性 赋值给对象

变量名=属性名,变量名和属性名同名情况下可以省略只写一个变量名

方法名(){}相当于省略了function(){}不写

数组解构赋值:

数组解构:

1.取出数组元素 赋值给变量

2.取出变量的值 赋值给数组元素

函数参数解构:

当函数参数是对象类型,就可以对形参进行解构

传参本质:实参给形参赋值

箭头函数:

相当于function函数的简写

1.去掉function,改成箭头=>

2.形参小括号写给箭头左边

箭头函数语法注意点:

1.如果箭头函数只有一个形参,则可以省略小括号

2.如果箭头函数的函数体只有一行代码,则可以省略大括号.(此时必须省略return)

function函数this有三种指向:

谁调用我,我就指向谁

普通函数:函数名() this->window

对象方法:对象名.函数名() this->对象名

构造函数:new 函数名()this->new创建实例

箭头函数this:

箭头函数没有this

箭头函数本质是访问,上级作用域中的this就是根据作用域链来一级一级往上查询,不能和构造函数和点击事件一起使用

展开运算符:

...

相当于对于对象遍历的简写

应用:

1.连接两个数组

2.求数组最大值

把两个对象数组元素不一样的合成一个

数据类型set:集合

set相当于是数组类型,和数组Array唯一的区别是不能存储重复元素

场景:

数组去重

let newArr = [...new set(需要去重的数组)]

argunments关键字:

获取函数所以的实参

是一个伪数组

有数组三要素(元素,下标,长度),但是不能使用数组的方法

应用:

一般用户参数数量不限的函数.

例如:arr.push() math.max() 这些函数实参数量不限,底层原理就是使用arguments来接收所有的实参

剩余参数(rest参数):

获取函数剩余的所有实参

语法:

function 函数名(形参1,....形参2){}

特点:

1.只能作为最后一个参数

2.是真数组

一般情况下,rest参数可以替代arguments

剩余参数:

function(...形参){

与arguments作用一致都是获取函数实参,一般用于封装,参数不确定的函数

}

防抖函数和节流函数:

防抖函数:

单位时间内,频繁触发事件,只会触发最后一次

经典应用场景:

输入框事件

函数防抖流程:

1.声明全局变量存储定时器

2.每一次触发事件,先清除定时器,然后将事件处理代码放入本次定时器

节流函数:

单位时间内,频繁触发事件,只会触发一次

经典应用场景:

滚动条