前端面试和一些建议

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

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

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

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

嗯,还有就是如果能力不达标,简历就写(包装?)的不要那么好,我看了一个小姐姐的简历,我还和另一个前端说,这个小姐姐应该可以,但在面试过程中,问的都是她简历里的工作职责,她都回答不上来,然后就问她如果自己在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基础,可能在这个账号会更新学习记录和 心得,如果感兴趣的话可以关注一下哦。

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

[论文阅读] 测试时间自适应TTA

最初接触 CVPR2024 TEA: Test-time Energy Adaptation [B站](1:35:00-1:53:00)https://www.bilibili.com/video/BV1wx4y1v7Jb/?spm_id_from333.788&vd_source145b0308ef7fee4449f12e1adb7b9de2 实现: 读取预训练好的模型参数设计需要更…

C语言写一个终端进度条

C语言写一个终端进度条 这个功能挺简单的,主要有以下两点: 如何获取终端宽度如何让字符在原地闪烁 如何获取终端宽度 这里用到了设备控制接口函数ioctl(),下面简单的介绍一下这个函数的用法: ioctl是一个在Unix和类Unix系统中…

怎样通过Java语言实现远程控制8路控制器/断路器

怎样通过Java语言实现远程控制8路控制器/断路器呢? 本文描述了使用Java语言调用HTTP接口,实现控制8路控制器/断路器,支持8路输出,均可独立控制,可接入各种电器。 可选用产品:可根据实际场景需求&#xff0…

【数据库主从架构】

【数据库主从架构】 1. 什么是数据库的主从架构1.1 主从复制1.1.1 MySQL的主从主从复制技术三级目录 1. 什么是数据库的主从架构 随着公司业务线的增多,各种数据都在迅速增加,并且数据的读取流量也大大增加,就面临着数据安全问题,…

手把手教你实现通讯录

整体构思 我们现在要实现一个通讯录 它应该有以下的功能 通讯录可以用来存储1000个人的信息,每个人的信息包括:姓名、性别、年龄、电话、住址 提供方法: 1.添加联系人信息 2.删除指定联系人信息 3.查找指定联系人信息 4.修改指定联系人信…

如何删除BigKey2

例2:假如有hash类型的key,其中有100万对field和value,field是自增id,这个key存在什么问题?如何优化? keyfieldvaluesomeKeyid:0value0..........id:999999value999999 存在的问题: hash的ent…

BJFUOJ-C++程序设计-实验2-类与对象

A 评分程序 答案&#xff1a; #include<iostream> #include<cstring>using namespace std;class Score{ private:string name;//记录学生姓名double s[4];//存储4次成绩&#xff0c;s[0]和s[1]存储2次随堂考试&#xff0c;s[2]存储期中考试&#xff0c;s[3]存储期…

机器学习:深入解析SVM的核心概念【二、对偶问题】

对偶问题 **问题一&#xff1a;什么叫做凸二次优化问题&#xff1f;而且为什么符合凸二次优化问题&#xff1f;**为什么约束条件也是凸的半空间&#xff08;Half-Space&#xff09;凸集&#xff08;Convex Set&#xff09;半空间是凸集的例子SVM 约束定义的半空间总结 **问题二…

使用Colab的高RAM模式

使用Colab的高RAM模式 colab需要升级为pro或者pro会员 1. 购买pro 图片来源&#xff1a;https://blog.csdn.net/javastart/article/details/138094086 2. 打开高RAM模式 要在Colab上使用高RAM模式来运行模型计算&#xff0c;您需要按照以下步骤操作&#xff1a; 打开您的…

Deep Learning Part Five RNNLM的学习和评价-24.4.30

准备好RNNLM所需要的层&#xff0c;我们现在来实现RNNLM&#xff0c;并对其进行训练&#xff0c;然后再评价一下它的结果的。 5.5.1 RNNLM的实现 这里我们将RNNLM使用的网络实现为SimpleRnnlm类&#xff0c;其层结构如下&#xff1a; 如图 5-30 所示&#xff0c;SimpleRnnlm …

