1. 基础
1.1 flex实现排列
<template>
<div class="wrapper">
<div v-for="item in count" :key="item" class="item"></div>
<div v-for="item in 100" :key="item" class="item" style="height:0;border:none;"></div>
</div>
</template>
<script setup>
import { ref } from "vue"
const count = ref(5)
</script>
<style scoped>
.wrapper {
width: 340px;
border: 1px solid cadetblue;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.item {
width: 100px;
height: 62px;
background-color: bisque;
border: 1px solid aqua;
}
</style>
1.2 this指向
const text = '0'
const o1 = {
text: '1',
fn: function () {
return this.text;
}
}
const o2 = {
text: '2',
fn: o1.fn
}
console.log(o2.fn());
console.log(o1.fn());
2
1
如果改成箭头函数，输出什么。
在node环境下，输出两个undefined；
在浏览器中，输出两个undefined；
如果将const改为var，输出0 0.
1.3 输出什么
async function async1() {
console.log('async1 start');
await async2();
console.log('async1 end');
}
async function async2() {
console.log('async2');
// 注意：这里如果返回 Promise 的话执行顺序就不一样了
}
console.log('script start');
setTimeout(function() {
console.log('setTimeout');
}, 0)
async1();
new Promise(function(resolve) {
console.log('promise1');
resolve();
}).then(function() {
console.log('promise2');
});
console.log('script end');
script start
async1 start
async2
promise1
script end
async1 end
promise2
setTimeout
1.4 https相比于http有哪些不同；为什么https更安全
http缺点：明文传输（登录时报文中明文显示账号密码，中间恶意路由器拦截报文读取到你的账号密码）；不验证通信双方身份，报文可能遭到篡改（中间恶意路由器拦截报文，并在其中插入一段广告js发给你）；
https特点：非明文传输；会验证通信双方身份（怎么验证？）。
https为什么是安全的：
https握手过程：juejin.cn/post/706648…
2. 算法
2.1 扁平数组树形化
前端为了渲染一个树形组件，如element-ui中的tree组件，你需要传入的参数结构如下：
[
{
id: 1,
label: 'Level one 1',
children: [
{
id: 4,
label: 'Level two 1-1',
children: [
{
id: 9,
label: 'Level three 1-1-1',
},
{
id: 10,
label: 'Level three 1-1-2',
},
],
},
],
},
{
id: 2,
label: 'Level one 2',
children: [
{
id: 5,
label: 'Level two 2-1',
},
{
id: 6,
label: 'Level two 2-2',
},
],
},
{
id: 3,
label: 'Level one 3',
children: [
{
id: 7,
label: 'Level two 3-1',
},
{
id: 8,
label: 'Level two 3-2',
},
],
},
]
但是后台返回的数据结构如下：
[
{ id: 1, label: 'A', parentId: 0 },
{ id: 2, label: 'B', parentId: 1 },
{ id: 3, label: 'C', parentId: 2 },
{ id: 4, label: 'D', parentId: 1 },
]
请写出转换算法。
https://paste.ubuntu.com/p/dBmY5DVz8x/
2.2 如上，如何进行反转
2.3 最长回文子串
5. 最长回文子串 - 力扣（LeetCode） (leetcode-cn.com)
暴力法：时间复杂度O(n^3)；
扩散法：时间复杂度O(n^2)，空间复杂度O(1)；
动态规划法：时间复杂度O(n^2)，空间复杂度O(n^2)；
马拉车算法：时间复杂度O(n)。
