web前端面试题

最近题主在找工作啊。。。发现基础的概念知识点还是需要重拾一下的，在这里就概括一下前端面试遇到的问题及答案。如有错误，请大家指正！！！！

1、中文的自我介绍

您好：我叫XXX。我是2015年毕业于西安欧亚学院。之前有过两份工作经验。第一份工作是在国翼天龙有限公司负责电子印章管理系统的开发，包括前后台开发。主要是针对于实体印章不能解决跨域问题为目的进行的开发。用到的前端技术是miniuiandjquery,后台技术是java+cxf。我的第二份工作是德森特有限公司，主要负责资产管理系统的前端开发，针对的客户是银行或者医院等他们的机房。用的前台框架是angularandbootstrap，我做了资产管理系统，资产上架，下架，以及资产维护系统。资产巡检系统做了一半移交给了其他同事。

这是我的介绍，谢谢

2、英文的自我介绍

Hello:mynameisXXX.IgraduatedfromXi'anEurasiaUniversityin2015.Thereweretwoworkingexperiencesbefore.Thefirstjobistodeveloptheelectronicsealmanagementsystem,includingthefrontandbackstagedevelopment,atthenationalDragonCompanyLimited.Thedevelopmentismainlyaimedatthefactthattheentitysealcannotsolvecrossdomainproblems.ThefrontendtechnologyusedisminiuiandjQuery,andthebackgroundtechnologyisjava+CXF.Mysecondjobisdersonlimited,whichismainlyresponsibleforthedevelopmentofthefrontendoftheassetmanagementsystem,andtheclientsaretheirbanksorhospitals.Thefrontframeusedisangularandbootstrap.Ihavemadeanassetmanagementsystem,assetshelves,downstairs,andassetmaintenancesystem.Halfoftheassetinspectionsystemwashandedovertoothercolleagues.Thisismyintroduction.Thankyou.

1、闭包和立即执行函数的概念，关系，区别

1、闭包：函数内部的函数本质上，闭包就是将函数内部和函数外部链接起来的桥梁。闭包可以看作是函数内部作用域的一个接口

用处：一、读取函数内部的变量，二、让这些变量始终保持在内存中，使得诞生环境一直存在。闭包使得内部变量记住上一次调用时的运算结果。三、封装对象的私有属性和私有方法,内部函数可以引用外部函数的参数和变量，参数和变量不会被垃圾回收机制回收

2、立即执行函数：以圆括号包裹的声明并马上调用的匿名函数

用处：不用为函数命名，避免全局变量被污染。二、创建一个独立的作用域，可以封装一些内部外部无法读取的私有变量

3、关系：都是特殊的函数

4、区别：立即执行函数只能执行一次，闭包会始终在内存中所以可以重复调用

2、作用域：指的是变量存在的范围。js中只有两种作用域，分为全局作用域[变量在整个程序中一直存在，所有地方都可以读取]和函数作用域[变量只在函数内部存在]

全局变量可以在函数内部读取

局部变量无法被函数外部读取

2、eval命令：把字符串解析成js语句执行

3、promise：

1、异步操作解决方案，充当异步操作和回掉函数之间的中间。不必一层层的嵌套回调函数。Promise是一个对象，从它可以获取异步操作的消息。Promise提供统一的API，各种异步操作都可以用同样的方法进行处理,promise是一个许诺，是对未来事情的承诺，承诺不一定能完成，但是无论如何都会返回结果

2、好处：1、只有三种状态padding（进行中）resolved（已成功）failed(已失败)2、只能从padding----》resolvedpadding----->failed状态发生改变则不可逆转。将异步操作以同步的流程表达

3、缺点:一旦开始执行，不知道进展到哪个阶段，无法取消2、如果不设置回掉函数，promise内部抛出的异常无法得知

4、一般用在读取文件的时候

4、同源策略，跨域，解决方式

1、同源策略：是指一段脚本只能读取来自同一来源的窗口和文档的属性，这里的同一来源指的是主机名，协议和端口号的组合

2、跨域问题是有js中的语言安全限制中的同源策略造成的，更多时候是出现在需要用ajax获取数据时

3、解决方式：jsonp，iframe,window.name,服务器上设置代理页面，postMessage

1、使用跨域资源共享

2、使用jsonpjsonwithpadding填充式json包含两个部分组件，回调函数和数据回调函数是当响应到来时应该在页面中调用的函数，而数据就是传入回调函数中的json数据。动态创建script标签，回调函数

