前端面试和一些建议

news2024/10/6 14:38:52

最近公司在招前端,我有跟着一起参与面试。我们主要负责面试的人,不会问那些什么闭包,原型链,他觉得那些东西在我们日常开发中用不到,问的基本都是一些工作中的问题。这些问题不是每次都问,但也就问这些了。我这里记录一下并且碎碎念一下。

因为我工作经验比较少,所以会比较注意项目职责中做的性能优化和适配,,还有优化底层逻辑。比如简历里的项目职责有写“针对小程序的性能进行优化,包括但不限于页面加载速度、交互流畅度等方面,并确保小程序在不同平台和设备上的兼容性”,“通过代码压缩、资源合并、缓存优化等手段提高网站或应用的加载速度和性能,提升用户体验”等。

我都会对这些进行提问,因为我在工作中没有做过这方面的工作,也比较感兴趣,但问的大部分面试者都回答不上,所以我的建议是项目职责写了的就一定要回答的上来,不然就不要写,强烈建议,不然你尴尬,我也有点尴尬。

还有就是男生不要留长指甲,面试了一个男生,指甲非常长,十个都长,就是和女生弄了甲片的长度一样长,然后也不修,没有甲型,就是真的会因为这个原因而不录取。

嗯,还有就是如果能力不达标,简历就写(包装?)的不要那么好,我看了一个小姐姐的简历,我还和另一个前端说,这个小姐姐应该可以,但在面试过程中,问的都是她简历里的工作职责,她都回答不上来,然后就问她如果自己在vue里封装一个弹窗,要怎么做,结构应该是什么样的,也回答不上来,就,我也不知道该怎么说了。

还有就是,我面试的话都会自己带一份简历以备不时之需,但面试的大部分面试者,都俩手空空,是只有我这样吗?emmm,不知道了。

我觉得我们的问题真的很人性化,不需要你死记硬背那些面试题,就问的都是平时工作中遇到的,和简历里自己提到的。希望大家和我以后面试都可以顺利通过,面试成功。我会对这些问题回答一下如果是我自己的话,怎么回答。(ps:我自己的工作经验还没有一年,就是我也不是大佬,是小白,有什么错误可以提出指正,仅供参考啊)嗯,希望有帮助到你?

  1. 你可以自己搭建项目吗?从什么开始入手
  2. 工作中遇到过最大的bug?
  3. 工作这么长时间有什么值得说的项目?
  4. 有对项目的目录进行过优化吗?
  5. 写一个项目会考虑那些问题?
  6. 近期有学到什么新的知识吗?
  7. 对现在智能化的东西有了解吗?
  8. 对后面的职业规划?
  9. 使用过pinia吗?常用的API?使用场景?
  10. 知道递归吗?使用场景?
  11. 知道或使用过hooks吗?使用场景
  12. 使用过echarts吗?有在echarts的基础上做过改动吗?
  13. var,const,let的区别,const不可以改变吗?
  14. js中的异步操作有那些?
  15. ref与reactive的区别与使用场景?
  16. 平时会在什么地方学习新知识?
  17. 对我们公司或对我们部门有什么想了解的?

对你有帮助吗?有的话点个赞或者收藏吧.

你可以自己搭建项目吗?从什么开始入手?

我在工作中还没有,基本公司都有模板。但如果我回答的话,可能会这么说,如下

首先就是需求分析,会选择合适的技术栈,是vue2还是vue3,项目初始化,构建工具是使用vite还是Webpack.使用什么UI框架或组件库,封装axios请求,然后确定路由是动态还是静态的等。
 

有对项目的目录进行过优化吗? 

我没有,但我去网上找了一下,

我采用了模块化的开发方式,将代码拆分为独立的模块或组件。这不仅提高了代码的可重用性,还使得项目的目录结构更加清晰。

我还遵循了命名规范,为文件和目录选择了有意义的名称。良好的命名习惯使得项目的目录结构更加易读易懂。

在资源管理方面,我合理管理了项目中的静态资源,并将不同类型的资源放置在不同的目录中。这有助于提高项目的可维护性。

我还对项目的构建流程进行了优化,使用构建工具进行自动化构建、代码压缩、文件合并等操作,以提高构建过程的效率和可靠性。

