2024年深信服 星耀前端一面面经＋二面凉了(1)，2024年最新2024Web前端架构面试指南

总结

• 对于框架原理只能说个大概，真的深入某一部分具体的代码和实现方式就只能写出一个框架，许多细节注意不到。

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

• 算法方面还是很薄弱，好在面试官都很和蔼可亲，擅长发现人的美哈哈哈…（最好多刷一刷，不然影响你的工资和成功率???）

• 在投递简历之前，最好通过各种渠道找到公司内部的人，先提前了解业务，也可以帮助后期优秀 offer 的决策。

• 要勇于说不，对于某些 offer 待遇不满意、业务不喜欢，应该相信自己，不要因为当下没有更好的 offer 而投降，一份工作短则一年长则 N 年，为了幸福生活要慎重选择！！！

第一次跳槽十分忐忑不安，和没毕业的时候开始找工作是一样的感受，真的要相信自己，有条不紊的进行。如果有我能帮忙的地方欢迎随时找我，比如简历修改、内推、最起码，可以把烦心事说一说，人嘛都会有苦恼的～

祝大家都有美好的未来，拿下满意的 offer。

怎么get? 我说jsonp 说说jsonp的实现和回调

img可以吗?我说可以，img怎么回调判断状态，我不知道。

（img元素能添加onError onLoad 属性，用于监听加载失败或者加载成功。）

seo， 单页面应用reactapp，多页面应用nextapp，以及自己写的多入口项目 针对seo他们有啥区别，我说了半天可能没说到他想听的，况且我也没深入了解（没查到合适的解释）

最近在学什么，我说markdown解析的一个案例，怎么实现的?我说他是用的一个插件。你怎么实现?我说匹配啊加标签啊高亮啊什么的巴拉巴拉

最后是一个匹配n叉树路径的算法

作者：mus。

链接：https://www.nowcoder.com/discuss/434043

来源：牛客网

题目：实现一个对树型结构进行过滤的函数，其中树形结构的格式如下：

tree = [

{name: ‘A’},

{name: ‘B’, children: [

{name: ‘A’},

{name: ‘AA’, children: […]}

]},

{name: ‘C’}

]

1. 假设我输入的 str 为 A 则过滤后返回的结果为

[

{name: ‘A’},

{name: ‘B’, children: [

{name: ‘A’}

]}

]

2. 假设我输入的 str 为 AA 则过滤后返回的结果为

[

{name: ‘B’, children: [

{name: ‘AA’, children: […]}

]}

]

3. 假设我输入的 str 为 B 则过滤后返回的结果为

[

{name: ‘B’, children: [

{name: ‘A’},

{name: ‘AA’, children: […]}

]}

]

// 实现该函数，要求不允许对原有的tree做任何修改，最终返回结果是一棵新结构出来的树

function filter (tree, str) {

}

我递归实在不行 写了好久没写出来 大致思路也只能停留于我能找到那个子节点，路径怎么存下来我觉得要写一个顶层的tmp，但是我现撕肯定是写不出来的。。。这种难度我刷力扣都是看答案的。。

（等我看看写出来的话挂上来）

大概用了一个小时的时间才写出，一个用队列的方式层序便利同时保存路径，然后浅拷贝穿单链表

作者：mus。

链接：https://www.nowcoder.com/discuss/434043

来源：牛客网

const tree = [

{ name: “A” },

{ name: “B”, children: [{ name: “A” }] },

{

name: “AA”,

children: [

{ name: “BB” },

{ name: “C” },

{ name: “D”, children: [{ name: “A” }] },

],

},

{ name: “D”, children: [{ name: “C”, children: [{ name: “AA” }] }] },

];

function filter(tree, str) {

let arr = […tree];

arr = arr.map((a) => [a, []]); //给一个二维环境，这里用数组，用Map也可以

let tmp = [];

while (arr.length > 0) {

let a = arr.shift();

if (a[0].name == str) {

tmp.push(a);

continue;

} //匹配就放进去

if (a[0].children) {

a[0].children.map((b) => {

arr.push([b, a[1].concat(a[0])]);

});

} //如果有孩子就把孩子放入待检测队列,同时把父亲按照层顺序存到father数组中

}

//console.log(tmp)//tmp数组每一项都是[节点，路径[]]

let res = [];

for (let i = 0; i < tmp.length; i++) {

if (tmp[i][1].length == 0) {

res.push(tmp[i][0]);

continue;

} //如果恰好是第一层，路径就是空的

//正常情况下我们新建一个对象，采用单链表的方式创建浅拷贝路径

let o = {};

let p = o;

while (tmp[i][1].length > 0) {

//console.log(tmp[i],i)

let m = tmp[i][1].shift();

结尾

学习html5、css、javascript这些基础知识，学习的渠道很多，就不多说了，例如，一些其他的优秀博客。但是本人觉得看书也很必要，可以节省很多时间，常见的javascript的书，例如：javascript的高级程序设计，是每位前端工程师必不可少的一本书，边看边用，了解js的一些基本知识，基本上很全面了，如果有时间可以读一些，js性能相关的书籍，以及设计者模式，在实践中都会用的到。

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

高级程序设计，是每位前端工程师必不可少的一本书，边看边用，了解js的一些基本知识，基本上很全面了，如果有时间可以读一些，js性能相关的书籍，以及设计者模式，在实践中都会用的到。