前端面试实战汇总

目录

• html
  • 1.简述一下对html语义化的理解
  • 2.行内元素有哪些？块级元素有哪些？空（void）元素有哪些
  • 页面导入样式时，使用link和@import有什么区别？
  • 介绍一下你对浏览器内核的理解？
  • 常见的浏览器内核有哪些？
  • html5有哪些新特性、移除了那些元素？如何处理HTML5新标签的浏览器兼容问题？如何区分 HTML 和 HTML5？
  • 请描述一下 cookies，sessionStorage 和 localStorage 的区别？
  • Label的做用是什么？是怎么用的？
  • 如何实现浏览器内多个标签页之间的通讯? (阿里)
  • 前端须要注意哪些SEO
  • 浏览器的渲染机制通常分为如下几个步骤
  • 重绘（Repaint）和回流（Reflow）
• css
  • display: none; 与 visibility: hidden; 的区别
  • 外边距折叠(collapsing margins)
  • 介绍一下标准的CSS的盒子模型？低版本IE的盒子模型有什么不一样的？
  • CSS优先级算法如何计算？
  • position的值relative和absolute定位原点是？
  • CSS3有哪些新特性？
  • 对BFC规范(块级格式化上下文：block formatting context)的理解？
  • css定义的权重
  • box-sizing 经常使用的属性有哪些？分别有什么做用？
  • css垂直居中的方法有哪些？
  • 在CSS样式中常使用 px、em 在表现上有什么区别？
  • 解释下什么是浮动和它的工做原理？
  • 浮动元素引发的问题？
  • 列举几种清除浮动的方式？
  • 介绍使用过的 CSS 预处理器？
  • CSS优化、提升性能的方法有哪些？
  • 浏览器是怎样解析CSS选择器的？
  • 抽离样式模块怎么写，说出思路？
  • 元素竖向的百分比设定是相对于容器的高度吗？
  • 什么是响应式设计？响应式设计的基本原理是什么？如何兼容低版本的IE？
• js
  • Canvas 元素、webgl、threeJS
  • JavaScript的组成
  • JS的基本数据类型和引用数据类型
  • 检测浏览器版本版本有哪些方式？
  • 介绍JS有哪些内置对象？
  • 如何最小化重绘(repaint)和回流(reflow)？
  • Javascript做用链域?
  • dom0 dom2 事件绑定区别
  • 数据请求
  • 面向对象
  • 闭包
  • 数组去重
• es6
  • let const
  • 箭头函数 this指向
  • 解构
  • ... 展开合并
  • promise
  • class (语法糖 => 构造函数,babel-loader)
  • 模块化
  • Set解构 不能重复的相似于数组的一个新的结构
  • 字符串模板
  • 遇到不会的
• 综合
  • 前端工程化工具 gulp&webpack
  • 团队协做工具 版本控制工具， 代码管理工具 svn&git
  • jquery
  • 事件循环
  • http相关
    • http状态码有那些？分别表明是什么意思？
    • 一个页面从输入 URL 到页面加载显示完成，这个过程当中都发生了什么？
    • 说说TCP传输的三次握手四次挥手策略
    • 断开一个TCP链接则须要“四次挥手”：
    • TCP和UDP的区别
    • HTTP和HTTPS
    • 为何HTTPS安全
    • 一个页面从输入 URL 到页面加载显示完成，这个过程当中都发生了什么？
    • HTTP 的工做原理
  • 前端攻击
• 遇到过哪些bug
  • react：
  • vue：
  • 小程序：
• MVC、MVP、MVVM三种区别及适用场合
• 第一家
  • 微信小程序开发 遇到了哪些bug 哪些部分是你开发的
  • 浏览器兼容性问题 有哪些兼容性问题
  • vue生命周期 经常使用的是哪些
  • from表单赋值 计算属性和方法的区别
  • 职业规划
  • 有什么问题须要问技术面试官
