当前位置:首页 > 数码 > 前端的十个棘手问题-检验你的知识储备! (前端)

前端的十个棘手问题-检验你的知识储备! (前端)

admin8个月前 (04-22)数码74

JavaScript 的变量提升是一种现象,即使用 var 关键字声明的变量会在编译时提升到作用域的顶部。

这会导致以下行为:

  • 变量在声明前可访问,但值为 undefined
  • 使用 let const 声明的变量不存在变量提升。

在 JavaScript 中, undefined 是一个全局属性,表示未赋值的变量或不存在的属性,而 null 表示一个空对象。

箭头函数是 ES6 中引入的一种语法简写,用于创建函数。

箭头函数的特点包括:

  • 没有自己的 this ,继承外部执行上下文的 this
  • 不能作为构造函数。

bind call apply 都是 JavaScript 中的函数,用于改变函数的 this 指向。

  • bind 不会立即执行函数,而是返回一个新的函数,该函数的 this 指向已更改。
  • call apply 在更改 this 指向的同时也会执行该函数。

this 是函数的执行上下文,分为全局执行上下文和函数执行上下文。

在非严格模式下,默认情况下 this 指向 window 对象,而在严格模式下, this 指向 undefined

this 的指向取决于函数的调用方式:

  • 作为构造函数:指向新创建的对象。
  • 作为普通函数:继承调用者的 this
  • 作为箭头函数:继承外部 this

map forEach 都是 JavaScript 中用于处理数组的函数,但它们有一些区别:

  • map 返回一个新数组,新数组的长度与原数组相同。
  • forEach 没有返回值,总是返回 undefined
  • map 的处理速度通常比 forEach 快。

浏览器的事件循环是一种机制,它将同步任务直接执行,并将异步任务排队。

前端

异步任务分为宏任务和微任务:

  • 宏任务:任务队列中的任务,如脚本代码、定时器。
  • 微任务:在宏任务完成后立即执行的任务,如 Promise

CSRF 是一种攻击,攻击者利用用户的身份盗取敏感信息。

防御措施包括:

  • 使用 CSRF 令牌。
  • 实现同源策略。

XSS 是一种攻击,攻击者通过注入恶意脚本代码来执行攻击。

防御措施包括:

  • 对输入进行编码。
  • 使用内容安全策略 (CSP)。

浏览器渲染页面的过程包括以下步骤:

  • 构建 DOM 树:将 HTML 转换为 DOM 结构。
  • 构建 CSSOM 树:将 CSS 样式转换为 CSS 对象模型 (CSSOM)。
  • 渲染:将 DOM 树和 CSSOM 树结合起来,在屏幕上显示页面。

面试Web前端需要注意什么?会面试哪些问题?

将这些问题作为参考。 希望你的面试官有点经验,不会用以下这样的问题开场。 以防万一,还是准备一些答案。 1.为什么选择程序员这个职业生涯?2.截至目前,你所从事的项目中最喜欢的是哪个?3.描述一下你梦想中的研发项目。 另外一些面试官会问一些通用的技术问题,来测试你的技术能力。 有可能部分人不知道这些问题是什么意思,而仅仅是在考察你的能力/竞争力。 基于面试官的技术能力级别的不同,你的答案也会有所不同。 这些问题简单易答,因此把这些问题记下来。 1.描述一下创建一个新网页的过程2.怎样减少页面加载时间?3.标准和标准体(standardsandstandardsbodies)为什么重要?4.你使用怎样一个过程来组织代码?5.你喜欢用什么工具来测试代码性能?[page]既然你从事前端工作,理解CSS会非常重要。 因此这里为你准备了一些常见的CSS问题。 这是展示你知识储备的重要开始。 这些并不是最尖锐或者重要的问题,如果不能回答出来,将对你很不利。 中的resetting和normalizing之间的区别有哪些?2.什么是floats,它是如何工作的?、relative、fixed和static定位的区别是什么?4.解释visiblityhidden和displaynone之间的区别5.你是如何修复特定浏览器默认样式的问题?6.你是否用过网格系统?目的是?7.如果计算CSS权重?8.解释如何优化CSS选择器。 9.为什么需要使用预编译器?10.你是如何测试网站的跨浏览器兼容性?现在我们最基本的任务完成了。 谁都能死记硬背这些答案来应付以上问题。 即使是新手前端开发者也能出色地回答大部分问题。 然而如果想真正让你的面试官印象深刻并证明你的功底深厚,就把下面这些问题牢记在心。 1.前端开发的框架是什么?2.响应式webapp和原生应用程序的区别是什么?3.原生app相对webapp的优点是什么?4.客户端和服务器端开发的区别是什么?5.什么是SASS和LESS?它们是如何工作的?面试官会更多关注你是如何表达对这些问题的解释。 他们会追问支持你的答案的工作案例。 前面的问题你可能可以通过记忆而过关,你可能还会遇到这些问题的扩展,但这些答案的深度,将让你与众不同。 通过你参与过的实际项目,来展示你的思考过程。

