面试题

1. es6的新特性
   箭头操作符、支持类、增加的对象字面量、模块化机制、解构、let和const关键字、Promise、Symbol

2. let和var以及const有什么区别
   var声明的变量会挂载在window上，而let和const声明的变量不会
   var声明变量存在变量提升，let和const不存在变量提升
   let和const声明形成块作用域
   同一作用域下let和const不能声明同名变量，而var可以

3. vue中的v-if和v-show的区别
   相同点：v-if与v-show都可以动态控制dom元素显示隐藏
   不同点：v-if显示隐藏是将dom元素整个添加或删除，而v-show隐藏则是为该元素添加css–display:none，dom元素还在。

4. MVVM和MVC的区别
   MVVM即Model-View-ViewModel的简写。即模型-视图-视图模型。
   MVC是Model-View- Controller的简写。即模型-视图-控制器。
   主要就是mvc中Controller演变成mvvm中的viewModel。mvvm主要解决了mvc中大量的DOM 操作使页面渲染性能降低，加载速度变慢，影响用户体验。和当 Model 频繁发生变化，开发者需要主动更新到View 。

5. vue的生命周期
   vue实例对象由创建到页面渲染到最后销毁的整个过程
   beforeCreate、created、beforeMount、mounted、beforeUpdate、updated、beforeDestroy、destroyed

6. vue和jQuery的区别
   jQuery是使用选择器（$）选取DOM对象，对其进行赋值、取值、事件绑定等操作，其实和原生的HTML的区别只在于可以更方便的选取和操作DOM对象，而数据和界面是在一起的。比如需要获取label标签的内容：$("lable").val();,它还是依赖DOM元素的值。

   Vue则是通过Vue对象将数据和View完全分离开来了。对数据进行操作不再需要引用相应的DOM对象，可以说数据和View是分离的，他们通过Vue对象这个vm实现相互的绑定。这就是传说中的MVVM。

7. Ajax和Axios的区别
   Ajax 是指一种创建交互式网页应用的网页开发技术。是异步 JavaScript 和 XML（标准通用标记语言的子集）。
   Ajax 是一种在无需重新加载整个网页的情况下，能够更新部分网页的技术。通过在后台与服务器进行少量数据交换，Ajax 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。
   axios用于浏览器和node.js的基于Promise的HTTP客户端

   1. 从浏览器制作XMLHttpRequests
   2. 让HTTP从node.js的请求
   3. 支持Promise API
   4. 拦截请求和响应
   5. 转换请求和响应数据
   6. 取消请求
   7. 自动转换为JSON数据
   8. 客户端支持防止XSRF

8. 有哪些网络协议
   常用的网络协议有TCP/IP协议、HTTP协议、FTP协议、Telnet协议、FTP协议、SMTP协议、NFS协议、UDP协议等。
   网络协议为计算机网络中进行数据交换而建立的规则、标准或约定的集合。

9. 简述TCP的三次握手过程
   TCP握手协议 ：在TCP/IP协议中,TCP协议提供可靠的连接服务,采用三次握手建立一个连接。
   第一次握手：建立连接时,客户端发送syn包(syn=j)到服务器,并进入SYN_SEND状态,等待服务器确认； SYN：同步序列编号(Synchronize Sequence Numbers)
   第二次握手：服务器收到syn包,必须确认客户的SYN（ack=j+1）,同时自己也发送一个SYN包（syn=k）,即SYN+ACK包,此时服务器进入SYN_RECV状态；
   第三次握手：客户端收到服务器的SYN＋ACK包,向服务器发送确认包ACK(ack=k+1),此包发送完毕,客户端和服务器进入ESTABLISHED状态,完成三次握手。
   完成三次握手,客户端与服务器开始传送数据。

10. 请说一下http请求的基本过程

    1. 连接 当我们输入这样一个请求时，首先要建立一个socket连接，因为socket是通过ip和端口建立的，所以之前还有一个DNS解析过程，把www.mycompany.com变成ip，如果url里不包含端口号，则会使用该协议的默认端口号。
    2. 请求 连接成功建立后，开始向web服务器发送请求，这个请求一般是GET或POST命令
    3. 应答 web服务器收到这个请求，进行处理。从它的文档空间中搜索子目录mydir的文件index.html。