最后,我定期审查和优化项目的目录结构,以适应新的需求和最佳实践。我相信持续的优化工作可以提高项目的质量和开发效率。

写一个项目会考虑那些问题?

  1. 需求分析:在开始编写项目之前,首先需要对项目的需求进行全面的分析和理解。这包括确定项目的功能、目标用户、用户需求、技术需求等。只有清楚地了解项目的需求,才能有针对性地进行后续的规划和开发。

  2. 技术选型:在确定项目的需求之后,需要根据项目的特点和需求选择合适的技术栈。这包括选择前端框架(如React、Vue.js、Angular等)、构建工具(如Webpack、Parcel等)、状态管理库、UI组件库等。技术选型的合理性对项目的后续开发和维护具有重要影响。

  3. 项目架构设计:在确定了技术栈之后,需要对项目的架构进行设计。这包括确定项目的目录结构、模块划分、组件设计等。良好的项目架构设计能够提高项目的可维护性、可扩展性和性能。

  4. 数据设计:对于涉及数据操作的项目,需要进行数据设计,包括数据库设计、数据接口设计等。合理的数据设计能够保证数据的完整性、一致性和安全性。

  5. 安全性考虑:在编写项目时需要考虑安全性问题,包括防止XSS攻击、CSRF攻击、SQL注入等。合理的安全性设计能够保护用户数据和系统安全。

  6. 性能优化:项目上线后需要考虑性能优化问题,包括页面加载速度优化、资源压缩、缓存策略等。优化项目的性能能够提升用户体验和网站的排名。

  7. 跨平台兼容性:在编写项目时需要考虑跨平台兼容性,包括不同浏览器、不同设备的兼容性。合理的兼容性设计能够确保项目在不同平台上的正常运行。

  8. 测试策略:编写项目时需要考虑测试策略,包括单元测试、集成测试、端到端测试等。合理的测试策略能够提高项目的质量和稳定性。

 使用过pinia吗?常用的API?使用场景?ai回答

我确实有使用过 Pinia,它是一个基于 Vue 3 的状态管理库,专门为 Vue 3 应用程序设计。Pinia 提供了一种简洁且优雅的方式来管理应用程序的状态,并且与 Vue 3 的响应式系统无缝集成。

在 Pinia 中,最常用的 API 包括:

  1. defineStore:用于定义一个状态管理仓库(Store),通过该 API 可以定义状态、获取状态、修改状态等操作。

  2. useStore:用于在组件中使用状态管理仓库,返回一个代表该仓库的实例,通过该实例可以访问仓库中定义的状态和方法。

  3. createPinia:用于创建 Pinia 实例,可以通过该实例注册和管理应用程序中的所有状态管理仓库。

  4. store.$state:用于访问状态管理仓库中的状态,可以直接在组件中通过 $state 访问状态。

  5. store.$actions:用于访问状态管理仓库中的动作(Actions),可以通过 $actions 调用仓库中定义的动作。

  6. store.$getters:用于访问状态管理仓库中的 getters,可以通过 $getters 获取仓库中定义的 getters。

  7. store.$subscribe:用于在组件中订阅状态管理仓库中状态的变化,当状态发生变化时,会触发相应的回调函数。

  8. store.$reset:用于重置状态管理仓库的状态,将状态恢复到初始值。

使用 Pinia 的场景主要包括:

  1. 大型应用程序:Pinia 适用于大型应用程序的状态管理,它提供了一种清晰且可维护的方式来管理应用程序的状态,使得代码结构更加清晰易懂。

  2. 跨组件状态共享:Pinia 支持在多个组件之间共享状态,可以在应用程序中方便地实现跨组件状态共享。

  3. 类型安全:Pinia 提供了类型安全的状态管理方案,可以有效地避免状态相关的错误,并提高代码的健壮性和可维护性。

  4. Vue 3 生态集成:Pinia 是专为 Vue 3 设计的状态管理库,与 Vue 3 的响应式系统无缝集成,可以充分利用 Vue 3 的特性和生态系统。

总的来说,Pinia 是一个功能强大且易于使用的 Vue 3 状态管理库,适用于大型应用程序的状态管理,能够提高代码的可维护性和可测试性,是 Vue 3 应用程序开发中的一种理想选择。