5、babel是将es6编译成es5的语法解释器

ES6代码输入==》babylon进行解析==》得到AST

==》plugin用babel-traverse对AST树进行遍历转译==》得到新的AST树

==》用babel-generator通过AST树生成ES5代码

6、css3的新特性

新增css伪类选择器，圆角，弹性布局，阴影和反射，文字阴影文字渲染，旋转，定位倾斜动画多背景

7、不确定数量的li进行插入dom用css3的特性怎么实现

Nth-child(n)：是一个伪类选择器，代表n传递几个就生成几个child

:nth-child(n)选择器匹配属于其父元素的第N个子元素，不论元素的类型。不管是不是同一个类型，所有子元素按照自然数去数

8、圣杯布局和双飞翼布局

9、居中div、

1、水平居中

div{
Width:200px;
Margin:0 auto
}

2、让绝对定位的div居中

Div{
Postion:absolute;
Width:300px;
Height:300px;
Margin:auto;
Top:0;
Left：0;
Bottom:0;
Right:0;
Background:red;
}

3、水平垂直居中一

Div{
Postion:absolute;
Width:500px;
Height:300px;
Border:2px solid red;
Top:50%;
Left:50%;
Margin:-150px 0 0 -250px//外边距是自身宽高的一半
}

4、水平垂直居中二

Div{
Postion:absolute;
Width:500px;
Height:300px;
Border:2px solid red;
Top:50%;
Left:50%;
Transform:translute(-50%,-50%)
}

5、水平垂直居中三

.fatherdiv{
Display:flex;
Align-items:center;  //垂直剧中
Justify-content:center;//水平居中
}
.childdiv{
Width:100px;
Height:100px;
Border:2px solid red 
}

10、消除一个数组中的重复元素去重方法

1、jquery的方法$.unique()

2、自己写方法

Function(arr){

LetnewArr=[]

For(leti=0;i<=arr.length;i++){

If(newArr.indexOf(arr[i])!==-1){

newArr.push(arr[i])

}

}

}

11、varletconst什么时候用let　const

1、const定义的是常量不可以更改而且必须初始化

2、Var变量可以修改，如果不初始化会输出undefined

3、let是块级作用域，只在let声明的代码块中有效

12、http请求get和post的区别

1、get的参数是拼接在url后面post的参数是放在虚拟载体里面

2、Get大小限制比较小

3、Post相对能安全些

4、应用不同，get是只需要请求。Post是提交数据之类的

13、Position有几种值，分别是以谁为基准定位,会不会脱离文档流

1、static没有定位，元素出现在正常流

2、Relative相对定位相对于正常位置

3、Fixed固定定位相对于浏览器窗口进行定位。脱离文档流

4、Absolute绝对定位相对于static定位以外的第一个父元素进行定位,脱离文档流。这个定位其他盒子和其他盒子的文本都会无视他，不会让出位置

5、inherit从父元素集成position属性的值

6、Float：浮动定位。脱离文档流。其他盒子看不见浮动的元素，但是其他盒子里的文本看的见，文本会为这个元素让出位置。

7、父div嵌套子div子divfloat定位之后，父div高度没有了。是因为子div脱离了文档流，父div没有内容撑开他的高度了。所以是0

14、ajax请求是什么好处

1、Ajax异步传输+js+html异步就是在向服务器发送请求的时候，不必等结果，可以同时做其他的事情

2、步骤：

1、创建XMLhttpRequest对象，异步调用对象

3、创建一个新的http请求，执行该请求的方法，url，验证信息

4、设置相应http请求状态变化的函数

5、发送http请求

6、获取异步调用返回的数据

7、使用js和dom实现局部刷新

4、优点：局部刷新，用户体验好，省流量

5、缺点：后退按钮无效。多个请求同时触发时，回调时间不确定

15、Cssflex弹性盒子布局

16、Js怎么定义函数

1、Functiona(){}

2、Vara=function(){}

17、Js怎么实现继承

1、构造继承

2、原型继承

3、实例继承

4、拷贝继承

18、jS创建对象的方式

1、对象字面量的方式a={}

2、定义一个无参数的构造函数，实例化构造函数然后添加属性

3、定义一个有参数的狗在函数，在构造函数内部用this进行属性的定义

