2018前端我的面试总结

时间 2019-11-08

标签前端我的面试总结栏目快乐工作繁體版

原文原文链接

　前言：css

　　最近一直在面试，我把面试的5家公司面试题，选择了一些来总结说明，若有问题，欢迎各位小伙伴给与指正
html

　　有些题的答案是百度，有些则是我本身的理解，有些题是开放题，没有标准答案，根据本身实际状况回答便可前端

　 下面这些题都很基础，更多更全的面试题我会在最后把连接发出来，那些连接是我准备面试收集的不错的面试题合集vue

　　HTML程序员

　　 问题1：你怎么理解web语义化？es6

　　　　要合理使用语义化的标签，好比，段落用P标签，标题用H1-H6；这样不只利于SEO，也利于后期维护
web

　　　 问题2：HTML5新增语义化 / 结构元素有哪些？面试

　　　　header, main, nav, side, article, section, footer编程

　　　 问题3：<img>标签的title和alt属性有什么区别？小程序

　　　前者是在图片正常加载，鼠标指上去显示的文本值；后者是在图片加载失败之后显示的提示文字信息

　　CSS

　　　问题1：display:none和visibility:hidden;的区别？

　　　前者让元素从DOM树中消失，不占据任何空间；后者不会让元素从DOM树中消失，仍占据空间，只是内容不可见。

　　　 问题2：css定位有几种方式？分别是什么？有什么区别？

　　　 4种；static,relative,absolute,fixed；

　　　 static：是默认值（静态定位）;

　　 relative：相对定位，相对于自身偏移，不会脱离文档流

　　　 absolute：绝对定位，相对于父元素偏移，脱离文档流

　　　 fixed：固定定位，相对于浏览器可视区域定位，脱离文档流

　　　问题3：什么是css的盒子模型？

　　盒子模型是指：外边距（margin）+ border（边框） + 内边距（padding）+ content（内容）

　　能够把每个容器，好比div，都看作是一个盒子模型

　　好比你给一个div设置宽高为500px，但实际你设置的只是content

　　　以后你又设置了padding:10px;border:1px solid red;

　　这时div的宽高就会变为544px（content 500px + padding 40px + border 4px）

　　 至关于一个元素的实际宽高是由：　padding + border + content 组成

　　问题1：location.replace()和location.assign()有什么区别？

　　前者是直接替换原来的URL地址，没有返回；后者是在原来的URL地址后面插入新的URL地址，有返回

　　问题2：建立JavaScript对象的三种方法？

　　1️⃣：建立一个空对象

　　　var obj = {};

　　2️⃣：对象字面量

　　var obj = {

　　name: "Tom",

　　age: 21

　}

　　3️⃣：使用new关键字（不推荐，尽可能不要用这种方式建立对象）

　　var obj = new Object();

　　问题3：事件绑定的三种方法？

　　1️⃣：直接绑定在HTML元素上，不推荐这种，耦合过高

　 2️⃣： 经过DOM获取到元素，而后绑定事件（绑定多个事件时不适用）

　　　var ele = document.getElementById("element");

　　　ele.click = function(){}

　 3️⃣：绑定多个事件时推荐这种方式

　　addEventListener('click'，'element'，function(){})

　　问题4：说一说你对闭包的理解（什么是闭包，用处）　　

　个人理解是闭包能够看做是一种方法，这个方法能够帮助咱们从外部获取到函数内部的变量

　闭包的用处主要有2个

　一是能够从外部获取到函数内部的变量；

　二是让变量一直存在，不被js的回收机制回收，但滥用闭包会形成内存泄漏

　　问题5：typeof null 和 typeof undefiind 的结果是什么？它们的区别？

　　结果都是object

　　前者表示一个空值，是一个特殊的对象，但null成为对象是历史遗留形成的（感兴趣的小伙伴可自行百度）

　后者的出现也是为了和null作区分，表示未定义，好比一个变量只声明没有赋值 var x;

　 问题6：es6的 let 和 const 的区别？

　 let用于声明变量，至关于es5里的 var，而且有块级做用域

　 const用于声明常量

　　问题7：说一说你对promise对象的认识（es6）

　　Promise是 CommonJS 提出来的这一种规范，有多个版本，在 ES6 当中已经归入规范，原生支持 Promise 对象；

　　非 ES6 环境能够用相似 Bluebird、Q 这类库来支持。

