前端面试常问的问题

**

前端面试题

**

自己整理的，希望可以帮助到小伙伴们早日拿到offer

1、实现div居中？
利用margin属性可以实现居中
单行文本垂直居中，设置line-height与盒子高度一样就可以
指定行内元素的垂直对齐方式：vertical-align
行内元素水平居中：text-align：center
块级元素水平居中：margin:0 auto
块级元素垂直居中：margin: auto

2、js的基本类型有哪些？其中null和undefined如何区别？
基本类型五种：boolen（true或false）；number（任何整数或浮点数值）；string（由单引号或双引号分隔的字符或字符序列（javascript没有单独的字符类型））,null（只有一个值的基本类型，null）,undefined（只有undefined的一个值的基本类型（undefined是赋给未初始化的变量的值））
Null表示没有对象，即该处不应该有值。典型用法是：作为函数的参数，表示该函数的参数不是对象。作为对象原型链的终点。
Undefined表示缺少值，就是此处应该有一个值，但是还没有定义。
典型用法是：变量被声明了，但没有赋值时，就等于undefined

3、var let const有什么区别？
1）var和let声明的是变量，可更改值，const不可
2）Var声明的变量只具有函数作用域，let和const声明的变量和常量 具有块级作用域
3）Var和let变量的声明可以不做赋值操作，const不可
4）Let不可以重复声明一个变量，重复声明会报错，var则不会
5）Let不存在变量提升，var存在

4、ajax
Ajax是默认异步提交，这样做的好处就是能够通过局部刷新的方式提高用户的体验，同时还能节省资料，减少数据库的压力，改成同步的方法就是将async的默认值改成false，一般都是true或者不写，如果改成false就会失去ajax的本身作用。

5、如何使用ajax？
1、创建xmlhttprequest对象，var xmlhttp = new XMLHTTPRequest（）：XMLHttpRequest对象用来和服务器交换数据
2、使用xmlhttprequest对象的open（）和send（）方法发送资源请求给服务器
3、使用xmlhttprequest对象的responseText或responseXML属性获得服务器的响应
4、Onreadystatechange函数，当发送请求到服务器，我们想要服务器响应执行一些功能就需要使用onreadystatechange函数，每次xmlhttprequest对象的readyState发生改变都会触发onreadystatechange函数

6、JSON和XML的区别
Json和xml都用于接收web服务端的数据
JSON 与 XML 的相同之处：
JSON 和 XML 数据都是 “自我描述” ，都易于理解。
JSON 和 XML 数据都是有层次的结构
JSON 和 XML 数据可以被大多数编程语言使用
JSON 与 XML 的不同之处：
JSON 不需要结束标签
JSON 更加简短
JSON 读写速度更快
JSON 可以使用数组

7、vue的生命周期
Vue的生命周期：创建前/后；模板编译前后；组件更新前后、组件销毁前后。
Vue实例从创建到销毁的过程，就是生命周期。也就是从开始创建、初始化数据、编译模板、挂载Dom->渲染、更新->渲染、卸载等一系列过程，我们称这是vue的生命周期。
Vue的生命周期共有8个阶段，分别为：beforecreare（组件实例被创建）、created、beforemount（模板编译前）、mounted、beforeupdate（组件更新前）、update、beforedestory（组件销毁前）、destoryed
Vue生命周期的作用：让我们在控制整个vue实例的过程中更容易形成好的逻辑。
第一次加载会触发beforecretae，create，beforeMount，mounted这几个钩子。

8、V-if和v-show有什么区别：
1、功能区别：
v-show严格意义上说“条件隐藏”。浏览器首先不管三七二十一，把HTML元素先渲染起来，符合条件就显示，不符合条件display就位none，不显示，但是元素还在那
V-if是真正意义上的“条件渲染”。浏览器先判断符不符合条件，符合在渲染，否则不渲染DOM，浏览器中找不到这个DOM
2、vue生命周期区别：
V-if由于是重新渲染，所以每次切换一次会重新走一次生命周期，v-show由于只是控制显示隐藏，所以除了初始化渲染，其他时候都不会再走相关生命周期了。
3、性能区别：
V-if有更高的切换开销，v-show有更高的初始渲染开销。如果需要频繁的切换，使用v-show比较好，如果运行条件很少改变，使用v-if比较好。

v-show比v-if性能更高，因为v-show只能动态的改变样式，不需要增删DOM元素。所以当程序不是很大时候，v-if和v-show区别都不大，如果项目很大，推荐多用v-show，较少浏览器后期操作的性能。