hr如何面试web前端工程师,该问哪些技术问题

近来几个月,一直在努力寻找前端战友,未果,一路的招聘经历下来,心生不少感慨, 一直都很小心翼翼的,怕错失了高人,又更加怕失误把关不够招到不合格的同学进来公司,对公司对项目造成某些影响。 面试前端工程师对我来说是一件非常有意思的事,因为面试过程很大程度上也是自我提升的过程。 无论大公司还是小公司,之所以在如何招聘到真正有能力的 前端工程师方面会遇到同样的问题,就是因为负责招聘的那些人不知道自己公司需要什么样的人,结果问问题时也问不到点子上。 经过这几年在行业里的摸索,我总 结出了自己的一套很有效的面试前端工程的方法。 有的应聘者说我不好对付,但留给他们这样的印象也并非我所愿。 我觉得之所以他们说我不好对付,主要是因为我问他们问题时问得太细了。 以前我曾专门写过一些 东西,告诉应聘者怎么才能通过我的面试(Surviving an interview with me)以及优秀的前面工程师应该具备什么样的素质(What makes a good front end engineer?),而我的面试可以说完全是按照那两篇文章的标准进行的。 我不会问一些特别偏门的问题,也不认为出几道逻辑题就能考出人的真实水平。 我 唯一的想法就是确定你能否胜任我们要招的这个职位。 为此,我需要简单地考察如下几个方面。 基本知识我们生活在互联网时代,你想知道的任何事情几乎都能在15分钟内找到相关信息。 可是,能找到信息并不等于你会使用它。 我认为所有前端工程师至少都应 该掌握某些基本的知识,才能有效地完成自己的工作。 如果一遇到问题,就停下工作上网四处搜索解决方案,怎么可能保证按期完成工作呢?听听,还有谁在说“我 不知道,但我可以上网搜到。 ”请这些同学把手举起来,让大家认识一下(immediately raises a flag for me.)。 下面我列出一些基本的知识点,这些都是我认为一名前端工程师(无论工作年头长短)在没有任何外来帮助的情况应该知道的。 DOM结构——两个节点之间可能存在哪些关系以及如何在节点之间任意移动。 DOM操作——怎样添加、移除、移动、复制、创建和查找节点。 事件——怎样使用事件以及IE和DOM事件模型之间存在哪些主要差别。 XMLHttpRequest——这是什么、怎样完整地执行一次GET请求、怎样检测错误。 严格模式与混杂模式——如何触发这两种模式,区分它们有何意义。 盒模型——外边距、内边距和边框之间的关系,IE 8以下版本的浏览器中的盒模型有什么不同。 块级元素与行内元素——怎么用CSS控制它们、它们怎样影响周围的元素以及你觉得应该如何定义它们的样式。 浮动元素——怎么使用它们、它们有什么问题以及怎么解决这些问题。 HTML与XHTML——二者有什么区别,你觉得应该使用哪一个并说出理由。 JSON——它是什么、为什么应该使用它、到底该怎么使用它,说出实现细节来。 重申一下,上述这些知识点都应该是你应该“想都不用想”的东西。 我一开始问的所有问题都是想摸清你对所有这些领域知识的掌握程度。 虽然上面列出的这些知识点并没有面面俱到,但我觉得你至少应该掌握这些,才有可能跟我坐到一间办公室里来。 少量提问我非常赞同面试者问的问题越少越好。 反复问应聘者各种问题既不公平,也很无聊。 我在任何一次面试中,通常只问三个大问题,但每个问题又会涉及我所能想到的多个方面。 回答每个大问题一般要经过几个步骤,这样我就可以在每个步骤中穿插着问一些小问题。 比如说:现在有一个正显示着Yahoo!股票价格的页面。 页面上有一个按钮,你可以单击它来刷新价格,但不会重新加载页面。 请你描述一下实现这个功能的过程,假设服务器会负责准备好正确的股票价格数据。 这个问题牵扯到一组我想要考察的基本知识点:DOM结构、DOM操作、事件处理、XHR和JSON。 如果我要求你对换一种处理股票价格的方式,或者 让你在页面中显示其他信息,就可以把更多的知识点包括进来。 对于经验比较丰富应聘者,我也可以自如地扩展要考察的知识范围,最简单像JOSN与XML的区 别、安全问题、容量问题,等等。 我还希望应聘者给出的任何解决方案中都不要使用库。 我想看到最原生态的代码,你就当页面中没有包含任何库。 你说你对哪个库了解多少多少,但我不能把 关于库的知识作为评判能力的因素,因为库是会随时间变化的。 我需要的是真正理解库背后的机制,特别是能够徒手写出一个自己的库的人。 解决问题做为一名前端工程师,最值得高兴的事莫过于解决同一个问题会有很多种不同的方法,而你要做的就是找出最合适的方法来。 我在提问的时候,经常会在应聘 者解释完一种方法后问他们还有没有第二种方法。 此时我会跟他们说,假设你的这个方法由于种种原因被否决了,那么你还能不能给出另一种方法。 这样做可以达到 两个目的。 首先,可以测试出他们是否在毫无意义地复述书本中的东西。 不能不承认,某些人确实有过目不忘的天赋,听他们在那里滔滔不绝地讲,你会觉得他们什么都 明白。 可是,只要一跟这些人谈到怎么查找方案无效的原因,以及能否拿出一个新方案来,他们往往就傻眼了。 这时候,如果我听到“我不明白这个方案为什么不够 好”之类的反问,心里立刻就明白我的问题已经超出了他们的能力范围,而他们只是想拿自己死记硬背的结论来蒙混过关。 其次,可以测试出他们已经掌握的(还是那句话,“想都不用想”)浏览器技术知识。 如果他们对浏览器平台的核心知识有较好的理解,想出解决同一问题的不同方案根本没有那么难。 对一名前端工程师来说,这绝对是最重要的能力。 前端工程师在工作中遇到本该如此却并未如此的难题(说你啦,IE6),应该说是一件很平常的事。 一个方案无效就无计可施的人,做不了前端工程师。 考核应聘者解决问题能力的另一层原因,与我的个人喜好有关。 在搞清楚应聘者知道什么不知道什么之后,我就会想着问一个他们知识领域之外的问题。 这样 做的目的,就是想看看他们怎样运用已有的知识解决新问题。 在解决问题的每一步,我也准备了一些提示,以防有人会卡壳打艮(在我面前15分钟一言不发,对我 评价这个人毫无帮助)。 我真正感兴趣的,是他们能够从上一步前进到下一步。 我希望看到一个人就在我眼前学到新知识。 注意:所有问题都与浏览器技术相关。 我不相信出几道抽象的逻辑题,就能够考出某人解决Web技术问题的能力。 在我看来,这无异于让素描大师画肖像(或者让刘翔跟博尔特同场竞技),没有意义,也得不到任何有价值的信息。 有激情要成为一名优秀的前端工程师,最重要的莫过于对自己做的事要有激情。 我们技能都不是从学校中或者从研讨会上学来的,因此前端工程师必须具备自学能 力。 浏览器技术的变化可谓日新月异,所以也只有不断提升自己的技能才做得到与时俱进。 我虽然不能强迫谁必须多看博客、不断学习,但想应聘前端工程师的人恐 怕还是必须这么做的。 你怎么知道谁对这种工作有没有激情?实际上非常简单。 我只问一个简单的问题:“目前你对什么Web技术最感兴趣?”这个问题永远不会过期,而且也几 乎不可能出错……除非你答不上来。 就眼下来说,我希望你对这个问题给出的技术中包括WebSocket、HTML、WebGL、客户端数据库,等等。 只有 对Web开发充满激情的人,才会坚持不懈地学习新知识、掌握新技能;这些人才是我真正想要的。 当然,我会让他们详细解释自己提到的技术,以保证他们不是随 口说了几个时髦的新词汇。 最后一点计算机科学或者Web设计方面的知识当然也有用,但那都是基本知识之外的东西。 只要基本知识在那儿了,一切就都有了基础,想扩充知识面也不难。 可 是,如果等到正式上班以后,还得从头学习基本技能,那种难度是不可同日而语的。 另外,高级前端工程师与一般工程师相比,肯定需要掌握更多的技能。 而面试几 乎没有经验大学毕业生,同样也会有一套完全不同的程序。 我在这篇文章里列出来的都是一些最基本的东西。 对于那些还没有多少面试经验的人,我总是喜欢告诉他们,面试完了只要问自己一个问题就行:你想以后跟这个人在一起共事吗?如果不管为什么,回答是不,那就是不。