　　详见：http://es6.ruanyifeng.com/?search=promise&x=4&y=2#docs/promise （阮一峰）

　　问题8：在浏览器输入地址按回车之后，发生了什么？（简述）

　　 1：DNS服务器对该域名进行解析（这个域名解析出来的IP地址就是要请求资源的服务器地址）

　　 2：尝试向该服务器创建链接，通过三次握手成功创建链接

　　 3：向服务器发送 HTTP 请求

　　 3：服务器收到、处理并返回 HTTP 请求

　　 4：浏览器获得返回内容（这个时候返回的内容都是字符串，须要浏览器解析，也就是浏览器渲染的过程）

　　问题9：简述浏览器渲染的过程？（这个提及来文字较多，因此就说几个要点）

　　 1：根据 HTML 结构生成 DOM 树

　　2：根据 CSS 生成 CSSOM

　　3：将 DOM 和 CSSOM 整合造成 RenderTree（渲染树）

　　4：根据 RenderTree 开始渲染和展现

　　5：遇到<script>时，会执行并阻塞渲染

　　注：这也是为何link引入的CSS文件要放在<head>头部，这样便于浏览器快速解析完成css样式，生CSSOM；

　　　　而引入的js文件要放在底部就是为了不阻塞页面加载，致使页面空白

　　问题10：new操做符到底作了什么？

　　1：建立一个空对象，用来返回实例对象

　　2：把这个空对象的原型指向构造函数的prototype属性

　 3：让构造函数的this指向实例对象

　　4：返回建立的实例对象

　 性能优化

　　　什么是SEO？SEO要怎么作？

　　　http://www.javashuo.com/article/p-twbnioja-mo.html 这是我以前写的一篇关于seo基础的博客

　　　 若是让你从前端的角度作性能优化，你会怎么作

　　　 https://www.cnblogs.com/tu-0718/p/6170463.html 这是我以前写的一篇关于前端性能优化的博客

　　HTTP

　　　　问题1：说一说状态码301和302的区别？

　　　　301：永久重定向，访问的地址永久被迁移到其它地址

　　　　302：临时重定向，访问的地址临时被迁移到其它地址

　　　　详见：https://blog.csdn.net/u013474436/article/details/48138707

　　　 问题2：cookie 和 localStorage 有何区别？

　　　 cookie

　　　　　 1：存储量过小，只有 4KB

　　　　　　2：全部 HTTP 请求都带着，会影响获取资源的效率

　　　　　　 3：API 简单，须要封装才能用

　　　　localStorage

　　　　　 1：存储量增大到 5MB

　　　　　　2：不会带到 HTTP 请求中

　　　　　　3：API 适用于数据存储 localStorage.setItem(key, value)localStorage.getItem(key)

　　　　问题3：sessionStorage和 localStorage 有何区别？

　　　　前者为临时存储，当网页或浏览器关闭时，缓存会自动清除

　　　后者为永久存储，除非手动自行清除缓存，不然，缓存永久有效

　　　 问题4：什么是同源策略？

　　　同源策略就是指协议，端口，域名所有都要相同。这是浏览器为安全性考虑实施的安全策略　

　　　详见：http://www.ruanyifeng.com/blog/2016/04/same-origin-policy.html　

　　开放性问题（没有答案）

　　1：你以为JS有哪些优势？你怎么理解JS的面向对象编程？

　　2：可否一我的独立开发？

　　3：若是和另外一我的一块儿开发，怎么让工做效率更高？

　　4：若是和另外一我的一块儿开发，他技术比你好，你会怎么办？

　　5：若是和另外一我的一块儿开发，你技术比他好，你会怎么办？

　　6：有没有了解太小程序，说说你对小程序的认识？

　　7：你以为vue和原生js相比有什么好处？

　　8：说一说你遇到过的兼容性问题（PC和移动端各说一个）

　　9：使用过flex布局吗，有什么优势？

　　10：你对加班是怎么看的？

附：我的收集的不错的面试题连接分享

　　 1：http://www.javashuo.com/article/p-wuxucrdi-dw.html　　2018面试题

　　　　2：http://www.javashuo.com/article/p-fnbljxtu-s.html 　　2017年前端面试题最新汇总

　　　　3：http://www.javashuo.com/article/p-xulgnctl-bb.html 　　2017年前端面试题整理汇总100题

　　　　5：http://www.javashuo.com/article/p-kaaztzka-s.html 　　前端面试题300道~~熬夜吐血整理

