:::info 📒 本期分享主题：前端入门那些事 :::

大纲

第01期-220331前端 副本 - 图1

如何写简历

写什么内容

:::info

  • 基础信息
  • 技术栈
  • 工作经历
  • 业务项目 :::

前端涉及的领域：
一、业务方向

  • TO B项目，后台管理系统。自研组件库，内部脚手架，微前端，低代码平台、可视化搭建技能
  • TO C项目，h5项目，重交互、重数据、重性能、重稳定，动画库封装，数据埋点、数据上报平台

二、技术方向
工程化建设（基建）

  • 前端工作流程建设(开发体验): 前端工作流搭建 开发规范、代码组织结构、eslint本地校验，提交校验、code review、构建平台

业务开发

  • 公司基础业务开发

简历模板

面试流程

自我介绍模板

  • 个人基础信息介绍：毕业院校，时间，专业
  • 技术栈、端、长期涉及领域 —— 如:vue or react、pc 还是移动端、toB 业务还是 toC 业务等
  • 技术掌握程度 —— 如:精通 react/vue 原理、熟练掌握 css、熟悉混合开发、了 解 webpack 配置等
  • 业务方向以 —— 如:业务量、技术 pk 业务、技术亮点

    第一轮面试

    面试官：小组长（10-15人）或者master（导师）（P6-P5） :::info 考察能力：
  1. 笔试：js基础、算法、数据结构
  2. 技术基础：闭包、原型链、异步、css、html特性
  3. 框架能力：diff算法、虚拟dom，vue、react框架
  4. 技术细节：特定业务场景下的技术实现的细节 ::: 回答问题思路：这个是什么，在什么场景下比较常见，原理或者形成的原因，这个在平常工作中的应用，使用时需要注意什么/有什么问题。

面试场景复现
面试官问：闭包是什么？在什么场景比较常见 ？
求职着回答：
1.是什么？
闭包（closure）是一个函数以及其捆绑的周边环境状态（lexical environment，词法环境）的引用的组合。换而言之，闭包让开发者可以从内部函数访问外部函数的作用域。在 JavaScript 中，闭包会随着函数的创建而被同时创建。
2.形成的原理是?
闭包和函数是没有关系的，闭包的形成和作用域有关，每次生成函数的时候，会生成一个作用域，这个作用域生成的时候会记录内部使用的外部游离变量(自由变量)，闭包是scope中的clourse属性,这个属性保存了外部所有游离变量的引用。在大部分场景下面说起闭包会聊起函数，但其实不只是函数会生成闭包，eval方法也会产生闭包。js当中内存回收机制有两种，一个是引用计数法，一个是标记清除法(维护一个列表，如果变量在作用域没有引用就会销毁)，现在js引擎主要用的是标记清除法，如果函数的引用没有销毁的话，作用域内部的闭包也不会销毁。使用闭包的时候会导致变量常驻内存。
3.这个在平常工作中的应用？
异步中参数传递，节流防抖函数，react中的hooks、vue中的Observer数据监听
4.使用时需要注意什么？
闭包会导致变量常驻内存，如果没有及时销毁外部的函数作用域，会导致内存一直释放不了。为什么推荐不使用eval方法，因为eval的参数是一个js代码的字符串，生成这个作用域的时候不知道要保存哪些游离变量，所以干脆就把所有的游离变量都保存下来了，所以eval使用不当会导致内存升高。

第二轮面试

面试官：前端主管（P6+） :::info 考察能力：

  1. 业务能力：解决突发问题的能力技术转换成业务的能力 前端实际场景的经验
  2. 知识体系的完整性架构设计能力 工作流程建设

  3. 新技术掌握速度积极主动性 个人培养潜力 ::: 2面的时候经常会问的一个问题: 你做过让你印象最深刻的/或者说最复杂的一个问题是什么？你是怎么解决的？
    他其实想考察主要是你的 表达能力、解决突发问题的能力、解决问题思路等。
    回答: 性能、效率、稳定这几个方面去回答，比如解决线上的性能问题，提高开发效率，通过工程化方式优化前端的工作流

    第三轮面试

    面试官：项目经理（P7） :::info 考察能力

  4. 理目标/做规划对目标是否清晰 分析能力

  5. 沟通能力积极主动性 抗压能力

  6. 职业规划个人成长 ::: 你的职业规划是什么?（管理方向、业务专家、技术专家）
    回答:我以后想成为一个技术专家，打算提高自己的架构设计能力，拥有自己完备的技术体系，给公司和团队带来高效的开发体验，稳定的技术产品方案。
    从你的回答就能知道你以后在公司的定位，以及是否能找到适合你的职业，以后你后续的培养方向。

    第四轮面试

    面试官：HR :::info

  7. 个人的基本情况离职原因

  8. 公司的基本情况业务情况 团队情况
  9. 当前薪资组成base加上年终奖 五险一金比例
  10. 期望薪资base或者总包 ::: 和hr聊薪资的时候，不要说多少到多少，直接说一个期望的薪资
    在你完成3轮以上面试之后，你是占据优势的一方，聊薪资的时候可以强势一些

