Web前端年后跳槽必看的各种面试题

幸运且光荣的被老大安排了一个任务 - “去整理些前端面试题”。年前确实不是招人的好时候,所以我们前端团队经过了超负荷的运转,终于坚持过了春节。春节以后就开始招人啦,这套题考察的目标就是基础基础再基础,嘿嘿。

事先声明:

◆ 这些题目的来源:面试曾经被问过;工作被别人问过或者遇见过;网上看见过...

◆ 答案真心不给提供,真的是许多问题都需要个人的理解和沉淀,所以还请各位自己动手...前端可以试试自己差不多能回答多少题,哈哈。

◆ 其实很多题我也没有好答案,面试的时候如果遇到牛人我也可以顺便交流交流,反正我也只是一面,不丢人也不怕丢人。

◆ 如果朋友们有好的面试题欢迎提建议,我会其实补充更新的,先谢谢各位了。

HTML相关

1. 标签的定义与用法。

2. 块级元素和行内元素都有哪些?

3. 你真的了解HTML吗? 雅虎面试题  把前面黄底那段拿去搜索下就知道了(曾在某浪公司面试的时候被问到过,确实是很好的问题)。

CSS相关

1. 介绍所知道的CSS hack技巧(如:_, *, +, \9, !important 之类)。

2. 介绍CSS盒模型。

3. CSS层叠是什么?介绍一下。

4. 都知道哪些CSS浏览器兼容性问题。

5. 有时会被问到些刁钻点的题,比如position值都有哪些,CSS3都有哪些新内容...

JavaScript基础相关

1. HTTP协议的状态消息都有哪些?(如200、302对应的描述)

2. AJAX是什么? AJAX的交互模型(流程)? AJAX跨域的解决办法?

3. 同步和异步的区别?

4. 简述JavaScript封装。

5. JavaScript继承有哪两种形式形式,进行描述。

6. 什么是闭包?以下代码点击

会输出什么?为什么?能大概说明白的话继续问能想出几种解决办法。

 
  
  1. > 
  2. <html> 
  3. <head> 
  4. <meta charset="utf-8" /> 
  5. <title>闭包演示title> 
  6. <style type="text/css"> 
  7.     p {background:gold;}  
  8. style> 
  9. <script type="text/javascript">   
  10. function init() {      
  11.     var pAry = document.getElementsByTagName("p");      
  12.     for( var i=0; i<pAry.length; i++ ) {      
  13.          pAry[i].onclick = function() {      
  14.          alert(i);      
  15.     }   
  16.   }  
  17. }  
  18. script>   
  19. head>   
  20. <body onload="init();">   
  21. <p>产品 0p>   
  22. <p>产品 1p>   
  23. <p>产品 2p>   
  24. <p>产品 3p>   
  25. <p>产品 4p>   
  26. body>   
  27. html>  

7. 在JS中this关键字的使用场合和用法(如在构造函数中、setTimeout中等)。

8. 简述下cookie的操作,还有cookie的属性都知道哪些。

9. IE与FF的JS兼容性都知道哪些。

10. DOM操作 - 怎样添加、移除、移动、复制、创建和查找节点(这个问题真心是基础题,一般不会问)。

jQuery相关

1. jQuery源码是否尝试去读过?说说基本的架构或者 jQuery.fn.init 中都做了哪些判断。

2. 都知道哪些不好的jQuery书写方式。

3. Sizzle是否有读过?

其它相关的加分项:

1. 都使用和了解过哪些编辑器?都使用和了解过哪些日常工具?

2. 都知道有哪些浏览器内核?开发过的项目都兼容哪些浏览器?

3. 国内外的JS牛人都知道哪些?

4. 瀑布流布局或者流式布局是否有了解

4. 正则表达式有系统学习过吗(看书或网上教程)?有的话就问问简单点的邮箱验证、URL验证, 或者问问 贪婪匹配与懒惰匹配 的理论知识。

5. Node.js是否有过尝试?到什么程度?说说个人理解的看法?

6. HTML5都有哪些新的JS API?

7. 前端优化知识都知道哪些?

8. 基础算法题(如快速排序,能否一两句说说重要的核心原理或者数组消重等)。

9. 是否有接触过或者了解过重构。




1.简述div元素和span元素的区别。

 

div是块元素,默认换行,一般用于排版。