• 第二家
  • 如何设置图片透明度 兼容性问题
  • seo 有哪些注意点 什么方法对seo更友好 title 有什么属性
  • 性能优化方案
  • cdn
  • 反向代理
  • 跨域cors
  • 本地项目关联到远程git仓库
  • bug如何定位的
  • 如何获取用户的ip地址 代理服务器ip
  • 请求响应头 头里面有什么属性
  • 如何知道用户从哪一个网页进来的
  • 有遇到过什么技术难度 如何解决的
  • 遇到问题 如何本身解决的
  • 最近在学什么技术
  • 本身的优势和缺点
• 第三家
  • 标准盒模型
  • 图片裁剪工具
  • canvas 了解过嘛
  • 如何返回的数据是json对象
  • delete操做以后 浏览器作了些什么
  • nuxt的生命周期
  • vue的数据双向绑定
  • base64了解过嘛
  • 跨域的解决方案
  • 为何会产生跨域
  • ajax 如何设置请求头
  • vue 的函数式写法有了解过嘛
  • eslint 使用的是哪一种程度
• 第四家
  • 骨架屏懒加载怎么实现的
  • 小程序的生命周期 分别是什么用 请求数据放在哪里
  • openId和unionId的区别
  • 预加载如何实现
  • vue生命周期 父传子
  • 微信支付出现过什么问题吗

html

1.简述一下对html语义化的理解

利于seo：搜索引擎爬出根据HTML标记和上下文锁定关键字的权重
易阅读、易于维护：
结构清晰：浏览器和搜索引擎解析解析

2.行内元素有哪些？块级元素有哪些？空（void）元素有哪些

行内元素:a、span、img、
块级元素：
空元素：br、

页面导入样式时，使用link和@import有什么区别？

介绍一下你对浏览器内核的理解？

渲染引擎
js引擎

常见的浏览器内核有哪些？

html5有哪些新特性、移除了那些元素？如何处理HTML5新标签的浏览器兼容问题？如何区分 HTML 和 HTML5？

html5有哪些新特性：

媒介回放 video audio
localStoreage 存放数据 若是没有删除 会永远存在
sessionStoreage 数据浏览器关闭以后清除
语义化更好的内容元素
表单控件
新技术

纯表现的元素 big center font tt b u
对可用性产生负面影响的元素 frame frameset noframes

支持HTML5新标签

1. IE8/IE7/IE6支持经过document.createElement方法产生的标签
   2.用框架 好比html5shim

请描述一下 cookies，sessionStorage 和 localStorage 的区别？

Label的做用是什么？是怎么用的？

如何实现浏览器内多个标签页之间的通讯? (阿里)

前端须要注意哪些SEO

浏览器的渲染机制通常分为如下几个步骤

重绘（Repaint）和回流（Reflow）

css

display: none; 与 visibility: hidden; 的区别

外边距折叠(collapsing margins)

介绍一下标准的CSS的盒子模型？低版本IE的盒子模型有什么不一样的？

CSS优先级算法如何计算？

position的值relative和absolute定位原点是？

CSS3有哪些新特性？

对BFC规范(块级格式化上下文：block formatting context)的理解？

css定义的权重

box-sizing 经常使用的属性有哪些？分别有什么做用？

css垂直居中的方法有哪些？

在CSS样式中常使用 px、em 在表现上有什么区别？

解释下什么是浮动和它的工做原理？

浮动元素引发的问题？

列举几种清除浮动的方式？

介绍使用过的 CSS 预处理器？

CSS优化、提升性能的方法有哪些？

浏览器是怎样解析CSS选择器的？

抽离样式模块怎么写，说出思路？

元素竖向的百分比设定是相对于容器的高度吗？

什么是响应式设计？响应式设计的基本原理是什么？如何兼容低版本的IE？

js

Canvas 元素、webgl、threeJS

JavaScript的组成

JS的基本数据类型和引用数据类型

检测浏览器版本版本有哪些方式？

介绍JS有哪些内置对象？

如何最小化重绘(repaint)和回流(reflow)？

Javascript做用链域?

dom0 dom2 事件绑定区别

数据请求

面向对象

闭包

数组去重

es6

let const

箭头函数 this指向

