`

web前端面试题

 
阅读更多
最近题主在找工作啊。。。发现基础的概念知识点还是需要重拾一下的,在这里就概括一下前端面试遇到的问题及答案。如有错误,请大家指正!!!!
1、中文的自我介绍
您好:我叫XXX。我是2015年毕业于西安欧亚学院。之前有过两份工作经验。第一份工作是在国翼天龙有限公司负责电子印章管理系统的开发,包括前后台开发。主要是针对于实体印章不能解决跨域问题为目的进行的开发。用到的前端技术是miniui and jquery,后台技术是java + cxf。我的第二份工作是德森特有限公司,主要负责资产管理系统的前端开发,针对的客户是银行或者医院等他们的机房。用的前台框架是angular and bootstrap ,我做了资产管理系统,资产上架,下架,以及资产维护系统。资产巡检系统做了一半移交给了其他同事。
这是我的介绍,谢谢
2、英文的自我介绍
Hello: my name is XXX. I graduated from Xi'an Eurasia University in 2015. There were two working experiences before. The first job is to develop the electronic seal management system, including the front and back stage development, at the national Dragon Company Limited. The development is mainly aimed at the fact that the entity seal can not solve cross domain problems. The front end technology used is miniui and jQuery, and the background technology is java + CXF. My second job is derson limited, which is mainly responsible for the development of the front end of the asset management system, and the clients are their banks or hospitals. The front frame used is angular and bootstrap. I have made an asset management system, asset shelves, downstairs, and asset maintenance system. Half of the asset inspection system was handed over to other colleagues.This is my introduction. Thank you.
1、闭包和立即执行函数的概念,关系,区别
1、闭包:函数内部的函数 本质上,闭包就是将函数内部和函数外部链接起来的桥梁。闭包可以看作是函数内部作用域的一个接口
用处:一、读取函数内部的变量,二、让这些变量始终保持在内存中,使得诞生环境一直存在。闭包使得内部变量记住上一次调用时的运算结果。三、封装对象的私有属性和私有方法,内部函数可以引用外部函数的参数和变量,参数和变量不会被垃圾回收机制回收
2、立即执行函数:以圆括号包裹的声明并马上调用的匿名函数
用处:不用为函数命名,避免全局变量被污染。二、创建一个独立的作用域,可以封装一些内部外部无法读取的私有变量
3、关系:都是特殊的函数
4、区别:立即执行函数只能执行一次,闭包会始终在内存中所以可以重复调用
2、作用域:指的是变量存在的范围。js中只有两种作用域,分为全局作用域[变量在整个程序中一直存在,所有地方都可以读取]和函数作用域[变量只在函数内部存在]
全局变量可以在函数内部读取
局部变量无法被函数外部读取
2、eval 命令:把字符串解析成js语句执行
3、promise :
1、异步操作解决方案,充当异步操作和回掉函数之间的中间。不必一层层的嵌套回调函数。Promise 是一个对象,从它可以获取异步操作的消息。Promise 提供统一的 API,各种异步操作都可以用同样的方法进行处理,promise是一个许诺,是对未来事情的承诺,承诺不一定能完成,但是无论如何都会返回结果
2、好处:1、只有三种状态 padding(进行中)  resolved(已成功) failed(已失败) 2、只能从padding----》resolved   padding----->failed  状态发生改变则不可逆转。将异步操作以同步的流程表达
3、缺点:一旦开始执行,不知道进展到哪个阶段,无法取消2、如果不设置回掉函数,promise内部抛出的异常无法得知
4、一般用在读取文件的时候
4、同源策略,跨域,解决方式
1、同源策略:是指一段脚本只能读取来自同一来源的窗口和文档的属性,这里的同一来源指的是主机名,协议和端口号的组合
2、跨域问题是有js中的语言安全限制中的同源策略造成的,更多时候是出现在需要用ajax获取数据时
3、解决方式:jsonp,iframe,window.name,服务器上设置代理页面,postMessage
1、使用跨域资源共享
2、使用jsonp  json with padding  填充式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){
Let newArr = []
For(let i =0;i<=arr.length;i++){
If(newArr.indexOf(arr[i]) !== -1){
newArr.push(arr[i])
}
}
}

11、var let const  什么时候用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、Css flex弹性盒子布局
16、Js 怎么定义函数

1、Function a(){}
2、Var a = 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、null undefined
1、null:值是空,没有值
2、Undefined:表明声明了一变量但是没有初始化赋值
22、事件是什么? 事件冒泡?阻止事件冒泡?事件绑定的几种方式?
1、事件:网页中的某个操作出发的行为
2、事件冒泡:具体元素上触发的事件逐级向上广播
3、事件处理机制:ie是事件冒泡,火狐同时支持捕获事件和冒泡事件
4、当前事件的停止出发:event.preventDefault 阻止元素发生默认行为
5、阻止冒泡,阻止当前事件传播,停止事件:event.stopPropagation()
6、事件绑定的几种方式:
1、直接诶在元素上添加事件属性,绑定事件回调函数 
ex: <button id=’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、如何判断一个对象是否属于某个类
A instanceof Object
25、jquery一个对象可以同时绑定多个事件,怎么实现
1、多个事件同一个函数
$(‘divid’).on(‘click mouseover’,function(){})

2、多个事件不同函数
    
	$(‘divid’).on({
Click:function(){},
Mouseover:function(){}
})

26、css盒子模型
1、盒子包括content margin padding border
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、indexOf  charAt
1、Arr.indexOf(‘a’) 返回当前数组中元素a的下标
2、String.charAt(index) 返回指定位置的字符
31、cookie  localStorage  sessionStorage
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、行内元素:a input select li img label span button area
2、块元素:div ul ol table h1-h6
34、js中有一函数执行对象查找时永远不会去找原型
1、hasOwnProperty()
35、js本地对象 内置对象 宿主对象
1、本地对象  array obj regexp 等可以new实例化的对象
2、内置对象指的是 gload Math 等不能被实例化的
3、宿主对象值得是浏览器自带的document window等
36、js为什么要被写在底部,何时加载它
1、原因:性能优化。web页面性能优化其精髓就是——将浏览器基本无序的资源加载请求用js有序地控制起来,包括js本身。
1、js的加载会阻塞其他内容的加载,如果网速慢或者js复杂会有长时间的页面空白,用户体验不好
2、Js一般会对dom树进行操作,放页尾dom树已经完成,可以直接执行js
37、前端优化方式有哪些?
1、优化css性能
2、减少外部http请求
3、压缩css js 和html
4、优化图片
5、使用轻量级框架
38、js的typeof返回的数据类型有哪些?
1、Object number string function boolean undefined

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:article footer header nav section
5、新的表单控件 ex: calender date time email url search
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 数组的reduce reduceRight
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、accessKey  char 使用键盘上哪个快捷键[字母]定位到元素上
2、contenteditable true/false  对于以前的展示元素规定是否编辑  比如span,label,p,div
3、contextMenu:规定元素的上下文菜单,配合menu使用[只有火狐浏览器支持这个标签]. 类似于列表数据中鼠标点击到哪里详细信息的小框展示
4、dir:文字展示方向 ltr 左到右  rtl 右到左
5、draggable true/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、Display visibility
1、display: none 隐藏之后元素不会占用为隐藏之前的位置,没有隐藏之前的空间会从页面布局中消失
2、Visibility:hidden  影藏之后仍然会占用位置和控件,影响布局
58、我们给一个dom同时绑定两个点击事件,一个用捕获,一个用冒泡。会执行几次事件,会先执行冒泡还是捕获?
1、其他元素捕获阶段事件----本元素代码顺序事件----其他元素冒泡事件
59、js的原型怎么理解
1、当函数对象本身的属性或方法与原型的属性或方法同名的时候:
  • 1、默认调用的是函数对象本身的属性或方法
  • 2、通过原型增加的属性或方法存在
  • 3、函数对象本身的属性或方法的优先级高于原型的属性或方法

2、原型是用来构建对象的。原型相当于对对象的一种描述。Es6中针对原型链可以构造类。继承的时候用原型
3、闭包用来实现面向对象,封装私有变量和方法。
60、css display 属性有几种值 分别是什么
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对象   var v=  $(‘#id’)[0] //得到dom对象
2、var $v = $(‘#id’) 得到jquery对象   var v=  $(‘#id’).get(0) //得到dom对象
2、dom对象转为jquery对象
1、var v = document.getElemntByID(‘id’)//得到dom对象  var $v = $(v) //转成jquery对象
65、select的几种实现方式
1、input ul 组合 需要给外部div设置为相对定位。Ul所在的子div设置为绝对定位
2、h5 新特性 input list=‘id’  <datalist id=’id’></datalist>
3、原生select标签
66、js dom和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的区别? 哪个好?
Js Java
动态语言弱类型 静态语言强类型
解释性语言 先编译后解释
直接在浏览器上可以看到源码 不能
基于原型和原型继承的面向对象 基于类和继承

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、利用css hack 去兼容 及针对不同的浏览器开发不同的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、for in 遍历对象本身和继承的可枚举属性
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、AMD CMD
1、AMD 异步模块定义 提前执行 推崇依赖前置
2、CMD 模块定义 延迟执行  推崇就近
85、es6的新特性
1、let const let是定义了块级作用域。Const 是常量
2、解构赋值
3、箭头函数
4、类 解决了原型对象比较绕的问题
5、for of值遍历
6、生成器
7、Promises
86、jquery的源码看过吗?能不能简单概况一下它的实现原理
1、原理就是封装了一些常用的操作
87、jquery bind delegate on 三个函数有什么区别
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、栅格系统xs sm md


90、string.match 和 string.search都是去字符串中匹配字符串。有什么区别
1、string.match 是用来检查0位的字符串有没有匹配上。如果有,就返回匹配上的字符串的索引。 如果没有就返回none
2、string.search 不管0位是否匹配,会扫描整个字符串,只要是有匹配就返回
91、CSRF CORS
1、CSRF:跨域攻击 cross site request forgery 伪造用户在已登录的web应用程序执行非本意的操作的攻击方法
2、CORS:服务器端跨域共享  cross origin resource sharing   access control allows orign
92、arr
1 、tostring:string.返回传统的字符串,全世界都能用
2 、tolocalstring:string.返回机器本地环境的字符串,只有当前环境能用
3 、valueof:object。 返回的是这个对象本身的值
93、定义大于1024小于1036 屏幕的css代码
1、@media screen(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、Angular digest 生命周期函数



主流框架
React
1、当你调用setState的时候,发生了什么事

1、setState方法调用时react就会重新调用render方法来重新渲染组件,setState通过一个队列来更新state,当调用setstate方法的时候将需要更新的state放入到这个状态队列中,这个队列会批量跟新state
2、在react中element和component的区别
1、Element:就是ui对象
2、Component:是一个函数或者一个类。它可以接受输入并通过jsx返回一个reactElement
3、什么时候用功能组件 function component? 什么时候用类组件 class component?
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、createElement cloneElement
    1、createElement: 是jsx 被加载到的, 是react 用来创建react Element
    2、cloneElement:用于克隆元素病传递新的props
12、可以选择性传递给setState的第二个参数是什么
      1、是一个回调函数。可以用来验证状态是否更新成功




分享到:
评论

相关推荐

    百度web前端面试题

    web前端面试题

    Web前端面试题.txt

    Web前端面试题.txt 面试的时候法宝,了解前端的基础面试题

    96道web前端面试题.pdf

    Web 前端面试题精华 在这篇资源摘要中,我们将涵盖 web 前端面试题的几个关键点,包括自我介绍、position 的值、解决跨域问题、XML 和 JSON 的区别、对 Webpack 的看法等。 自我介绍 在面试时,自我介绍是一个...

    web前端面试题集锦及答案解析

    ### Web前端面试题集锦及答案解析 #### HTML与HTTP相关知识点 1. **SEO优化技巧**: - **合理的Title、Description、Keywords**:在搜索引擎优化中,这三者的重要性逐渐递减。Title应强调重点,关键词重复次数不...

    初,中,高级工程师web前端面试题

    适用于各级别工程师的面试题,包含基础js,html,css,vue+react 以及高级浏览器原理,工程化,手写代码和性能优化问题,适用于各级别工程师的面试题,包含基础js,html,css,vue+react 以及高级浏览器原理,工程化...

    经典web前端面试题

    经典 Web 前端面试题 本文将对经典 Web 前端面试题进行详细的解释和总结,从 HTML 的基本结构到 CSS 的样式规则、选择器和优先级等方面对知识点进行了详细的讲解。 HTML 基本结构 HTML 的基本结构包括 `&lt;html&gt;`、...

    web 前端 面试题

    html css js面试题1000 题,面试专用 ,

    web前端面试题小汇总

    Web 前端面试题小汇总 本文总结了多个与 Web 前端相关的知识点,涵盖了 JavaScript、CSS、HTML 等多个方面的内容。 类数组对象 vs 数组 在 JavaScript 中,类数组对象和数组是两个不同的概念。类数组对象是 ...

    web前端面试题(含答案).doc

    Web 前端面试题解析 以下是对 Web 前端面试题的详细解析,涵盖 HTML、CSS、JavaScript、AngularJS、Vue.js、SVG 等多个领域。 一、HTML 结构 * 前端页面有三层构成:结构层(HTML)、表示层(CSS)和行为层...

    各名企Web前端面试题

    本资源"各名企Web前端面试题"正是为此目的而准备,涵盖了丰富的面试经验和实际案例。 一、HTML相关知识 HTML(HyperText Markup Language)是网页内容的基础结构,面试中常考察对标签的熟练运用、语义化理解以及新...

    公司Web前端面试题

    ### 公司Web前端面试题知识点解析 #### 一、选择填空题解析 ##### 题目1:字符串拼接与类型转换 **题目内容**:`vara1=10,a2=20;alert("a1+a2=" + a1 + a2);` - **选项**:A. a1+a2=30 B. a1+a2=1020 C. a1+a2=a1+...

    web前端面试题及答案.pdf

    "Web 前端面试题及答案" 本资源摘要信息主要涵盖了 Web 前端开发中的一些常见问题和答案,涉及到浏览器、HTML、CSS、JavaScript 等方面的知识点。 1. 浏览器内核(Layout Engine) 在 Web 前端开发中,浏览器内核...

    web前端面试题-面试题答案

    web前端面试题-面试题答案

    2021年最新Web前端面试题精选大全及答案_HanXiaoXi_yeal的博客-CSDN博客_前端面试题2021及答案.html

    2021年最新Web前端面试题精选大全及答案_HanXiaoXi_yeal的博客-CSDN博客_前端面试题2021及答案.html

    web前端面试题.doc

    Web前端面试题涵盖了许多核心概念和技术,以下是这些题目所涉及的知识点详解: 1. 前端页面的三层构成:结构层(HTML)、表现层(CSS)和行为层(JavaScript)。结构层负责内容的组织,表现层处理外观设计,行为层...

Global site tag (gtag.js) - Google Analytics