js高级篇

目录

1、作用域

2、let、const、var

3、作用域链

4、垃圾回收机制

5、闭包

6、变量提升

7、函数提升

8、剩余参数

9、展开运算符

10、箭头函数

11、filter筛选数组方法

12、数组解构

13、对象解构

15、数组对象

16、数组遍历foreach

17、数组去重

1、作用域

作用域:变量能够被访问的范围

作用域分为局部作用域和全局作用域;

局部作用域:函数作用域:函数内部声明的变量，只能内部访问，外部无法直接访问，函数在执行之后，函数内部的变量实际被清空了。

块级作用域:使用{}包裹的代码具有块级作用域。一般是for和if
全局作用域:

9、展开运算符

展开运算符:可以将一个数组进行展开，不会修改原数组
展开运算符： 可以展开数组、合并数组、将伪数组转化为真数组

 展开运算符 可以展开数组console.log(...arr)console.log(Math.max(1, 2, 3))...arr1  === 1,2,31 求数组最大值console.log(Math.max(...arr1)) // 3console.log(Math.min(...arr1)) // 12. 合并数组3、可以把伪数组转化为真数组const arr2 = [3, 4, 5]const arr = [...arr1, ...arr2]console.log(arr)

剩余参数和展开运算符的区别:剩余参数:函数参数使用,得到真数组
 

10、箭头函数

箭头函数:
const fn = O=>{
console.log('我是箭头函数)
fnO
注意:

1.只有一个函数的时候可以省略小括号
2.如果函数体只有一行代码可以写到一行上
3.再写到一行上的时候可以无需写return直接写返回值4.加括号的函数体返回对象字面量表达式
const fn = uname => ({uname: uname})console.log(fn('我是个好人'))
箭头函数参数:箭头函数没有arguments动态参数，可以使用剩余参数
箭头函数this:箭头函数没有自己的this，它只会从自己的作用域链上一级沿用this，事件回调函数中使用箭头函数的时候，this为全局的window。

 // 1. 箭头函数 基本语法const fn = () => {console.log(123)}fn()const fn = (x) => {console.log(x)}fn(1)// 2. 只有一个形参的时候，可以省略小括号const fn = x => {console.log(x)}fn(1)// // 3. 只有一行代码的时候，我们可以省略大括号const fn = x => console.log(x)fn(1)// 4. 只有一行代码的时候，可以省略returnconst fn = x => x + xconsole.log(fn(1))// 5. 箭头函数可以直接返回一个对象const fn = (uname) => ({ uname: uname })console.log(fn('刘德华'))

11、filter筛选数组方法

筛选数组方法: filter()，返回数组，包含了符合条件的所有元素,如果没有符合条件的元素返回空数组，看的是回调函数返回值的布尔值
被遍历的数组.filter(function(item,index, arr){l/ item必须写，index,arr可选
return 筛选条件
})

 const arr = [10, 20, 30]const newArr = arr.filter(function (item, index) {// console.log(item)// console.log(index)return item >= 20})// 返回的符合条件的新数组

对象:无序的键值对的集合

12、数组解构

解构赋值:是一种快速为变量赋值的语法，本质上仍然是为变量赋值，分为数组解构、对象解构；

数组解构：是将数组的单元值快速批量的赋值给一系列变量的语法

注意:

1.赋值运算符=左侧的[用于批量声明变量，右侧的数组的单元值将被赋值给左侧的变量
2.变量的数量大于单元值数量的时候，多余的变量被赋值为underfind
3.变量的数量小于单元值数量的时候，可以通过...获取剩余单元值，但只能置于最末位对象解构:

const arr = [1, 2, 3]const [a, b, c] = arrconsole.log(a, b, c
// // 交换2个变量的值let a = 1let b = 2;[b, a] = [a, b]console.log(a, b)

13、对象解构

对象解构：是将对象属性和方法快速批量赋值给一系列变量的语法
注意:

1.赋值运算符=左侧的用于批量声明变量，右侧对象的属性值将被赋值给左侧的变量
⒉.对象属性的值将被赋值给属性名相同的变量
3.对象中找不到与变量名相同的属性名的时候变量值为underfined

4.给新的变量名赋值:
const { name : uname，age } = { name : '小明’, age : 183

// 1. 对象解构的变量名 可以重新改名  旧变量名: 新变量名const { uname: username, age } = { uname: 'pink老师', age: 18 }console.log(username)console.log(age)

14、JS前面有两哪种情况需要加分号的？

1、立即执行函数 

2、数组解构

15、数组对象

const res = {data: {data: [1, 2, 3],},const {data:{data: mydata}}=resconsole.log(mydata)

16、数组遍历foreach

遍历数组forEach方法:用于调用数组的每个元素，并将元素传递给回调函数，在特殊情况下：通过修改index,arr可以修改原数组，item如果是简单数据类型修改不了原数组，如果是复杂数据类型可以修改原数组。

17、数组去重

数组去重reduce方法:

const arr = ['a'， 'b', 'a'， 'b'， 'C', 'e', 'e', 'c', 'd', 'd', 'd', 'd']
//如果indexof下标为-1代表数组中没有该字符，把该字符添加进去
let res = arr.reduce((acc, item)=>{
if (acc.indexof(item)===-1){
acc.push(item)
}
return acc
},[])
console.1og(res)

数组去重Set方法:

const arr =['a'， 'b', 'a'， 'b', 'c', 'e', 'e', 'e', 'd', 'd'， 'd', 'd']
const newArr = [. ..new Set(arr)]//展开式
console.log(newArr)

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！