或者

1. pinia 和 vuex 具有 相同的功效, 是 Vue 的存储库,它允许您跨组件/页面共享状态。2. 设计使用的是 Composition api,更符合vue3的设计思维。3. Pinia 对 Vue 2 和 Vue 3 都有效,并且不需要您使用组合 API

2、1 Vue2 和 Vue3 都能支持。2. 抛弃传统的 Mutation ,只有 state, getter 和 action ,简化状态管理库。3. 不需要嵌套模块,符合 Vue3 的 Composition api,让代码扁平化。4. TypeScript支持。5. 代码简介,很好的代码自动分割 总结 : Pinia的优势就是,更加 简洁 的语法,完美支持Vue3的Composition api 和 对TypeSccript 的完美支持。

对现在智能化的东西有了解吗?

其实是想问对AI了解吗?比如说会用ChatGPT辅助写代码吗,我们前端想听到的是会,因为这样会觉得你是一个对新东西接受了比较高的人,不知道同样的问题其他的面试官想听到的答案是什么,但我觉得可以说会,有时候遇到一些代码上的问题可以找它解决,有ChatGPT,或者国内的讯飞星火等 

var,const,let的区别,const不可以改变吗? 

区别

var:

  • 使用 var 声明的变量属于函数作用域或全局作用域(如果在函数外声明),而不是块级作用域。
  • var 声明的变量可以被重复声明,而且不会报错,这可能导致意外的覆盖。
  • 声明提升:var 声明的变量会在其所在函数或全局范围内提升到函数或全局作用域的顶部,但初始化的值不会提升。

const:

  • 使用 const 声明的变量是常量,一旦被赋值就不能再被修改。
  • 声明 const 变量时必须进行初始化,否则会抛出 SyntaxError 错误。
  • const 声明的变量也具有块级作用域。

let:

  • 使用 let 声明的变量具有块级作用域,只在声明的块级作用域内有效。
  • 不允许重复声明同一变量,如果在同一作用域内重复声明同一变量,会抛出 SyntaxError 错误。
  • 声明提升:和 var 不同,let 声明的变量在块级作用域内是不会被提升的。

const不可以改变吗?

因为你说const一旦赋值就不能被修改,进而引出这个问题

所以对于对象和数组等复合类型数据,const 只保证了变量指向的内存地址不会改变,而不是对象或数组本身的内容不可修改。

const PI = 3.14;
PI = 3; // Error: Assignment to constant variable.

const obj = { name: 'John' };
obj.name = 'Alice'; // No error, because only the property of the object is being modified, not the reference itself

console.log(obj); // { name: 'Alice' }

obj = { age: 30 }; // Error: Assignment to constant variable.

在上面的例子中,对于基本类型的常量,尝试重新赋值会导致错误。但是对于对象 obj,虽然我们不能重新赋值一个新的对象给 obj,但是我们可以修改对象的属性,因为对象的引用并没有改变。

平时会在什么地方学习新知识? 

提问时也可能问会逛什么社区?记住,就是想问你有没有逛csdn什么的,有一个面试者不知道没听清还是怎么了,回答我们,平时比较宅,不怎么出去逛。

csdn,blili,知乎,掘金,github等,不要在回答没事干比较宅,不出去逛。

对后面的职业规划?

这个是肯定要在面试之前要想好的,这个问题应该是每次面试必问的吧?
如果你目前前端技术还不怎么样,就说近期把js所有都搞懂什么的,或者你对后端感兴趣,有Python也可以说后面想往全栈发展。比如我最近打算看一下那个javascript高级程序设计。

对基础知识了解加深一下,你也可以说对tree.js感兴趣,反正,吹嘛,一年两年以后不知道还在不在这个公司了呢。还有的面试者自学了nood.js,python说后面想自己一个网站,卖课什么的,反正这些目前我都不太懂,和另一个面试官聊的(全栈),反正就基于目前的能力对后面进行职业规划吧。

 

今天先这样,后面慢慢更新。。。。

最近准备学javascript基础,可能在这个账号会更新学习记录和 心得,如果感兴趣的话可以关注一下哦。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1640239.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

