从面试角度了解前端基础知识体系
目录
前端专业知识相关面试考察点
HTML 与 CSS
Javascript
网络相关
浏览器相关
安全相关
算法与数据结构
计算机通用知识
前端项目经验相关面试考察点
前端框架与工具库
Node.js 与服务端
性能优化
前端工程化
开发效率提升
监控、灰度与发布
多人协作
结束语
这两年大裁员过后,带来了一系列的人员变动,常常面临着不受宠的被辞退了,能干的人跑了,剩下的人在努力维护着项目。于是乎老板们才发现人好像又不够了,然后又开始各种招人。机会一直都有,重要的还是得努力提升自己的能力,才能在这场战斗中存活下来。
前端开发中相对基础的一些内容,主要围绕着 HTML/CSS/Javascript 和浏览器等相关。这些基础知识的掌握是必须的,但有些时候在工作中未必会用到。例如有些项目前后端部署在一起,并不会存在跨域一说,那么可能在开发过程中不会遇到浏览器请求跨域和解决方案相关问题。除了通过不断地学习和在项目中练习,或许从面试的角度来补齐相应的专业知识,可以给我们带来更大的动力。
本文的内容包括:
- 前端专业知识相关面试考察点
- 前端项目经验相关面试考察点
前端专业知识相关面试考察点
首先我们会针对前端开发相关来介绍需要掌握的一些知识,内容会包括 Javascript、HTML 与 CSS、网络相关、浏览器相关、安全相关、算法和计算机通用知识。
由于篇幅关系,下面会以关键知识点和问题的方式进行描述,并不会提供具体的答案和详细的内容描述。因此,大家可以针对提到的知识点和问题去进行深入学习和发散,也可以去网上搜一些相关的题目,结合大家的答案去尝试进行理解和解答。
HTML 与 CSS
关于 HTML 的内容会较少单独地问,更多是结合浏览器机制等一起考察:
- DOM 操作是否会带来性能问题
- 事件冒泡/事件委托
关于 CSS,也有以下的一些考察点:
- 介绍盒子模型
- 内联元素与块状元素、
display
- 文档流的理解:
static
/relative
/absolute
/fixed
等 - 元素堆叠:
z-index
与position
的作用关系 - Flex 布局方式的理解和使用
- Grid 布局方式的理解和使用
- BFC 的优点和缺点
- CSS 动画考察:关键帧、
animate
、transition
等
很多时候,面试官也会通过让候选人编码实现某些样式/元素的方式,来考察候选人对 CSS 的掌握程度,其中布局(居中、对齐等)会比较容易考察到。
Javascript
前端最基础的技能包括 Javascript、CSS 和 HTML,尤其是新人比较容易遇到这方面的考察。对于 Javascript 会问到多一些,通常包括:
考察范围 | 具体问题 |
---|---|
对单线程 Javascript 的理解 | 单线程来源 Web Workers 和 Service Workers 的理解 |
异步事件机制 | 为什么使用异步事件机制 在实际使用中异步事件可能会导致什么问题 关于 setTimeout 、setInterval 的时间精确性 |
对 EventLoop 的理解 | 介绍浏览器的 EventLoop 宏任务(MacroTask)和微任务(MicroTask)的区别 setTimeout 、Promise 、async /await 在不同浏览器的执行顺序 |
Javascript 的原型和继承 | 如何理解 Javascript 中的“一切皆对象” 如何创建一个对象 proto 与prototype 的区别 |
作用域与闭包 | 请描述以下代码的执行输出内容(考察作用域) 什么场景需要使用闭包 闭包的缺陷 |
this 与执行上下文 | 简单描述this 在不同场景下的指向apply /< |
相关文章:
从面试角度了解前端基础知识体系
目录 前端专业知识相关面试考察点 HTML 与 CSS Javascript 网络相关 浏览器相关 安全相关 算法与数据结构 计算机通用知识 前端项目经验相关面试考察点 前端框架与工具库 Node.js 与服务端 性能优化 前端工程化 开发效率提升 监控、灰度与发布 多人协作 结束语…...
【DKN: Deep Knowledge-Aware Network for News Recommendation】
DKN: Deep Knowledge-Aware Network for News Recommendation 摘要 在线新闻推荐系统旨在解决新闻信息爆炸的问题,为用户进行个性化推荐。 总体而言,新闻语言高度凝练,充满知识实体和常识。 然而,现有的方法并没有意识到这些外部…...
Linux管道与重定向
管道 是进程通信的方法之一,在Linux中用命令1|命令2的形式表示,将前一个命令的结果作为后续命令的参数进行输入,也有tee管道,可以进行多次筛选,即多次使用|过滤命令。 重定向 文件描述符FD Linux中输入输出分为三种…...
kotlin数组
1、kotlin中的数组与java数组比较: 2、创建 fun main() {// 值创建val a intArrayOf(1,2,3)// 表达式创建val b IntArray(3){println("it: ${it}")it1}println("a数组:${a.contentToString()}, 长度:${a.size}")prin…...
SpringSecurity实战入门——认证
项目代码 gson/spring-security-demo 简介 Spring Security 是 Spring 家族中的一个安全管理框架。相比与另外一个安全框架Shiro,它提供了更丰富的功能,社区资源也比Shiro丰富。 一般来说中大型的项目都是使用SpringSecurity来做安全框架。小项目有Shiro的比较多,因为相比…...
23种设计模式之桥接模式
桥接模式 1、定义 桥接模式:将抽象部分与它的实现部分解耦,使得两者都能独立变化 2、桥接模式结构 Abstraction(抽象类):它是用于定义抽象类的,通常是抽象类而不是接口,其中定义了一个Imple…...
vuejs3+elementPlus后台管理系统,左侧菜单栏制作、跳转、默认激活菜单
制作: <script setup> import {useUserStore} from "/stores/userStore.js"; import {ref} from "vue";const userStore useUserStore() //默认激活菜单 const defaultMenu ref(/home) </script><template><el-menuact…...
代码随想录算法训练营第四十四天|LeetCode198 打家劫舍、LeetCode213 打家劫舍Ⅱ
题1: 指路:198. 打家劫舍 - 力扣(LeetCode) 思路与代码: 对于这个题,拿房屋i举例,我们需要考虑的是否确定偷取这个房屋,如果确定偷取这个房屋,那么我们将得到房屋i的金…...
Git进阶使用(图文详解)
文章目录 Git概述Git基础指令Git进阶使用一、Git分支1.主干分支2.其他分支2.1创建分支2.2查看分支1. 查看本地分支2. 查看远程分支3. 查看本地和远程分支4. 显示分支的详细信息5. 查看已合并和未合并的分支 2.3切换分支1. 切换到已有的本地分支2. 创建并切换到新分支3. 切换到远…...
Effective C++ 改善程序与设计的55个具体做法笔记与心得 4
四. 设计与声明 18. 让接口容易被正确使用,不易被误用 请记住: 好的接口很容易被正确使用,不容易被误用。你应该在你的所有接口中努力达成这些性质“促进正确使用”的办法包括接口的一致性,以及与内置类型的行为兼容。“阻止误…...
WordPress管理员后台登录地址修改教程,WordPress admin登录地址文件修改方法
我们使用WordPress时,管理员后台登录默认地址为“域名/wp-login.php”或“域名/wp-admin”,为了安全,一般会把此地址改掉,防止有人恶意来攻击咱的WordPress,今天出个WordPress后台登录地址修改教程,修改之后…...
Python基础教程(二十四):日期和时间
💝💝💝首先,欢迎各位来到我的博客,很高兴能够在这里和您见面!希望您在这里不仅可以有所收获,同时也能感受到一份轻松欢乐的氛围,祝你生活愉快! 💝Ὁ…...
java面向对象(上)
一.面向对象与面向过程 1.面向过程 面向过程(procedure Oriented Programming),简称POP,主要思想就是将问题分解成一个个步骤去解决,把这个步骤称为函数. 典型语言:C语言 优点:可以大大简化代码 缺点:当代码量过大时,不方便维护 2.面向对象 面向对象(Object Oriented Pr…...
揭示SOCKS5代理服务器列表的重要性
在复杂的网络安全领域中,SOCKS5代理在保护在线活动方面发挥着关键作用。本文深入探讨了SOCKS5代理服务器列表的细节,探讨了它们的应用、优势以及在增强在线安全和隐私方面不可或缺的功能。 一、理解SOCKS5代理服务器列表 作为在客户端和服务器之间进行通…...
机器学习python实践——关于ward聚类分层算法的一些个人心得
最近在利用python跟着参考书进行机器学习相关实践,相关案例用到了ward算法,但是我理论部分用的是周志华老师的《西瓜书》,书上没有写关于ward的相关介绍,所以自己网上查了一堆资料,都很难说清楚ward算法,幸…...
从零制作一个docker的镜像
近期docker的镜像仓库不好用了,很多国内的源也无法使用了,所有今天给大家分享一下怎么从零制作一个CentOS镜像。 准备CentOS7最小环境 mkdir /centos7.9-root# 在该目录准备centos的最小环境 sudo yum --installroot/centos7.9-root --releasever7 ins…...
eclipse 老的s2sh(Struts2+Spring+Hibernate) 项目 用import导入直接导致死机(CPU100%)的解决
1、下载Apache Tomcat - Apache Tomcat 8 Software Downloads 图中是8.5.100的版本,下面的设置用的是另一个版本的,其实是一样。 2、先将Server配好,然后再进行导入操作。 2、选择jdk 当然,这里也可以直接“Download and instal…...
《米小圈动画汉字》汉字教育动画化:传统与创新的完美融合!
汉字,作为中华文化的瑰宝,承载着千百年来中华民族的智慧和思想。每一个汉字不仅仅是一个符号,更是一段历史的见证,一种文化的传承。在当今全球化的背景下,汉字教育面临着新的挑战与机遇。在这种背景下,如何…...
【LeetCode最详尽解答】11-盛最多水的容器 Container-With-Most-Water
欢迎收藏Star我的Machine Learning Blog:https://github.com/purepisces/Wenqing-Machine_Learning_Blog。如果收藏star, 有问题可以随时与我交流, 谢谢大家! 链接: 11-盛最多水的容器 直觉 这个问题可以通过可视化图表来理解和解决。 通过图形化这个…...
redis 缓存jwt令牌设置更新时间 BUG修复
大家好,今天我又又又来了,hhhhh。 上文中 我们永redis缓存了token 但是我们发现了 一个bug ,redis中缓存的token 是单用户才能实现的。 就是 我 redis中存储的键 名 为token 值 是jwt令牌 ,但是如果 用户a 登录 之后 创建一个…...
nginx精准禁止特定国家或者地区IP访问
1、安装依赖 dnf -y install gcc-c libtool gd-devel pcre pcre-devel openssl openssl-devel zlib zlib-devel libmaxminddb-devel pcre-devel zlib-devel gcc gcc-c make git2、获取NGINX安装包并安装 wget https://nginx.org/download/nginx-1.26.1.tar.gz git clone http…...
单片机课设-基于单片机的电子时钟设计(仿真+代码+报告)
基于单片机的电子时钟设计 前言一、课设任务是什么?二、系统总体方案硬件设计2.1 系统硬件总体设计2.2 键盘电路设计2.3 DS1302实时时钟芯片电路设计2.4 复位电路2.5 LCD电路设计 三、软件设计3.1 主程序流程图3.2 主要程序设计代码3.3 修改时间函数3.4 扫描键盘函数 四、仿真…...
.net 6 api 修改URL为小写
我们创建的api项目,url是[Route(“[controller]”)],类似这样子定义的。我们的controller命名是大写字母开头的,显示在url很明显不是很好看(url不区分大小写)。转换方式: var builder WebApplication.Crea…...
Windows电脑部署Jellyfin服务端并进行远程访问配置详细教程
文章目录 前言1. Jellyfin服务网站搭建1.1 Jellyfin下载和安装1.2 Jellyfin网页测试 2.本地网页发布2.1 cpolar的安装和注册2.2 Cpolar云端设置2.3 Cpolar本地设置 3.公网访问测试4. 结语 前言 本文主要分享如何使用Windows电脑本地部署Jellyfin影音服务并结合cpolar内网穿透工…...
rsync同步目录脚本
假设有两台服务器的示例 IP 地址为: Server A: 192.168.1.100Server B: 192.168.1.200 现在来解释如何使用这个脚本进行服务器之间文件夹内容的同步,保留路径和服务器信息的抽象化。 1. 脚本文件位置和权限 假设脚本文件位于 /root/script.sh&#x…...
LeetCode 6. Z 字形变换
LeetCode 6. Z 字形变换 将一个给定字符串 s 根据给定的行数 numRows ,以从上往下、从左到右进行 Z 字形排列。 比如输入字符串为 “PAYPALISHIRING” 行数为 3 时,排列如下: 之后,你的输出需要从左往右逐行读取,产生…...
RTC实时时钟
一、Unix时间戳 1、Unix 时间戳 (1)Unix 时间戳(Unix Timestamp)定义为从UTC/GMT的1970年1月1日0时0分0秒开始所经过的秒数,不考虑闰秒 (2)时间戳存储在一个秒计数器中,秒计数器为…...
WHAT - React 学习系列(一)
官方文档 If you have a lot of HTML to port to JSX, you can use an online converter. You’ll get two things from useState: the current state (count), and the function that lets you update it (setCount). To “remember” things, components use state.To mak…...
代理模式(静态代理/动态代理)
代理模式(Proxy Pattern) 一 定义 为其他对象提供一种代理,以控制对这个对象的访问。 代理对象在客户端和目标对象之间起到了中介作用,起到保护或增强目标对象的作用。 属于结构型设计模式。 代理模式分为静态代理和动态代理。…...
Word2Vec基本实践
系列文章目录 提示:这里可以添加系列文章的所有文章的目录,目录需要自己手动添加 例如:第一章 Python 机器学习入门之pandas的使用 提示:写完文章后,目录可以自动生成,如何生成可参考右边的帮助文档 文章目…...
南宁seo网站排名优化公司/软文营销代理
由于django的模板渲染机制,图片不能直接引用,否则不会显示。 <img src"/static/img/logo.jpg"> 可以看出图片的大小轮廓,但并不显示内容。 解决方法: 第一步 配置setting.py文件 在setting.py随后加上…...
如何做淘宝联盟网站主/seo网站的优化方案
2020庚子年,天干地支纪年第37位;一次大疫情举国哗。平白的多了近10日的假期,习惯上班下班的程序猿类居然开始有些不习惯无所事事,没有指令的工作节奏。 闲来无事难得可以连上网络,索性找些事情做做,以了却…...
网站建设资料总结/百度关键词价格查询软件
为了提高体验度,今天上午特意下载织梦cms 浏览了一下, 网上也看到相关文档, 但是实践中还是有问题, 自己重新写了一笔, 下面是代码和截图第一步上图表单部分表单部分js部分<div class"cbox mceneter">…...
学网站开发与维护有用吗/互联网运营推广是做什么的
下面的文字,有的来自自己微博上的记录,有的来自散写的文章,但总的来看都是自身这些年来的一些思考。 也许对喜欢思考的人有点意思,所以汇总下。 但也正因为时间跨度和来源比较杂,就没什么体系性了。 关于编程 1.和世界…...
我想做个网站怎么做/在线客服系统平台有哪些
容器配接器( Priority_queue) 概述 priority_queue是拥有优先级的queue,不过它容器内的元素并不是根据加入顺序排列,而是根据用户定义的优先级进行排列。priority_queue只能在队列尾部加入元素,在头部取出元素。不能遍历容器&…...
网站设计建议/谷歌seo排名
转载: http://blog.csdn.net/cutesource/article/details/5422093最近常有数据库和网络设备升级和搬迁等事情,而各个应用都是基于数据库连接池做的,大部分都是基于C3P0,数据库或网络状况的变动都会导致客户端连接池中的connection失效&#x…...