一、前端文件流操作

下面创建一个 fileUpload 的函数式组件，当用户选择文件时，通过FileReader将文件内容读取为 ArrayButter,然后将ArrayBuffer转换为十六进制字符串，并将结果显示在页面上。

假设我们有一个文件，称为 hello

通过 ln -s 创建一个软链接，通过 ln 可以创建一个硬链接。

1
2
3
4
5
6
7
8

$ ln -s hello hello-soft
$ ln hello hello-hard

$ ls -lh
total 768
45459612 -rw-r--r--  2 xiange  staff   153K 11 19 17:56 hello
45459612 -rw-r--r--  2 xiange  staff   153K 11 19 17:56 hello-hard
45463415 lrwxr-xr-x  1 xiange  staff     5B 11 19 19:40 hello-soft -> hello

他们的区别有以下几点:

• 软链接可理解为指向源文件的指针，它是单独的一个文件，仅仅只有几个字节，它拥有独立的 inode
• 硬链接与源文件同时指向一个物理地址，它与源文件共享存储数据，它俩拥有相同的 inode

一、概述

随着浏览器的功能不断增强，越来越多的网站开始考虑，将大量数据储存在客户端，这样可以减少从服务器获取数据，直接从本地获取数据。

现有的浏览器数据储存方案，都不适合储存大量数据：Cookie 的大小不超过 4KB，且每次请求都会发送回服务器；LocalStorage 在 2.5MB 到 10MB 之间（各家浏览器不同），而且不提供搜索功能，不能建立自定义的索引。所以，需要一种新的解决方案，这就是 IndexedDB 诞生的背景。

防抖 debounce - 重新开始

应用场景：搜索框输入文字后调用对应搜索接口、文本编辑器实时保存

利用闭包，不管触发频率多高，在停止触发 n 秒后才会执行，如果重复触发，会清空之前的定时器，重新计时，直到最后一次 n 秒后执行

经常遇到的浏览器的兼容性有哪些？

1. IE 浏览器不支持 Promise
   babel-polyfill → webpack.config.js 的 entry 中设置 [‘babel-polyfill’, ‘./src/main.js’]

2. 各浏览器之间默认样式的差异
   normalize.css
   与 reset 区别 → normalize.css 消除各浏览器之间默认样式的差异、保留有用的默认样式；
   而 reset 会清除所有的默认样式，过于暴力，例如会让 h 标题标签不再默认加粗，ul li 前面默认的小圆点也没了）

在 React 或 Vue 项目中，在列表组件中为每个列表项指定一个唯一的 key 是很重要的，其作用主要有以下几点：

由于疏忽或者错误造成程序未能释放已经不再使用的内存，不再用到的内存却没有及时释放，从而造成内存上的浪费。

const swap = (arr,i,j) => [arr[i],arr[j]] = [arr[j],arr[i]];

冒泡排序

比较相邻的元素。如果第一个比第二个大，就交换他们两个。

对每一对相邻元素作同样的工作，从开始第一对到结尾的最后一对。这步做完后，最后的元素会是最大的数。

什么是 CICD

CICD（Continuous Integration and Continuous Deployment，持续集成和持续部署）是一种软件开发实践，旨在通过自动化软件构建、测试和部署过程，以便快速、频繁地将代码交付给生产环境。CICD 流程包括持续集成（Continuous Integration，CI）、持续交付（Continuous Delivery，CD）和持续部署（Continuous Deployment，CD）。

在 React 中，Virtual DOM（虚拟 DOM）是一种内存中的表示，它是由 React 创建和维护的一种树形结构，用于表示真实 DOM 的抽象。当状态发生变化时，React 会通过比较新的 Virtual DOM 和旧的 Virtual DOM 的差异来确定需要更新的部分，并将这些变化应用到真实的 DOM 中，从而实现页面的更新。