最后，有可能你没有面过四轮，可能一轮技术面试就能直接谈薪资了，不管是几轮面试，上述面试过程大差不差，如果你现在已经在公司了，那么你就要朝着这个方向去努力，等你下次找工作的时候，你就能应对自如了，同时也能拿到高薪工作。

如何选择公司

:::info 技术：技术分享体系，团队技术栈是否成熟，
业务：业务在公司是否比较核心（边缘业务随时会被裁员）
团队：团队氛围是否比较活跃，leader的是否比较符合你，团队做的事情是否有价值
成长：成长空间是否足够，是否有成熟的晋升体系和考核机制
薪资：薪资是否达到预期，同级别做的事情基本差不多（薪资可能天差地别） :::

开发流程

第01期-220331前端 副本 - 图2 :::info

  1. 如何上手工作
  2. 如何跟后端联调

  3. 遇到问题如何解决 :::

    参考文档

    :::info

  4. 需求文档

  5. 技术方案
  6. 测试用例 :::

    git工作流

    image.png
    git分支模型参考
    image.png
    分支命名规范
分支管理 命名规范 解释
master 主分支 master 稳定版本分支，上线完成回归后后，由项目技术负责人从 release 分支合并进来，并打 tag
test 测试分支 test/版本号
示例：test/1.0.0		 测试人员使用分支，测试时从 feature 分支合并进来，支持多人合并
feature 功能开发分支 feature/功能名称
示例：feature/blog		 新功能开发使用分支，基于master建立
bugfix修复分支 bugfix/功能名称
示例：fix/blog		 紧急线上bug修复使用分支，基于master建立
release 上线分支 release/版本号
示例：release/0.1.0		 用于上线的分支，基于 master 建立，必须对要并入的 分支代码进行 Code review 后，才可并入上线

版本管理规范

版本名称 定义 示例
主版本 含有破坏性更新、大调整等 1.1.0 > 2.0.0
次版本 增加新功能特性 1.1.0 > 1.2.0
补丁版本 修复问题等 1.1.0 > 1.1.1

部署流程

image.png

技术职级和晋升

p5 高级工程师

了解常见优化手段，熟悉常见的前端/移动端交互模式，能独立实现前端 /移动端交互功能
有较为丰富的开发经验，能负责一个独立项目的开发，有稳定的产出，能解决绝大多数项目的问题
在做技术规划和项目推进时能综合考虑技术方各种因素，合理安排工作
能独立完成复杂任务，能够发现并解决问题，能够独当一面

p6 资深工程师

在某一技术方向上(vue、react、性能优化、工程化等)有较深入的研究，且结合实际场景有高产出
在技术选型、方案设计以及技术调研方面能够提出有效的建议并推进实施
沟通、表达能力较强，能主导、推进跨团队或跨部门的沟通，具备作为初级工程师导师 的能力

P7 技术专家

在某个领域有深入的研究，并有一定的成就
能够带领一个团队实现公司的目标
具有熟练的架构能力，能把控整个项目

如何提升晋升力

  1. 刻意锻炼：沟通能力、规划分析能力、解决问题的能力
  2. 持续学习：培养长期学习的习惯，持续迭代完善自己的知识体系
  3. 影响力：多进行技术分享，多进行跨部门沟通，打造自己的个人影响力
  4. 技术体系：培养自己的技术体系，b端，c端，工程化(工程效率、工程质量)
  5. 目标规划：想清楚自己之后的目标是什么？管理岗或者技术专家岗
  6. 项目管理：目标和预期管理任务规划拆分

    Q&A环节

    问题记录
    …

    最后

    掘金：https://juejin.cn/user/430664288573789/posts
    B站：https://space.bilibili.com/511605498?spm_id_from=333.1007.0.0