当前位置: 首页 > news >正文

纷享销客前端实习一面

自我介绍

学校+专业+姓名+什么时候开学前端+前端经验+实习公司+项目

1. 前端是怎么学的?

我一开始是通过 B 站、掘金、官网文档等资源自学 HTML、CSS 和 JavaScript,后面通过做一些小项目巩固知识,比如实现简易的 todoList、天气查询、图形拖拽等。后来我系统性地学习了 Vue 和 React,掌握了组件化开发、路由、状态管理、前端工程化等内容,并在实习中参与真实项目,不断积累实践经验。


2. 为什么对前端感兴趣?

我喜欢前端是因为它“看得见”,可以快速地将代码变成界面和交互体验,并且它紧跟技术潮流、新东西不断出现,很有挑战和成就感。同时,我也喜欢把复杂的逻辑通过交互变得简单直观,提升用户体验。


3. 和别人相比,你觉得自己有什么优势?

  • 学习能力强:我能快速掌握新框架新技术。
  • 实践动手能力强:不仅看理论,也会动手做项目实践。
  • 注重细节和用户体验:对 UI 和交互的细节比较敏感。
  • 团队协作意识强:在实习和合作项目中习惯使用 git 协作,能主动沟通推进任务。

4. 城市地铁规划使用了什么算法?有用到遍历吗?

地铁规划本质是图论问题,地铁站是节点、线路是边,常用算法包括:

  • 最短路径算法:如 Dijkstra(用于求最短行驶路线)
  • 最小生成树算法:如 Prim、Kruskal(构建最优成本线路)
  • 遍历算法:如 DFS/BFS(查找所有路径或最少换乘路径)
  • A*:启发式最优路径(更智能)
  • 网络流算法:分析高峰期站点流量瓶颈

所以遍历是必须要用的,尤其是在路径搜索、换乘优化等场景中。


5. 举一个时间复杂度的例子

function printPairs(arr) {for (let i = 0; i < arr.length; i++) {for (let j = 0; j < arr.length; j++) {console.log(arr[i], arr[j]);}}
}
  • 时间复杂度是 O(n^2)
  • 因为有两个嵌套循环,每个都跑 n 次。

6. Promise实例? promise.all 第一个执行后面的还会执行吗?为什么?

1. 创建普通 Promise 实例