11. promise本身是同步方法，但是他的 .then()和.catch()是异步方法

12. 在开发中遇到过什么问题

13. 你知道哪些状态码，都分别代表什么
    200 - 服务器成功返回网页
    403 - (禁止)服务器拒绝请求
    404 - 请求的网页不存在
    503 - 服务器超时
    500 - 服务器内部错误)服务器遇到错误，无法完成请求

14. vuex有几种属性
    有五种,分别是State , Getter , Mutation , Action , Module (就是mapAction)
    state就是存放数据的地方，类似一个仓库 , 特性就是当mutation修改了state的数据的时候，他会动态的去修改所有的调用这个变量的所有组件里面的值
    getter用来获取数据，mapgetter经常在计算属性中被使用
    Action 于 mutation 类似，不同在于：
    Action 提交的是 mutation，而不是直接变更状态。
    Action 可以包含任意异步操作

15. 提交表单有几种方式

    1. submit提交
       在form标签中添加Action(提交的地址)和method(post),且有一个submit按钮（）就可以进行数据的提交，每一个input标签都需要有一个name属性，才能进行提交。
    2. Ajax提交form表单
    3. Easyui的form插件
    4. form表单提交附件

16. Html5的新特性
    (1)语义标签：语义化标签使得页面的内容结构化，见名知义
    (2)增强型表单：HTML5 拥有多个新的表单 Input 输入类型。这些新特性提供了更好的输入控制和验证。
    (3)视频和音频：HTML5 提供了播放音频文件的标准，即使用 元素
    (4)Canvas绘图：标签只是图形容器，必须使用脚本来绘制图形
    (5)拖放API：拖放是一种常见的特性，即抓取对象以后拖到另一个位置。

17. CSS3有什么新特性
    选择器、RGBA和透明度 、多栏布局、多背景图、Word Wrap、文字阴影、@font-face属性 、圆角、边框图片、盒阴影、盒子大小、媒体查询、语音

18. px和em的区别

    1. px实际上就是像素，用PX设置字体大小时，比较稳定和精确
    2. em就是根据基准来缩放字体的大小。
    3. rem是相对单位，是相对HTML根元素。

19. 什么是闭包
    “闭包就是能够读取其他函数内部变量的函数。例如在javascript中，只有函数内部的子函数才能读取局部变量，所以闭包可以理解成“定义在一个函数内部的函数“。在本质上，闭包是将函数内部和函数外部连接起来的桥梁。

20. CSS预处理器
    CSS预处理器定义了一种新的语言，其基本思想是，用一种专门的编程语言，为CSS增加了一些编程的特性，将CSS作为目标生成文件，然后开发者就只要使用这种语言进行编码工作。
    常见的预处理器为：Sass、LESS和Stylus

21. 元素的隐藏与显示

    1. display 显示：block：以块级元素显示； none：隐藏对象；特点：隐藏之后，不再为其保留位置。
    2. visibility 可见性：visible：对象可以看见； hidden：对象隐藏不可见；特点：隐藏之后，继续保留原有位置
    3. overflow 溢出： auto：超出自动显示滚动条，不超出不显示滚动条； hidden：不显示超过对象的内容，超出的部分隐藏掉；

22. 什么是事件流
    页面触发一个事件时，会按照一定的顺序来响应事件，事件的响应过程为事件。就我个人理解就是网页对点击事件的排序顺序就是事件流
    1、冒泡型的事件流
    从明确事件源到不明确的事件源依次向上响应。
    2、捕获型的事件流
    从不确定事件源到确定事件源依次向下响应。

23. 什么是事件代理
    由于事件会在冒泡阶段向上传播到父节点，因此可以把子节点的监听函数定义在父节点上，由父节点的监听函数统一处理多个子元素的事件，这种方法叫做事件的代理

24. sessionStorage和localStorage
    sessionStorage用于本地存储一个会话（session）中的数据，这些数据只有在同一个会话中的页面才能访问
    并且当会话结束后数据也随之销毁。因此sessionStorage不是一种持久化的本地存储，仅、是会话级别的存储。只允许同一窗口访问。
    而localStorage用于持久化的本地存储，除非主动删除数据，否则数据是永远不会过期的。同源可以读取并修改localStorage数据。