免责声明:本文转载或采集自网络,版权归原作者所有。本网站刊发此文旨在传递更多信息,并不代表本网赞同其观点和对其真实性负责。如涉及版权、内容等问题,请联系本网,我们将在第一时间删除。同时,本网站不对所刊发内容的准确性、真实性、完整性、及时性、原创性等进行保证,请读者仅作参考,并请自行核实相关内容。对于因使用或依赖本文内容所产生的任何直接或间接损失,本网站不承担任何责任。

标签: 前端

“前端的十个棘手问题-检验你的知识储备! (前端)” 的相关文章

揭秘高效存储和增强用户体验之道-20k级别前端使用LocalStorage的秘密技巧 (常见存储高级技术的原理和实现)

揭秘高效存储和增强用户体验之道-20k级别前端使用LocalStorage的秘密技巧 (常见存储高级技术的原理和实现)

localStorage 和 sessionStorage 是两个在 Web 开发中广泛使用的 API,用于存储键值对。尽管它们使用起来非常方便,但也存在一些规范使用的问题。 规范使用问题...

优雅的前端国际化实现指南-b-b (时尚的前端)

优雅的前端国际化实现指南-b-b (时尚的前端)

Internationalization (i18n) is the process of adapting software applications and content to differ...

前端请求到后端API的中间件流程解析 (前端请求到后端的详细过程)