span是行内元素,默认不换行,一般用于局部文字样式。

 

通过display属性他们之间可以相互转换,div默认为block,span默认为inline。

 

2.谈谈javascript数组方法sort()的使用,重点介绍sort()参数的使用及其内部机制。

 

语法:arrayObject.sort(sortby)

参数sortby:可选,规定排序顺序。必须是函数。

 

返回对数组的引用。注意,数组在原数组上进行排序,不生成副本。

 

如果该方法没有使用参数,将按照字符编码的顺序进行排序。

如果想要按照其他标准进行排序,就需要提供比较函数,该函数要比较两个值,然后返回一个用于说明这两个值的相对顺序的数字。比较函数应该具有两个参数a和b,其返回值如下:

1)若a小于b,在排序后的数组中a应该出现在b之前,返回一个小于0的值。

2)若a等于b,返回0。

3)若a大于b,则返回一个小于0的值。

例:按照数值进行排序

 

 

 

 

3.结合text这段结构,谈谈innerHTML outerHTML innerText之间的区别。

 

innerHTML:对象里面的HTML内容,这里是text

outerHTML:对象里面包括对象本身的HTML内容,这里是text

innerText:对象里面的文本内容,这里是text

 

4.说几条XHTML规范的内容。

 

1)标签名必须用小写字母。

2)所有标签都必须被关闭,包括空标签。

3)属性值必须加引号。

4)用Id属性代替name属性。

5)所有XHTML文档必须进行文件类型声明。

 

5.对Web标准化(或网站重构)知道哪些相关知识,简述几条你知道的Web标准?

 

为什么要使用web标准?

1)具有更好的兼容性。

2)易于代码维护和开发。

3)可增加网站的访问量。

4)标准的web文档更易被转换为其他格式。

5)更易被搜索引擎访问,也更易被准确索引。

6)更易被JavaScript和DOM代码访问。

 

W3C标准:HTML、XHTML、CSS、XML、XSL、DOM。

 

6.完成foo()函数的内容,要求能够弹出对话框提示当前选中的是第几个单选框。

 

   

   

   

   

   

   

   

   

 

7.填充注释部分的函数体,使得foo()函数调用弹出“成功”的对话框。代码应尽量简短。

 

 

   

   

 

 

 

8.下面代码:

求:y、z、s的值。

 

答案:undefined、undefined、NaN。两个add函数都没有返回值,所以是undefined,两个undefined相加自然是NaN。

 

9.下面代码:

 

求:y、z、s的值。

 

 

答案:4,4,8。直接通过function声明的函数,后面定义的会影响前面的。

通过var声明的函数,后面定义的不会影响前面的:

通过function定义的函数,后面定义的,照旧影响前面的引用,但是不能改变通过var声明函数后的引用,反而,通过var声明的函数,改变了后来通过声明函数之后的引用。

 

10.下面的输出结果为:

 

typeof(NaN) //number

typeof(Infinity) //number

typeof(null) //object

typeof(undefined) //undefined

 

NaN == NaN //false

NaN != NaN //true

NaN >= NaN //false

 

null == undefined //true

null >= undefined //false

null <=undefined //false

 

parseInt("123abc") //123

"123abc" - 0 //NaN

 

Infinity > 10 //true

Infinity == NaN //false

Infinity > "abc" //false

 

true == 1 //true

new String("abc") == "abc" //true

new String("abc") === "abc" //false

 

 

var a = "123abc";

alert(typeof(a++)); //number

alert(a); //NaN

 

 

 

var a = "123abc";

a.valueOf = function(){return parseInt(a);}

a.toString = function(){return parseInt(a);}

alert(++a); //NaN

alert(a-0); //NaN

 

 

 

var a = new Object();

a.toString = function(){return "123abc";}

a.valueOf = function(){return parseInt(a);}

alert(++a); //124

alert(a-0); //124

 

 

 

String.prototype.valueOf = function()

{

return parseFloat(this);

}

alert("123abc" > 122); //false

alert(new String("123abc") > 122); //true

 

 

 

var s = new String("abc");

alert(typeof(s) == typeof("abc")); //false typeof(s) == object 而typeof("abc")==string

alert(s === "abc"); //false

alert(s.toString() == s); //true

 


你可能感兴趣的:(JavaScript)