解构

... 展开合并

promise

class (语法糖 => 构造函数,babel-loader)

模块化

Set解构 不能重复的相似于数组的一个新的结构

字符串模板

遇到不会的

当时在公司的时候自学的react 项目着急 就直接用了 没有注意到这些细节 回去我再去研究下

综合

前端工程化工具 gulp&webpack

团队协做工具 版本控制工具， 代码管理工具 svn&git

git经常使用：
git pull
git add . 暂存区
git commit 提交到本地仓库。
git push origin master:kerwin

代码冲突怎么解决？

git pull 再提交一次
借助可视化工具合并

本地项目关联到远程git仓库
彻底空白项目关联：
git init 初始化
git remote add 地址
将所有文件加入git版本管理的意思是将当前文件夹下的所有文件放到版本管理中
git add 提交文件 使用-m 编写注释
git commit -m "注释"
git push 执行完以上操做，项目就与远程git仓库关联到了一块儿，能够正常使用了，去git项目页上能够看到刚刚提交的代码

有文件的项目关联：
git init
设置remote地址
git remote add origin 地址
获取远程仓库master分支上的内容
git pull origin master
将当前分支设置为远程仓库的master分支
git branch --set-upstream-to=origin/master master
将所有文件加入git版本管理 .的意思是将当前文件夹下的所有文件放到版本管理中
git add .
提交文件 使用-m 编写注释
git commit -m "注释"
推送到远程分支
git push
git config -l 配置文件页，使用vim编辑器的推出命令退出 :wq

jquery

事件循环

http相关

http状态码有那些？分别表明是什么意思？

一个页面从输入 URL 到页面加载显示完成，这个过程当中都发生了什么？

说说TCP传输的三次握手四次挥手策略

断开一个TCP链接则须要“四次挥手”：

TCP和UDP的区别

HTTP和HTTPS

为何HTTPS安全

一个页面从输入 URL 到页面加载显示完成，这个过程当中都发生了什么？

HTTP 的工做原理

https://www.jianshu.com/p/5dc1793a4d10

前端攻击

1. CSRF的基本概念、缩写、全称
   CSRF的防范措施
   XSS的防范措施主要有三个：
   CSRF 和 XSS 的区别

遇到过哪些bug

react：

在页面没有加载完毕ajax 还在请求的时候 就立马点击其余页面 会报错 这时候的组件已经销毁了 可是ajax还在请求数据 this.setstate 还在执行 个人解决办法是 在销毁周期去this.setstate 赋值一个空函数

vue：

在使用vant的表单时 他的组件model 不是便可建立的 致使ref获取不到 没法赋初始值
个人解决办法是设置表单的初始状态（initialValues），尚未建立出来，让状态更新，渲染from表单时候传入异步更新 ，等建立完毕以后再设置起内容

小程序：

最近出现的一个bug button在以前是占满一行的 可是最近微信改了样式 设置了小型 若是要变成以前的 须要在page.json 去删除v2 new Date跨平台兼容性问题 只能本身手动把-替换/
没法获取UnionID的问题
用户必须已经关注公众号
必需要把公众号和小程序绑定在开发平台

MVC、MVP、MVVM三种区别及适用场合

MVC：Model（模型）-View 视图（渲染页面）-Controller（控制器） 实现关注点分离，即应用程序中的数据模型与业务和展现逻辑解耦
View 传送指令到 Controller ；
Controller 完成业务逻辑后，要求 Model 改变状态 ；
Model 将新的数据发送到 View，用户获得反馈
MVC优势：
耦合性低，视图层和业务层分离，
生命周期成本低
MVC使开发和维护用户接口的技术含量下降
可维护性高，分离视图层和业务逻辑层也使得WEB应用更易于维护和修改
部署快
MVC缺点：
不适合小型，中等规模的应用程序
视图与控制器间过于紧密链接，
视图对模型数据的低效率访问，
MVP：MVP（Model-View-Presenter）是MVC的改良模式
MVVM：主要目的是分离视图（View）和模型（Model） 低耦合 独立开发 可测试 可重用性
https://blog.csdn.net/victoryzn/article/details/78392128