const p = new Promise((resolve, reject) => {setTimeout(() => {resolve("成功");// 或 reject("失败");}, 1000);
});

2. Promise.resolve()

快速创建一个成功的 Promise

const p = Promise.resolve("立即成功");
p.then(console.log); // 立即成功

3. Promise.reject()

快速创建一个失败的 Promise

const p = Promise.reject("立即失败");
p.catch(console.error); // 立即失败

4. Promise.all()

等待所有 Promise 成功,否则立刻失败

Promise.all([Promise.resolve(1),Promise.resolve(2)
]).then(res => console.log(res)); // [1, 2]

5. Promise.race()

谁先完成(成功或失败),就返回谁的结果

Promise.race([new Promise(r => setTimeout(() => r("A"), 500)),new Promise(r => setTimeout(() => r("B"), 1000))
]).then(console.log); // A

6. Promise.allSettled()

等待所有完成(不管成功或失败),返回每个的状态

Promise.allSettled([Promise.resolve("yes"),Promise.reject("no")
]).then(console.log);/*
[{ status: 'fulfilled', value: 'yes' },{ status: 'rejected', reason: 'no' }
]
*/

7. Promise.any()(ES2021)

只要有一个成功就返回结果;全部失败才报错

Promise.any([Promise.reject("fail"),Promise.resolve("success")
]).then(console.log); // success

8. async/await 与 Promise

async function fetchData() {const data = await Promise.resolve("结果");console.log(data); // 结果
}

二、promise.then 返回什么?

1. 返回一个新的 Promise

const p = Promise.resolve(1);const p2 = p.then(val => {return val + 1;
});p2.then(console.log); // 2
  • then() 返回的是一个新的 Promise 实例
  • 可以链式调用,不会影响原 Promise

2. 返回值分类

返回内容结果
普通值(如字符串、数字)包装成一个成功的 Promise
Promise 对象等待它的状态
抛出异常 / 返回 throw返回失败的 Promise

3. 示例:then 返回普通值

Promise.resolve("a").then(val => val + "b") // 返回的是 "ab".then(console.log); // ab

4. 示例:then 返回一个 Promise

Promise.resolve("a").then(val => Promise.resolve(val + "b")).then(console.log); // ab

5. 示例:then 抛异常

Promise.resolve("x").then(val => {throw new Error("出错了");}).catch(err => console.error(err.message)); // 出错了

const p1 = new Promise(resolve => setTimeout(() => resolve('A'), 1000));
const p2 = new Promise(resolve => setTimeout(() => resolve('B'), 2000));Promise.all([p1, p2]).then(res => {console.log(res); // ['A', 'B']
});
  • 是的,后面的会继续执行。
  • Promise.all 会等所有 Promise 都成功,才返回结果。
  • 即使第一个已经执行完,后面的也会照常执行,不会提前停止。
  • 如果其中有一个失败reject),Promise.all 会立刻 reject后续结果不会返回

7. reduce 是什么?使用示例?

reduce 是数组的一个高阶函数,用于累计处理数组值。

const arr = [1, 2, 3, 4];
const sum = arr.reduce((acc, cur) => acc + cur, 0); // 10

也可以将数组转对象:

const people = [{ id: 1, name: 'Tom' }, { id: 2, name: 'Jerry' }];
const map = people.reduce((acc, cur) => {acc[cur.id] = cur.name;return acc;
}, {});

8. nextTick 是什么?

  • 在 Vue 中,nextTick 用于等待 DOM 更新完成后再执行某个逻辑。
  • 在 Node.js 中,process.nextTick 是一种微任务,比 setTimeout 还早执行。
Vue.nextTick(() => {console.log('DOM updated!');
});

9. 数组扁平化有几种方式?

方法一:flat()(ES2019+)

[1, [2, [3]]].flat(Infinity) // [1, 2, 3]

方法二:递归

function flatten(arr) {return arr.reduce((acc, cur) =>Array.isArray(cur) ? acc.concat(flatten(cur)) : acc.concat(cur), []);
}

方法三:栈(迭代模拟递归)

function flatten(arr) {const stack = [...arr];const result = [];while (stack.length) {const val = stack.pop();if (Array.isArray(val)) {stack.push(...val);} else {result.unshift(val);}}return result;
}

10. 在项目中,Vue 和 React 有什么区别?

对比项VueReact
编程范式更接近模板 + 配置式更偏函数式、JSX 写法
数据绑定响应式系统(双向绑定)单向数据流,需要自己用 state 和 props 控制
组件写法options API / composition API函数组件 / class 组件(已弃用)
状态管理Vuex / PiniaRedux / Zustand / Context
生命周期命名比较直观(如 mounted更底层(如 useEffect
上手难度上手快更灵活但学习曲线稍陡

http://www.dtcms.com/a/319753.html

相关文章:

  • 数据结构(五):顺序循环队列与哈希表
  • 纪念《信号与系统》拉普拉斯变换、Z变换之前内容学完
  • 树莓派Raspberry Pi 烧录
  • TCP/IP 协议中的三次握手和四次挥手-----详解笔记
  • 板块三章节3——NFS 服务器
  • 人工智能2.0时代的人才培养和通识教育
  • 计算机视觉第一课opencv(一)保姆级教学
  • lane_up channel_up
  • mysql8.0.40服务日志时间和linux系统时间不同步问题!
  • 指针——练习
  • 算法 - 贪心算法
  • 计网学习笔记第3章 数据链路层层(灰灰题库)
  • 冷库设备远程监控物联网+省电节能解决方案
  • linux下实现System V消息队列实现任意结构体传输
  • 具身智能,正在翻越三座大山
  • 计算机毕业设计java疫情开放下的新冠信息共享平台 基于Java的社区疫情防控人员流动管理系统 疫情防控期间社区人员动态管理系统
  • 范数的定义、分类与 MATLAB 应用实践
  • 解决React白板应用中的画布内容丢失问题
  • 3363. 最多可收集的水果数目
  • 关键字 - 第二讲
  • Spring AI + Redis:构建高效AI应用缓存方案
  • 【物联网】基于树莓派的物联网开发【25】——树莓派安装Grafana与Influxdb无缝集成
  • 在 Linux 系统上安装 Docker 的步骤如下(以 Ubuntu/Debian为例)
  • 前缀和
  • 简洁明了的讲明什么是哈希(hash)函数
  • [激光原理与应用-170]:测量仪器 - 能量型 - 光功率计的工作原理与内部功能模块组成
  • 【第7话:相机模型3】自动驾驶IPM图像投影拼接技术详解及代码示例
  • 直连微软,下载速度达18M/S
  • Mysql 单行函数 聚合函数
  • MySQL聚簇索引与非聚簇索引详解