输入url到页面展示过程
sequenceDiagram
浏览器->>dns服务器: 向dns服务器请求
dns服务器->>浏览器: 返回网址的ip
浏览器-->>服务器: 发起tcp请求，http默认80端口，https默认443端口,一次握手(我来啦
服务器-->>浏览器: 二次握手，（我收到啦
浏览器-->>服务器: 三次握手，(我也收到啦
服务器->>浏览器: 传输数据
浏览器-->>服务器: 我全都收完啦(第一次挥手
服务器-->>浏览器: 好哒知道啦(第二次挥手
服务器-->>浏览器: 拜拜啦(第三次挥手
浏览器-->>服务器: 拜拜啦(第四次挥手
浏览器->>view:解析html，展示页面。
graph TD
浏览器解析html
--> 解析其他静态资源
--> 加载资源文件,请求过程同上
-->解析完成,生成dom树,cssom,合并生成renderTree
--> 计算图层布局,排版
--> 渲染绘制
--> 页面展示
script标签中defer和async
script 标签的 defer 与 async 属性_script标签的defer和async属性_mrlmx的博客-CSDN博客
两者都是使script异步执行的属性
最大的区别是，
defer会在页面加载完成后再依次执行。async是js加载完成了，就直接执行。如果js加载完了（下载好了），页面渲染还没结束，会阻塞页面渲染，优先执行该js。
引用的文章解释的挺好的，但是为了兼容老浏览器，还是建议直接把js加在body的最下面，在加上defer属性。
flex的常用属性
给父元素设置display: flex。
// flex-direction默认是row
flex-direction: row; //水平排列
flex-direction: row-reverse; // 水平反向排列
flex-direction: column; // 垂直排列
flex-direction: column-reverse; // 垂直反向排列
justify-content: center; // 主轴居中
justify-content: space-around; // 内容平分，左右两侧有空白
justify-content: space-between; // 内容平分，左右两侧无空白
align-item: center; // 恻轴居中
子元素
flex: number; // 占几份
我常用的就这些，其他的都现查。
推荐直接看阮一峰flex布局教程。
元素水平垂直居中的几个方法
纯定位
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
margin: auto;
定位+transform
position: absolute;
left: 50%;
top: 50%;
transform: transilate(-50%,-50%);
父元素flex
display:flex;
justify-content: center;
align-item: center;
常用的基本就这些，固定宽度的居中实际开发中基本不会用，所以只记不定宽的水平垂直居中方案就好啦。
排序，从小到大
直接sort不行吗。
自己写排序
function quickSort(arr, fn) {
if (arr.length <= 1) {
return arr;
}
const pivotIndex = Math.floor(arr.length / 2);
const pivot = arr[pivotIndex];
const left = [];
const right = [];
for (let i = 0; i < arr.length; i++) {
if (i === pivotIndex) {
continue;
}
if (fn(arr[i], pivot) > 0) {
left.push(arr[i]);
} else {
right.push(arr[i]);
}
}
return [...quickSort(left, fn), pivot, ...quickSort(right, fn)];
}
// 示例
const arr = [5, 3, 8, 4, 2];
const sortedArr = quickSort(arr, (a,b) => a - b);
console.log(sortedArr); // [2, 3, 4, 5, 8]
vue的通信方式
全局通信 bus,vueX
父子通信 props
子传父 callback ref
什么是断言，列举对变量，接口，对象的语法。
后面这半句我完全不理解。
断言本身这个功能，我也不是很能理解。
本身的功能类似特定的if+抛出错误。
如果断言的代码执行为假，则抛出错误。
这是他的功能，看了看其他人的说法，使用层面上，只能在开发、测试中使用，不可以上生产。主要用来定位bug，确保程序的运行符合预期。那为什么不用单侧来保证呢，不过单侧中也有类似断言的使用。
已知存在数组;找出公共相同的字母，并打印到控制台。
var arr = ['aaea', 'bbebb', 'ccceca'];
var commonLetters = arr.reduce(function(common, str, index) {
if (index === 0) {
// 第一个字符串
return new Set(str.split(""));
} else {
// 非第一个字符串
var letters = new Set(str.split(""));
return new Set([...common].filter(letter => letters.has(letter)));
}
});
console.log(Array.from(commonLetters)); // 输出 ["a", "e"]
chatGPT牛批。
