分享前端知识，记录前端进阶

本文介绍react项目中如何创建events来进行跨组件事件触发重点讲解自定义参数传递，和如何拿到最新的state值🌟。

需求：2s后执行函数fn1，之后再过3s执行函数fn2上面👆那种流程式的写法虽然可是实现功能，但是存在回调嵌套问题，无论是书写还是阅读都极其不便，有没有更优雅的方式呢？有。

还在为js频繁操纵样式而苦恼吗，试试styleSheet吧，可以轻松实现元素样式增添

在开发前端需求时，有时需要在本地缓存记录一些数据状态，再次打开页面时，需要首先查询缓存中的数据，如果有就用缓存中的数据当作初始值，如果对应数据有更新，也要更新缓存

JSON是JavaScript Object Notation的缩写，翻译为JavaScript对象符号。和JavaScript不同，JSON不是一种编程语言，而是存储数据的一种格式，被广泛用于前后端数据传递、项目配置文件中JSON1. JSON数据类型2. JSON类型与JavaScript类型转换3 JSON.stringify方法4 JSON.parse方法1. JSON数据类型.json结尾的文件顶层可以存储三大类的数据基本类型字符串、数字、布尔类型、null（不能存undefine.

早期JS中用不到模块化，JS多用来表单验证，没必要放到多个文件中来写；后来JS需求变得复杂：ajax前后端分离、SPA、前端路由和Node等，使得对模块化的需求愈加强烈。为此社区中产生了AMD、CMD、CommonJS等模块化规范，随着官方ES6中ES Module的提出，社区规范可以落幕了什么是模块化将程序划分为一个个模块，在模块内部可以编写属于自己作用域的代码，不会影响其他模块模块可以将自己希望暴露的东西暴露给别的模块使用，也可以导入其他模块暴露的变量、函数、对象等一个独立的js文件就.

介绍Error类，采用throw关键字主动抛出错误，采用try-catch主动捕获错误

介绍浏览器和Node两种环境下的JS事件循环，包括宏任务、微任务的划分，以及优先级；列举常见面试题，对深入理解事件循环机理和通过面试都很有帮助

在开发中，我们通常会遇到需要多个串联异步请求的方案，即要依靠第一个异步请求结果来发起下个异步请求，这时如果采用Promise会形成回调地狱，不利于代码的管理，所以采用async和await关键字来解决异步代码处理方案一个异步请求：Promise多个串联异步请求：Promise(可能会用到Promise.all/race等进行结果处理)多个串联异步请求：async-await（本质上是Promise+生成器的语法糖）async和await是包装好的语法糖、但我们不至于用，还是要一步一步进行推.

为了给函数具有暂停、中断等功能，ES6中新增了生成器函数和生成器Generator来控制函数执行。生成器是一种特殊的迭代器，同样可以通过调用next方法得到函数执行中返回值，同时可以中途给函数传递参数

迭代器迭代器是一个特殊的对象，可以帮助我们遍历另一个数据结构（数组 链表 映射表等1. 基本结构JS中迭代器是一个具体的对象，这个对象有一个next函数：函数无参数或者有一个参数，返回一个拥有以下两个属性的对象done（boolean）：如果迭代器可以产生序列中的下一个值，则为 false；如果迭代器已将序列迭代完毕，则为 true。value（任意类型）：迭代器返回的值const iterator = { next() { reutrn { done: false, value：'任

介绍了Promise类产生的背景与使用方法，包括对象方法和类方法

本文详细介绍了响应式原理，手把手实现Vue中的响应式1 什么是响应式响应式可以理解为：数据发生改变时，用到该数据的代码块自动重新执行简而言之，就是A变，依赖A（用到A的值）的函数也跟着变。那么就需要依次考虑一下问题：如何监听到A的值的改变了：Proxy代理set捕获器可以监听值改变监听到之后，重新执行用到A相关的函数：如何知道数据和函数的依赖关系每个A都对应一个响应数组，里面存用到它的函数怎么知道函数用到A：响应式函数需要额外包裹包裹时执行函数2 代码设计cons.

在一些前端框架中，常常需要监听数据变化，页面进行响应。为了监听对象的变化，需要对对象的操作进行捕获。本文着重介绍ES6中Proxy代理对象的使用，以及涉及到的映射对象Reflect使用

新数组方法includes,flat,flatmap，对象方法Object.entries()和Object.fromEntries()，以及空值合并运算符??

介绍Map和Set的构造、属性以及方法、WeakMap在Vue3响应式实现中的应用

对象属性key可以分为字符串类型和Symbol类型两种，本文介绍了Symbol类型对象属性的声明和修改。同时也介绍了不同属性的遍历方法。

ES6重要技巧：对象和数组解构赋值、函数默认参数与剩余参数、let和const作用域以及用法

ES6中引入class语法糖来定义类，采用extends关键字来实现类的继承。相比于ES5中构造函数的方式在书写的简便性上有了质的提升。但是万变不离其宗，本文带你解密语法糖背后的实现原理，看完你会对class和extends有更深入的理解和认识

在面向对象的语言中，类的继承最重要的特征之一。本文通过讨论JS中原型链继承法、借用构造函数继承法和寄生组合式继承法的优缺点，来逐步推导出类继承最为成熟的方案

JavaScript中每个对象都有一个特殊的内置原型属性 [[prototype]]，指向另外一个对象。每个函数除了隐式原型外，还有一个显式原型prototype，当函数作为构造函数调用来创建实例对象时，实例对象的原型会被赋值为函数的显式原型

JavaScript中构造函数是批量生产对象的利器。首先要声明，构造函数本身也是一个普通的函数，只不过以new操作符来调用时，该普通函数被称为构造函数

学好对象对于JS非常重要，我们可以很轻易的对对象中的属性进行增删改查，但是如果要对某个属性进行适当“限制”，或者劫取属性的get的set操作，那么就需要用到Object.defineProperty()方法了

函数式编程是一种编程范式，它不是JavaScript中特有的，只能说JavaScript遵循函数式编程范式。 本文主要讲解函数式编程中：纯函数、函数柯里化以及组合函数的概念和用法

在JavaScript语法中，call，apply和bind可以为函数显式绑定this。代码底层是用C++实现的，但是我们可以用JS代码写一个自己的call，apply和bind函数，实现相同功能

普通函数和箭头函数中this指向的区别，以及如何快速判断this指向，含日常高频实用代码this解析

JavaScript中的函数，如果它访问了外层作用域中的自由变量，那么该函数和外层自由变量共同构成了闭包

JavaScript是高级程序语言，计算机不能直接读懂，需要解释器或者编译器将其翻译成计算机能看懂的机器码才能执行。JavaScript引擎能够“读懂”JavaScript代码，并准确地给出代码运行结果

在JS中，关键字var声明的变量会自动被移到函数或者全局代码之上，但是变量赋值不会随之提升，显示声明的函数作为一个整体也会提升到全局代码之上