TCP和UDP的区别tcp是传输控制协议，基于连接协议，给连接对方提供可靠的传输，一个tcp传输需要经过三次握手四次挥手才能建立会话；优点：传输安全，不易丢包缺点：传输效率低udp是用户传输协议，不建立连接，不需要建立会话，直接发送数据，不可靠传输数据；优点：传输效率高缺点：易丢包，传输不安全什么是语义化标签，为什么要语义化什么是：旨在让标签有自己的含义。为什么：1),.即使在没有CSS样式的条件下，也能很好地呈现出内容结构、代码结构；2).语义化HTML会使HTML结构变的清晰，有利于维护代码和添加样式；3).方便其他设备解析（如屏幕阅读器、盲人阅读器、移动设备）以意义的方式来渲染网页；4).提升搜索引擎优化(SEO)的效果。和搜索引擎建立良好沟通，有助于爬虫抓取更多的有效信息：5).爬虫依赖于标签来确定上下文和各个关键字的权重；6).便于团队开发和维护，语义化更具可读性，是下一步吧网页的重要动向，遵循W3C标准的团队都遵循这个标准，可以减少差异化。7).通常语义化HTML会使代码变的更少，使页面加载更快。清除浮动，什么时候需要清除浮动，清除浮动都有哪些方法；什么时候？对元素进行了浮动(float)时，我们的元素就会脱离文档流；方法？方法一：添加新的元素 应用 clear：both；方法二：父级div定义 overflow: auto方法三： 据说是最高大上的方法 :after 方法JavaScript有哪几种数据类型？基本数据类型1).字符串’String’;2.数字Number；3布尔’Boolean‘引用数据类型1).数组’Array‘2).对象’Object‘特殊数据类型1).空对象null2).未定义Undefined行内元素有哪些？块级元素有哪些？ 空(void)元素有那些？行内元素：a b span img input select strong块级元素：div ul li ol dl dt dd h1 p空元素：
![]()
Label的作用是什么？如何使用？作用：Label标签是用来定义表单控制间的关系使用：当用户选择该标签时，浏览器会自动将焦点转到和标签相关的表单内容上HTML5 为什么只需要写 ？告知浏览器的解析器用什么文档标准解析这个文档一个CSS文件如果过大的话，加载会很慢，占用过大带宽，如果解决？1.去除空格和换行,压缩css代码;2.尽量使用简写, 缩减代码;3.将css文件分成多个文件标签的隐藏（display:none和visibility:hidden）的区别？display:none是彻底消失，不在文档流中占位，浏览器也不会解析该元素；visibility:hidden是视觉上消失了，可以理解为透明度为0的效果，在文档流中占位，浏览器会解析该元素；input中disabled与readonly有何区别？1）、Readonly只针对input(text / password)和textarea有效，而disabled对于所有的表单元素都有效，2）、但是表单元素在使用了disabled后，当我们将表单以POST或GET的方式提交的话，这个元素的值不会被传递出去，而readonly会将该值传递出去（readonly接受值更改可以回传，disable接受改但不回传数据）。a标签的四个伪类是什么？如何排序？为什么？（link,visited,hover,active）为了产生预期的效果，在 CSS 定义中，a:hover 必须位于 a:link 和 a:visited 之后 !为了产生预期的效果，在 CSS 定义中，a:active 必须位于 a:hover 之后！使用display:inline-block在IE6中不能正常显示，如何解决？1.如果先定义了 display:inline-block，然后再将 display 设回 inline 或 block，2.直接让块元素设置为内联对象呈递，然后触发块元素的 layoutimg的alt和title有什么区别？1)、alt是在图片不能正常加载时候显示的提示语，2)、title属性是鼠标划上去显示的内容css样式引用和js引入的位置问题（为什么会放在头部或者底部）。因为页面在加载时，css加载时可以并发请求的（同页面中的图片，ie6除外），而js加载时需要等待一个js文件加载完成后才加载其他资源，为了页面的快速呈现，放置在尾部效果更好某种效果，有两种实现方案都可以实现，方案一：标签；方案二：背景图，两个方案如何取舍？衡量的标准是什么?如果图像是内容的一部分或图表或人，使用img标签加上alt属性如果你想打印页面并且你想要的图像包含默认情况下使用img使用img（alt文本）图像有一个重要的语义化时div+css与table布局的有何区别？1).符合W3C标准，代码结构清晰明了，结构、样式和行为分离，带来足够好的可维护性。2).布局精准，网站版面布局修改简单。3).加快了页面的加载速度（最重要的）。4).节约站点所占的空间和站点的流量。5.用只包含结构化内容的HTML代替嵌套的标签，提高另外搜索引擎对网页的搜索效率。table的合并边框属性是什么？跨行是什么？跨列是什么？合并边框“cellspacing” 跨行“rowspan”跨列“colspan”split() join()的区别在哪？1).join()函数获取一批字符串，然后用分隔符字符串将它们连接起来，从而返回一个字符串。2).split()函数获取一个字符串，然后在分隔符处将其断开，从而返回一批字符串。数组方法pop() push() unshift() shift()的区别在哪？push()是用来在数组末端添加项，shift()在移除数组的第一个项pop()在数组末端移除项，unshift()在数组前端添加项。JavaScript的事件流模型都有哪些？“事件冒泡”：事件开始由最具体的元素接收，然后逐级向上传播“事件捕捉”：事件由顶层的dom开始向下传递，在底层最具体的元素接收“事件委托”：当事件响应到需要绑定的元素上时，会通过事件冒泡机制从而触发它的外层元素的绑定事件上，然后在外层元素上去执行函数。请按要求操作数组a：i. 如何删除数组a中第2个元素（即：“B”）？a.splice(1,1)ii. 如何删除数组a中最后一个元素？a.pop()iii. 如何将“NEW”插入数组a的“B”和“C”之间？a…splice(2,0,NEW);请你谈谈Cookie的弊端a. 每个特定的域名下最多生成的cookie个数有限制b. 安全性问题。如果cookie被人拦截了，那人就可以取得所有的session信息。c.有些状态不可能保存在客户端。d. cookie存储字段小，为了兼容性，一般不能超过4K请说出三种减少页面加载时间的方法a. 压缩合并Javascript、CSS代码b.Javascript脚本放在文件末尾c. 服务器开启gzip压缩d.网址后加斜杠e.减少http请求列举IE与其他浏览器不一样的特性？1)IE支持currentStyle2)IE使用innerText;3)滤镜方面：IE：filter:alpha(opacity= num4)事件方面：attachEvent5)鼠标位置：IE是event.clientX;6)IE使用event.Element;7)IE中消除list的原点仅需margin:0即可达到最终效果前端页面有哪三层构成，分别是什么？作用是什么？1)结构层，表现层，行为层2作用：a. 结构层：由 HTML 或 XHTML 之类的标记语言负责创建，仅负责语义的表达。解决了页面“内容是什么”的问题。b. 表示层：由CSS负责创建，解决了页面“如何显示内容”的问题。c. 行为层：由脚本负责。解决了页面上“内容应该如何对事件作出反应”的问题。函数里的this什么含义，什么情况下，怎么用。1）this是一个关键词，它始终指向一个对象，this像是一个指针。2） 情况一：纯粹的函数调用情况二：作为对象方法的调用情况三： 作为构造函数调用什么是闭包,闭包的特性、作用闭包：闭包是指有权访问另一个函数作用域中变量的函数作用：1）能够读取函数内部的变量2）这些变量长期保存在内存中，不会在外部函数调用后清除特性：1）函数套函数2）内部函数可以直接使用外部函数的局部变量或参数3)变量或参数不会被垃圾回收机制回收undefined和 null 区别1）类型不同2）转化出的值不同3）含义不同：undefined：表示使用var声明变量但没有初始化null：是个空指针对象jQuery库中的 $ ()是什么?就是jquery对象，$()就是jQuery()，在里面可以传参数，作用就是获取元素jQuery中，如何阻止事件冒泡和浏览器默认行为？1）阻止冒泡用stopagation2）阻止浏览器默认行为用preventDefault怎样添加,移除,移动,复制,创建和查找节点?1）添加用appendChild（）2）移除用removeChild（）3）移动用cloneNode()removeChild()insertBefore()4）复制用cloneNode()5）创建用createElement(),createTextNode()6）查找用getElementsByTagName()getElementsByClassName()getElementById()什么叫优雅降级和渐进增强？1)优雅降级：一开始就构建完整的功能，然后再针对低版本浏览器进行兼容。2)渐进增强：针对低版本浏览器构建页面，保证最基本的功能，然后在针对高级浏览器进行效果，交互等改进和追加功能达到最好的效果Javascript中的定时器有哪些？他们的区别及用法是什么？1）setTimeout(),setInterval()区别：setTimeout调用一次,setInterval反复调用用法：都可以传入两个参数，一个函数名，另一个为毫秒数innerHTML和outerHTML有什么区别1）innerHTML: 从对象的起始位置到终止位置的全部内容,不包括Html标签。2）outerHTML: 除了包含innerHTML的全部内容外, 还包含对象标签本身。浏览器的标准模式和怪异模式究竟是什么？a）标准模式：是浏览器按照W3C标准解析执行代码，这样用规定的语法去渲染，就可以兼容各个浏览器，保证以正确的形式展示网页。b）怪异模式：是使用浏览器自己的方式解析执行代码，因为不同浏览器解析执行的方式不一样，所以我们称之为怪异模式。JQuery链式写法原理答：jq的链式调用是通过return this的形式来实现的。通过对象上的方法最后加上return this，把对象再返回回来，对象就可以继续调用方法，实现链式操作了。如果需要链式的处理，只需要在方法内部返回当前的这个实例对象this就可以了，因为返回当前实例的this，就又可以访问自己的原型了。$(document).ready() 是个什么函数？为什么要用它？答：该函数会按照注册（绑定）的顺序一次执行，是事件模块中最重要的一个函数，可以极大的提高Web应用程序的响应速度，jQuery就是用(document).ready()方法来代替传统的JS的window.onload方法的JavaScript window.onload 事件和 jQuery ready 函数有何不同？答：前者除了要等待 DOM 被创建还要等到包括大型图片、音频、视频在内的所有外部资源都完全加载。如果加载图片和媒体内容花费了大量时间，用户就会感受到定义在 window.onload 事件上的代码在执行时有明显的延迟。另一方面，jQuery ready() 函数只需对 DOM 树的等待，而无需对图像或外部资源加载的等待，从而执行起来更快。使用 jQuery $(document).ready() 的另一个优势是你可以在网页里多次使用它，浏览器会按它们在 HTML 页面里出现的顺序执行它们，相反对于 onload 技术而言，只能在单一函数里使用。鉴于这个好处，用 jQuery ready() 函数比用 JavaScript window.onload 事件要更好些。$(this) 和 this 关键字在 jQuery 中有何不同?a、this表示js的dom对象
b、$(this)表示的是用jquery封装好的当前对象,可以使用jquery提供的方法访问样式
px、em、rem的区别px: 像素px是相对于显示器屏幕分辨率而言的
em会继承父级元素的字体大小
rem会继承html元素的字体大小
js页面生命周期DOMContentLoaded, 浏览器完成HTML的加载, 并构建DOM树,但是css和img等外部资源尚未加载完成。注意：这里的外部资源指的是需要发送http请求获得的资源，而不是自己文件中的资源load, 浏览器加载完所有资源, 包括HTML文档, 图片, 样式等beforeunload, 用户即将离开, 用来检查用户是否保存了修改, 并询问是否真的要离开unload, 用户几乎已经离开, 但是可以启动一些操作, 比如发送统计数据有关css属性position的属性值的描述static：没有定位，元素出现在正常的流中，占据文档流空间
fixed：生成固定定位的元素，相对于浏览器可视窗口进行定位，不占据文档流空间
relative：生成相对定位的元素，相对于元素本身正常位置进行定位，占据文档流空间
absolute：生成绝对定位的元素，相对于static定位以外的第一个含有(relative, absolute, fixed, sticky)的祖先元素定位，不占据文档流空间
sticky: 黏贴定位，相对于浏览器可视窗口进行定位，占据文档流空间
主流浏览器、内核 、内核构成以及作用IE * tridentFirefox(火狐) * geckoSafari(苹果) * webkitChrome(谷歌) * webkit * blink (blink是webkit内核一个分支)Opera(欧朋) * presto * webkit (2013改为webkit)内核构成:
渲染引擎：负责渲染HTML、CSS、图片等信息，然后输出到显示器
js引擎: 负责解析javascript脚本，实现页面动态效果
css具有继承属性color, text-align, line-height, font-size, font-weight, font-style, font-family,white-space, text-indent, text-decoration, text-transform等等== 和 ===，null 和 undefined的区别==:
值相等，类型可以不同
===: 值相等且类型相同
null: 表示暂且空值，未来有值，一般用于释放引用类型数据
undefined: 表示未定义，一般是指一个变量只是生声明而没有赋值
css优先级分配含有!important的css的优先级最高
在相同选择器精度情况下：
id选择器的优先级 > class选择器大 > 元素选择器
内联样式 > 内部样式
内联样式 > 外部样式
HTML、XHTML、XML、HTML5区别HTML: 超级文本标记语言，标签对大小写不敏感
XHTML: 严格的HTML，标签必须小写，标签必须闭合，标签必须嵌套正确
XML: 可扩展的标记语言，标签可以自定义，比如
HTML5: HTML4.0.1升级版
行内元素，行内块元素，块级元素的区别以及标签嵌套规范行内元素: 不占满整行，不可以直接使用css设置宽度和高度，比如 a, i, span, b, strong, del, s等等
行内块元素: 不占满整行，可以直接使用css设置宽度和高度，比如 button, img, input, textarea, select等等
块级元素: 占满整行，可以直接使用css设置宽度和高度，比如 div, p, h1-h6, ul, ol, li, form等等
标签嵌套规范
行内元素可以嵌套行内元素
块级元素可以嵌套块级元素、行内块元素、行内元素
p元素不能嵌套p元素，p元素不能嵌套h系列的元素，h系列的元素不能嵌套h系列的元素
面向对象以及原型面向对象
将需求抽象成一个对象，然后对其成员进行分析
面向对象三大特征
封装、继承、多态
面向对象的第一步是创建构造函数，第二步通过构造函数创建对象实例
原型：
对象的属性和方法，有可能是定义在自身，也有可能是定义在它的原型对象，由于原型本身也是对象，又有自己的原型，所以形成了一条原型链。
函数的原型是 prototype
对象的原型是 __proto__
对象的顶级原型为null， 即Object.prototype.__proto__ == null
外边距合并在垂直方向，两个元素相遇，会发生外边距合并，合并时取最大外边距
对于父子元素外边距合并
如果父级元素没有内边距和边框，此时设置子元素的外边距，该外边距会和父元素的外边距发生合并
解决方法：
父元素设置边框
父元素设置内边距替换子元素的外边距
对于同级元素外边距合并
在垂直方向, 前一个元素设置margin-bottom,后一个设置margin-top, 此时两个元素会发生外边距合并
解决方法: 只设置元素最大值的外边距
a元素和label元素的作用对于a元素
下载，跳转站外链接，跳转站内链接，回到顶部，锚点
对于label元素
label一般配合表单控件使用
使用label元素包裹的表单控件，点击label任何一个范围，相当于点击表单控件
使用label的for属性关联表单控件的id，点击label任何一个范围，相当于点击表单控件
判断数组六大方法arr.constructor === Array
arr instanceof Array
Array.isArray(arr)
Array.prototype.isPrototypeOf(arr)
Object.getPrototypeOf(arr) === Array.prototype
Object.prototype.toString.call(arr) === '[object Array]'
CSS的盒子模型盒子模型的组成：内容(content)、内边距(padding)、边框(border)、外边距(margin)
内边距位于内容和边框之间，一般用于隔离内容，内边距可以填充背景色
外边距位于盒子和盒子之间，一般用于隔离盒子，使得盒子与盒子有一定的间距
边框位于内边距和外边距之间
js数据类型js数据类型分为原始数据类型和引用数据类型
原始数据类型
number, string, boolean, null, undefined, symbol
引用数据类型
function, array, object
$(function() {}) 和 window.onload区别
window.onload是在页面所有的元素都加载完成后才触发 $(function(){})是在页面的dom结构加载完毕后就触发dom里的内容不一定都已经加载完成
内部插入节点和外部插入节点内部插入节点，节点关系为父子关系
在父节点尾部添加一个子节点
父节点.append(子节点)
子节点.appendTo(父节点)
在父节点顶部添加一个子节点
父节点.prepend(子节点)
子节点.prependTo(父节点)
外部插入节点，节点关系为同胞节点
在节点前面添加节点
节点1.before(节点2);
节点2.insertBefore(节点1);
在节点后面添加节点
节点1.after(节点2);
节点2.insertAfter(节点1);
== 和 ===，null 和 undefined的区别==:
值相等，类型可以不同
===: 值相等且类型相同
null: 表示暂且空值，未来有值，一般用于释放引用类型数据
undefined: 表示未定义，一般是指一个变量只是生声明而没有赋值
瀑布流实现原理先取第一行元素的高度为基准高度，从第二行开始，在基准高度找出最小高度值，将下一个元素放在最小高度对应的元素的下面，元素完成位置设置后，将基准高度的最小高度重置为元素高度和最小高度之和$.extend 和 $.fn.extend的区别$.extend
如果只传递一个对象，表示在jQuery构造函数扩展属性和方法，jquery实例不能使用，只能jQuery构造函数本身使用
如果传递两个对象以上的，表示合并对象，并返回合并之后的对象
如果第一个参数为true，其他参数为对象时，则表示深度合并对象，并返回合并之后的对象
$.fn.extend
表示在jQuery构造函数的原型prototype扩展属性和方法, jquery实例能使用, jQuery构造函数本身不能使用
重绘和回流重绘
当页面的元素需要更新属性，新的属性对元素的外观，风格的产生影响，这个更新的过程称为重绘
比如设置元素的background，color等等，都会重绘元素
回流
当页面的元素因为尺寸，位置、布局，隐藏等改变而需要浏览器重新构建的过程，这个重构的过程称为回流
比如设置元素的width，height，float，position等等，都会回流元素
display: none; 和 visibility: hidden;的区别共同点：都是隐藏元素
不同点: 对于display: none;隐藏的元素不会占据文档流；visibility: hidden;隐藏的元素仍会占据文档流
浏览器的渲染页面机制浏览器解析HTML文档和CSS样式表构建DOM树和和CSSDOM树(没有设置节点外观样式)
浏览器结合DOM树和CSSOM树构建渲染树(重绘元素)
浏览器在渲染树内对每个渲染元素进行布局处理，计算出每一个元素的大小和位置(回流元素)
遍历渲染树将实际的像素显示到屏幕(确认最终的回流元素样式)
加载优化懒加载可视区域的数据
依赖的下载路径是否可靠，不可用时候是否会阻碍整个页面
脚本放在body结束标签之前执行
压缩html、图片、样式表、js
保证图片正常浏览时，图片分辨率要尽可能小
字体图标替换图片
css选择器尽量不要超过四个层级，由于css选择器越复杂，浏览器计算得越久
尽量减少js对DOM操作
bootstrap4响应式断点范围 超大PC xl: x >= 1200px
pc lg: x >= 992px
平板 md: x >= 768px
手机或者手机横屏 sm:
x >= 576px
超小屏幕手机: x < 576
什么是XSS攻击XSS(cross site script): 跨站脚本攻击原理: 恶意攻击者往web页面插件恶意的HTML代码, 当用户浏览网页时, 嵌入恶意的html代码就会被执行实现原理: 通过站内交互途径, 比如发布评论, 提交含有javascript的内容文本, 如果前端和服务器没有过滤或者没有转义这些脚本, 作为内容发布到网页上, 其他用户访问这个页面时会执行这些脚本, 从而被攻击目的: 通过插入恶意脚本, 实现对用户浏览器的控制, 获取用户信息怎样防止XSS攻击 输入过滤(长度验证, 格式验证)
输出转义(html转义编码)
将重要的cookie标记httponly, 避免XSS攻击利用javascript的document.cookie获取cookie
其中具有httponly标记的cookie无法获取，增强cookie的安全性
有关css属性position的属性值的描述static：没有定位，元素出现在正常的流中，占据文档流空间
fixed：生成固定定位的元素，相对于浏览器可视窗口进行定位，不占据文档流空间
relative：生成相对定位的元素，相对于元素本身正常位置进行定位，占据文档流空间
absolute：生成绝对定位的元素，相对于static定位以外的第一个含有(relative, absolute, fixed, sticky)的祖先元素定位，不占据文档流空间
sticky: 黏贴定位，相对于浏览器可视窗口进行定位，占据文档流空间
前端如何定跳页面利用a标签的href属性跳转页面
使用location跳转页面，跳转方式有三种
location.href
location.assign()
localtion.replace()
加载优化懒加载可视区域的数据
依赖的下载路径是否可靠，不可用时候是否会阻碍整个页面
脚本放在body结束标签之前执行
压缩html、图片、样式表、js
保证图片正常浏览时，图片分辨率要尽可能小
字体图标替换图片
css选择器尽量不要超过四个层级，由于css选择器越复杂，浏览器计算得越久
尽量减少js对DOM操作
目前主流浏览器IE 内核 ：tridentFirefox 内核：geckoSafari (苹果) 内核：webkitOpera（欧朋） 内核:webkitChrome (谷歌) 内核:webkit内核构成：渲染引擎：负责渲染HTML,CSS,图片 等信息，然后输出显示器js引擎：负责解析JavaScript脚本，实现页面动态效果get请求和post请求的区别get传输数据的速度快，安全性低post传输速递低，安全性高Sass、LESS 是什么？大家为什么要使用他们？共同点：他们是CSS的预处理器，是CSS上的抽象层，是一种特殊语法，语言编译成CSS;Less:是一种动态样式语言，将CSS设置成动态语言的属性，既可以在客户端运行，也可以在服务端运行；Sass:为什么使用？a.结构清晰，便于扩展。b.可以方便地屏蔽浏览器私有语法差异。这个不用多说，封装对浏览器语法差异的重复处理，减少无c.意义的机械劳动。d.可以轻松实现多重继承。e.完全兼容 CSS 代码，可以方便地应用到老项目中。LESS 只是在 CSS 语法上做了扩展，所以老的 CSS 代码也可以与 LESS 代码一同编译。为什么要用面向对象？1.便于项目的维护，拓展更新2.可以实现属性和方法的继承3.提高网页应用程序的性能，节省内存空间什么是对象？属性和方法的集合，属性和方法是对象的成员js面向对象创建对象的几种方式：1.直接量定义对象2.工厂模式定义对象优点：解决看创建相似对象的问题，缺点：不能识别对象类型3.构造函数定义对象优点：创建自定义函数介意将它的实例标识为一种特定的类型缺点：每个方法都要重新实例一遍4.原型定义对象优点：可以让所有的对象实例共享它所包含的属性和方法缺点：原型中的所有属性都是共享的，但是实例一般都要有自己单独属性的5.混合模型三种方式定义一个函数1.var fn1= new Function(‘代码块’);//调用fn1()2.var fn2 =function(){代码块}；fn2()3.function fn3(){代码块}；fn3（）自执行函数(function(){代码块})（）回调函数特点：把一个函数作为实参传递到另一个函数再调用function fn1(callback){callback();}fn1(function(data){代码块})CSS中link和@import的区别是？1.lin属于HTML标签，而@import是CSS提供的2.link是标签没有兼容性问题，而@import需要ie5以上浏览器3.页面被加载时，link标签被同时加载，而@import需要页面加载完再加载4.link标签方式的权重高于@import为什么要初始化样式？由于兼容问题，不同浏览器对标签的默认样式值不同，若不初始化会造成不同浏览器之间的显示差异BFC是什么？独立的布局环境，其中的元素不受外界的影响，并在一个BFC中，块盒和行盒都会垂直沿其父元素的边框排列对 WEB 标准以及 W3C 的理解与认识W3C可分为结构层，行为层和表现层，而WEB标准是让三者独立，让其具有模块化W3C对web标准提出了规范化1.对于结构：a.标签要闭合b.标签要小写c.标签不能随意嵌套2.对于表现和行为：a.尽量使用外链CSS和JS，符合规范提高渲染速度b.不需要变动页面内容、提供打印版本而不需要复制内容、提高网站易用性作用域，作用域链？a.作用域：就是变量与函数的可访问范围。作用域分为 全局作用域(所声明的变量全局都可以访问),局部作用域(所声明的变量只在其内部可以访问)。b.作用域链：当我们在一个函数内部访问当前作用域内不存在的变量时，就会逐层向外查找，如果一直找不到就会报错。当我们在局部作用域中，调用外部变量时，就产生了作用域链。JavaScript的三种强制转化类型ParseInt()将一个字符串转化成一个整数ParseFloat（）将一个字符串转化成一个浮点数Number（）将变量转化成数值型ajax的理解？ajax的原理：原理：相当于在用户和服务器之间加一个中间层（ajax引擎),使用户操作与服务器响应异步化。ajax的优点：在不刷新整个页面的前提下与服务器通信维护数据。不会导致页面的重载可以把前端服务器的任务转接到客服端来处理，减轻服务器负担，节省宽带。ajax的劣势：对搜索引擎的支持比较弱；不容易调试。解决办法：通过location.hash值来解决Ajax过程中导致的浏览器前进后退按键失效列举浏览器对象模型 BOM 里常用的至少 4 个对象，并列举 window 对象的 常用方法至少5个对象：window document location screen history navigator方法：alert() confirm() prompt() open() close() setInterval() setTimeout() clearInterval() clearTimeout()如何阻止事件冒泡和默认事件 ：a.阻止冒泡事件：e. stopPropagation();//标准浏览器b.阻止默认事件：e.preventDefault();javascript 的本地对象，内置对象和宿主对象a.本地对象：array obj regexp 等可以 new 实例化b.内置对象：gload Math 等不可以实例化的c.宿主对象:浏览器自带的 document,windowSass和Less的区别只要区别是他们的实现方式不同LESS是基于javaScript运行,所以LESS是在客户端处理，Sass是基于Ruby的，在服务端处理的，很多开发者不选择LESS是因为LESS输出修改过的CSS浏览器需要依赖JavaScript引擎，而JavaScript引擎需要额外的时间处理代码JQuery是什么？特点，优缺点？什么是jQuery：1.jQuery是一个优秀的JavaScript框架2.是一个轻量级的js库，简洁的js库，能使用户更方便的处理dom，event，实现动画效果，并且方便为网站提供ajax交互特点：1.一款轻量级的js框架2.丰富的dom选择器3.链式表达式4.事件。样式。动画支持5.ajax操作支持6.跨浏览器兼容7.插件扩展开发8.可拓展性强优点：1.实现脚本与页面分离2.最少代码做最多的事情3.性能支持比较好缺点：1.不能向后兼容2.插件的兼容性3.使用多个插件容易发生冲突网络七层协议：1.应用层2.表示层3.会话层4.传输层5.网络层6.数据链路层7.物理层js的常用内置对象1.array数组对象2.string字符串3.math对象4.Date日期对象js堆栈含义：都是运行时内存分配的一个数据区，因此也被称为堆区和栈区区别：二者存储的数据类型和处理速度不同1.堆用于复杂引用数据类型分配空间，存储速度慢；2.栈主要用于存放基本数据类型，存储速度快；垃圾回收机制1.标记清除：当变量进入执行环境时，变量标记为进入环境，当离开环境时，标记为离开环境，2.引用计数：引用计数的含义是跟踪记录每个值被引用的次数，当声明一个变量并将一个引用类型赋值给该变量时，这个值的引用次数就是1，相反，如果包含对这个值引用的变量又取得另外一个值，则这个值引用次数就-1；js由三部分组成ECMAscript：它是js语言的标准，规定了js的编程语法和基础核心知识dom：文档对象模型，提供给js很多操作页面中元素的属性和方法bom：浏览器对象模型，提供给很多操作浏览器的属性和方法，而这些方法都放在window浏览器对象下Promise是什么是一种异步编程的解决方案，从语法上看，Promise是一个对象，它可以获取异步操作的消息，从本意上看他是一种承诺，承诺一段时间会给你一个结果同步加载与异步加载？同步模式：又称阻塞模式，会阻止浏览器的后续处理，停止后续的解析，只有当前加载完成，才能进行下一步操作。所以默认同步执行才是安全的。但这样如果js中有输出document内容、修改dom、重定向等行为，就会造成页面堵塞异步加载：又叫非阻塞加载，浏览器在下载执行js的同时，还会继续进行后续页面的处理Promise的作用？是一个对象，用来传递异步操作的消息，提供统一的api，可供进一步处理vuex的五个属性有哪些（状态管理模式）1.state：基本数据 （mapState辅助函数）2.getters：从基本数据派生的数据3.mutations：提交更改数据的方法4.actions：像一个装饰器，包裹mutations，使之可以异步5.mudules：模块化vuexvue的虚拟dom 是什么是js模拟dom结构，利用虚拟dom最后的状态去操作dom常见的八大数据结构：数组栈队列链表树图字典树（这是一种高效的树形结构，但值得单独说明）散列表（哈希表）foreach和map的区别foreach返回的是一个undefinedmap返回的是一个新数组nodejs的优缺点：优点：高并发适合I/O密集型缺点：不适合CPU密集型应用只支持单核CPU可靠性低适合场景：RESTful API统一web应用的UI层大量的ajax请求的应用页面导入样式时，使用link和@import有什么区别？1.link属于XHTML标签，除了加载css外，还能定义rel链接起作用，而@import是css提出的只能加载css2.页面被加载时，link会被同时加载，而@import引用的css需要页面加载完再加载3.@import需要IE5以上才能识别，而link无兼容问题原型是什么？在JavaScript中原型是一个prototype对象，用于表示类型之间的关系。原型链是什么？在JavaScript中是通过prototype对象指向父类对象，直到指向Object对象为止，这样就形成了一个原型指向的链条，专业术语称之为原型链。什么是虚拟DOM？使用js对象模拟DOM，在操作过程中不会直接操作DOM，等待虚拟DOM操作完成，仅仅比较开始和结束状态虚拟DOM有哪些变换，最终根据结束状态虚拟DOM去操作DOM。Vue相对于jQuery在开发上有什么优点a.Vue比JQuery减少了 DOM 操作b.组件化模式，开发效率高,方便维护jsonp原理？使用script标签的src属性，利用get方式请求后台数据，将数据以参数的形式返回怎样避免全局变量污染？a.尽量少使用全局变量b.使用闭包Vue数据双向绑定的原理及其实现原理是根据数据劫持和订阅者模式实现过程是监听器，观察者和解析器MVC与MVVM的理解MVC视图层（View）：主要是用户界面的展示控制层（Controller）：主要是处理Model层和View层的交互模型层（Model）：主要是对数据的CRUD操作辑的处理。MVVM视图层（View）：调用ViewModel的方法并响应变化。视图模型层（ViewModel）：主要做业务的调度者，分割了View层和Model层。模型（Model）：数据模型GET、POST的区别？a.get是从服务器上获取数据，post是向服务器传送数据。b.get传送的数据量较小，不能大于2KB。post传送的数据量较大，一般被默认为不受限制c.get安全性非常低，post安全性较高。socket与web socket的区别？Socket是传输控制层协议，WebSocket是应用层协议。什么是深拷贝，什么是浅拷贝深拷贝是两个对象在同一个内存空间，如果一个改变另一个会开辟新的内存空间，不受影响浅拷贝是两个对象，如果一个改变，另一个也会发生改变请讲述sessionStorage、localStorage、cookie的区别？⒈localStorage长期存储数据，浏览器关闭数据后不丢失；⒉sessionStorage数据在浏览器关闭后自动删除；⒊cookie是网站为了标识用户身份而存储在用户本地终端（Client Side）上的数据（通常经过加密）。cookie始终在同源的http请求中携带（即使不需要）都会在浏览器和服务器端间来回传递。session storage和local storage不会自动把数据发给服务器，仅在本地保存；⒋存储大小：cookie数据大小不会超过4K，session storage和local storage虽然也有存储大小的限制，但比cookie大得多，可以达到5M或者更多；如何解决浏览器兼容问题? 另外请详细讲述CSS hack。可以通过初始化样式csshack是通过不同css 代码在不同浏览器中兼容相同效果讲一下 prototype 是什么东西，原型链的理解，什么时候用 prototypeprototype是js的对象由属性和方法组成原型链是每个prototype对象指向父级对象，最终指向Obeject产生的原型链条js中call(),apply(),bind()方法的区别call()和apply()第二个传入的参数不同，call()传入的是字符串，apply()传入的是数组bind()传参方式与call()相同，只不过call()和apply()调用后会立即执行，而bind()还需要再调用才会执行什么是事件委托，它的作用？就是讲子元素的事件，放在父元素去处理，他是原理是事件冒泡的实现作用:减少for循环优化性能，减少内存什么是函数防抖？在单位时间内函数只执行最后一次，如果多次触发，则重新计算延迟时间应用场景：表单提交，输入框验证，搜索框什么是函数节流？在单位时间内多次触发一段时间只一次函数执行应用场景:dom元素的多次拖拽或滚动，抢购什么重绘和回流？重绘：当页面元素样式改变，不影响元素在文档流中的位置回流：当操作的改变响应文档内容或者元素在文档流中的位置发生改变优化：减少dom操作将样式放在head标签下而脚本放在body结束后简洁优化css样式事件冒泡和事件捕获的区别？事件冒泡是给子元素绑定事件并触发时，父元素也会跟着触发事件捕获是用addeventlistener（）绑定并触发子元素时，先触发父元素再传递给子元素什么堆栈？它们的区别堆主要存储引用数据类型，存放速度比较慢栈主要存储基本数据类型，存取速度比较快区别：栈存储的是局部变量，堆存放的是实体栈的存放速度比堆快栈存放的变量生命周期结束就会被摄放，而堆会不定时被垃圾回收机制回收什么是路由守卫？路由守卫是路由跳转时被验证，通常用于登录验证传入的参数有to(到哪个页面),from(从哪个页面来),next(回调函数)请描述下你对vue框架的理解？vue是一套用于构建用户界面的渐进式框架特性：轻量级框架双向数据绑定插件化优点：轻量高性能组件化的MVVM库，容易上手缺点：不支持IE8性能不如react和angularvar let const区别?var的声明一般在全局作用域,会有变量提升,会造成变量污染let的声明一般在块级作用域,不存在变量提升,形成暂时性死区,不能重复声明const的声明一般在块级作用域,形成暂时性死区,不能重复赋值,原因是对简单数据类型的值保存在内存地址,而复杂的数据类型保存的是指向实际数据的内存地址promise是什么?作为异步编程操作,解决回调地狱,有三个参数,padding(进行中),fulfilled(已成功),rejected(已失败),一旦执行无法中途取消Promise.prototype.then()等待上一个promise状态改变返回新的promise实例Promise.prototype.catch()用于指定发生回调函数异步执行的错误Promise.prototype.try()用于指定发生回调函数同步执行的错误Promise.prototype.finally()不管 Promise 对象最后状态如何，都会执行的操作Promise.all()方法用于将多个 Promise 实例，包装成一个新的 Promise 实例,一个执行失败则不会继续执行Promise.race() 多个相同数据的接口哪个获取快,就先获取哪个的结果Promise.allSettled()不管每一个操作是成功还是失败，再进行下一步操作Promise.any()只要参数实例有一个变成fulfilled状态，包装实例就会变成fulfilled状态；如果所有参数实例都变成rejected状态，包装实例就会变成rejected状态。async/await是什么?promise和Generater的语法糖,await必须放在async里面好处:1.简介,使异步代码看起来像同步代码2.async/await 让 try/catch可以同时处理同步和异步的错误箭头函数与普通函数的区别1.普通函数存在变量提升的现象2.箭头函数不能作为构造函数使用,没有new对象3.两者this的指向不同,普通this指向绑定的事件,箭头函数的this指向所处环境的上下文,如果没有上下文指向最外层的对象windowMap和Set的区别?1.Map保存键值对，任何值都可以作为键值的值。2.Set保存的是类数组数据，是值的集合。3.Map有get方法而Set没有get方法原型和原型链的理解?原型:每个函数都有prototype属性,该属性指向原型对象;使用原型对象的好处是所有对象实例共享它所包含的属性和方法原型链:每个对象都有个原型对象,通过_proto_指针指向原型对象,并从中继承方法和属性,同时原型对象也有原型,这样一层一层最终指向null原型的作用：1.数据共享 节约内存内存空间2.实现继承