25. http与https的区别

    1. https协议需要到ca申请证书，一般免费证书较少，因而需要一定费用。
    2. http是超文本传输协议，信息是明文传输，https则是具有安全性的ssl加密传输协议。
    3. http和https使用的是完全不同的连接方式，用的端口也不一样，前者是80，后者是443。
    4. http的连接很简单，是无状态的；HTTPS协议是由SSL+HTTP协议构建的可进行加密传输、身份认证的网络协议，比http协议安全。

26. 你理解的原型链
    每个对象都可以有一个原型_proto_，这个原型还可以有它自己的原型，以此类推，形成一个原型链。查找特定属性的时候，我们先去这个对象里去找，如果没有的话就去它的原型对象里面去，如果还是没有的话再去向原型对象的原型对象里去寻找… 这个操作被委托在整个原型链上，这个就是我们说的原型链了。

27. yarn serve 的流程

    1. 用户向YARN中提交应用程序，其中包括ApplicationMaster程序、启动ApplicationMaster的命令、用户程序等。
    2. ResourceManager为该应用程序分配第一个Container，并与对应的Node-Manager通信，要求它在这个Container中启动应用程序的ApplicationMaster。
    3. ApplicationMaster首先向ResourceManager注册，这样用户可以直接通过ResourceManage查看应用程序的运行状态，然后它将为各个任务申请资源，并监控它的运行状态，直到运行结束，即重复步骤4~7。
    4. ApplicationMaster采用轮询的方式通过RPC协议向ResourceManager申请和领取资源。
    5. 一旦ApplicationMaster申请到资源后，便与对应的NodeManager通信，要求它启动任务。
    6. NodeManager为任务设置好运行环境(包括环境变量、JAR包、二进制程序等)后，将任务启动命令写到一个脚本中，并通过运行该脚本启动任务。
    7. 各个任务通过某个RPC协议向ApplicationMaster汇报自己的状态和进度，以让ApplicationMaster随时掌握各个任务的运行状态，从而可以在任务失败时重新启动任务。在应用程序运行过程中，用户可随时通过RPC向ApplicationMaster查询应用程序的当前运行状态。

28. JavaScript的引用数据类型
    对象Object、数组Array 、函数Function、Date等

29. 块级元素和行内元素的垂直居中

30. 对象的三大特性
    三大特征分别为：封装，继承和多态

    1. 封装
       我们平时所用的方法和类都是一种封装，当我们在项目开发中，遇到一段功能的代码在好多地方重复使用的时候，我们可以把他单独封装成一个功能的方法，这样在我们需要使用的地方直接调用就可以了。
    2. 继承
       继承在我们的项目开发中主要使用为子类继承父类，下面是es6继承的书写方法
    3. 多态
       多态的具体表现为方法重载和方法重写：
       方法重载：重载是指不同的函数使用相同的函数名，但是函数的参数个数或类型不同。调用的时候根据函数的参数来区别不同的函数
       方法重写：重写（也叫覆盖）是指在派生类中重新对基类中的虚函数（注意是虚函数）重新实现。即函数名和参数都一样，只是函数的实现体不一样

31. 图片的懒加载
    当打开一个有很多图片的页面时，先只加载页面上看到的图片，等滚动到页面下面时，再加载所需的图片。这就是图片懒加载。

32. 盒模型
    盒模型是有两种标准的，一个是标准模型，一个是IE模型。
    标准模型：宽高只是内容（content）的宽高，
    IE模型：宽高是内容(content)+填充(padding)+边框(border)的总宽高。

33. 你知道的数组api

    1. concat()方法用于合并两个或多个数组。
    2. slice()方法返回一个从开始到结束（不包括结束）选择的数组的一部分浅拷贝到一个新数组对象，原始数组不会被修改。
    3. splice()方法始终会返回一个数组，该数组包含从原始数组中删除的项
    4. join()使用指定的字符串用来分隔数组字符串
    5. push()可接受任意类型的参数，将它们逐个添加到数组的末尾，并返回数组的长度
    6. pop()从数组的末尾移除最后一项，减少数组的length值，返回移除的项
    7. shift() 移除数组中的第一个项并且返回该项，同时将数组的长度减一。
    8. unshift() 在数组的前端添加任意个项，并返回新数组的长度。
    9. reverse() 方法用于颠倒数组中元素的顺序
    10. String() 函数把对象的值转换为字符串。