基于Unity+Vue通信交互的WebGL项目实践

unity-webgl 是无法直接向vue项目进行通信的,需要一个中间者 jslib 文件 jslib当作中间者,unity与它通信,前端也与它通信,在此基础上三者之间进行了通信对接 看过很多例子:介绍的都不是很详细,不如自己写&…

(39)4.29数据结构(栈,队列和数组)栈

#include<stdlib.h> #include<stdio.h> #define MaxSize 10 #define Elemtype int 1.栈的基本概念 2.栈的基本操作 typedef struct { Elemtype data[MaxSize]; int top; }Sqstack;//初始化栈 void InitStack(Sqstack& S) { S.top -1; //初始化…

4G小车的公网直播推流

一直想做一个小车, 可以通过4G推流, 没想到现在很多云服务提供商, SRS云服务器已经可以一键搭建了. 硬件方面, 就是一个1126驮着一个3516, 1126负责4G连接, 转流到Intenet, 3516负责vi_venc_rtsp 思路如下, 我的1126的摄像头一直没能横过来, 所以就不用1126的摄像头了, 先用35…

Redis-概述-安装-基本知识

Redis概述 Redis是什么 Redis&#xff08;Remote Dictionary Server 远程字段服务&#xff09;是一个开源的使用ANSI C语言编写、支持网 络、内存亦可持久化的key-value数据库&#xff0c;并提供多种语言的API。Redis是一个key-value存储系统&#xff0c;它支持存储的value类型…

好用的AI工具推荐与案例分析

你用过最好用的AI工具有哪些&#xff1f; 简介&#xff1a;探讨人们在使用AI工具时&#xff0c;最喜欢的和认为最好用的工具是哪些&#xff0c;展示AI技术的实际应用和影响。 方向一&#xff1a;常用AI工具 在选择常用AI工具时&#xff0c;可以根据不同的应用场景和需求来挑选…

华为平板手机如何清理应用市场的存储空间

如何清理应用市场的存储空间 适用产品&#xff1a; 手机&#xff0c;平板 适用版本&#xff1a;不涉及系统版本 如果您的应用市场显示应用的数据较大&#xff0c;可能是下载的安装包没有安装成功&#xff0c;导致安装包未自动删除。&#xff08;可参考&#xff1a;应用市场下…

【QT】初始QT

目录 一.背景1.GUI开发的各种技术方案2.什么是框架3.QT支持的系统4.QT的版本5.QT的优点6.QT的应用常见 二.环境搭建1.认识QTSDK中的重要工具2.使用QT Creator创建项目3.项目解释(1)main.cpp(2)widget.h(3)widget.cpp(4)widget.ui(5)Empty.pro(6)临时文件 三.初始QT1.Hello Worl…

STM32单片机通过串口控制DDSM210 直驱伺服电机

1 电机介绍 官方资料&#xff1a;https://www.waveshare.net/wiki/DDSM210 DDSM210 直驱伺服电机是基于一体化开发理念&#xff0c;集外转子无刷电机、编码器、伺服驱动于一体的高可靠性永磁同步电动机&#xff0c;其结构紧凑&#xff0c;安装方便&#xff0c;运行稳定&#x…

飞致云开源社区月度动态报告(2024年4月)

自2023年6月起&#xff0c;中国领先的开源软件公司FIT2CLOUD飞致云以月度为单位发布《飞致云开源社区月度动态报告》&#xff0c;旨在向广大社区用户同步飞致云旗下系列开源软件的发展情况&#xff0c;以及当月主要的产品新版本发布、社区运营成果等相关信息。值得注意的是&…

服务器数据恢复—多块磁盘离线导致阵列瘫痪,上层lun不可用的数据恢复案例

服务器存储数据恢复环境&#xff1a; 某品牌MSA2000存储&#xff0c;该存储中有一组由8块SAS硬盘&#xff08;其中有一块热备盘&#xff09;组建的RAID5阵列&#xff0c;raid5阵列上层划分了6个lun&#xff0c;均分配给HP-Unix小型机使用&#xff0c;主要数据为oracle数据库和O…

链表面试题及其解析