4、用原型进行创建

5、定义并创建对象的实例

6、使用函数来定义对象，然后创建新的对象实例

19、作用域链

1、全局函数无法查看局部函数的内部细节，但是局部函数可以查看上层的函数细节

2、当需要从局部函数查找某一属性或者方法时，如果当前作用域没找到就会追溯到上层作用域中查找，直至全局函数，这种组织形式就是作用域链

20、谈谈this对象的理解

1、This对象总是指向函数的直接调用者

2、如果用new关键字，this指向new出来的那个对象

3、在时间中this指向出发这个事件的对象。

21、nullundefined

1、null:值是空，没有值

2、Undefined:表明声明了一变量但是没有初始化赋值

22、事件是什么？事件冒泡？阻止事件冒泡？事件绑定的几种方式？

1、事件：网页中的某个操作出发的行为

2、事件冒泡：具体元素上触发的事件逐级向上广播

3、事件处理机制：ie是事件冒泡，火狐同时支持捕获事件和冒泡事件

4、当前事件的停止出发：event.preventDefault阻止元素发生默认行为

5、阻止冒泡，阻止当前事件传播，停止事件：event.stopPropagation()

6、事件绑定的几种方式：

1、直接诶在元素上添加事件属性，绑定事件回调函数

ex:<buttonid=’1’onclick=’click()’>save</button>

