前端面试题目javascript
1. div和span的区别？css
div是块级标签，span是行级标签html
2. 在html中，position取值有哪几种，默认值是什么？前端
取值：static、relative、fixed、absolutehtml5
默认值：staticjava
3. 前端页面由哪三层构成，分别是什么？做用是什么？jquery
前端页面构成：结构层、表示层、行为层git
结构层（structural layer）github
由 HTML 或 XHTML之类的标记语言负责建立。标签，也就是那些出如今尖括号里的单词，对网页内容的语义含义作出了描述，但这些标签不包含任何关于如何显示有关内容的信息。例如，P标签表达了这样一种语义：“这是一个文本段。”web
表示层（presentation layer）
由 CSS 负责建立。 CSS对“如何显示有关内容”的问题作出了回答。
行为层（behaviorlayer）
负责回答“内容应该如何对事件作出反应”这一问题。这是 Javascript 语言和 DOM主宰的领域。
4. 如何居中一个浮动元素？
方式1:设置容器的浮动方式为相对定位，而后肯定容器的宽高好比宽500 高 300 的层，而后设置层的外边距。
<!DOCTYPEHTML>
<html>
<head>
<styletype="text/css">
div{
width: 500px;
height: 300px;
margin: -150px 0 0 -250px;
position: absolute;
left: 50%;
top: 50%;
background-color: yellow;
}
</style>
</head>
<body>
<div>
元素居中
</div>
</body>
</html>
方式2：须要position:absolute;绝对定位。而层的定位点，使用外补丁margin负值的方法。负值的大小为层自身宽度高度除以二。
<styletype="text/css">
<!--
div {
position:absolute;
top:50%;
left:50%;
margin:-150px 0 0 -200px;
width:400px;
height:300px;
border:1px solid #008800;
}
-->
</style>
<div>让层垂直居中于浏览器窗口</div>
5. 请简述HTML和XHTML最重要的4点不一样？
不一样：
XHTML要求正确嵌套
XHTML 全部元素必须关闭
XHTML 区分大小写
XHTML 属性值要用双引号
XHTML 用 id 属性代替 name 属性
XHTML 特殊字符的处理
6. 页面布局中常据说的“结构与表现”分离，“结构”是指？“表现”是指？
“结构”：HTML
“表现”：CSS
7. 怎么样从web前端方面优化性能？至少列举5点？
1) HTML部分
u 语义化HTML：好处在于可使代码简洁清晰，支持不一样设备，利于搜索引擎，便于团队开发；
u 减小DOM节点：加速页面渲染；
u 给图片加上正确的宽高值：这能够减小页面重绘，同时防止图片缩放；
u 防止src属性和link的href属性为空：当值为空时，浏览器极可能会把当前页面当成其属性值加载；
u 正确的闭合标签：如避免使用<div/>，浏览器会多一个将它解析成<div\></div\>的过程；
u 连接为目录或首页的地址后面加”/”，如http://www.5icool.org/；
u 用LINK而不用@import方式导入样式；
u 样式放在页头，JS放在页尾；
u 缩小favicon.ico并缓存；
2) CSS部分
u 避免使用CSS Expressions(CSS表达式)：如background-color: expression( (newDate()).getHours()%2 ? “#B8D4FF” : “#F08A00″ ) ;
u 避免使用CSS Filter（CSS滤镜）；
u 使用CSS缩写，减小代码量；
u 经过CSSSprites把同类图片合成一张，减小图片请求；
u 减小查询层级：如.header .logo要好过.header .top .logo；
u 减小查询范围：如.header>li要好过.header li；
u 避免TAG标签与CLASS或ID并存：如a.top、button#submit；
u 删除重复的CSS；
3) Javscript部分
u 尽可能少用全局变量；
u 使用事件代理绑定事件，如将事件绑定在body上进行代理；
u 避免频繁操做DOM节点；
u 不使用EVAL；
u 减小对象查找，如a.b.c.d这种查找方式很是耗性能，尽量把它定义在变量里；
u 类型转换：把数字转换成字符串使用”” + 1，浮点数转换成整型使用Math.floor()或者Math.round()；
u 对字符串进行循环操做，譬如替换、查找，应使用正则表达式；
u 删除重复的JS；
4) 服务器部分
u 尽可能合并CSS、JS文件，或将其直接写在页面上，减小HTTP请求；
u 压缩CSS、JS文件，缩短文件传输时间；
u 避免404错误：特别要避免给404指定一个停摆页面，不然全部404错误都将会加载一次页面；
u 通常要求减小DNS查询次数，如同一个页面的请求资源尽可能少的使用不一样的主机名，这能够减小网站并行下载的数量，但不少网站为了加速下载资源实际上是特地用了多个主机名，这里要作一个权衡；
u 使用CDN加速，使用户从离本身最近的服务器下载文件；
u 减小Cookie的大小，使用无cookie的域，客户端请求静态文件的时候，减小 Cookie 的反复传输对主域名的影响；
u 为文件头指定Expires，使内容具备缓存性；
u 使用gzip压缩内容；
8. JavaScript中哪些方法获取元素?
getElementById
getElementsByClassName
getElementsByTagName
getElementsByName
9. 描述CSS hack技巧?
条件注释：仅适用于IE
特定符号：适用于能识别特定符号的浏览器
内核符号：针对不一样浏览器内核
10.用JS截取字符串，asdfgh，要fgh;?
方式1： ‘asdfgh’.substr(3,3)
方式2： ’asdfgh’.substring(3,5) 或者 ‘asdfgh’.substring(3)
11.IE6的双倍边距BUG指的是什么？怎么解决？
双边距：当块级元素有浮动样式的时候，给元素添加margin-left和margin-right样式，在ie6下就会出现双倍边距。
解决方案：给当前元素添加样式，使当前元素不为块，如：display:inline;display:list-item
12. 若是制做一个访问量很大的网站，对css，js和图片应该怎么处理?
方法1：资源文件按模块进行放置，有利于团队开发
方法2：图片尽可能采起聚合技术
方法3：精简压缩css和js文件，减小文件大小
方法4：类库、媒体使用CDN加速，减轻服务器压力
13.述ajax原理，什么是同步异步(主观题，答案不惟一)?
Ajax的工做原理：至关于在用户和服务器之间加了—个中间层，使用户操做与服务器响应异步化。这样把之前的一些服务器负担的工做转嫁到客户端，利于客户端闲置的处理能力来处理，减轻服务器和带宽的负担，从而达到节约ISP的空间及带宽租用成本的目的。
同步异步：
14. 平时有没有使用xml和json，在ajax交互中，哪种更易于开发和维护，js中怎么序列化JSON字符串?
有，json相比xml可读性和可扩张性好、编码及解码难度较低、在数据交互中带宽占用少，而且在当下是最流行的数据交互格式。
序列化JSON字符串：eval() 或者 JSON.parse()
15. JS怎么建立一个类?
方式1 : var obj = new Object();
方式2 : var obj = {};
16.JS的typeof返回哪些数据类型?
string、number、object、boolean、function、undefined
17. HTTP请求有哪几种？
post、get
18. 完成下面布局（兼容IE6-10以及FF、谷歌、苹果浏览器）?
<!DOCTYPEhtml>
<htmllang="en">
<head>
<metahttp-equiv="Content-Type" content="text/html;charset=utf-8"/>
<title></title>
<style>
body {
margin: 0;
padding: 0;
}
#body {
background-color: #0099CB;
width: 100%;
float: left;
}
#header {
height: 60px;
background-color: #999999;
}
#content {
background-color: #006766;
margin-left: 180px;
}
#sidebar {
width: 180px;
float: left;
}
#footer {
clear: both;
height: 60px;
background-color: #999999;
}
</style>
</head>
<body>
<divid="header"></div>
<divid="body">
<divid="sidebar"></div>
<divid="content"></div>
</div>
<divid="footer"></div>
</body>
</html>
19.闭包是什么？有什么特性？请简单书写一个简单事例？
必包：闭包是指能够包含自由（未绑定到特定对象）变量的代码块；这些变量不是在这个代码块内或者任何全局上下文中定义的，而是在定义代码块的环境中定义（局部变量）
特性：闭包是可以读取其余函数内部变量的函数，即在外面能够调用函数中的函数的变量，其实他就是将函数内外部链接起来的桥梁
事例：
<scripttype=’text/javascript’>
function a(){
var i = 99;
iAdd = function(){
i++;
}
function b(){
alert(i);
}
return b;
}
var result = a();
result();//结果为99
iAdd();
result();//结果为100
</script>
20. 解释jsonp的原理，以及为何不是真正的ajax（主观题）？
JSONP是一种非正式传输协议，该协议的一个要点就是容许用户传递一个callback参数给服务端，而后服务端返回数据时会将这个callback参数做为函数名来包裹住JSON数据，这样客户端就能够随意定制本身的函数来自动处理返回数据了。
21. js延迟加载的方式有哪些？
defer和async、动态建立DOM方式（用得最多）、按需异步载入js
22. 对WEB标准以及W3C的理解与认识？
标签闭合、标签小写、不乱嵌套、提升搜索机器人搜索概率、使用外 链css和js脚本、结构行为表现的分离、文件下载与页面速度更快、内容能被更多的用户所访问、内容能被更普遍的设备所访问、更少的代码和组件，容易维 护、改版方便，不须要变更页面内容、提供打印版本而不须要复制内容、提升网站易用性；
23. xhtml和html有什么区别？
HTML是一种基本的WEB网页设计语言，XHTML是一个基于XML的置标语言
最主要的不一样：
XHTML 元素必须被正确地嵌套。
XHTML 元素必须被关闭。
标签名必须用小写字母。
XHTML 文档必须拥有根元素。
24. Doctype? 严格模式与混杂模式-如何触发这两种模式，区分它们有何意义?
用于声明文档使用那种规范（html/Xhtml）通常为严格 过分 基于框架的html文档
加入XMl声明可触发，解析方式更改成IE5.5 拥有IE5.5的bug
25. 行内元素有哪些？块级元素有哪些？CSS的盒模型？
块级元素：div p h1 h2 h3 h4 form ul
行内元素: a b br i span input select
Css盒模型:内容，border ,margin，padding
26.CSS引入的方式有哪些?link和@import的区别是?
内联 内嵌 外链 导入
区别 ：同时加载
前者无兼容性，后者CSS2.1如下浏览器不支持
Link 支持使用javascript改变样式，后者不可
27.CSS选择符有哪些？哪些属性能够继承？优先级算法如何计算？内联和important哪一个优先级高？
标签选择符 类选择符 id选择符
继承不如指定 Id>class>标签选择
后者优先级高
28.前端页面有哪三层构成，分别是什么？做用是什么？
结构层 Html 表示层 CSS 行为层 js
29.css的基本语句构成是？
选择器{属性1:值1;属性2:值2;……}
30.你作的页面在哪些流览器测试过？这些浏览器的内核分别是什么?
Ie(Ie内核)火狐（Gecko）谷歌（webkit） opear(Presto)
31.写出几种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）
32.<img>标签上title与alt属性的区别是什么？
Alt 当图片不显示是用文字表明。
Title 为该属性提供信息
33.描述css reset的做用和用途？
Reset重置浏览器的css默认属性浏览器的品种不一样，样式不一样，而后重置，让他们统一
34.解释css sprites，如何使用？
Css 精灵把一堆小的图片整合到一张大的图片上，减轻服务器对图片的请求数量
35.浏览器标准模式和怪异模式之间的区别是什么？
盒子模型渲染模式的不一样
使用 window.top.document.compatMode 可显示为何模式
36.你如何对网站的文件和资源进行优化？期待的解决方案包括：
文件合并
文件最小化/文件压缩
使用CDN托管
缓存的使用
37.什么是语义化的HTML？
直观的认识标签对于搜索引擎的抓取有好处
38.清除浮动的几种方式，各自的优缺点？
1.使用空标签清除浮动 clear:both（理论上能清楚任何标签，，，增长无心义的标签）
2.使用overflow:auto（空标签元素清除浮动而不得不增长无心代码的弊端,,使用zoom:1用于兼容IE）
3.是用afert伪元素清除浮动(用于非IE浏览器)
39.javascript的typeof返回哪些数据类型？
Object number function boolean underfind
40.例举3种强制类型转换和2种隐式类型转换？
强制（parseInt,parseFloat,number）
隐式（== – ===）
41.split() join() 的区别？
前者是切割成数组的形式，后者是将数组转换成字符串
42.数组方法pop() push() unshift() shift()？
Push()尾部添加 pop()尾部删除
Unshift()头部添加 shift()头部删除
43.14.JS中的call()和apply()方法的区别？
例子中用 add 来替换 sub，add.call(sub,3,1) == add(3,1) ，因此运行结果为：alert(4);
注意：js 中的函数实际上是对象，函数名是对 Function 对象的引用。
function add(a,b)
{
alert(a+b);
}
function sub(a,b)
{
alert(a-b);
}
add.call(sub,3,1);
44.IE和DOM事件流的区别？
1.执行顺序不同、
2.参数不同
3.事件加不加on
4.this指向问题
45.IE和标准下有哪些兼容性的写法？
Var ev = ev || window.event document.documentElement.clientWidth || document.body.clientWidth Var target = ev.srcElement||ev.target
46.ajax请求的时候get 和post方式的区别？
一个在url后面一个放在虚拟载体里面
有大小限制
安全问题
应用不一样一个是论坛等只须要请求的，一个是相似修改密码的
47.call和apply的区别？
Object.call(this,obj1,obj2,obj3) Object.apply(this,arguments)
48.ajax请求时，如何解释json数据？
使用eval parse 鉴于安全性考虑使用parse更靠谱
49.new操做符具体干了什么呢?
一、建立一个空对象，而且 this 变量引用该对象，同时还继承了该函数的原型。
二、属性和方法被加入到 this 引用的对象中。
三、新建立的对象由 this 所引用，而且最后隐式的返回 this 。
var obj = {};
obj.__proto__ = Base.prototype;
Base.call(obj);
50.写一个获取非行间样式的函数？
functiongetStyle(obj,attr,value)
{
if(!value)
{
if(obj.currentStyle)
{
return obj.currentStyle(attr)
}
else
{
obj.getComputedStyle(attr,false)
}
}
else
{
obj.style[attr]=value
}
}
51.事件委托是什么？
让利用事件冒泡的原理，让本身的所触发的事件，让他的父元素代替执行！
http://www.webasily.com/?p=78 例子可见此连接
52.闭包是什么，有什么特性，对页面有什么影响？
闭包就是可以读取其余函数内部变量的函数。
http://blog.csdn.net/gaoshanwudi/article/details/7355794 此连接可查看（问这个问题的不是一个公司）
53.如何阻止事件冒泡和默认事件？
canceBubble return false
54.添加删除替换插入到某个接点的方法？
obj.appendChidl()
obj.innersetBefore
obj.replaceChild
obj.removeChild
55.解释jsonp的原理，以及为何不是真正的ajax？
动态建立script标签，回调函数
Ajax是页面无刷新请求数据操做
56.javascript的本地对象，内置对象和宿主对象？
本地对象为array obj regexp等能够new实例化
内置对象为gload Math 等不能够实例化的
宿主为浏览器自带的document,window 等
57.document load 和document ready的区别？
Document.onload 是在结构和样式加载完才执行js
Document.ready原生种没有这个方法，jquery中有 $().ready(function)
58.”==”和“===”的不一样？
前者会自动转换类型
后者不会
59.javascript的同源策略？
一段脚本只能读取来自于同一来源的窗口和文档的属性，这里的同一来源指的是主机名、协议和端口号的组合
60.编写一个数组去重的方法？
function oSort(arr)
{
varresult ={};
varnewArr=[];
for(vari=0;i<arr.length;i++)
{
if(!result[arr])
{
newArr.push(arr)
result[arr]=1
}
}
returnnewArr
}
61.Doctype做用? 严格模式与混杂模式-如何触发这两种模式，区分它们有何意义?
（1）、<!DOCTYPE> 声明位于文档中的最前面，处于 <html>标签以前。告知浏览器的解析器，用什么文档类型 规范来解析这个文档。
（2）、严格模式的排版和 JS 运做模式是 以该浏览器支持的最高标准运行。
（3）、在混杂模式中，页面以宽松的向后兼容的方式显示。模拟老式浏览器的行为以防止站点没法工做。
（4）、DOCTYPE不存在或格式不正确会致使文档以混杂模式呈现。
62.行内元素有哪些？块级元素有哪些？空(void)元素有那些？
（1）CSS规范规定，每一个元素都有display属性，肯定该元素的类型，每一个元素都有默认的display值，好比div默认display属性值为“block”，成为“块级”元素；span默认display属性值为“inline”，是“行内”元素。
（2）行内元素有：a b span img input select strong（强调的语气） 块级元素有：div ul ol li dl dt dd h1 h2 h3 h4…p
（3）知名的空元素： <br> <hr> <img> <input> <link><meta>
不为人知的是： <area><base> <col> <command> <embed> <keygen><param> <source> <track> <wbr>
63.CSS的盒子模型？
（1）两种， IE 盒子模型、标准 W3C 盒子模型；IE 的content部分包含了border 和 pading;
（2）盒模型： 内容(content)、填充(padding)、边界(margin)、 边框(border).
64.link 和@import 的区别是?
（1）、link属于XHTML标签，而@import是CSS提供的;
（2）、页面被加载的时，link会同时被加载，而@import引用的CSS会等到页面被加载完再加载;
（3）、import只在IE5以上才能识别，而link是XHTML标签，无兼容问题;
（4）、link方式的样式的权重 高于@import的权重.
65.CSS 选择符有哪些？哪些属性能够继承？优先级算法如何计算？ CSS3新增伪类有那些？
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）
可继承： font-sizefont-family color, UL LI DL DD DT;
不可继承 ：border paddingmargin width height ;
优先级就近原则，样式定义最近者为准;
载入样式以最后载入的定位为准;
优先级为:
!important > id > class > tag
important 比 内联优先级高
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，单选框或复选框被选中。
66.如何居中div,如何居中一个浮动元素?
·
给div设置一个宽度，而后添加margin:0 auto属性
· div{
· width:200px;
· margin:0 auto;
· }
· 居中一个浮动元素
· 肯定容器的宽高 宽500 高 300 的层
· 设置层的外边距
·
· .div {
· Width:500px ; height:300px;//高度能够不设
· Margin: -150px 0 0 -250px;
· position:relative;相对定位
· background-color:pink;//方便看效果
· left:50%;
· top:50%;
· }
67.浏览器的内核分别是什么?常常遇到的浏览器的兼容性有哪些？缘由，解决方法是什么，经常使用hack的技巧？
* IE浏览器的内核Trident、 Mozilla的Gecko、google的WebKit、Opera内核Presto；
* png24为的图片在iE6浏览器上出现背景，解决方案是作成PNG8.
* 浏览器默认的margin和padding不一样。解决方案是加一个全局的*{margin:0;padding:0;}来统一。
* IE6双边距bug:块属性标签float后，又有横行的margin状况下，在ie6显示margin比设置的大。
浮动ie产生的双倍距离 #box{float:left; width:10px; margin:0 0 0 100px;}
这种状况之下IE会产生20px的距离，解决方案是在float的标签样式控制中加入 ——_display:inline;将其转化为行内属性。(_这个符号只有ie6会识别)
渐进识别的方式，从整体中逐渐排除局部。
首先，巧妙的使用“\9”这一标记，将IE游览器从全部状况中分离出来。
接着，再次使用“+”将IE8和IE七、IE6分离开来，这样IE8已经独立识别。
css
.bb{
background-color:#f1ee18;/*全部识别*/
.background-color:#00deff\9; /*IE六、七、8识别*/
+background-color:#a200ff;/*IE六、7识别*/
_background-color:#1e0bd1;/*IE6识别*/
}
* IE下,可使用获取常规属性的方法来获取自定义属性,
也可使用getAttribute()获取自定义属性;
Firefox下,只能使用getAttribute()获取自定义属性.
解决方法:统一经过getAttribute()获取自定义属性.
* IE下,even对象有x,y属性,可是没有pageX,pageY属性;
Firefox下,event对象有pageX,pageY属性,可是没有x,y属性.
* （条件注释）缺点是在IE浏览器下可能会增长额外的HTTP请求数。
* Chrome 中文界面下默认会将小于 12px 的文本强制按照 12px 显示, 可经过加入 CSS 属性 -webkit-text-size-adjust: none; 解决.
超连接访问事后hover样式就不出现了 被点击访问过的超连接样式不在具备hover和active了解决方法是改变CSS属性的排列顺序:
L-V-H-A : a:link {} a:visited {}a:hover {} a:active {}
68.html5\CSS3有哪些新特性、移除了那些元素？如何处理HTML5新标签的浏览器兼容问题？如何区分 HTML 和 HTML5？
· HTML5 如今已经不是 SGML 的子集，主要是关于图像，位置，存储，地理定位等功能的增长。
· * 绘画 canvas 元素
·
· 用于媒介回放的 video和 audio 元素
·
· 本地离线存储localStorage 长期存储数据，浏览器关闭后数据不丢失；
· sessionStorage 的数据在浏览器关闭后自动删除
·
· 语意化更好的内容元素，好比 article、footer、header、nav、section
·
· 表单控件，calendar、date、time、email、url、search
·
· CSS3实现圆角，阴影，对文字加特效，增长了更多的CSS选择器 多背景 rgba
·
· 新的技术webworker,websockt, Geolocation
· 移除的元素
· 纯表现的元素：basefont，big，center，font, s，strike，tt，u；
·
· 对可用性产生负面影响的元素：frame，frameset，noframes；
·
· * 是IE8/IE7/IE6支持经过document.createElement方法产生的标签，
· 能够利用这一特性让这些浏览器支持HTML5新标签，
·
· 浏览器支持新标签后，还须要添加标签默认的样式：
·
· * 固然最好的方式是直接使用成熟的框架、使用最多的是html5shim框架
· <!--[if lt IE 9]>
· <script>src="http://html5shim.googlecode.com/svn/trunk/html5.js"</script>
· <![endif]-->
69.你怎么来实现页面设计图，你认为前端应该如何高质量完成工做? 一个满屏品字布局如何设计?
* 首先划分红头部、body、脚部；。。。。。
实现效果图是最基本的工做，精确到2px；
与设计师，产品经理的沟通和项目的参与
作好的页面结构，页面重构和用户体验
处理hack，兼容、写出优美的代码格式
针对服务器的优化、拥抱 HTML5。
70.常使用的库有哪些？经常使用的前端开发工具？开发过什么应用或组件？
* 使用率较高的框架有jQuery、YUI、Prototype、Dojo、Ext.js、Mootools等。尤为是jQuery，超过91%。
轻量级框架有Modernizr、underscore.js、backbone.js、Raphael.js等。
（理解这些框架的功能、性能、设计原理）
* Sublime Text 、Eclipse、Notepad、Firebug、HttpWatch、Yslow。
* 城市选择插件，汽车型号选择插件、幻灯片插件。弹出层。（写过开源程序，加载器，js引擎更好）
1. JavaScript原型，原型链 ? 有什么特色？
2. * 原型对象也是普通的对象，是对象一个自带隐式的 __proto__ 属性，原型也有可能有本身的原型，若是一个原型对象的原型不为null的话，咱们就称之为原型链。
3. * 原型链是由一些用来继承和共享属性的对象组成的（有限的）对象链。
4.
5. * JavaScript的数据对象有那些属性值？
6.
7. writable：这个属性的值是否能够改。
8.
9. configurable：这个属性的配置是否能够删除，修改。
10.
11. enumerable：这个属性是否能在for…in循环中遍历出来或在Object.keys中列举出来。
12.
13. value：属性值。
14.
15. * 当咱们须要一个属性的时，Javascript引擎会先看当前对象中是否有这个属性，若是没有的话，就会查找他的Prototype对象是否有这个属性。
16.
function clone(proto) {
function Dummy() { }
Dummy.prototype = proto;
Dummy.prototype.constructor = Dummy;
return new Dummy(); //等价于Object.create(Person);
}
functionobject(old) {
function F() {};
F.prototype =old;
return new F();
}
var newObj = object(oldObject);
71.列出display的值，说明他们的做用。position的值， relative和absolute定位原点是？
1. block 象块类型元素同样显示。
none 缺省值。向行内元素类型同样显示。
inline-block 象行内元素同样显示，但其内容象块类型元素同样显示。
list-item 象块类型元素同样显示，并添加样式列表标记。
2.
*absolute
生成绝对定位的元素，相对于 static 定位之外的第一个父元素进行定位。
*fixed （老IE不支持）
生成绝对定位的元素，相对于浏览器窗口进行定位。
*relative
生成相对定位的元素，相对于其正常位置进行定位。
* static 默认值。没有定位，元素出如今正常的流中
*（忽略 top, bottom, left,right z-index 声明）。
* inherit 规定从父元素继承 position 属性的值。
72.页面重构怎么操做？
编写 CSS、让页面结构更合理化，提高用户体验，实现良好的页面效果和提高性能。
73.语义化的理解？
html语义化就是让页面的内容结构化，便于对浏览器、搜索引擎解析；
在没有样式CCS状况下也以一种文档格式显示，而且是容易阅读的。
搜索引擎的爬虫依赖于标记来肯定上下文和各个关键字的权重，利于 SEO。
使阅读源代码的人对网站更容易将网站分块，便于阅读维护理解。
74.HTML5的离线储存？
localStorage 长期存储数据，浏览器关闭后数据不丢失；
sessionStorage 数据在浏览器关闭后自动删除。
75.为何要初始化CSS样式。
· 由于浏览器的兼容问题，不一样浏览器对有些标签的默认值是不一样的，若是没对CSS初始化每每会出现浏览器之间的页面显示差别。
· 固然，初始化样式会对SEO有必定的影响，但鱼和熊掌不可兼得，但力求影响最小的状况下初始化。
*最简单的初始化方法就是： * {padding: 0;margin: 0;} （不建议）
淘宝的样式初始化：
body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, ol, li,pre, form, fieldset, legend, button, input, textarea, th, td { margin:0;padding:0; }
body, button, input, select, textarea { font:12px/1.5tahoma, arial,\5b8b\4f53; }
h1, h2, h3, h4, h5, h6{ font-size:100%; }
address, cite, dfn, em, var { font-style:normal; }
code, kbd, pre, samp { font-family:couriernew, courier, monospace; }
small{ font-size:12px; }
ul, ol { list-style:none; }
a { text-decoration:none; }
a:hover { text-decoration:underline; }
sup { vertical-align:text-top; }
sub{ vertical-align:text-bottom; }
legend { color:#000; }
fieldset, img { border:0; }
button, input, select, textarea { font-size:100%; }
table { border-collapse:collapse; border-spacing:0; }
76.(写)描述一段语义的html代码吧。
（HTML5中新增长的不少标签（如：<article>、<nav>、<header>和<footer>等）
就是基于语义化设计原则）
< div id="header">
< h1>标题< /h1>
< h2>专一Web前端技术< /h2>
< /div>
· 语义 HTML 具备如下特性：
· 文字包裹在元素中，用以反映内容。例如：
· 段落包含在<p> 元素中。
· 顺序表包含在<ol>元素中。
· 从其余来源引用的大型文字块包含在<blockquote>元素中。
· HTML 元素不能用做语义用途之外的其余目的。例如：
· <h1>包含标题，但并不是用于放大文本。
· <blockquote>包含大段引述，但并不是用于文本缩进。
· 空白段落元素 (<p></p> ) 并不是用于跳行。
· 文本并不直接包含任何样式信息。例如：
· 不使用<font> 或 <center> 等格式标记。
· 类或 ID 中不引用颜色或位置。
77.iframe有那些缺点？
*iframe会阻塞主页面的Onload事件；
*iframe和主页面共享链接池，而浏览器对相同域的链接有限制，因此会影响页面的并行加载。
使用iframe以前须要考虑这两个缺点。若是须要使用iframe，最好是经过javascript
动态给iframe添加src属性值，这样能够能够绕开以上两个问题。
22.css定义的权重
如下是权重的规则：标签的权重为1，class的权重为10，id的权重为100，如下例子是演示各类定义的权重值：
/*权重为1*/
div{
}
/*权重为10*/
.class1{
}
/*权重为100*/
#id1{
}
/*权重为100+1=101*/
#id1 div{
}
/*权重为10+1=11*/
.class1 div{
}
/*权重为10+10+1=21*/
.class1 .class2 div{
}
若是权重相同，则最后定义的样式会起做用，可是应该避免这种状况出现
78.eval是作什么的？
它的功能是把对应的字符串解析成JS代码并运行；
避免使用eval，不安全，很是耗性能（2次，一次解析成js语句，一次执行）。
23.写一个通用的事件侦听器函数
`// event(事件)工具集，来源：https://github.com/markyun
markyun.Event = {
// 页面加载完成后
readyEvent : function(fn) {
if (fn==null) {
fn=document;
}
var oldonload = window.onload;
if (typeof window.onload != 'function') {
window.onload = fn;
} else {
window.onload = function() {
oldonload();
fn();
};
}
},
// 视能力分别使用dom0||dom2||IE方式来绑定事件
// 参数： 操做的元素,事件名称 ,事件处理程序
addEvent : function(element, type, handler) {
if (element.addEventListener) {
//事件类型、须要执行的函数、是否捕捉
element.addEventListener(type,handler, false);
} else if (element.attachEvent) {
element.attachEvent('on' + type,function() {
handler.call(element);
});
} else {
element['on' + type] = handler;
}
},
// 移除事件
removeEvent : function(element, type, handler) {
if (element.removeEnentListener) {
element.removeEnentListener(type,handler, false);
} else if (element.datachEvent) {
element.detachEvent('on' + type,handler);
} else {
element['on' + type] = null;
}
},
// 阻止事件 (主要是事件冒泡，由于IE不支持事件捕获)
stopPropagation : function(ev) {
if (ev.stopPropagation) {
ev.stopPropagation();
} else {
ev.cancelBubble = true;
}
},
// 取消事件的默认行为
preventDefault : function(event) {
if (event.preventDefault) {
event.preventDefault();
} else {
event.returnValue = false;
}
},
// 获取事件目标
getTarget : function(event) {
return event.target || event.srcElement;
},
// 获取event对象的引用，取到事件的全部信息，确保随时能使用event；
getEvent : function(e) {
var ev = e || window.event;
if (!ev) {
var c = this.getEvent.caller;
while (c) {
ev = c.arguments[0];
if (ev && Event ==ev.constructor) {
break;
}
c = c.caller;
}
}
return ev;
}
};
24.99%的网站都须要被重构是那本书上写的？
* 网站重构：应用web标准进行设计（第2版）
79.什么叫优雅降级和渐进加强？
优雅降级：Web站点在全部新式浏览器中都能正常工做，若是用户使用的是老式浏览器，则代码会检查以确认它们是否能正常工做。因为IE独特的盒模型布局问题，针对不一样版本的IE的hack实践过优雅降级了,为那些没法支持功能的浏览器增长候选方案，使之在旧式浏览器上以某种形式降级体验却不至于彻底失效.
渐进加强：从被全部浏览器支持的基本功能开始，逐步地添加那些只有新式浏览器才支持的功能,向页面增长无害于基础浏览器的额外样式和功能的。当浏览器支持时，它们会自动地呈现出来并发挥做用。
80.Node.js的适用场景？
高并发、聊天、实时消息推送
81.WEB应用从服务器主动推送Data到客户端有那些方式？
html5 websoket
WebSocket经过Flash
XHR长时间链接
XHR Multipart Streaming
不可见的Iframe
<script>标签的长时间链接(可跨域)
82.js的几种数据类型？
number,string,boolean,object,undefined
js的常见内置对象类：Date,Array,Math、Number、Boolean、String、Array、RegExp、Function...
· 一般能够作一些小练习来判断TA的水平，js 虽然很灵活，可是具体的代码和实现方式能体现出一我的的全局观，随着代码规模的增加，复杂度增长，如何合理划分模块实现功能和接口的能力比较重要。（下面例题）
·
["1","2", "3"].map(parseInt)
·
· [typeof null, nullinstanceof Object]
·
· [ [3,2,1].reduce(Math.pow),[].reduce(Math.pow)] ]
·
· var val = 'smtg';
· console.log('Value is ' + (val === 'smtg') ?'Something' : 'Nothing');
83.建立一个对象？
function Person(name, age) {
this.name = name;
this.age = age;
this.sing = function() { alert(this.name) }
}
84.谈谈This对象的理解？
this是js的一个关键字，随着函数使用场合不一样，this的值会发生变化。
可是总有一个原则，那就是this指的是调用函数的那个对象。
this通常状况下：是全局对象Global。 做为方法调用，那么this就是指这个对象
85.事件、IE与火狐的事件机制有什么区别？如何阻止冒泡？
1. 咱们在网页中的某个操做（有的操做对应多个事件）。例如：当咱们点击一个按钮就会产生一个事件。是能够被 JavaScript 侦测到的行为。
2. 事件处理机制：IE是事件冒泡、火狐是 事件捕获；
3. ev.stopPropagation();
86.什么是闭包（closure），为何要用？
· 待完善
· 执行say667()后,say667()闭包内部变量会存在,而闭包内部函数的内部变量不会存在.使得Javascript的垃圾回收机制GC不会收回say667()所占用的资源，由于say667()的内部函数的执行须要依赖say667()中的变量。这是对闭包做用的很是直白的描述.
·
function say667() {
· // Local variable that ends up withinclosure
· var num = 666;
· var sayAlert = function() { alert(num); }
· num++;
· return sayAlert;
· }
·
· var sayAlert = say667();
· sayAlert()//执行结果应该弹出的667
87.如何判断一个对象是否属于某个类？
使用instanceof （待完善）
if(a instanceof Person){
alert('yes');
}
88.JSON 的了解？
JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式。它是基于JavaScript的一个子集。数据格式简单, 易于读写, 占用带宽小
{'age':'12', 'name':'back'}
89.ajax 是什么?ajax 的交互模型?同步和异步的区别?如何解决跨域问题?
· 待完善
· 1. 经过异步模式，提高了用户体验
·
· 2. 优化了浏览器和服务器之间的传输，减小没必要要的数据往返，减小了带宽占用
·
· 3. Ajax在客户端运行，承担了一部分原本由服务器承担的工做，减小了大用户量下的服务器负载。
·
· 2. Ajax的最大的特色是什么。
·
· Ajax能够实现动态不刷新（局部刷新）
· readyState属性 状态 有5个可取值： 0=未初始化 ，1=正在加载 2=以加载，3=交互中，4=完成
· ajax的缺点
· 一、ajax不支持浏览器back按钮。
·
· 二、安全问题 AJAX暴露了与服务器交互的细节。
·
· 三、对搜索引擎的支持比较弱。
·
· 四、破坏了程序的异常机制。
·
· 五、不容易调试。
· 跨域： jsonp、 iframe、window.name、window.postMessage、服务器上设置代理页面
90.模块化怎么作？
当即执行函数,不暴露私有成员
var module1 = (function(){
var _count = 0;
var m1 = function(){
//...
};
var m2 = function(){
//...
};
return {
m1 : m1,
m2 : m2
};
})();
91.对Node的优势和缺点提出了本身的见解？
*（优势）由于Node是基于事件驱动和无阻塞的，因此很是适合处理并发请求，
所以构建在Node上的代理服务器相比其余技术实现（如Ruby）的服务器表现要好得多。
此外，与Node代理服务器交互的客户端代码是由javascript语言编写的，
所以客户端和服务器端都用同一种语言编写，这是很是美妙的事情。
*（缺点）Node是一个相对新的开源项目，因此不太稳定，它老是一直在变，
并且缺乏足够多的第三方库支持。看起来，就像是Ruby/Rails当年的样子。
92.异步加载的方式？
(1) defer，只支持IE
(2) async：
(3) 建立script，插入到DOM中，加载完毕后callBack
documen.write和 innerHTML的区别
document.write只能重绘整个页面
innerHTML能够重绘页面的一部分
93.告诉我答案是多少？
(function(x){
delete x;
alert(x);
})(1+5);
函数参数没法delete删除，delete只能删除经过for in访问的属性。
固然，删除失败也不会报错，因此代码运行会弹出“1”。
94.Jquery与jQuery UI 有啥区别？
*jQuery是一个js库，主要提供的功能是选择器，属性修改和事件绑定等等。
*jQuery UI则是在jQuery的基础上，利用jQuery的扩展性，设计的插件。
提供了一些经常使用的界面元素，诸如对话框、拖动行为、改变大小行为等等
95.jquery 中如何将数组转化为json字符串，而后再转化回来？
jQuery中没有提供这个功能，因此你须要先编写两个jQuery的扩展：
$.fn.stringifyArray = function(array) {
return JSON.stringify(array)
}
$.fn.parseArray = function(array) {
return JSON.parse(array)
}
而后调用：
$("").stringifyArray(array)
96.前端开发的优化问题？
· （1）减小http请求次数：CSS Sprites, JS、CSS源码压缩、图片大小控制合适；网页Gzip，CDN托管，data缓存 ，图片服务器。
·
· （2）前端模板 JS+数据，减小因为HTML标签致使的带宽浪费，前端用变量保存AJAX请求结果，每次操做本地变量，不用请求，减小请求次数
·
· （3）用innerHTML代替DOM操做，减小DOM操做次数，优化javascript性能。
·
· （4）当须要设置的样式不少时设置className而不是直接操做style。
·
· （5）少用全局变量、缓存DOM节点查找的结果。减小IO读取操做。
·
· （6）避免使用CSS Expression（css表达式)又称Dynamic properties(动态属性)。
·
· （7）图片预加载，将样式表放在顶部，将脚本放在底部 加上时间戳。
·
· （8）避免在页面的主体布局中使用table，table要等其中的内容彻底下载以后才会显示出来，显示比div+css布局慢。
97.http状态码有那些？分别表明是什么意思？
100-199 用于指定客户端应相应的某些动做。
200-299 用于表示请求成功。
300-399 用于已经移动的文件而且常被包含在定位头信息中指定新的地址信息。
400-499 用于指出客户端的错误。400 一、语义有误，当前请求没法被服务器理解。401 当前请求须要用户验证 403 服务器已经理解请求，可是拒绝执行它。
500-599 用于支持服务器错误。 503 – 服务不可用
98.平时如何管理你的项目，如何设计突发大规模并发架构？
先期团队必须肯定好全局样式（globe.css），编码模式(utf-8) 等
编写习惯必须一致（例如都是采用继承式的写法，单样式都写成一行）；
标注样式编写人，各模块都及时标注（标注关键样式调用的地方）；
页面进行标注（例如 页面 模块 开始和结束）；
CSS跟HTML分文件夹并行存放，命名都得统一（例如style.css）
JS 分文件夹存放 命民以该JS 功能为准英文翻译；
图片采用整合的 images.png png8 格式文件使用尽可能整合在一块儿使用方便未来的管理
1. 那些操做会形成内存泄漏？
2. 内存泄漏指任何对象在您再也不拥有或须要它以后仍然存在。
3. 垃圾回收器按期扫描对象，并计算引用了每一个对象的其余对象的数量。若是一个对象的引用数量为 0（没有其余对象引用过该对象），或对该对象的唯一引用是循环的，那么该对象的内存便可回收。
4.
5. setTimeout 的第一个参数使用字符串而非函数的话，会引起内存泄漏。
6. 闭包、控制台日志、循环（在两个对象彼此引用且彼此保留时，就会产生一个循环）
99.JavaScript是一门什么样的语言，它有哪些特色？
没有标准答案。
100。.JavaScript的数据类型都有什么？
基本数据类型：String,boolean,Number,Undefined, Null
引用数据类型：Object(Array,Date,RegExp,Function)
101.如何判断某变量是否为数组数据类型？
· 方法一.判断其是否具备“数组性质”，如slice()方法。可本身给该变量定义slice方法，故有时会失效
· 方法二.obj instanceof Array 在某些IE版本中不正确
· 方法三.方法一二皆有漏洞，在ECMA Script5中定义了新方法Array.isArray(),保证其兼容性，最好的方法以下：
JavaScript
if(typeof Array.isArray==="undefined")
{
Array.isArray = function(arg){
return Object.prototype.toString.call(arg)==="[object Array]"
};
}
102.已知ID的Input输入框，但愿获取这个输入框的输入值，怎么作？(不使用第三方框架)
JavaScript
document.getElementById(“ID”).value
103.但愿获取到页面中全部的checkbox怎么作？(不使用第三方框架)
JavaScript
var domList = document.getElementsByTagName(‘input’)
var checkBoxList = [];
var len = domList.length;//缓存到局部变量
while (len--) {//使用while的效率会比for循环更高
if (domList[len].type == ‘checkbox’) {
checkBoxList.push(domList[len]);
}
}
104.设置一个已知ID的DIV的html内容为xxxx，字体颜色设置为黑色(不使用第三方框架)
JavaScript
var dom = document.getElementById(“ID”);
dom.innerHTML = “xxxx”
dom.style.color = “#000”
105.当一个DOM节点被点击时候，咱们但愿可以执行一个函数，应该怎么作？
· 直接在DOM里绑定事件：<div οnclick=”test()”></div>
· 在JS里经过onclick绑定：xxx.onclick = test
· 经过事件添加进行绑定：addEventListener(xxx, ‘click’, test)
那么问题来了，Javascript的事件流模型都有什么？
· “事件冒泡”：事件开始由最具体的元素接受，而后逐级向上传播
· “事件捕捉”：事件由最不具体的节点先接收，而后逐级向下，一直到最具体的
· “DOM事件流”：三个阶段：事件捕捉，目标阶段，事件冒泡
106.什么是Ajax和JSON，它们的优缺点?
Ajax是异步JavaScript和XML，用于在Web页面中实现异步数据交互。
优势：
· 可使得页面不重载所有内容的状况下加载局部内容，下降数据传输量
· 避免用户不断刷新或者跳转页面，提升用户体验
缺点：
· 对搜索引擎不友好（
· 要实现ajax下的先后退功能成本较大
· 可能形成请求数的增长
· 跨域问题限制
JSON是一种轻量级的数据交换格式，ECMA的一个子集
优势：轻量级、易于人的阅读和编写，便于机器（JavaScript）解析，支持复合数据类型（数组、对象、字符串、数字）
107.看下列代码输出为什么？解释缘由。
JavaScript var a; alert(typeof a); // undefined alert(b); // 报错 解释：Undefined是一个只有一个值的数据类型，这个值就是“undefined”，在使用var声明变量但并未对其赋值进行初始化时，这个变量的值就是undefined。而b因为未声明将报错。注意未申明的变量和声明了未赋值的是不同的。
108.看下列代码,输出什么？解释缘由。
JavaScript var a = null; alert(typeof a); //object 解释：null是一个只有一个值的数据类型，这个值就是null。表示一个空指针对象，因此用typeof检测会返回”object”。
109.看下列代码,输出什么？解释缘由。
JavaScript
var undefined; undefined == null; // true 1 == true; // true 2 == true; // false 0 == false; // true 0 == ''; // true NaN == NaN; // false [] == false; // true [] == ![]; // true
· undefined与null相等，但不恒等（===）
· 一个是number一个是string时，会尝试将string转换为number
· 尝试将boolean转换为number，0或1
· 尝试将Object转换成number或string，取决于另一个对比量的类型
· 因此，对于0、空字符串的判断，建议使用 “===” 。“===”会先判断两边的值类型，类型不匹配时为false。
那么问题来了，看下面的代码，输出什么，foo的值为何？
JavaScript
1
var foo = "11"+2-"1"; console.log(foo); console.log(typeof foo); 执行完后foo的值为111，foo的类型为String。
110.看代码给答案。
JavaScript
1
var a = new Object(); a.value = 1; b = a; b.value = 2; alert(a.value);
答案：2（考察引用数据类型细节）
111.已知数组var stringArray = [“This”, “is”, “Baidu”, “Campus”]，Alert出”This is Baidu Campus”。
答案：alert(stringArray.join(“”))
已知有字符串foo=”get-element-by-id”,写一个function将其转化成驼峰表示法”getElementById”。
JavaScript
function combo(msg){
var arr=msg.split("-");
for(var i=1;i<arr.length;i++){
arr[i]=arr[i].charAt(0).toUpperCase()+arr[i].substr(1,arr[i].length-1);
}
msg=arr.join("");
return msg;
}
(考察基础API)
112.var numberArray = [3,6,2,4,1,5]; （考察基础API）
1) 实现对该数组的倒排，输出[5,1,4,2,6,3]
2) 实现对该数组的降序排列，输出[6,5,4,3,2,1]
JavaScript
function combo(msg){
var arr=msg.split("-");
for(var i=1;i<arr.length;i++){
arr[i]=arr[i].charAt(0).toUpperCase()+arr[i].substr(1,arr[i].length-1);
}
msg=arr.join("");
return msg;
}
113.输出今天的日期，以YYYY-MM-DD的方式，好比今天是2014年9月26日，则输出2014-09-26
JavaScript
var d = new Date(); // 获取年，getFullYear()返回4位的数字 var year = d.getFullYear(); // 获取月，月份比较特殊，0是1月，11是12月 var month = d.getMonth() + 1; // 变成两位 month = month < 10 ? '0' + month : month; // 获取日 var day = d.getDate(); day = day < 10 ? '0' + day : day; alert(year + '-' + month + '-' + day);
114.将字符串”<tr><td>{$id}</td><td>{$name}</td></tr>”中的{$id}替换成10，{$name}替换成Tony （使用正则表达式）
答案：”<tr><td>{$id}</td><td>{$id}_{$name}</td></tr>”.replace(/{\$id}/g, ’10’).replace(/{\$name}/g, ‘Tony’);
115.为了保证页面输出安全，咱们常常须要对一些特殊的字符进行转义，请写一个函数escapeHtml，将<, >, &, “进行转义
JavaScript
function escapeHtml(str) {
return str.replace(/[<>”&]/g, function(match) {
switch (match) {
case “<”:
return “<”;
case “>”:
return “>”;
case “&”:
return “&”;
case “\””:
return “"”;
}
});
}
116.foo =foo||bar ，这行代码是什么意思？为何要这样写？
答案：if(!foo) foo = bar; //若是foo存在，值不变，不然把bar的值赋给foo。
短路表达式：做为”&&”和”||”操做符的操做数表达式，这些表达式在进行求值时，只要最终的结果已经能够肯定是真或假，求值过程便了结止，这称之为短路求值。
117.看下列代码，将会输出什么?(变量声明提高)
JavaScript
var foo = 1;
function(){
console.log(foo);
var foo = 2;
console.log(foo);
}
答案：输出undefined 和 2。上面代码至关于：
JavaScript
var foo = 1;
function(){
var foo;
console.log(foo); //undefined
foo = 2;
console.log(foo); // 2;
}
函数声明与变量声明会被JavaScript引擎隐式地提高到当前做用域的顶部，可是只提高名称不会提高赋值部分。
118.用js实现随机选取10–100之间的10个数字，存入一个数组，并排序。
JavaScript
var iArray = [];
funtion getRandom(istart, iend){
var iChoice = istart - iend +1;
return Math.floor(Math.random() * iChoice + istart;
}
for(var i=0; i<10; i++){
iArray.push(getRandom(10,100));
}
iArray.sort();
119.把两个数组合并，并删除第二个元素。
JavaScript
var array1 = ['a','b','c']; var bArray = ['d','e','f']; var cArray = array1.concat(bArray); cArray.splice(1,1);
120.怎样添加、移除、移动、复制、建立和查找节点（原生JS，实在基础，没细写每一步）
1）建立新节点 createDocumentFragment() //建立一个DOM片断 createElement() //建立一个具体的元素 createTextNode() //建立一个文本节点 2）添加、移除、替换、插入 appendChild() //添加 removeChild() //移除 replaceChild() //替换 insertBefore() //插入 3）查找 getElementsByTagName() //经过标签名称 getElementsByName() //经过元素的Name属性的值 getElementById() //经过元素Id，惟一性
121.有这样一个URL：http://item.taobao.com/item.htm?a=1&b=2&c=&d=xxx&e，请写一段JS程序提取URL中的各个GET参数(参数名和参数个数不肯定)，将其按key-value形式返回到一个json结构中，如{a:’1′, b:’2′, c:”, d:’xxx’, e:undefined}。
答案：
JavaScript
function serilizeUrl(url) {
var result = {};
url = url.split("?")[1];
var map = url.split("&");
for(var i = 0, len = map.length; i < len; i++) {
result[map[i].split("=")[0]] = map[i].split("=")[1];
}
return result;
}
122.正则表达式构造函数var reg=newRegExp(“xxx”)与正则表达字面量var reg=//有什么不一样？匹配邮箱的正则表达式？
答案：当使用RegExp()构造函数的时候，不只须要转义引号（即\”表示”），而且还须要双反斜杠（即\\表示一个\）。使用正则表达字面量的效率更高。
邮箱的正则匹配：
JavaScript
1
var regMail = /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+((.[a-zA-Z0-9_-]{2,3}){1,2})$/;
123.看下面代码，给出输出结果。
JavaScript
for(var i=1;i<=3;i++){
setTimeout(function(){
console.log(i);
},0);
};
答案：4 4 4。
缘由：Javascript事件处理器在线程空闲以前不会运行。追问，如何让上述代码输出1 2 3？
JavaScript
for(var i=1;i<=3;i++){
setTimeout((function(a){ //改为当即执行函数
console.log(a);
})(i),0);
};
124.写一个function，清除字符串先后的空格。（兼容全部浏览器）
使用自带接口trim()，考虑兼容性：
JavaScript
if (!String.prototype.trim) {
String.prototype.trim = function() {
return this.replace(/^\s+/, "").replace(/\s+$/,"");
}
}
// test the function
var str = " \t\n test string ".trim();
alert(str == "test string"); // alerts "true"
125..Javascript中callee和caller的做用？
答案：
caller是返回一个对函数的引用，该函数调用了当前函数；
callee是返回正在被执行的function函数，也就是所指定的function对象的正文。
那么问题来了？若是一对兔子每个月生一对兔子；一对新生兔，从第二个月起就开始生兔子；假定每对兔子都是一雌一雄，试问一对兔子，第n个月能繁殖成多少对兔子？（使用callee完成）
JavaScript
var result=[];
function fn(n){ //典型的斐波那契数列
if(n==1){
return 1;
}else if(n==2){
return 1;
}else{
if(result[n]){
return result[n];
}else{
//argument.callee()表示fn()
result[n]=arguments.callee(n-1)+arguments.callee(n-2);
return result[n];
}
}
}
126.你说你热爱前端，那么应该WEB行业的发展很关注吧？说说最近最流行的一些东西吧？
Node.js、Mongodb、npmM、MVVM、MEAN
127.你有了解咱们公司吗？说说你的认识？
由于我想去阿里，因此我针对阿里的说
最羡慕就是在双十一购物节，350.19亿元，每分钟支付79万笔。海量数据，竟然无一漏单、无一故障。太厉害了。
128.absolute的containingblock计算方式跟正常流有什么不一样？
129.position跟display、margin collapse、overflow、float这些特性相互叠加后会怎么样？
130.对BFC规范的理解？（W3C CSS 2.1 规范中的一个概念,它决定了元素如何对其内容进行定位,以及与其余元素的关系和相互做用。）
131.事件绑定和普通事件有什么区别？
132.b继承a的方法？
133..JavaScript中的做用域与变量声明提高？
134.一个页面从输入 URL 到页面加载显示完成，这个过程当中都发生了什么？（流程说的越详细越好）
135.你所知道的页面性能优化方法有那些？
136.除了前端之外还了解什么其它技术么？你最最厉害的技能是什么？
137.AMD（Modules/Asynchronous-Definition）、CMD（Common ModuleDefinition）规范区别？
138.谈谈你认为怎样作能是项目作的更好？
139.你对前端界面工程师这个职位是怎么样理解的？它的前景会怎么样？
140.移动端（好比：Android IOS）怎么作好用户体验?
141.加班的见解