调教AI给我写了一个KD树的算法

我不擅长C&#xff0c;但是目前需要用C写一个KD树的算法。首先我有一份点云数据&#xff0c;需要找给定坐标范围0.1mm内的所有点。 于是我开始问AI&#xff0c;他一开始给的答案&#xff0c;完全是错误的&#xff0c;但是我一步步给出反馈&#xff0c;告诉他的问题&#xff0c;…

基于Springboot的交流互动系统

基于SpringbootVue的交流互动系统的设计与实现 开发语言&#xff1a;Java数据库&#xff1a;MySQL技术&#xff1a;SpringbootMybatis工具&#xff1a;IDEA、Maven、Navicat 系统展示 用户登录 首页 帖子信息 聚会信息 后台登录 后台管理首页 用户管理 帖子分类管理 帖子信息…

【模板】二维前缀和

原题链接&#xff1a;登录—专业IT笔试面试备考平台_牛客网 目录 1. 题目描述 2. 思路分析 3. 代码实现 1. 题目描述 2. 思路分析 二维前缀和板题。 二维前缀和&#xff1a;pre[i][j]a[i][j]pre[i-1][j]pre[i][j-1]-pre[i-1][j-1]; 子矩阵 左上角为(x1,y1) 右下角(x2,y2…

自然语言处理基础

文章目录 一、基础与应用简单介绍基本任务重要应用 二、词表示与语言模型词表示方案一&#xff1a;用一组的相关词来表示当前词方案二&#xff1a;one-hot representation&#xff0c;将每一个词表示成一个独立的符号方案三&#xff1a;上下文表示法&#xff08;contextual rep…

Mamba3D革新3D点云分析:超越Transformer,提升本地特征提取效率与性能!

DeepVisionary 每日深度学习前沿科技推送&顶会论文分享&#xff0c;与你一起了解前沿深度学习信息&#xff01; Mamba3D革新3D点云分析&#xff1a;超越Transformer&#xff0c;提升本地特征提取效率与性能&#xff01; 引言&#xff1a;3D点云分析的重要性与挑战 3D点云…

Python语言零基础入门——文件

目录 一、文件的基本概念 1.文件 2.绝对路径与相对路径 3.打开文件的模式 二、文件的读取 三、文件的追加 四、文件的写入 五、with语句 六、csv文件 1.csv文件的读取 2.csv文件的写入 七、练习题&#xff1a;实现日记本 一、文件的基本概念 1.文件 文件是以计算…

【Android学习】简易计算器的实现

1.项目基础目录 新增dimens.xml 用于控制全部按钮的尺寸。图片资源放在drawable中。 另外 themes.xml中原来的 <style name"Theme.Learn" parent"Theme.MaterialComponents.DayNight.DarkActionBar">变为了&#xff0c;加上后可针对button中增加图片…

最新AI创作系统,ChatGPT商业运营系统网站源码,SparkAi-v6.5.0,Ai绘画/GPTs应用,文档对话

一、文章前言 SparkAi创作系统是基于ChatGPT进行开发的Ai智能问答系统和Midjourney绘画系统&#xff0c;支持OpenAI-GPT全模型国内AI全模型。本期针对源码系统整体测试下来非常完美&#xff0c;那么如何搭建部署AI创作ChatGPT&#xff1f;小编这里写一个详细图文教程吧。已支持…

【C语言的完结】:最后的测试题

看到这句话的时候证明&#xff1a; 此刻你我都在努力~ 个人主页&#xff1a; Gu Gu Study ​​ 专栏&#xff1a;语言的起点-----C语言 喜欢的一句话&#xff1a; 常常会回顾努力的自己&#xff0c;所以要为自己的努力留下足迹…

Delta lake with Java--数据增删改查

之前写的关于spark sql 操作delta lake表的&#xff0c;总觉得有点混乱&#xff0c;今天用Java以真实的数据来进行一次数据的CRUD操作&#xff0c;所涉及的数据来源于Delta lake up and running配套的 GitGitHub - benniehaelen/delta-lake-up-and-running: Companion reposito…