前端请求到后端API的中间件流程解析 (前端请求到后端的详细过程)

在前端请求到后端 API 的典型流程中,请求经过一系列中间件的处理,以确保请求的顺利处理和安全性。以下是中间件的详细解析: 前端请求 用户在前端发起请求,包括请求的 URL、参数以及其...

不容错过的前端开发技术 (不容错过的前一句)

不容错过的前端开发技术 (不容错过的前一句)

作为一名软件开发人员,跟上最新的发展至关重要。对于前端开发而言,这一点尤为关键,因为它旨在为用户创造无缝且引人入胜的体验。以下是前端开发领域中一些最流行的技术,它们将在 2023年大受欢迎:...

前端常用设计模式初探 (前端常用设计模式有哪些)

前端常用设计模式初探 (前端常用设计模式有哪些)

设计模式是一组可重复使用的解决方案,用于解决软件设计中的常见问题。它们提供了将代码组织成可重用、灵活和易于维护的形式的蓝图。 常用原则 在了解设计模式之前,让我们先回顾一下一些重要的常...

十分钟搞定前端虚拟列表-用于处理超长列表的优化技术

十分钟搞定前端虚拟列表-用于处理超长列表的优化技术

在处理包含大量数据的列表时,前端性能往往是一个重要的考虑点。传统的滚动列表组件在处理大数据量时可能会非常卡顿,甚至导致页面崩溃。那么针对这个问题,虚拟列表的概念就出现了,随后又出现了各种各样的虚拟...

从零到一的实操指南-构建前端团队组件系统 (从零到一的实数有哪些)

从零到一的实操指南-构建前端团队组件系统 (从零到一的实数有哪些)

前言 随着vue/react这类以数据驱动为主的web框架的始终完善和壮大,越来越多的前端团队开局着手搭建外部的组件库。只管目前市面上曾经有很多性能弱小且完善的组件库供我们经常使用,比如基于...