2015年十大热点javascript笔试题你都会么？

2024-05-09 12:18
文章标签 2015 java script 笔试 十大 热点

本文主要是介绍2015年十大热点javascript笔试题你都会么？，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

第一次输出10应该没有问题。我们知道取对象属于除了点操作符还可以用中括号，所以第二次执行时相当于arguments调用方法，this指向arguments，而这里传了两个参数，故输出arguments长度为2。

AD：干货来了,不要等！WOT2015 北京站演讲PPT开放下载！

2015年关于javascript经典笔试题你都会么？

1、考察this 

   
  1. var length = 10; 
  2. function fn() { 
  3.   console.log(this.length); 
  4. } 
  5.  
  6. var obj = { 
  7.   length: 5, 
  8.   method: function(fn) { 
  9.     fn(); 
  10.     arguments[0](); 
  11.   } 
  12. }; 
  13.  
  14. obj.method(fn, 1); 

输出：10 2

第一次输出10应该没有问题。我们知道取对象属于除了点操作符还可以用中括号，所以第二次执行时相当于arguments调用方法，this指向arguments，而这里传了两个参数，故输出arguments长度为2。

2、var和函数的提前声明

   
  1. function fn(a) { 
  2.   console.log(a);  
  3.   var a = 2; 
  4.   function a() {} 
  5.   console.log(a);  
  6. } 
  7.  
  8. fn(1); 

输出：function a() {} 2

我们知道var和function是会提前声明的，而且function是优先于var声明的(如果同时存在的话)，所以提前声明后输出的a是个function，然后代码往下执行a进行重新赋值了，故第二次输出是2。

3、局部变量和全局变量

   
  1. var f = true; 
  2. if (f === true) { 
  3.   var a = 10; 
  4. } 
  5.  
  6. function fn() { 
  7.   var b = 20; 
  8.   c = 30; 
  9. } 
  10.  
  11. fn(); 
  12. console.log(a); 
  13. console.log(b); 
  14. console.log(c); 

输出：10 报错 30

这是个我犯了很久的错误，很长一段时间我都以为{...}内的新声明的变量是局部变量，后来我才发现function内的新声明的变量才是局部变量，而没有用var声明的变量在哪里都是全局变量。再次提醒切记只有function(){}内新声明的才能是局部变量，while{...}、if{...}、for(..) 之内的都是全局变量(除非本身包含在function内)。

4、变量隐式声明 

   
  1. var f = true; 
  2. if (f === true) { 
  3.   var a = 10; 
  4. } 
  5.  
  6. function fn() { 
  7.   var b = 20; 
  8.   c = 30; 
  9. } 
  10.  
  11. fn(); 
  12. console.log(a); 
  13. console.log(b); 
  14. console.log(c); 

答案：10

前面我说过function和var会提前声明，而其实{...}内的变量也会提前声明。于是代码还没执行前，a变量已经被声明，于是 'a' in window 返回true，a被赋值。

5、给基本类型数据添加属性，不报错，但取值时是undefined

   
  1. var a = 10; 
  2. a.pro = 10; 
  3. console.log(a.pro + a); 
  4.  
  5. var s = 'hello'; 
  6. s.pro = 'world'; 
  7. console.log(s.pro + s); 

答案：NaN undefinedhello

给基本类型数据加属性不报错，但是引用的话返回undefined，10+undefined返回NaN，而undefined和string相加时转变成了字符串。

6、函数声明优于变量声明 

   
  1. console.log(typeof fn); 
  2. function fn() {}; 
  3. var fn; 

答案：function

因为函数声明优于变量声明。我们知道在代码逐行执行前，函数声明和变量声明会提前进行，而函数声明又会优于变量声明，这里的优于可以理解为晚于变量声明后，如果函数名和变量名相同，函数声明就能覆盖变量声明。所以以上代码将函数声明和变量声明调换顺序还是一样结果。

7、判断一个字符串中出现次数最多的字符，并统计次数

hash table方式： 

   
  1. var s = 'aaabbbcccaaabbbaaa'; 
  2. var obj = {}; 
  3. var maxn = -1; 
  4. var letter; 
  5. for(var i = 0; i < s.length; i++) { 
  6.   if(obj[s[i]]) { 
  7.     obj[s[i]]++; 
  8.     if(obj[s[i]] > maxn) { 
  9.       maxn = obj[s[i]]; 
  10.       letter = s[i]; 
  11.     } 
  12.   } else { 
  13.     obj[s[i]] = 1; 
  14.     if(obj[s[i]] > maxn) { 
  15.       maxn = obj[s[i]]; 
  16.       letter = s[i]; 
  17.     } 
  18.   } 
  19. } 
  20.  
  21. alert(letter + ': ' + maxn); 