2、Js获取dom元素通过js给dom绑定事件document,getElementById(‘#id’).on(‘click’,function(){})

3、js获取到dom元素之后通过addEventListener函数绑定事件

Ex:document,getElementById(‘#id’).addEventListener(‘click’,function(){})

23、事件委托

利用事件冒泡原理，让自己所触发的事件，由父元素代替执行

24、如何判断一个对象是否属于某个类

AinstanceofObject

25、jquery一个对象可以同时绑定多个事件，怎么实现

1、多个事件同一个函数

$(‘divid’).on(‘click mouseover’,function(){})

2、多个事件不同函数

$(‘divid’).on({
Click:function(){},
Mouseover:function(){}
})

26、css盒子模型

1、盒子包括contentmarginpaddingborder

2、Ie的怪异盒子是content包含了padding+border

3、W3c标准是四部分分离

27、什么是语义化html

1、直观的认识标签

27、spilt和join的区别

1、spilt将字符串按照规则拆分成数组

2、Join将数组合并成

28、pop()push()shift()unshift()

1、pop()尾部删除push()尾部添加

2、Shift()头部删除unshift()头部添加

29、一次完整的http事务是怎样的过程？

1、域名解析

2、发起tcp的三次握手

3、建立TCP链接之后发起http请求

4、服务端响应http请求，浏览器得到html代码

5、浏览器解析html代码，并请求html代码中的资源

6、浏览器对页面进行渲染呈现给用户

30、indexOfcharAt

1、Arr.indexOf(‘a’)返回当前数组中元素a的下标

2、String.charAt(index)返回指定位置的字符

31、cookielocalStoragesessionStorage

1、Cookie：浏览器端的缓存，一般较小，4K

2、localStorage:客户端的缓存，给每个变量位置一个独立的存储区域，在数据被清楚之前一直存在5M后者更大

3、sessionStorage：会话存储变量。除非浏览器被关闭，会话结束.时间半小时

32、怎样添加删除、移动、复制、创建和查找节点

1、创建新节点

CreateDocumentFragment()//创建一个dom片段

createElement()//创建一个dom元素

createTextNode()//创建一个文本节点

2、方法

AppendChild()//添加

RemoveChild()//删除

ReplaceChild()//替换

insetBefore()//插入

3、查找

GetElementById

getElementsByName//或者所有name属性值等于参数的元素

getElementsByTagName//通过标签名称

33、行内元素块元素

1、行内元素：ainputselectliimglabelspanbuttonarea

2、块元素:divuloltableh1-h6

34、js中有一函数执行对象查找时永远不会去找原型

1、hasOwnProperty()

35、js本地对象内置对象宿主对象

1、本地对象arrayobjregexp等可以new实例化的对象

2、内置对象指的是gloadMath等不能被实例化的

3、宿主对象值得是浏览器自带的documentwindow等

36、js为什么要被写在底部，何时加载它

1、原因：性能优化。web页面性能优化其精髓就是——将浏览器基本无序的资源加载请求用js有序地控制起来，包括js本身。

1、js的加载会阻塞其他内容的加载，如果网速慢或者js复杂会有长时间的页面空白，用户体验不好

2、Js一般会对dom树进行操作，放页尾dom树已经完成，可以直接执行js

37、前端优化方式有哪些？

1、优化css性能

2、减少外部http请求

3、压缩cssjs和html

4、优化图片

5、使用轻量级框架

38、js的typeof返回的数据类型有哪些？

1、Objectnumberstringfunctionbooleanundefined

39、Js移除数组

1、lodash-.remove()返回的是删除掉的数组

2、Js原生的删除方法：Splice

40、H5原生的保存localstrage

1、webStroge分为两个接口：localStrage,sessionStrage

四个函数：setItem,getItem,removeItem,clear

1、localStrage:域内安全，永久保存，即客户端或浏览器中来自同一域名的所有页面都可访问localStorage数据。除非删除数据否则永久保存。但客户端和浏览器之间的数据相互独立

2、sessionStrage：会话控制，短期保存。浏览器关闭之后会清除数据

41、Css3的新特性？

1、选择器

2、盒模型

3、背景和边框

4、文字特效

5、2D/3D转换

6、动画

7、多列布局

8、用户界面

42、H5的新特性用过哪些?

1、用于绘画的canvas元素

2、用于媒介回放的video和audio元素

3、对本地连线存储的更好的支持

4、新的特殊内容元素ex：articlefooterheadernavsection

5、新的表单控件ex：calenderdatetimeemailurlsearch

6、新元素，新属性，完全支持css3，video,audio,2D/3D制图，本地存储，本地SQL数据，Web应用

项目中的问题

43、资产管理系统是给谁做的？

银行或者医院的机房

44、资产管理系统里面的文件导出是怎么做的？

1、XLSX.utils。先读取book,遍历sheet，convert2binary

45、资产管理系统的图表用echarts画了哪些？

1、柱状图

2、折线图

3、饼图

46、SpingBoot使用过么？

47、Array数组的几种常用方法区分

1、Split:用于将array数组按照分隔符规则分割成字符串数组

2、Splice(start,num):用于删除，返回被删除的数组。Start是开始删除的下标，num：指的是删除个数，如果是0那就是一个都没有删除

3、Slice：截取指定数量长度的元素，含头不含尾。

4、Replace：将数组中的一些元素替换成另外的元素[用正则表达式]

48、array数组的reducereduceRight

1、reduce接受一个函数作为累加器，数组中的每个值从左到右开始合并，最终为一个值

2、Arr.reduce(callback,[initValue]):

1、callback包含四个参数

1、previousValue:上一次计算的值

2、currentValue当前需要被参与计算的值

3、Index：数组中元素的下标

2、Initvalue：作为第一次调用callback的一个参数.如果initValue第一次传入并且有值则previousValue取initValue的值。如果没有传入初始值，则previousValue的值是数组中第一个元素的值

3、用处：

1、求数组中的最大值

2、将嵌套数组扁平化成单层数组

4、reduceRight:这个方法是将数组从右到左进行累加计算。和reduce方法计算方向不同

51、h5全局新属性

1、accessKeychar使用键盘上哪个快捷键[字母]定位到元素上

2、contenteditabletrue/false对于以前的展示元素规定是否编辑比如span,label,p,div

3、contextMenu：规定元素的上下文菜单，配合menu使用[只有火狐浏览器支持这个标签].类似于列表数据中鼠标点击到哪里详细信息的小框展示

4、dir:文字展示方向ltr左到右rtl右到左

5、draggabletrue/false/auto是否允许拖动元素

6、hidden:隐藏元素

7、title:对元素的描述鼠标指针的提示信息类似于img的alt

52、h5的离线缓存怎么使用工作原理是什么？

1、是什么：h5的离线缓存是指用户没有与因特网连接时，可以正常访问站点或者应用。在用户和因特网建立链接之后，更新用户机器上的缓存文件

2、原理：h5的离线缓存基于一个新建的.appcache文件的缓存机制，不是存储技术。通过这个文件上的解析清单离线存储资源，这些资源一旦被存储下来，当用户网络处于离线状态时，浏览器会通过被离线缓存的数据进行页面展示

3、使用

1、在页面头部像下面一样加入一个maniFest的属性

2、在cache.manifest文件中编写需要离线存储的资源

3、在离线状态时，通过操作widow.appliocationCache进行需求实现

53、link和@import的区别

1、link属于xhtml标签@import是由css提供

2、页面加载时link会被同时加载，而@import引用的css是在页面加载结束后加载

3、link是xhtml标签，没有兼容性。@import只有ie5以上才能识别

4、link方式样式的权重高于@import的权重

54、src和href的区别

1、href:指向网络资源所在位置，建立和当前元素之前的链接用于超链接

2、Src：指向外部资源，一般会将指向的资源下载并应用到文档内

55、document.onload和document.ready的区别

1、document.onload结构和样式加载完才执行js

2、document.ready图片等资源没有被加载完成的时候就执行js

56、多重样式优先级：内联样式》内部样式》外部样式》浏览器默认样式

57、Displayvisibility

1、display:none隐藏之后元素不会占用为隐藏之前的位置，没有隐藏之前的空间会从页面布局中消失

2、Visibility：hidden影藏之后仍然会占用位置和控件，影响布局

58、我们给一个dom同时绑定两个点击事件，一个用捕获，一个用冒泡。会执行几次事件，会先执行冒泡还是捕获？

1、其他元素捕获阶段事件----本元素代码顺序事件----其他元素冒泡事件

59、js的原型怎么理解

1、当函数对象本身的属性或方法与原型的属性或方法同名的时候：

• 1、默认调用的是函数对象本身的属性或方法
• 2、通过原型增加的属性或方法存在
• 3、函数对象本身的属性或方法的优先级高于原型的属性或方法

2、原型是用来构建对象的。原型相当于对对象的一种描述。Es6中针对原型链可以构造类。继承的时候用原型

3、闭包用来实现面向对象，封装私有变量和方法。

60、cssdisplay属性有几种值分别是什么

1、none:不显示,这个元素直接消失，后面的元素会直接上来填上位置。而visibility：hidden是隐藏了元素但是元素所占的位置还在

2、block:块元素元素前后会有换行符

3、inline：行元素[也叫内联元素]，前后没有换行符。Inline元素不会独占一行，。多个相邻的行元素会排列在同一行里，直到一行排列不下，才会新换一行，其宽度随着元素的内容进行变化。行元素设置宽高属性无效

4、inline-block：行内块元素，将对象呈现为inline对象，将对象的内容作为block对象呈现。基于block的宽高属性又有inline的同行特性

61、怎么动态创建btn并且绑定事件

1、获取需要动态创建的元素的父元素，

2、$(父元素).on(‘事件名’,’子元素名称,function(){})

62、js是单线程还是多线程？为什么

1、单线程、因为js作为浏览器脚本而言，主要用途就是和用户互动操作dom

2、单线程意味着所有的任务需要排队，前一个任务结束才后执行后一个任务。如果前面任务阻塞，则后面的会一直等着。在队列中间加入定时器之后，等待所有任务执行完毕之后才会执行定时器

3、js分为同步任务和异步任务。同步任务值得是在主线程上排队执行的任务。只有前一个执行完毕才执行下一个。异步任务指的是不进入主线程，进入任务队列，只有任务队列通知主线程，某个异步任务可以执行了该任务才会进入到主线程执行。

63、settimeout延时参数设为0和不写这个函数直接执行方法体有什么区别？

1、设置成0之后可以改变任务执行的先后顺序，延迟该任务发生，使他异步执行

2、setTimeout：指定时间间隔之后执行一次代码

setInterval()：执行时间间隔后不停的执行代码

64、jquery对象和dom对象之间的相互转换

1、jquery对象转为dom对象

1、var$v=$(‘#id’)得到jquery对象varv=$(‘#id’)[0]//得到dom对象

2、var$v=$(‘#id’)得到jquery对象varv=$(‘#id’).get(0)//得到dom对象

2、dom对象转为jquery对象

1、varv=document.getElemntByID(‘id’)//得到dom对象var$v=$(v)//转成jquery对象

65、select的几种实现方式

1、inputul组合需要给外部div设置为相对定位。Ul所在的子div设置为绝对定位

2、h5新特性inputlist=‘id’<datalistid=’id’></datalist>

3、原生select标签

66、jsdom和bom

1、bom是浏览器对象模型，主要用来获取或者设置浏览器的属性，行为。比如新建窗口，获取当前页面的地址，浏览器操作历史，分辨率，。浏览器版本等

2、dom是文档对象模型。用来获取或设置文档中标签的属性。例如获取input表单的值。操作对象是文档，html文档，和浏览器没有直接关系

67、ie的事件冒泡和标准的dom事件冒泡停止默认行为及阻止事件传播

1、ie

Window.event.cancalBubble//停止冒泡

Window.event.returnValue=false//阻止事件的默认行为

2、标准dom

event.stopPropagation()//阻止事件传播

Event.preventDefault()//取消事件的默认行为

68、angular依赖注入是什么

69、Pc开发难点

70、Js的面向对象和java的面向对象有什么区别

1、js中的this指的是函数调用者

2、java中的this指的是当前对象

71、静态语言java和动态语言js的区别？哪个好？

JsJava

动态语言弱类型静态语言强类型

解释性语言先编译后解释

直接在浏览器上可以看到源码不能

基于原型和原型继承的面向对象基于类和继承

72、js怎么兼容不同的浏览器的

1、优雅降级：先开发一套完整的功能，然后在低版本浏览器上向下兼容

2、渐进增强：在低版本上开发基本的功能，然后针对不同的浏览器追加功能

1、获取非行间样式creentStyle/getComputerStyle。CurrentStyle之兼容ie其他浏览器不能用。解决方案，同时使用getComputerStyle,可以兼容谷歌等

2、不同浏览器的标签默认的外补丁和内补丁不同。比如str[i]需要替换成str.charAt(i)

3、不同浏览器对dom的支持程度。Document.getElementByid(‘ul’).childNodes.length除ie外其他浏览器对于childNodes会把文本节点和元素节点混淆。用.children.length可以解决

73、Jquery中的$是什么

1、$是jquery的专用的特殊符号，所有jquery函数的调用都是从$开始的

2、$()表示一个选择器，括号里面写想选中的dom元素

3、$(document)是一个选择器，选中的是整个html所有元素的集合

4、$(function(){})是document.ready事件，在所有元素准备完毕之后载入页面执行本方法

74、Css3怎么兼容不同的浏览器的

1、利用csshack去兼容及针对不同的浏览器开发不同的css代码

2、-moz-:代表火狐浏览器

3、-ms-:代表ie浏览器

4、-webkit-:代表谷歌浏览器

5、-o-:代表opera浏览器私有属性

75、Canvas中的函数有了解过么

1、getContext()：渲染上下文和会话、

2、FillStyle：样式

3、FillRect：画矩形

4、BeginPath()

76、小程序开发了解过么

77、Angular2

78、Vue

79、移动端如何兼容不同的屏幕

1、@media针对不同的屏幕写不同的样式

2、写js让屏幕自适应，

80、自己有没有用原生的js封装过什么小组件

81、Transfrom实时动画的帧动画和有什么区别

1、实时动画采用各种算法来实现运动物体的运动控制

2、逐帧动画在时间帧上逐祯绘制帧内容。灵活性比较大，很适合表现很细腻的动画。缺点是增加制作负担并且最终输出的文件量很大

82、js对象的遍历

1、forin遍历对象本身和继承的可枚举属性

2、Object.keys(obj):返回一个数组，包括对象自身的所有可枚举属性。不包含继承的

3、Object.getOwnPropertyNames(obj):返回一个数组，包含对象自身的所有属性。包含不可枚举属性

4、Object.getOwnPropertySymbols(obj)：返回一个数组包含对象自身的所有symbol属性

5、Reflect.ownKeys(obj)：返回一个数组，包含对象自身的所有键名。包含symbol，可枚举和不可枚举

6、遍历次序规则：

1、首先遍历所有的数值键，按照i升序排列

2、其实遍历字符串

3、最后遍历symbol

83.当前主流的五大浏览器及内核

1、IE浏览器内核：trident内核，也是俗称的ie内核

2、fireFox浏览器内核：Gecko内核，俗称fireFox内核

3、chrome浏览器内核:以前是webkit内核。现在是blink内核

4、safari内核：wbkit内核

5、Opera浏览器内核：webkit内核

84、AMDCMD

1、AMD异步模块定义提前执行推崇依赖前置

2、CMD模块定义延迟执行推崇就近

85、es6的新特性

1、letconstlet是定义了块级作用域。Const是常量

2、解构赋值

3、箭头函数

4、类解决了原型对象比较绕的问题

5、forof值遍历

6、生成器

7、Promises

86、jquery的源码看过吗？能不能简单概况一下它的实现原理

1、原理就是封装了一些常用的操作

87、jquerybinddelegateon三个函数有什么区别

1、bind需要是已经存在的dom节点绑定事件

2、delegate(dom元素，事件类型，数据，回调函数)：用于事件委托，更精确更小范围的使用事件代理

3、on(事件类型，dom元素，数据，回调函数）:前两个参数和delegate的参数调换了位置。dom元素是可选项。不传递dom元素的话是.on前面的元素自己，传递的话功能和delegate一样

88、css3的动画怎么设定

1、animation-name指定要绑定到选择器的关键帧的名称

2、animation-duration动画指定需要多少秒完成

3、animation-timeing-function设置动画将如何完成一个周期

4、animation-delay启动延迟

5、animation-iteration-count动画播放次数

6、animation-direction是否反向播放动画

7、animation-paly-state动画是否在运行或已暂停

89、boostrap的响应式布局

1、Boostrap退出了移动端设备优先的一种不惧方式。即在头部加上viewport视口。对内容包裹一个.container容器

2、栅格系统xssmmd

90、string.match和string.search都是去字符串中匹配字符串。有什么区别

1、string.match是用来检查0位的字符串有没有匹配上。如果有，就返回匹配上的字符串的索引。如果没有就返回none

2、string.search不管0位是否匹配，会扫描整个字符串，只要是有匹配就返回

91、CSRFCORS

1、CSRF：跨域攻击crosssiterequestforgery伪造用户在已登录的web应用程序执行非本意的操作的攻击方法

2、CORS：服务器端跨域共享crossoriginresourcesharingaccesscontrolallowsorign

92、arr

1、tostring：string.返回传统的字符串，全世界都能用

2、tolocalstring：string.返回机器本地环境的字符串，只有当前环境能用

3、valueof：object。返回的是这个对象本身的值

93、定义大于1024小于1036屏幕的css代码

1、@mediascreen(min-device-width:1024px)and(max-width:1036px)

2、Device-width:设备屏幕分辨率的宽度

3、Width:浏览器窗口的宽度

94、iframe的缺点

1、iframe会阻塞主页面的onload事件

2、会影响页面的并行加载

3、搜索引擎的检索程序无法解读这种页面。不利于seo

95、Angular单元测试

1、Karma

2、jasmine

96、Angulardigest生命周期函数

主流框架

React

1、当你调用setState的时候，发生了什么事

1、setState方法调用时react就会重新调用render方法来重新渲染组件，setState通过一个队列来更新state,当调用setstate方法的时候将需要更新的state放入到这个状态队列中，这个队列会批量跟新state

2、在react中element和component的区别

1、Element:就是ui对象

2、Component：是一个函数或者一个类。它可以接受输入并通过jsx返回一个reactElement

3、什么时候用功能组件functioncomponent?什么时候用类组件classcomponent?

1、如果组件具有状态或者生命周期方法，请使用class组件

2、其余情况使用功能组件

4、什么是react的refs为什么他们很重要？

1、refs是一系列元素ref的集合。ref类似于jquery里面的id，唯一标识

5、react的keys是什么？为什么他们很重要

1、keys可以帮助react跟踪哪些项目已更改，添加或从列表中删除

6、受控组件和不受控组件的区别

1、受控组件：react控制的组件，也是表单数据的唯一真理

2、不受控控件：表单数据由dom处理，而不是react组件

7、react中那个生命周期会发出ajax请求为什么

1、ajax请求发生在componentDidMount生命周期中。

8、shouldComponentUpdate应该做什么

1、手动调用组件更新状态

9、prop.children为什么提倡使用react自己的api而不是用jquery的api

1、是因为prop.children有时候只有一个元素是个object有时候是多个元素，。是个数组。在react中对于这些封装了使得它忽略了chilren到底是对象还是数组，这时候就不会在.map的时候就不会抛错了

10、描述事件在react中的处理方式

1、react将单个事件监听器监听在了顶部，所以不关心更新的到底是哪个具体的dom

11、createElementcloneElement

1、createElement:是jsx被加载到的，是react用来创建reactElement

2、cloneElement:用于克隆元素病传递新的props

12、可以选择性传递给setState的第二个参数是什么

1、是一个回调函数。可以用来验证状态是否更新成功