纷享销客前端实习一面自我介绍学校+专业+姓名+什么时候开学前端+前端经验+实习公司+项目 1. 前端是怎么学的？我一

自我介绍

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

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 有什么区别？

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

纷享销客前端实习一面