Es6解构赋值,熟练掌握作用域

5.3 数组的解构赋值 数组的解构赋值是按照前后数据的索引值一一对应的

5.4 前后数据结构也要保持一致,不然解构的可能与原数组解构嵌套不同

5.5 数组解构时的默认值

6 对象的解构赋值 对象的解构赋值是按照key一一解构

7 解构数组,如果有两个值必须写在后面,rest参数

8 解构对象rest参数前写谁就不解构谁

9 解构函数的剩余参数

10函数的形参可以写赋值形式,对象是键值对

11 Js默认字符串前面有一个空字符串拼接

12 扩展运算符

---

1 全局作用域

---

解释:var变量是定义在window上

var a = 123;

​ console.log(a); //123

​ console.log(window); //window a: 123

2 函数级作用域

---

function fn() {

​ var b = 234;

​ console.log(b); //234

console.log(window); //没有b属性,因为它是函数级作用域,有c属性.因为在函数不定义直接使用属于全局变量

​ c = 555;

​ console.log(window); //window c: 555 ,因为在函数不定义直接使用属于全局变量

​ }

​ fn()

3 变量提升

---

// 变量提升将变量的声明会提升至本作用域的最顶部

​ console.log(a); //undefined

​ var a = 123;

​ //上面代码相当于

​ var a;

​ console.log(a);

​ a = 123;

4  const和let

---

// let和const声明的变量不存在变量提升 因为let和const声明变量后会将当前代码块转化为一个暂

//时性的死区

​ //暂时性死区的本质就是，只要一进入当前作用域，所要使用的变量就已经存在了，但是不可获取，只有

//等到声明变量的那一行代码出现，才可以获取和使用该变量

​ // let声明的变量首次可以不赋值 let声明的变量在相同作用于内不能重复定义, const声明的常量必须

//有默认值 const声明的是常量 不能重新赋值 但是如果值是引用数据类型 数据内部的属性是可以修改

const a = 1;

​ console.log(a);//1

​ a = 2 //报错 无法直接修改常量

​ const obj = {

​ name: ‘张三’

​ }

​ obj.name = ‘李四’;

​ console.log(obj.name); //李四

5 解构赋值

---

总结:

1 解构赋值就是按照一定的模式将对象或者数组中的数据取出赋值给变量,数组解构按照索引等号两边相对应,对象解构按照key解构,

2 无论是对象的解构赋值还是数组的解构赋值 “等号” 两边的数据类型都要保持一致, 不然是undefined.前后数据结构也要保持一致, 不然解构的可能与原数组解构嵌套不同

5.1 数组类型 ‘’=‘’ 如果前后类型不同是undefined

---

var arr = [1, 2, 3, 4];

var a, b, c, d = arr //类型不同

console.log(a, b, c); //undefined undefined undefined

console.log(d) //(4) [1, 2, 3, 4]

5.2解构交换变量

---

var a = 1;

var b = 2;

console.log(a, b);//1 2

var [a, b] = [b, a];

console.log(a, b);// 2 1

5.3 数组的解构赋值 数组的解构赋值是按照前后数据的索引值一一对应的

---

var arr = [1, 2, 3, 4];

var [a, b, , d] = arr;

console.log(a, b, d); //1 2 4,逗号也算一位

5.4 前后数据结构也要保持一致,不然解构的可能与原数组解构嵌套不同

---

var arr = [1, [2, 3, [4]]];

var [a, [b, c, [d]]] = arr;

console.log(a, b, c, d); //1 2 3 4

5.5 数组解构时的默认值

---

var arr = [1, 2, 3, 4, undefined];

var [a, b, c, d, e = 5] = arr; //直接赋值默认值

console.log(a, b, c, d, e);//1 2 3 4 5

let arr = [];//三个空数组,有时候直接用数组长度作为判断条件

arr.length = 3;

console.log(arr); //(3) [empty × 3]

6 对象的解构赋值 对象的解构赋值是按照key一一解构

框架相关

原生JS虽能实现绝大部分功能，但要么就是过于繁琐，要么就是存在缺陷，故绝大多数开发者都会首选框架开发方案。现阶段较热门是React、Vue两大框架，两者工作原理上存在共通点，也存在一些不同点，对于校招来说，不需要两个框架都学得特别熟，一般面试官会针对你简历中写的框架进行提问。

在框架方面，生命周期、钩子函数、虚拟DOM这些基本知识是必须要掌握的，在学习的过程可以结合框架的官方文档

Vue框架

知识要点：
1. vue-cli工程
2. vue核心知识点
3. vue-router
4. vuex
5. http请求
6. UI样式
7. 常用功能
8. MVVM设计模式

React框架

知识要点：
1. 基本知识
2. React 组件
3. React Redux
4. React 路由

Vue框架*

知识要点：
1. vue-cli工程
2. vue核心知识点
3. vue-router
4. vuex
5. http请求
6. UI样式
7. 常用功能
8. MVVM设计模式

[外链图片转存中…(img-TIQHTFaA-1725995917822)]

React框架

知识要点：
1. 基本知识
2. React 组件
3. React Redux
4. React 路由

[外链图片转存中…(img-OnouMNSt-1725995917824)]