前端事件是无法区别单击还是双击的 需要我们自己写方法实现
借用防抖的思想，记录一下

最近学习到了 babel, 看到一些好文章，mark标记一下。

@babel/core

babel编译器。被拆分三个模块：@babel/parser、@babel/traverse、@babel/generator

@babel/parser: 接受源码，进行词法分析、语法分析，生成AST。
@babel/traverse：接受一个AST，并对其遍历，根据preset、plugin进行逻辑处理，进行替换、删除、添加节点。
@babel/generator：接受最终生成的AST，并将其转换为 代码字符串，，同时此过程也可以创建source map。

统一团队代码风格规范

1 安装 eslint
输入命令 yarn add eslint -D,
项目中输入命令 npx eslint --init
然后开始自己选择项目所需要的内容。

笔者这里选择的是 “React” + “TypeScript” + “Airbnb: https://github.com/airbnb/javascript"

然后系统就自动下载安装了以下的安装包并创建了一个 .eslintrc的配置文件

一直以来使用 React 开发项目都是使用脚手架 umi,这次试试使用 WebPack5 搭建 React+TS+antd+less 开发环境。

项目初始化
新建文件夹并进入此文件夹，打开命令工具(cmd / git bash)
yarn init -y

Webpack
yarn add webpack webpack-cli -D

webpack-cli提供了许多命令来使 webpack 的工作变得更简单

本文安装的版本是

1
2

"webpack": "^5.64.1",
"webpack-cli": "^4.9.1"

创建 Webpack 配置文件
webpack.config.js
配置基本内容

在使用typescript中使用axios时，很多资料都是用any来处理返回值得类型

于是，记录一次Typescript+Axios的使用

在之前写公司的业务的时候有这样的一个需求，通过 XMLHttpRequest 拿到图片的二进制内容。然后将 ArrayBuffer 中的数据暂存在 JSON 中，所以需要涉及到 ArrayBuffer 和 String 的相互转换。
记录一下

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

/**
 * @description 将ArrayBuffer对象转换成string
 * @param {ArrayBuffer} buf - ArrayBuffer对象
 */
function bufferToString(buf): Promise<string> {
  return new Promise((resolve) => {
    var blob = new Blob([buf], { type: "application/octet-stream" });
    var reader = new FileReader();
    reader.onload = function (event) {
      const result = event.target.result as string;
      // console.log("result",result);
      resolve(result);
    };

    reader.readAsText(blob, "utf-8");
  });
}

如何实现 useState 改变值之后立刻获取最新的状态

之前在写项目的时候,遇到一个问题,如何实现 useState 改变值之后立刻获取最新的状态?
然后刚刚好在思否上看到一个大神操作方法
记录一下
原文连接

在前端同时处理多个Http请求时，为了减少请求与响应时延，往往会使用Promise.all()实现请求并行发送。但是浏览器对此有一定的限制，
在 Chrome 浏览器中允许的最大并发请求数目为 6，这个限制还有一个前提是针对同一域名的，超过这一限制的后续请求将会被阻塞。

于是，可以通过一定方式实现并发控制，一次发送一组Http请求，待执行完成一个Http请求则将下一个Http请求加入分组

前端面试题–某易26问

1、介绍redux，主要解决什么问题

答：redux ：可预测的状态管理机，随着单页面应用的需求越来越复杂，组件间的数据传递和状态管理越来越复杂。Redux 通过一系列约定的规范将修改应用的状态标准化，Redux应用需要遵循三大原则：1，唯一数据源 2，保持应用状态只读 3，应用状态的修改要通过纯函数来完成。
Redux主要用来解决大型web项目间复杂数据传递与状态管理的问题。

2、⽂件上传如何做断点续传

Redux请求中间件如何处理并发操作？

问题提出背景：有一个数组A，然后让你根据数组A的每一项发起一个请求，拿到所有项的返回结果后，组装起来渲染视图

思路：利用redux-thunk中间件来操作，redux-thunk使得 dispatch()得到增强，能接收一个函数，在这个函数里使用promise.all()执行完异步操作后，再dispatch一个action对象。