正则方式： 

   
  1. var s = 'aaabbbcccaaabbbaaabbbbbbbbbb'; 
  2. var a = s.split(''); 
  3. a.sort(); 
  4. s = a.join(''); 
  5. var pattern = /(\w)\1*/g; 
  6. var ans = s.match(pattern); 
  7. ans.sort(function(a, b) { 
  8.   return a.length < b.length; 
  9. });; 
  10. console.log(ans[0][0] + ': ' + ans[0].length); 

 8、经典闭包

   
  1. <!-- 实现一段脚本，使得点击对应链接alert出相应的编号 --> 
  2. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
  3. <body> 
  4.   <a href='#'> 第一个链接 </a> </br> 
  5.   <a href='#'> 第二个链接 </a> </br> 
  6.   <a href='#'> 第三个链接 </a> </br> 
  7.   <a href='#'> 第四个链接 </a> </br> 
  8. </body> 

dom污染法：

   
  1. <!-- 实现一段脚本，使得点击对应链接alert出相应的编号 --> 
  2. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
  3. <body> 
  4.   <a href='#'> 第一个链接 </a> </br> 
  5.   <a href='#'> 第二个链接 </a> </br> 
  6.   <a href='#'> 第三个链接 </a> </br> 
  7.   <a href='#'> 第四个链接 </a> </br> 
  8.   <script type="text/javascript"> 
  9.     var lis = document.links; 
  10.     for(var i = 0, length = lis.length; i < length; i++) { 
  11.       lis[i].index = i; 
  12.       lis[i].onclick = function() { 
  13.         alert(this.index); 
  14.       }; 
  15.     } 
  16.   </script> 
  17. </body> 

闭包：

   
  1. <!-- 实现一段脚本，使得点击对应链接alert出相应的编号 --> 
  2. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
  3. <body> 
  4.   <a href='#'> 第一个链接 </a> </br> 
  5.   <a href='#'> 第二个链接 </a> </br> 
  6.   <a href='#'> 第三个链接 </a> </br> 
  7.   <a href='#'> 第四个链接 </a> </br> 
  8.   <script type="text/javascript"> 
  9.     var lis = document.links; 
  10.     for(var i = 0, length = lis.length; i < length; i++) { 
  11.       (function(i) { 
  12.         lis[i].onclick = function() { 
  13.           alert(i + 1); 
  14.         }; 
  15.       })(i);  
  16.     } 
  17.   </script> 
  18. </body> 

9、this

   
  1. function JSClass() { 
  2.   this.m_Text = 'division element'; 
  3.   this.m_Element = document.createElement('div'); 
  4.   this.m_Element.innerHTML = this.m_Text; 
  5.   this.m_Element.addEventListener('click', this.func); 
  6.   // this.m_Element.onclick = this.func; 
  7. } 
  8.  
  9. JSClass.prototype.Render = function() { 
  10.   document.body.appendChild(this.m_Element); 
  11. } 
  12.  
  13. JSClass.prototype.func = function() { 
  14.   alert(this.m_Text); 
  15. }; 
  16.  
  17. var jc = new JSClass(); 
  18. jc.Render();  // add div 
  19. jc.func();  // 输出 division element 
  20. //click添加的div元素division element会输出underfined，为什么？ 

答案：division element undefined

第一次输出很好理解，第二次的话仔细看，this其实已经指向了this.m_Element，因为是this.m_Element调用的addEventListener函数，所以内部的this全指向它了。可以试着加上一行代码this.m_Element.m_Text = 'hello world'，就会alert出hello world了。

10、split

请编写一个JavaScript函数 parseQueryString，它的用途是把URL参数解析为一个对象，如： var url = “http://witmax.cn/index.php?key0=0&key1=1&key2=2″ 

   
  1. function parseQueryString(url) { 
  2.   var obj = {}; 
  3.   var a = url.split('?'); 
  4.   if(a === 1) return obj; 
  5.   var b = a[1].split('&'); 
  6.   for(var i = 0, length = b.length; i < length; i++) { 
  7.     var c = b[i].split('='); 
  8.     obj[c[0]] = c[1]; 
  9.   } 
  10.   return obj; 
  11. } 
  12. var url = 'http://witmax.cn/index.php?key0=0&key1=1&key2=2'; 
  13. var obj = parseQueryString(url); 
  14. console.log(obj.key0, obj.key1, obj.key2);  // 0 1 2 

这篇关于2015年十大热点javascript笔试题你都会么？的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！


http://www.chinasem.cn/article/973388。

相关文章

java设计模式之工厂模式--普通工厂方法模式（Factory Method）

java设计模式之工厂模式--普通工厂方法模式（Factory Method）