第一家

微信小程序开发 遇到了哪些bug 哪些部分是你开发的

浏览器兼容性问题 有哪些兼容性问题

1.不一样浏览器的标签默认的外补丁（margin）和内补丁（padding）不一样
解决方案：css里增长通配符*{margin：0；padding：0}
2.ajax略有不一样
IE：ActiveXObject
其余：xmlHttpReuest
3.IE与宽度和高度的问题
IE不认得min-这个定义，但实际上它把正常的width和height看成有min的状况来使。这样问题就大了，若是只用宽度和高度，正常的浏览器里这两个值就不会变，若是只用min-width和min-height的话，IE下面根本等于没有设置宽度和高度。
box{ width: 80px; height: 35px;}html>body #box{ width: auto;height: auto; min-width: 80px; min-height: 35px;}

4.IE9如下浏览器不能使用opacity
解决方案：opacity：0.5；filter：alfha（opacity=50）；filter：progid：DXlmageTransform.Microsoft.Alfha(style=0,opacity=50);

vue生命周期 经常使用的是哪些

from表单赋值 计算属性和方法的区别

职业规划

研究技术，
若是之后有机会为公司创造更大利益

有什么问题须要问技术面试官

• 技术发展路线 ，技术栈
• 技术分享学习
• 什么通知结果？
  如今项目是什么项目 ，进行到什么阶段
  是否有我的提高培训

有什么问题须要问hr
公司对我有什么指望 公司发展路线

第二家

如何设置图片透明度 兼容性问题

seo 有哪些注意点 什么方法对seo更友好 title 有什么属性

性能优化方案

cdn

反向代理

跨域cors

本地项目关联到远程git仓库

彻底空白项目关联：
git init 初始化
git remote add 地址 将所有文件加入git版本管理 .的意思是将当前文件夹下的所有文件放到版本管理中
git add 提交文件 使用-m 编写注释
git commit -m "注释"
git push 执行完以上操做，项目就与远程git仓库关联到了一块儿，能够正常使用了，去git项目页上能够看到刚刚提交的代码

有文件的项目关联：
git init
设置remote地址
git remote add origin 地址
获取远程仓库master分支上的内容
git pull origin master
将当前分支设置为远程仓库的master分支
git branch --set-upstream-to=origin/master master
将所有文件加入git版本管理 .的意思是将当前文件夹下的所有文件放到版本管理中
git add .
提交文件 使用-m 编写注释
git commit -m "注释"
推送到远程分支
git push

git config -l 配置文件页，使用vim编辑器的推出命令退出 :wq

bug如何定位的

如何获取用户的ip地址 代理服务器ip

请求响应头 头里面有什么属性

http://www.javashuo.com/article/p-yxaifony-ks.html

如何知道用户从哪一个网页进来的

HttpContext.Current.Request.UrlReferrer UrlReferrer是否是本身的页面

有遇到过什么技术难度 如何解决的

遇到问题 如何本身解决的

最近在学什么技术

本身的优势和缺点

优势：单身 全身心投入到 没有家庭负担 自学能力强 逻辑能力强 自控能力强
缺点:缺点钱

第三家

标准盒模型

图片裁剪工具

canvas 了解过嘛

如何返回的数据是json对象

delete操做以后 浏览器作了些什么

nuxt的生命周期

vue的数据双向绑定

base64了解过嘛

let const
var a
{
let a
}会出现什么问题

跨域的解决方案

为何会产生跨域

ajax 如何设置请求头

vue 的函数式写法有了解过嘛

eslint 使用的是哪一种程度

3.14159 用哪些截取后面4位小数
深拷贝 是什么 如何实现
echarts 实现一个5维的效果 4个维度都特别端 若是有一个维度特别长处理

第四家

骨架屏懒加载怎么实现的

小程序的生命周期 分别是什么用 请求数据放在哪里

openId和unionId的区别

预加载如何实现

vue生命周期 父传子

微信支付出现过什么问题吗