写在前面
5月24到30这7天,IMWeb前端提拔营,腾讯大佬们分享个人履历,使出种种前端方面的大招。从中进修了许多前端方面的学问,也get到了前端进修的要领论,另有一些算法学问等等。
现将总结以下:(本文长度略长,看官坚持耐烦,嘿嘿)
早报前端面试题
天天早上,助教先生会发一些典范前端面试题,归档一下:
05/24
问题1: CSS引入的体式格局有哪些?
答案:
CSS与HTML文档连系的4中要领:
1、运用<link>元素链接到外部的款式文件
2、在<head>元素中运用"style"元夙来指定
3、运用CSS "@import"标记来导入款式表单
4、在<body>内部的元素中运用"style"属性来定义款式
问题2: 行内元素有哪些?块级元素有哪些?CSS的盒模子?
答案: 块级元素:div p h1 h2 h3 h4 form ul
行内元素: a b br i span input select
Css盒模子:内容,border ,margin,padding
问题3: link和@import的区分是?
答案: 本质上,这两种体式格局都是为了加载CSS文件,但照样存在着纤细的差异。
1、老祖宗的差异。link属于XHTML标签,而@import完全是CSS供应的一种体式格局。link标签除了能够加载CSS外,还能够做许多别的的事变,比方定义RSS,定义rel衔接属性等,@import就只能加载CSS了。
2、加载递次的差异。当一个页面被加载的时刻(就是被阅读者阅读的时刻),link援用的CSS会同时被加载,而@import援用的CSS会比及页面悉数被下载完再被加载。
3、兼容性的差异。由于@import是CSS2.1提出的所以老的阅读器不支撑,@import只要在IE5以上的才辨认,而link标签无此问题。
4、运用dom掌握款式时的差异。当运用javascript掌握dom去转变款式的时刻,只能运用link标签,由于@import不是dom能够掌握的。
问题4: ==
和===
的差别
答案: 前者会自动转换范例,后者不会
前端罕见问题个人思考题:
1、你之前自认为做得最好的,最具有应战的一项需求是什么,为何?如今转头去看,另有哪些地方能够值得优化?
2、说一下h5中的离线存储有哪些
05/25
问题1: XHTML和HTML有什么区分?
答案:
HTML是一种基础的WEB网页设想言语,XHTML是一个基于XML的置标言语
最主要的差别:
XHTML 元素必需被准确地嵌套。
XHTML 元素必需被封闭。
标署名必需用小写字母。
XHTML 文档必需具有根元素。
问题2: Doctype? 严厉情势与混淆情势-如何触发这两种情势,辨别它们有何意义?
答案: 用于声明文档运用那种范例(html/Xhtml)平常为 严厉 过分 基于框架的html文档
到场XMl声明可触发,剖析体式格局更改成IE5.5 具有IE5.5的bug
问题3: 写出几种IE6 BUG的处置惩罚要领
答案:
1.双边距BUG float引发的 运用display
2.3像素问题 运用float引发的 运用dislpay:inline -3px
3.超链接hover 点击后失效 运用准确的誊写递次 link visited hover active
4.Ie z-index问题 给父级增添position:relative
5.Png 通明 运用js代码 改
6.Min-height 最小高度 !Important 处置惩罚’
7.select 在ie6下遮掩 运用iframe嵌套
8.为何没有办法定义1px摆布的宽度容器(IE6默许的行高形成的,运用over:hidden,zoom:0.08 line-height:1px)
问题4: IE和DOM事宜流的区分
答案:
1.实行递次不一样、
2.参数不一样
3.事宜加不加on
4.this指向问题
前端罕见问题个人思考题 :
1、谈一谈你做过的一个项目,营业逻辑模块如何离别的?
2、什么是xss破绽,如何防备?
05/26
问题1: 优先级算法如何盘算?
答案:
重要性和泉源的优先级排序从低到高是:
1、阅读器默许款式
2、用户在阅读器中定义的一般款式(normal划定规矩,不带important划定规矩)
3、开辟人员定义的一般款式( normal划定规矩,不带important划定规矩)
4、开辟人员定义特别款式(带important划定规矩)
5、用户在阅读器中定义特别款式(带important划定规矩)
别的另有一些准绳:
1、雷同的款式在CSS划定规矩后增添了!important的优先于没有增添的。
2、CSS划定规矩在文档中涌现的递次背面定义的的优先于前面定义的。
3、加了!important的优先于内联款式。
4、内联款式优先于用link引入的款式和页面上<style>里的款式。
问题2: split() join() 的区分?
答案: 前者是切割成数组的情势,后者是将数组转换成字符串
问题3: ajax要求的时刻get 和post体式格局的区分?
答案:
1、一个在url背面 一个放在假造载体内里
2、有大小限定
3、平安问题
4、运用差别 一个是论坛等只须要要求的,一个是相似修正暗码的
问题4: IE和规范下有哪些兼容性的写法?
答案:
1、Var ev = ev || window.event
2、document.documentElement.clientWidth || document.body.clientWidth
3、Var target = ev.srcElement||ev.target
前端罕见问题个人思考题 :
1、 说一下你明白的MVVM,画一下你的设想情势。
2、 说一下h5中的离线存储有哪些?
05/27
问题1: 消灭浮动的几种体式格局,各自的优瑕玷
答案:
1. 运用空标签消灭浮动 clear:both(理论上能清晰任何标签,增添无意义的标签)
2. 运用overflow:auto(空标签元素消灭浮动而不能不增添无意代码的弊病,,运用zoom:1用于兼容IE)
3. 是用afert伪元素消灭浮动(用于非IE阅读器)
问题2: call和apply的区分
答案: Object.call(this,obj1,obj2,obj3)
Object.apply(this,arguments)
问题3: <img>标签上title与alt属性的区分是什么?
答案:
Alt 当图片不显现是 用笔墨代表。
Title 为该属性供应信息
问题4:什么是语义化的HTML?
答案:直观的熟悉标签 关于搜索引擎的抓取有优点
前端罕见问题个人思考题:
1、 请说出三种削减页面加载时候的要领。(加载时候指感知的时候或许现实加载时候)
2、 形貌下“reset”CSS文件的作用和运用它的优点。
05/28
问题1: Ajax的优瑕玷都有什么?
答案:
1)页面无革新,用户体验非常好。
2)运用异步体式格局与服务器通讯,具有越发敏捷的相应才能。
3)能够把一些服务器累赘的事情转到客户端,应用客户端闲置的才能来处置惩罚,减轻服务器累赘,勤俭空间和宽带租用本钱。而且减轻服务器的累赘,ajax的准绳是“按需取数据”,能够最大水平的削减冗余要乞降相应对服务器形成的累赘。
4)基于规范化并被普遍支撑的手艺,不须要下载插件或许小顺序。
Ajax的瑕玷:
1)Ajax不支撑阅读器back按钮。
2)平安问题, Ajax暴露了与服务器交互的细节。
3)对搜索引擎的支撑比较弱。
4)破坏了顺序的非常机制。
5)不容易调试。
问题2: 简述一下Ajax的事情道理
答案: Ajax的中心是JavaScript对象XmlHttpRequest。该对象在Internet Explorer 5中初次引入,它是一种支撑异步要求的手艺。简而言之,XmlHttpRequest使您能够运用JavaScript向服务器提出要求并处置惩罚相应,而不壅塞用户。
问题3: CSS+DIV开辟Web页面的上风有哪些?
答案:
1)CSS+DIV,这个网页设想情势中,DIV负担了网页的内容,CSS负担了网页的款式。如许就使网页的内容和款式的星散开来。有利于页面的保护晋级。
2)有助于进步搜索引擎亲和力(疾速找到须要的数据,而不是像在TABLE中一层层的查找)
3)有助于页面的重构(换皮肤如blog,直接套用别的一套款式就能够完成,而不必修改网页剧本。)
问题4:简述DIV元素和SPAN元素的区分
答案:DIV默许情况下是分行显现,SPAN在偕行显现。
前端罕见问题个人思考题 :
1、前端平安方面有无相识?CSRF如何攻防?
2、 说说你对SVG明白?
05/29
问题1: 简单说一下阅读器当地存储是如何的
答案:在较高版本的阅读器中,js供应了sessionStorage和globalStorage。在HTML5中供应了localStorage来庖代globalStorage。
html5中的Web Storage包括了两种存储体式格局:sessionStorage和localStorage。
sessionStorage用于当地存储一个会话(session)中的数据,这些数据只要在同一个会话中的页面才接见而且当会话完毕后数据也随之烧毁。因而sessionStorage不是一种耐久化的当地存储,仅仅是会话级别的存储。
而localStorage用于耐久化的当地存储,除非主动删除数据,不然数据是永久不会逾期的。
问题2: 在JavaScript剧本中,isNaN的作用是什么?
答案: isNaN的作用是推断值是不是为数字
问题3: 编写JavaScript剧本天生1-6之间的整数?
答案:
var NowFrame;
NowFrame=Math.random( )*6+1 //随机天生一个1-6之间的小数
NowFrame=parseInt(NowFrame) //把1-6之间的小数转化为整数
问题4: CSS范例中,.(句点)背面跟一个称号代表什么寄义?#(井号)背面跟一个称号代表什么寄义?假如要对一个元素设置CSS款式(内嵌款式),应将CSS款式写在它的什么属性内?
答案:
1) .(句号)背面跟一个称号示意文档中所有class属性值包括这个称号的运用其款式,
2) #(井号)背面跟个称号示意文档中ID为此称号的元素运用其款式。
3) CSS款式写在style属性内。
前端罕见问题个人思考题 :
1、请你谈谈Cookie的弊病 。
2、对BFC范例的明白?
05/30
问题1: display:none和visibility:hidden的区分
答案:
display:none 隐蔽对应的元素,在文档规划中不再给它分派空间,它各边的元素会合拢,就当他历来不存在。
visibility:hidden 隐蔽对应的元素,但是在文档规划中仍保存本来的空间。
问题2: position的absolute与fixed共同点与差别点
答案:
A:共同点:
1.转变行内元素的显现体式格局,display被置为block;
2.让元素离开一般流,不占有空间;
3.默许会掩盖到非定位元素上
B差别点:
absolute的”根元素“是能够设置的,而fixed的”根元素“固定为阅读器窗口。
当你转动网页,fixed元素与阅读器窗口之间的间隔是稳定的。
问题3: CSS 挑选符有哪些?哪些属性能够继续?优先级算法如何盘算? CSS3新增伪类有那些?
答案:
CSS 挑选符:
1.id挑选器(# myid)
2.类挑选器(.myclassname)
3.标签挑选器(div, h1, p)
4.相邻挑选器(h1 + p)
5.子挑选器(ul > li)
6.子女挑选器(li a)
7.通配符挑选器( * )
8.属性挑选器(a[rel = "external"])
9.伪类挑选器(a: hover, li:nth-child)
可继续的款式:
1.font-size
2.font-family
3.color
4.text-indent
不可继续的款式:
1.border
2.padding
3.margin
4.width
5.height
优先级算法:
1.优先级就近准绳,同权重情况下款式定义近来者为准;
2.载入款式以末了载入的定位为准;
3.!important> id > class > tag
4.important 比 内联优先级高,但内联比 id 要高
CSS3新增伪类举例:
p:first-of-type 挑选属于其父元素的首个 <p> 元素的每一个 <p> 元素。
p:last-of-type 挑选属于其父元素的末了 <p> 元素的每一个 <p> 元素。
p:only-of-type 挑选属于其父元素唯一的 <p> 元素的每一个 <p> 元素。
p:only-child 挑选属于其父元素的唯一子元素的每一个<p> 元素。
p:nth-child(2) 挑选属于其父元素的第二个子元素的每一个 <p> 元素。
:enabled:disabled 掌握表单控件的禁用状况。
:checked 单选框或复选框被选中。
问题4:你晓得若干种Doctype文档范例?
答案:
1. 该标签可声明三种 DTD 范例,离别示意严厉版本、过渡版本以及基于框架的 HTML 文档。
2. HTML 4.01 划定了三种文档范例:Strict、Transitional 以及 Frameset。
3. XHTML 1.0 划定了三种 XML 文档范例:Strict、Transitional 以及 Frameset。
4. Standards (规范)情势(也就是严厉显现情势)用于显现遵照最新规范的网页,而 Quirks(包涵)情势(也就是松懈显现情势或许兼容情势)用于显现为传统阅读器而设想的网页。
前端罕见问题个人思考题:
1、请说出三种削减页面加载时候的要领
2、哪些操纵会形成内存走漏?
剑指offer算法题
天天下昼,构造一同刷题,刷题链接是https://www.nowcoder.com/ta/coding-interviews
若想看Java版本(混淆有JavaScript),移步于我的GitHub热忱的看官一颗星星是给我最大的勉励~
若想看JavaScript版本,移步于IMWeb社区