1.返回倒数第k个节点 实现一种算法&#xff0c;找出单向链表中倒数第 k 个节点。返回该节点的值。 示例&#xff1a; 输入&#xff1a; 1->2->3->4->5 和 k 2 输出&#xff1a; 4 说明&#xff1a; 给定的 k 保证是有效的。 1.1快慢指针 即慢指针一次走一步…

[C++][数据结构]二叉搜索树:介绍和实现

二叉搜索树 概念 二叉搜索树又称二叉排序树&#xff0c;它是一棵空树&#xff0c;或者是具有以下性质的二叉树: 若它的左子树不为空&#xff0c;则左子树上所有节点的值都小于根节点的值若它的右子树不为空&#xff0c;则右子树上所有节点的值都大于根节点的值它的左右子树也…

JavaScript中的Math对象方法、Date对象方法

个人主页&#xff1a;学习前端的小z 个人专栏&#xff1a;JavaScript 精粹 本专栏旨在分享记录每日学习的前端知识和学习笔记的归纳总结&#xff0c;欢迎大家在评论区交流讨论&#xff01; 文章目录 &#x1f31f;Math对象方法&#x1f344;1 Math静态属性&#x1f344;2 Math…

Vue阶段练习:组件拆分

页面开发思路 分析页面&#xff0c;按模块拆分组件&#xff0c;搭架子&#xff08;局部或全局注册&#xff09;根据设计图&#xff0c;编写html结构css样式拆分封装通用小组件&#xff08;局部或全局注册&#xff09;将来通过js动态渲染实现功能 BaseBrandItem.vue <templ…

A5资源网有哪些类型的资源可以下载?

A5资源网提供了广泛的资源下载&#xff0c;包括但不限于以下类型&#xff1a; 设计素材&#xff1a;包括各类图标、矢量图、背景素材、UI界面元素等&#xff0c;适用于网页设计、平面设计等领域。 图片素材&#xff1a;提供高质量的照片、插图、摄影作品等&#xff0c;可用于…

使用STM32F103C8T6与蓝牙模块HC-05连接实现手机蓝牙控制LED灯

导言: 在现代智能家居系统中,远程控制设备变得越来越普遍和重要。本文将介绍如何利用STM32F103C8T6单片机和蓝牙模块HC-05实现远程控制LED灯的功能。通过这个简单的项目,可以学会如何将嵌入式系统与蓝牙通信技术相结合,实现远程控制的应用。 目录 导言: 准备工作: 硬…

ue引擎游戏开发笔记(27)——解决角色移动及转动存在卡顿掉帧小技巧

1.需求分析&#xff1a; 随之游戏越来越大&#xff0c;难免出现部分时候移动出现卡顿&#xff0c;能否进行一定优化。 2.操作实现&#xff1a; 1.思路&#xff1a;采取捕获最后deltaseconds来逐帧进行旋转或移动&#xff0c;使动作显得不那么卡顿。 .2.首先在引擎中建立映射&a…

【深度学习】第一门课 神经网络和深度学习 Week 4 深层神经网络

&#x1f680;Write In Front&#x1f680; &#x1f4dd;个人主页&#xff1a;令夏二十三 &#x1f381;欢迎各位→点赞&#x1f44d; 收藏⭐️ 留言&#x1f4dd; &#x1f4e3;系列专栏&#xff1a;深度学习 &#x1f4ac;总结&#xff1a;希望你看完之后&#xff0c;能对…

DRF解析器源码分析

DRF解析器源码分析 1 解析器 解析请求者发来的数据&#xff08;JSON&#xff09; 使用 request.data 获取请求体中的数据。 这个 reqeust.data 的数据怎么来的呢&#xff1f;其实在drf内部是由解析器&#xff0c;根据请求者传入的数据格式 请求头来进行处理。 drf默认的解…

连接一个 IP 不存在的主机时,会发生什么?(面试)

一、IP 不存在时 如果 IP 在局域网内&#xff0c;会发送 N 次 ARP 请求获得目的主机的 MAC 地址&#xff0c;同时不能发出 TCP 握手消息。 如果 IP 在局域网外&#xff0c;会将消息通过路由器发出&#xff0c;但因为最终找不到目的地&#xff0c;触发 TCP 重试流程。 二、IP…