　　　　6：http://www.javashuo.com/article/p-gvizxzrh-hz.html 　　我遇到的前端面试题2017

　　　　7：http://www.javashuo.com/article/p-cqjshfgy-k.html 　　 JavaScript面试

　　　　8：http://www.javashuo.com/article/p-dzpvgzet-cw.html 　　你不能错过的前端面试题合集

　　　　9：http://www.javashuo.com/article/p-riwvmnzo-kv.html 　　VUE合集面试题

　　　　10：https://www.jianshu.com/p/e54a9a34a773 　　VUE合集面试题

　　　 11： https://www.qdfuns.com/article/47855/dad8d910a0a6ea455a8319a827aaad7b.html 　　（没有答案）

　　　　12： http://www.javashuo.com/article/p-hrkoxhma-mo.html 　　别的程序员是怎样读你的简历的（仅供参考）

　　　　13：http://www.javashuo.com/article/p-vaqbplam-eb.html 　　如何准备一次技术面试（附一套前端面试题）

2018前端我的面试总结

1： 你以为JS有哪些优势？你怎么理解JS的面向对象编程？

2：可否一我的独立开发？

3：若是和另外一我的一块儿开发，怎么让工做效率更高？

4：若是和另外一我的一块儿开发，他技术比你好，你会怎么办？

5：若是和另外一我的一块儿开发，你技术比他好，你会怎么办？

6：有没有了解太小程序，说说你对小程序的认识？

7：你以为vue和原生js相比有什么好处？

8：说一说你遇到过的兼容性问题（PC和移动端各说一个）

9：使用过flex布局吗，有什么优势？

10：你对加班是怎么看的？

2：http://www.javashuo.com/article/p-fnbljxtu-s.html 2017年前端面试题最新汇总

3：http://www.javashuo.com/article/p-xulgnctl-bb.html 2017年前端面试题整理汇总100题

6：http://www.javashuo.com/article/p-gvizxzrh-hz.html 我遇到的前端面试题2017

7：http://www.javashuo.com/article/p-cqjshfgy-k.html JavaScript面试

8：http://www.javashuo.com/article/p-dzpvgzet-cw.html 你不能错过的前端面试题合集

9：http://www.javashuo.com/article/p-riwvmnzo-kv.html VUE合集面试题

10：https://www.jianshu.com/p/e54a9a34a773 VUE合集面试题

11： https://www.qdfuns.com/article/47855/dad8d910a0a6ea455a8319a827aaad7b.html （没有答案）

12： http://www.javashuo.com/article/p-hrkoxhma-mo.html 别的程序员是怎样读你的简历的（仅供参考）

　　1：你以为JS有哪些优势？你怎么理解JS的面向对象编程？

　　2：可否一我的独立开发？

　　3：若是和另外一我的一块儿开发，怎么让工做效率更高？

　　4：若是和另外一我的一块儿开发，他技术比你好，你会怎么办？

　　5：若是和另外一我的一块儿开发，你技术比他好，你会怎么办？

　　6：有没有了解太小程序，说说你对小程序的认识？

　　7：你以为vue和原生js相比有什么好处？

　　8：说一说你遇到过的兼容性问题（PC和移动端各说一个）

　　9：使用过flex布局吗，有什么优势？

　　10：你对加班是怎么看的？

　　　　2：http://www.javashuo.com/article/p-fnbljxtu-s.html 　　2017年前端面试题最新汇总

　　　　3：http://www.javashuo.com/article/p-xulgnctl-bb.html 　　2017年前端面试题整理汇总100题

　　　　6：http://www.javashuo.com/article/p-gvizxzrh-hz.html 　　我遇到的前端面试题2017

　　　　7：http://www.javashuo.com/article/p-cqjshfgy-k.html 　　 JavaScript面试

　　　　8：http://www.javashuo.com/article/p-dzpvgzet-cw.html 　　你不能错过的前端面试题合集

　　　　9：http://www.javashuo.com/article/p-riwvmnzo-kv.html 　　VUE合集面试题

　　　　10：https://www.jianshu.com/p/e54a9a34a773 　　VUE合集面试题

　　　 11： https://www.qdfuns.com/article/47855/dad8d910a0a6ea455a8319a827aaad7b.html 　　（没有答案）

　　　　12： http://www.javashuo.com/article/p-hrkoxhma-mo.html 　　别的程序员是怎样读你的简历的（仅供参考）