1.普通工厂模式，就是建立一个工厂类，对实现了同一接口的一些类进行实例的创建。 2.先定义一个接口： package com.zhong.pattern.factorymethod;/*** 发送接口* @author admin**/public interface Sender {/*** 发送消息方法* @param msg*/void send(String msg);} 3
阅读更多...
Java设计模式之代理模式2-动态代理（jdk实现）

Java设计模式之代理模式2-动态代理（jdk实现）

这篇是接着上一篇继续介绍java设计模式之代理模式。下面讲解的是jdk实现动态代理。 1.）首先我们要声明一个动态代理类，实现InvocationHandler接口 package com.zhong.pattern.proxy;import java.lang.reflect.InvocationHandler;import java.lang.reflect.Method;/*** 演
阅读更多...
java设计模式之代理模式1--静态代理

java设计模式之代理模式1--静态代理

Java编程的目标是实现现实不能完成的，优化现实能够完成的，是一种虚拟技术。生活中的方方面面都可以虚拟到代码中。代理模式所讲的就是现实生活中的这么一个概念：助手。 代理模式的定义：给某一个对象提供一个代理，并由代理对象控制对原对象的引用。 1.）首先新建一个表演的接口 package com.zhong.pattern.proxy;/*** 表演接口* @author admin*
阅读更多...
java原型（Prototype）设计模式

java原型（Prototype）设计模式

原型模式就是讲一个对象作为原型，使用clone()方法来创建新的实例。 public class Prototype implements Cloneable{private String name;public String getName() {return name;}public void setName(String name) {this.name = name;}@Overri
阅读更多...
Java中23种设计模式之适配者模式

Java中23种设计模式之适配者模式

适配器模式的作用就是在原来的类上提供新功能。 主要可分为3种： 1.类适配：创建新类，继承源类，并实现新接口，例如：     class Adapter extends OldClass implements NewFunc{} 2.对象适配：创建新类持源类的实例，并实现新接口，例如：     class Adapter implements NewFunc { priva
阅读更多...
java不依赖临时变量交换两个变量的值

java不依赖临时变量交换两个变量的值

java不依赖临时变量交换两个变量的值 1.简单易懂的实现方式     int a=1,b=2;     int temp = 0;     temp = a;     a = b;     b= temp; 2.算术算法 int a=1,b=2; a = a+b;// a = 1+2  b = a-b;// b = a-b --> b=3-2 -->1 a = a -b;/
阅读更多...
Java中的SOLID原则及示例

Java中的SOLID原则及示例

类是任何Java应用程序的构建块。如果这些区块不强，那么建筑（即应用）将来将面临艰难时期。这实际上意味着，当应用程序范围上升或应用程序在生产或维护中面临某些设计问题时，不那么好的编写会导致非常困难的情况。 另一方面，一组精心设计和编写的类可以加速编码过程的突飞猛进，同时减少错误的数量。 在本教程中，我们将使用 5个最推荐的设计原则的示例来讨论Java中的SOLID原则，在编写类时我们应该记住这
阅读更多...
Java比较和交换示例 - CAS算法

Java比较和交换示例 - CAS算法

Java比较和交换示例 - CAS算法 由Lokesh Gupta | 提起下：多线程 一个Java 5中最好添加的是支持类，如原子操作AtomicInteger，AtomicLong等等。这些课程帮助您最大限度地减少复杂的（非必要）需要多线程的，如增加一些基本的操作代码或递减的值在多个线程之间共享。这些类内部依赖于名为CAS（比较和交换）的算法。在本文中，我将详细讨论这个概念。 1.乐观和
阅读更多...
java并发编程之CyclicBarrier（循环栅栏）

java并发编程之CyclicBarrier（循环栅栏）

package com.zhong;import java.util.concurrent.CyclicBarrier;/*** Cyclic意思是循环，Barrier意思是屏障，那么CyclicBarrier翻译过来就是循环栅栏。* 它是一个同步辅助类，能让一组线程互相等待，* 直到这一组线程都到了一个公共屏障点，各线程才能继续向下执行。因为该屏障能够在释放等待线程后继续重用，所以叫循环屏障。*
阅读更多...
Java内存管理 - 垃圾收集算法

Java内存管理 - 垃圾收集算法

我们都知道Java 中垃圾收集器 [GC] 的功能。但只有少数人试图深入了解垃圾收集的工作原理。你不是其中之一，这就是你在这里的原因。 在这个Java内存管理教程中，我们将尝试了解Java垃圾收集的当前算法，我们将了解这些算法的演变。 目录1. Java中的内存管理2.引用计数机制3.标记和清除机制4.停止并复制GC 5.分代停止和复制6.如何提高Java中的内存利用率 1.
阅读更多...

Copyright China编程 23002807@qq.com

沪ICP备2023033072号-2