js常见题目

来源：互联网发布：ico转换软件编辑：程序博客网时间：2024/06/10 02:36

原生JavaScript面试题

1. 放在HTML里的哪一部分javascript会在页面加载的时候被执行了?( )

A .文件头部位置 B.文件尾 C.<head>标签部分 D.<body>标签部分

2. 在以下的HTML中，哪个是外部样式或js文件的正确引用方法？（）

A、<style src=”mystyle.css”>

B、<link type=”text/css” rel=”stylesheet” src=” mystyle.css”/>

C、@import url(myscript.js);

D、<script type=”text/javascript” src=”myscript.js”></script>

3. 声明一个变量,给它加上name属性和show方法显示其name的值,以下代码正确的是()

A、var obj={name:”zhangsan”,show: “alert(this.name);”};

B、var obj={name:”zhangsan”,show:function(){alert(name);}};

C、var obj={name:”zhangsan”,show:function(){alert(this.name);}};

D、var obj=[name:”zhangsan”,show:function(){alert(name);}];

4. 下列代码的执行结果是（）

var i = 12;

var sum =i++ + ++i + ++i*2 + i-- + i--;

document.write(sum + " " + i);

A. 85 13 B. 84 12 C. 83 11 D. 85 14

5. 下列代码的执行结果是（）

document.write(parseInt(null) + Number(null) + "1"); NaN 0 1

NaN B. 0NaN1 C. 01 D. NaN1

6. 分析下面的js代码块

var a=new Array(2,4,4,5,6);

var sum=0;

for(var i=0;i<a.length;i++)

sum+=a[i];

document.write(sum); 输出的结果是（）

A、21 B、24456 C、2,4,4,5,6 D、19

7. 请选择结果为真的表达式（）

A、null instanceof Object B、null==undefined

C、null===undefined D、NaN==NaN

8. 在js里，下列选项中不属于数组方法的是（）

A、sort()B、length() C、concat() D、reverse()

9. var emp=new Array(3); For(var i in emp) 以下代码中能与for循环代码互换的是（）

A、for(var i=0;i<emp;i++)

B、for(var i=0;i<Array(3);i++)

C、for(var i=0;i<emp.length();i++)

D、for(var i=0;i<emp.length;i++)

10. 如要将各项成绩之和放到总分框中，关键的JavaScript代码应该是？（）

A、zongfen.value = yuwen.value + shuxue.value

B、document.form1.zhongfen.value = document.form1.yuwen.value + document.form1.shuxue.value

C、document.form[1].zhongfen.value = document.from[1].yuwen.value + document.form[1].shuxue.value

D、document.zhongfen.value = document.yuwen.value + document.shuxue.value

11. javascript中表达式parseInt(“8x8”)+parseFloat(“8”)的结果是什么？（）8 8

A、88 B、96 C、16 D、8X88

12. 在表单（form1）中有一个文本框元素（fname），用于输入电话号码，格式如：010-82668155，要求前3位是010紧接着一个“-”，后面是8位数字，要求在提交表单时，根据上述条件验证该文本框中输入内容的有效性，下列语句中，（）能正确实现以上功能

A、var str = form1.fname.value;

if(str.substr(0,4)!=”010-” &&str.substr(4).length!=8 && isNaN(parseFloat(str.substr(4)))) alert(“无效的电话号码“)；

B、var str = form1.fname.value;

if(str.substr(0,4)!=”010-” || str.substr(4).length!=8 || isNaN(parseFloat(str.substr(4)))) alert(“无效的电话号码“)；

C、var str = form1.fname.value;

if(str.substr(0,3)!=”010-” || str.substr(3).length!=8 || isNaN(parseFloat(str.substr(3)))) alert(“无效的电话号码“)；

D、var str = form1.fname.value;

if(str.substr(0,3)!=”010-” && str.substr(3).length!=8 && isNaN(parseFloat(str.substr(3)))) alert(“无效的电话号码“)；

13. 下列JS可以让一个input的背景变成红色的是？（）

A、inputElement.style.backgroundColor=”red”;

B、inputElement.backgroundColor=”red”;

C、inputElement.style.backgroundColor=”#0000”;

D、inputElement.backgroundColor=”#0000”;

14. 页面有一个按钮button，id为button1，通过原生js如何禁用？(多选)

A、document.getElementById(“button1”).readonly = true;

B、document.getElementById(“button1”).setAttribute(“readonly”,”true”);

C、document.getElementById(“button1”).disabled = true;

D、document.getElementById(“button1”).setAttribute(“disabled”,”true”);

15. 下面有关javaScript中call和apply的描述，错误的是？（）

A、call与apply都属于Function.prototype的一个方法，所以每个Function实例都有call，apply属性

B、两者传递的参数不同，call函数第一个参数都是要输入给当前对象的对象，apply不是

C、Apply传入的是一个参数数组，也就是将多个参数组合成为一个数组传入

D、Call传入的则是直接的参数列表。Call方法可将一个函数的对象上下文从初始的上下文改变为由thisObj制定的新对象

16. 创建一个对象obj，该对象包含一个名为”name”的属性，其值为”value”.以下哪一段JavaScript代码无法得到上述的结果？（单选）

A、var obj = new Object();

obj[“name”]=”value”;

B、var obj ={name:”value”};

C、var obj = new function(){

This.name = “value”;

}

D、var obj = new Object();

obj.prototype.name = “value”;

17. 正则表达式匹配，开头为“010-”，后面是7-8个数字的电话号码。

function isPhone(num){

var validPhone = ____ /^010-(\d{7}|\d{8})$/______

var flag = num.match(validPhone)?true:false;

return flag

}

18. 请写出下面代码运行后的结果

var obj = {a:1,b:function(){console.log(this.a)}}

var a = 2;var objb = obj.b;

obj.b();

objb();

obj.b.call(window);

_1，2，2__

19. 判断浏览器类型及设备的属性是_window.navigator.userAgent_

20. 解释一下alert(Function instanceof Object);和alert(Object instanceof Function);的结果。

Function 本身就没是一个对象；

Object 本身就是一个构造函数；

21. 写一段脚本，实现：当页面上任意一个链接被点击的时候，alert出这个链接在页面上的顺序号，如第一个链接则alert(1),依次类推。

for(var i = 0; i < document.getElementsByTagName('input').length; i++){

document.getElementsByTagName('input')[i].onclick = (function(n){

return function(){console.log(n+1);}

})(i);

}

22. 以下代码输出什么，为什么？(function(){var a=b=5;})();console.log(b);

23. 创建”内置”方法：给String对象定义一个repeatify方法，该方法接收一个整数参数，作为字符串重复的次数，最后返回重复指定次数的字符串。

String.prototype.repeatify = function(n){

if(!n || n < 2){

return null;

}

var _map = {};

for(var x = 0; x < this.length; x++){

for(var y = x + 1; y <= this.length; y++){

var _r = this.toString().substring(x, y);

if(_map[_r] != null){

_map[_r]++;

} else{

_map[_r] = 1;

}

for(var _m in _map){

if(_map[_m] == n){

console.log(_m);

}

var str = 'abcdefgg';

str.repeatify(2);

24. 请简述javascript中如何避免全局变量污染？请给出简短的代码片段。

利用匿名函数自执行的方式避免全局变量污染

(function(){

//这里的变量不会污染全局命名空间

})()

25. 已定义类SuperType如下，现在需要通过继承的方式定义SuperType的子类SubType，同时要求为SubType新增一个属性age，新增一个方法sayAge，请给出类SubType的实现。

function SubType(){

SuperType.apply(this,arguments)

this.age = ‘xxx’

}

SubType.prototype = Object.create(SuperType.prototype);

SubType.prototype.sayAge = function(){}

26. 请简述setTimeout在web UI开发中的作用，以及如何使用setTimeout模拟setInterval。

setTimeout在web UI开发中可以在指定时间内控制DOM 节点的状态

var timeout = function(callback){

callback();

window.setTimeout(timeout(callback),1000);

}

timeout (function(){

console.log(1);

});

27. 请为字符串增加trinerse函数，实现将字符串中数字删除后将剩余字符串逆序。

String.prototype.trinerse = function(){

var _str = this.toString();

_str = _str.replace(/\d+/g, '');

var _array = _str.split('');

_array.reverse();

return _array.join('');

}

28. 写一个函数：统计从1到10亿之间的自然数中含有多少个2？例如1-20中，有2,12,20这三个自然数，有3个2。

function count(n){

var _count = 0; //定义初始个数

for(var i = 1; i <= n; i++) { //从1到400

if(i.toString().indexOf('2') > -1){

_count++;

}

return _count;

}

29. 常见的排序都有那些？写出一种你常用的排序方法。

1.快速排序法

2.冒泡排序

3.插入排序

4.选择排序

常用的排序为第一种

function quickSort(a) {

if (a.length <= 1) {

return a;

}

var midLength = Math.floor(a.length / 2);

var midValue = a.splice(midLength,1);

var left = [];

var right = [];

for (var i = 0; i < a.length; i++) {

if (a[i] < midValue) {

left.push(a[i]);

} else {

right.push(a[i]);

}

return quickSort(left).concat(midValue,quickSort(right));

}

console.log(quickSort([1,5,3,6,2,4,0]));

30. 写出下面代码的结果
foo() //? foo
function foo(){

Console.log(‘foo’) ;

  }
  -----------------------------
  var foo = function bar(){
    console.log(‘foo’);

  }
  foo(); //? foo
  bar(); //? 报错

31. 请描述以下两段代码在1000ms内共执行了多少次，并且描述setTimeout与setInterval的运行机制

setTimeout (function(){

setTimeout(argument.callee,100);

/*代码块，执行时间150ms*/

},100)
setInterval(function(){

/*代码块，执行时间150ms*/

},100)

32. 请写出下面代码执行后的结果

var a = 100;

function testResult(){

var b = 2 * a;

var a = 200;

var c = a/2;

alert(b);

alert(c)

}

答案：NaN 100

33. 请写出下面代码执行的结果

代码1：

for(var i=1;i<=5;i++){

setTimeout(function timer(){

console.log(j)

},j*1000)

}

结果：undefined

代码2：

for(var i=1;i<=5;i++){

(function(j){

setTimeout(function timer(){

console.log(j);

},j*1000);

})(i);

}

结果：1 2 3 4 5

代码3：

function foo(num){

console.log("foo:"+num);

this.count++;

}

foo.count=0;

var i;

for(i=0;i<10;i++){

if(i>5){

foo.call(foo,i);

}

console.log(foo.count)

结果：foo:6 foo:7 foo:8 foo:9

34. 请写出下面代码执行后的结果：

var a=100;

function testResult(){

var b=2*a;

var a=200;

var c=a/2;

alert(b);

alert(c);

}

testResult();

答案：NaN 100

35. for..of和for..in的区别？

for in 语法遍历一个对象的可枚举属性for按设置的条件循环执行包含的语句块

36. 完成一个函数，接受数组作为参数，数组元素为整数或者数组，数组元素包含整数或数组，函数返回扁平化后的数组，如：[1,[2,[[3,4],5],6]] = > [1,2,3,4,5,6]

function reArray(_array){

var result = [];

for(var i = 0; i < _array.length; i++){

if(_array[i] instanceof Array){

result = result.concat(reArray(_array[i]));

} else{

result.push(_array[i]);

}

return result;

}

37. 下面代码运行的结果是什么？

function printing(){

console.log(1)

setTimeout(function(){console.log(2);},1000);

setTimeout(function(){console.log(3);}，0)；

console.log(4)

}

printing();

1，4，3，2

38. 请问控制台上回输出什么？

(function(){var a = b = 5})()

console.log(b)

39. 什么是闭包，闭包的作用？

闭包可以理解为在函数外部改变函数内部的值；

闭包可以实现匿名自执行函数和实现继承等。

40. 有一个数组[3,4,1,2,5,6,6,5,4,3,3]请用javascript写一个函数，找出该数组中没有重复的数的总和。（上面的数据的没有重复的总和为1+2=3）

function count(_array){

var _duplicated = [];

_array.sort();

for(var i = 0; i < _array.length; i++){

if(_duplicated.indexOf(_array[i]) < 0 && _array[i] == _array[i + 1]){

_duplicated.push(_array[i]);

}

var _result = 0;

for(var i = 0; i < _array.length; i++){

if(_duplicated.indexOf(_array[i]) < 0){

_result += _array[i];

}

return _result;

}

41. 实现id为div的元素以每秒20px的速度右移100px，并且20px和100px可以调整。

function move(_speed, _moveTager){

var element = document.getElementById('div');

element.timer = window.setInterval(function(){

var left = element.offsetLeft;

element.style.left = left + _speed + 'px';

if(element.offsetLeft >= _moveTager){

window.clearInterval(element.timer);

element.timer = null;

}

}, 1000);

}

42. 从0-99这100个数中随机取出10个，要求不能有重复，可以自己设计数据结构。

var randoms=[];

while(true){

var num = parseInt(Math.random() * 100) + 1;

if(randoms.indexOf(num) < 0){

randoms.push(num);

}

if(randoms.length >= 10){

break;

}

console.log(randoms);

43. 跨域是什么？有什么常用的解决方法。

跨域是指通过js在不同的域之间进行数据传输或通信。

通常会用 JSOP 来实现跨域。

1. 以下代码alert出来是多少？

alert(1&&2);

alert(1||2);

1 && 2 : 2;

1 || 2 : 1;

js中&&和 || 遵循”短路”原理, 在||中只要遇到true的分项就停止处理,并返回该分项而在&&中遇到false的分项就停止处理,并返回改分项如果没有遇到false 则返回最后分项

2. 验证字符串的组成规则，第一个需为数字，后面可以是字母、数字，下划线总长度为3~50位。

/^[0-9]\w{3,50}$/

3. 以下代码alert出来的值是多少?

window.val = 1;

var json = {

val:10,

dbl:function(){

this.val+=2;

}

};

json.dbl();

var del = json.dbl;

dbl();

json.dbl.call(window);

alert(window.val+json.val);

报错 dbl is not defind();

dbl();直接执行的时候,意思是指在window对象下的方法可是dbl既没有声明也没有function 因此汇报 dbl is not defind();

4. 以下代码alert出来的值是多少?

(function(){

var val = 1;

var json = {

val:10,

dbl:function(){

val*=2

};

json.dbl();

alert(json.val+val);

}());

存在语法错误,在声明json对象的时候对象内的属性值dbl之后不应接;倘若去掉;则值为12,按照作用域链寻找规则dbl方法内的val从内而外,寻找最近作用域内的val 为自运行函数内的val声明则为 1 * 2 最后结果为10 + 2 结果12

5. 以下代码alert的值

function C1(name){

if(name) this.name=name

}

function C2(name){

this.name=name

}

function C3(name){

this.name=name||"John"

}

C1.prototype.name='Tom';

C2.prototype.name='Tom';

C3.prototype.name='Tom';

alert((new C1().name)+(new C2().name)+(new C3().name))

C1函数的构造方法当中有if判断new的时候没有传参则值不会变依然为字符串”Tom”

C2函数构造方法在new的时候没有传参,参数值为undefined则c2的name值为undefined

C3函数的构造方法中,name赋值过程有||符按照短路原理第一个分项的值为undefined 相当于false跳过,继续匹配而第二个分项的值为有值的字符串返回第二个分项所以name值为”John”

最后在alert中进行字符串拼接输出结果为 TomundefinedJohn

6. 以下代码，alert出的值是多少?

var test=(function(i){

return function(){

alert(i+2)

}

}(2));

test(5);

值为4 ;

变量test 后面赋值的最外层实际上是一个自运行函数函数内return一个方法

最后test实际上是一个不接收参数的函数只是该函数是接收的函数内部return出来的函数故可以访问自运行函数传进来的参数i即 2 最后结果为 2 + 2 结果为4 典型的闭包结构

7. 写一段代码，让id为seconds的容器里面的数字每秒少一，一直变到0

var secDom = document.getElementById(‘seconds’);

var timeObj = setInterval(function(){

var num = secDom.innerHTML*1;

if(num != 0){

secDom.innerHTML = — num;

}else{

clearInterval(timeObj);

}

},1000);

8. 请写出以下输出结果

var Foo=function(){};

var foo=new Foo();

delete Foo.prototype

Foo.prototype.aaa=function(){alert("原型方法aaa")};

Foo.prototype={

"aaa":function(){alert("重写的aaa")},

"bbb":function(){alert("重写的bbb")}

}

foo.aaa();// 原型方法aaa

var foo2=new Foo();

foo2.aaa();// 重写的aaa

foo.constructor===Foo;//true

foo2.constructor===Foo;//false

foo2.constructor===Object;//true

Foo.prototype={

"constructor":Foo,

"aaa":function(){alert("第二次重写的aaa")},

"bbb":function(){alert("第二人重写的bbb")}

}

var foo3=new Foo();

foo3.aaa();//第二次重写的aaa

foo.constructor===Foo;//true

foo2.constructor===Foo;//false

foo3.constructor===Foo;//ture

9. 编写一个方法去掉一个数组的重复元素

Array.prototype.unique2 = function(){

this.sort(); //先排序

var res = [this[0]];

for(var i = 1; i < this.length; i++){

if(this[i] !== res[res.length - 1]){

res.push(this[i]);

}

return res;

}

var arr = [1, 'a', 'a', 'b', 'd', 'e', 'e', 1, 0]

alert(arr.unique2());

10. 简答

Is ‘false’is false?

Is ‘ ‘ is false?

What is typeof []?

object

What is the value of‘6’+9

What is the value of 4+3+2+’1’

What is the value of ‘1’+2+4

124

11. 已知 arr1 = [‘a’,’b’,'c','d'],arr2=['x','b','c','y'],用js取两个数组相同的元素

var newList = [];

for(var i = 0; i < arr1; i++){

for(var j = 0; j < arr2; j ++){

if(arr1[i] == arr2[j]){

newList.push(arr1[i]);

}

12. 用正则表达式将下面字符串中的html标签去除

var text = “<span style='dispaly:none;'>This is test</span><img src=‘’>ss</img><strong></strong>

”

var reg = />([^<]*)/ig;

var result = reg.exec();

var text = “”;

while(result == null){

text += result[1];

result = reg.exec();

}

console.log(text);

13. JS是什么，JS和HTML的开发如何结合？

JavaScript一种直译式脚本语言，是一种动态类型、弱类型、基于原型的语言，内置支持类型。它的解释器被称为JavaScript引擎，为浏览器的一部分，广泛用于客户端的脚本语言，最早是在HTML（标准通用标记语言下的一个应用）网页上使用，用来给HTML网页增加动态功能。

通过在<script></script>标签中使用或者<script src=“XX.js”></script>引入

14. 怎样添加，移除，移动，复制，创建，查找节点？

（1）创建新节点

createDocumentFragment() //创建一个DOM片段

createElement() //创建一个具体的元素

createTextNode() //创建一个文本节点

（2）添加、移除、替换、插入

appendChild()

removeChild()

replaceChild()

insertBefore()

（3）查找

getElementsByTagName() //通过标签名称

getElementsByName() //通过元素的Name属性的值

getElementById() //通过元素Id，唯一性

1.创建元素节点

document.createElement() 方法用于创建元素，接受一个参数，即要创建元素的标签名，返回创建的元素节点

1 var div = document.createElement("div"); //创建一个div元素

2 div.id = "myDiv"; //设置div的id

3 div.className = "box"; //设置div的class

创建元素后还要把元素添加到文档树中

2.添加元素节点

appendChild() 方法用于向childNodes列表的末尾添加一个节点，返回要添加的元素节点

1 var ul = document.getElementByIdx("myList"); //获得ul

2 var li = document.createElement("li"); //创建li

3 li.innerHTML = "项目四"; //向li内添加文本

4 ul.appendChild(li); //把li添加到ul子节点的末尾

appendChild() 方法还可以添加已经存在的元素，会将元素从原来的位置移到新的位置

1 var ul = document.getElementById("myList"); //获得ul

2 ul.appendChild(ul.firstChild); //把ul的第一个元素节点移到ul子节点的末尾

insertBefore() 方法，如果不是在末尾插入节点，而是想放在特定的位置上，用这个方法，该方法接受2个参数，第一个是要插入的节点，第二个是参照节点，返回要添加的元素节点

1 var ul = document.getElementById("myList"); //获得ul

2 var li = document.createElement("li"); //创建li

3 li.innerHTML= "项目四"; //向li内添加文本

4 ul.insertBefore(li,ul.firstChild); //把li添加到ul的第一个子节点前

1 var ul = document.getElementById("myList"); //获得ul

2 var li = document.createElement("li"); //创建li

3 li.innerHTML= "项目四"; //向li内添加文本

4 ul.insertBefore(li,ul.lastChild); //把li添加到ul的最后一个子节点（包括文本节点）之前

1 var ul = document.getElementById("myList"); //获得ul

2 var li = document.createElement("li"); //创建li

3 li.innerHTML= "项目四"; //向li内添加文本

4 var lis = ul.getElementsByTagName("li") //获取ul中所有li的集合

5 ul.insertBefore(li,lis[1]); //把li添加到ul中的第二个li节点前

添加后:

3.移除元素节点

removeChild() 方法，用于移除节点，接受一个参数，即要移除的节点，返回被移除的节点，注意被移除的节点仍然在文档中，不过文档中已没有其位置了

1 var ul = document.getElementById("myList"); //获得ul

2 var fromFirstChild = ul.removeChild(ul.firstChild); //移除ul第一个子节点

1 var ul = document.getElementById("myList"); //获得ul

2 var lis = ul.getElementsByTagName("li") //获取ul中所有li的集合

3 ul.removeChild(lis[0]); //移除第一个li，与上面不同，要考虑浏览器之间的差异

4.替换元素节点

replaceChild() 方法，用于替换节点，接受两个参数，第一参数是要插入的节点，第二个是要替换的节点，返回被替换的节点

1 var ul = document.getElementById("myList"); //获得ul

2 var fromFirstChild = ul.replaceChild(ul.firstChild); //替换ul第一个子节点

1 var ul = document.getElementById("myList"); //获得ul;

2 var li = document.createElement("li"); //创建li

3 li.innerHTML= "项目四"; //向li内添加文本

4 var lis = ul.getElementsByTagName("li") //获取ul中所有li的集合

5 var returnNode = ul.replaceChild(li,lis[1]); //用创建的li替换原来的第二个li

5.复制节点

cloneNode() 方法，用于复制节点，接受一个布尔值参数， true 表示深复制（复制节点及其所有子节点），false 表示浅复制（复制节点本身，不复制子节点）

1 var ul = document.getElementById("myList"); //获得ul

2 var deepList = ul.cloneNode(true); //深复制

3 var shallowList = ul.cloneNode(false); //浅复制

15. 截取字符串abcdefg中的efg?

str = “abcdefg”

str.substr(-1,3);

16. 写出程序的运行结果。

for(i=0,j=0;i<10,j<6;i++,j++){

k=i+j

}

k == 10

17. 实现一个遍历数组或者对象里所有成员的迭代器。

for(var i in obj){

console.log(obj[i]);

}

18. 写出三个javascript中使用this关键字的典型应用场景,谈谈对This对象的理解

情况一：纯粹的函数调用

这是函数的最通常用法，属于全局性调用，因此this就代表全局对象Global。

请看下面这段代码，它的运行结果是1。

复制代码代码如下:

function test(){

this.x = 1;

alert(this.x);

}

test(); // 1

为了证明this就是全局对象，我对代码做一些改变：

复制代码代码如下:

var x = 1;

function test(){

alert(this.x);

}

test(); // 1

运行结果还是1。再变一下：

复制代码代码如下:

var x = 1;

function test(){

this.x = 0;

}

test();

alert(x); //0

情况二：作为对象方法的调用

函数还可以作为某个对象的方法调用，这时this就指这个上级对象。

复制代码代码如下:

function test(){

alert(this.x);

}

var o = {};

o.x = 1;

o.m = test;

o.m(); // 1

情况三作为构造函数调用

所谓构造函数，就是通过这个函数生成一个新对象（object）。这时，this就指这个新对象。

复制代码代码如下:

function test(){

this.x = 1;

}

var o = new test();

alert(o.x); // 1

运行结果为1。为了表明这时this不是全局对象，我对代码做一些改变：

复制代码代码如下:

var x = 2;

function test(){

this.x = 1;

}

var o = new test();

alert(x); //2

运行结果为2，表明全局变量x的值根本没变。

情况四 apply调用

apply()是函数对象的一个方法，它的作用是改变函数的调用对象，它的第一个参数就表示改变后的调用这个函数的对象。因此，this指的就是这第一个参数。

复制代码代码如下:

var x = 0;

function test(){

alert(this.x);

}

var o={};

o.x = 1;

o.m = test;

o.m.apply(); //0

apply()的参数为空时，默认调用全局对象。因此，这时的运行结果为0，证明this指的是全局对象。

19. 写一段JS代码：判断字符串是否是这样组成的，第一个必须是字母，后面可以是字母、数字、下划线、总长度为5-20

var text = “abc”;

var reg = /^[a-zA-Z]\w{5,20}$/;

reg.test(text);

20. Javascript中callee和caller的作用？

callee是对象的一个属性，该属性是一个指针，指向参数arguments对象的函数

caller是函数对象的一个属性，该属性保存着调用当前函数的函数的引用（指向当前函数的直接父函数）

返回一个对函数的引用，该函数调用了当前函数。

注意：

对于函数来说，caller属性只有在函数执行时才有定义。如果函数是由 Javascript程序的顶层调用的，那么 caller包含的就是 null。

21. 前端页面有那三层构成，分别是什么？作用是什么？

分成：结构层、表示层、行为层。

结构层（structural layer）

由 HTML或 XHTML之类的标记语言负责创建。标签，也就是那些出现在尖括号里的单词，对网页内容的语义含义做出了描述，但这些标签不包含任何关于如何显示有关内容的信息。例如，P标签表达了这样一种语义：“这是一个文本段。”

表示层（presentation layer）

由 CSS负责创建。 CSS对“如何显示有关内容”的问题做出了回答。

行为层（behaviorlayer）

负责回答“内容应该如何对事件做出反应”这一问题。这是Javascript 语言和DOM主宰的领域。

22. 前端页面由哪三层构成，分别是什么作用？

同上

23. JS语句var a1=10;var a2=20;alert(“a1+a2=”a1+a2) (D )

A、a1+a2=30 B、a1+a2=1020 C、a1+a2=a1+a2 D、显示错误

24. 将字符串s中的所有字母变为小写字母的方法（B）

A、s.toSmallCase() B、s.toLowerCase() C、s.toUpperCase() D、s.toUpperCase()

25. 以下（B）表达式产生一个0-7之间（含0.7）的随机整数

A、Math.floor(Math.random()*6)

B、Math.floor(Math.random()*7)

C、Math.floor(Math.random()*8)

D、Math.ceil(Math.random()*8)

26. 什么是JavaScripts原型、原型链?有什么特点?

在JavaScript中,一共有两种类型的值,原始值和对象值.每个对象都有一个内部属性[[prototype]],我们通常称之为原型.原型的值可以是一个对象,也可以是null.如果它的值是一个对象,则这个对象也一定有自己的原型.这样就形成了一条线性的链,我们称之为原型链.

访问一个对象的原型可以使用ES5中的Object.getPrototypeOf方法,或者ES6中的__proto__属性.

原型链的作用是用来实现继承,比如我们新建一个数组,数组的方法就是从数组的原型上继承而来的.

var arr = [];

arr.map === Array.prototype.map //arr.map是从arr.__proto__上继承下来的,arr.__proto__也就是Array.prototype

图形化原型链

虽然我们都说原型链,但实际上,在不考虑网页中frame的情况,js引擎在执行期间的某一时刻,所有存在的对象组成的是一棵原型树.默认情况下,只有一棵树.根节点可以说是Object.prototype,也可以说是null.

但我们可以再建立一棵原型树,通过使用Object.create方法

var foo = Object.create(null); //foo是一个对象,但它是游离的,不属于已有的那棵原型树

var bar = Object.create(foo); //bar的原型是foo

var baz = Object.create(foo); //baz的原型是foo

这样我们有了第二棵原型树

遍历原型链

我们没有办法遍历到所有以某个对象为原型的对象,但我们可以向上遍历,获取到一个对象所有的上层原型,这个原型链必定是线性的,尽头是null.

function getPrototypeChain(object) {

var protoChain = [];

while (object = object.__proto__) {

protoChain.push(object);

}

protoChain.push(null);

return protoChain;

}

试验一下,不同的环境实现不同,显示形式也不同.下面是在chrome控制台中的显示.

>getPrototypeChain(new String(""))

[String, Object, null] //依次是String.prototype,Object.prototype,null

>getPrototypeChain(function(){})

内置类型的对象的原型链并不长,下面试试宿主对象.

>getPrototypeChain(document.createElement("div"))

[HTMLDivElement, HTMLElement, Element, Node, Object, null]

这个就长多了.

超长原型链

可以看出来,我们平时使用的对象并没有很长的原型链.但可以自己构造一个.

function Foo() {}

for (var i = 0; i < 100; i++) {

Foo.prototype["foo" + i] = i;

Foo.prototype = new Foo;

}

console.dir(getPrototypeChain(new Foo));

27. 简述 eval的作用

eval() 函数可计算某个字符串，并执行其中的的 JavaScript 代码。

该方法只接受原始字符串作为参数，如果 string参数不是原始字符串，那么该方法将不作任何改变地返回。因此不要为 eval() 函数传递String 对象来作为参数。

如果试图覆盖 eval属性或把 eval()方法赋予另一个属性，并通过该属性调用它，则 ECMAScript实现允许抛出一个 EvalError异常。

28. 写一段代码创建一个对象

var obj = {

name : “小明”,

age : 18

}

29. 什么是事件？IE与火狐的事件机制有何区别？如何阻止冒泡？

JavaScript 使我们有能力创建动态页面。事件是可以被 JavaScript侦测到的行为。

网页中的每个元素都可以产生某些可以触发 JavaScript函数的事件。比方说，我们可以在用户点击某按钮时产生一个 onClick事件来触发某个函数。事件在 HTML页面中定义。

事件举例：

鼠标点击

页面或图像载入

鼠标悬浮于页面的某个热点之上

在表单中选取输入框

确认表单

键盘按键写一个通用的事件侦听函数

区别参考http://www.cnblogs.com/zhangtao/articles/1490432.html

阻止事件冒泡

function stopBubble(e){

if(e&&e.stopPropagation){//非IE

e.stopPropagation();

}

else{//IE

window.event.cancelBubble=true;

}

30. 什么是闭包(closure),为何要使用？

闭包是指有权访问另一个函数作用域中变量的函数，创建闭包的最常见的方式就是在一个函数内创建另一个函数，通过另一个函数访问这个函数的局部变量,利用闭包可以突破作用链域，将函数内部的变量和方法传递到外部。

闭包的特性：

1.函数内再嵌套函数

2.内部函数可以引用外层的参数和变量

3.参数和变量不会被垃圾回收机制回收

31. 如何判断一个对象是否属于某个类？

var obj = new Abc();

alert(obj instanceof Abc);

32. 说说new操作符具体做了什么？

举例: var obj = new Base();

new操作符具体干了三件事情。

一，我们创建了一个空对象obj

二，我们将这个空对象的__proto__成员指向了Base函数对象prototype成员对象

三，我们将Base函数对象的this指针替换成obj，然后再调用Base函数，于是我们就给obj对象赋值了一个id成员变量，这个成员变量的值是”base”

33. 上面代码执行的输出结果

var z = 10;

function foo(){

console.log(z);

}

(function(funArg){

var z = 20

funArg();

})(foo)

34. 上面代码执行后输出什么？

var data = [];

for(var k = 0;k<3;k++){

data[k] = function(){

console.log(k);

};

data[0]()

data[1]()

data[2]()

3 3 3

35. 假设现有一篇文章 var content = “…大量文字”，文章触及到一些敏感词[“习近平”，“周永康”，“中共”，“6.4”]等，如何在文章中发现这些敏感词，并将背景置为红色或改变字体颜色标识出来。

css : .red{

color : red;

}

js : var content = “…大量文字”,

var sen = [“习近平”，“周永康”，“中共”，“6.4”];

for(var i = 0;i < sen.length; i++){

content.replace(sen[i],”<span class=‘red’>”+sen[i]+”</span>”);

}

36. Label标签的作用是?

可以使标签内的区域指向label标签for属性指代的对象的事件。

无label标签:<input id="ye" type="checkbox" /> 文本

有label标签:<label for="ye"><input id="ye" type="checkbox" />

文本</label>

有label标签的这一段，点击标签中的文本，可使多选框聚焦。

37. 已知有字符串foo=”get-element-by-id”,写一个function将其转化成驼峰表示法”。

function combo(msg){

var arr=msg.split("-"); //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(""); //join()加入什么，连接数组元素，返回字符串

return msg;

}

38. 用js/jquery写出数组中去除重复元素的方法（写清大概思路即可，能想到几种写几种）

方法一:

1).构建一个新的数组存放结果

2.)for循环中每次从原数组中取出一个元素，用这个元素循环与结果数组对比

3).若结果数组中没有该元素，则存到结果数组中

方法二:

1).先将原数组进行排序

2).检查原数组中的第i个元素与结果数组中的最后一个元素是否相同，因为已经排序，所以重复元素会在相邻位置

3).如果不相同，则将该元素存入结果数组中

方法三:

1.创建一个新的数组存放结果

2.创建一个空对象

3.for循环时，每次取出一个元素与对象进行对比，如果这个元素不重复，则把它存放到结果数组中，同时把这个元素的内容作为对象的一个属性，并赋值为1，存入到第2步建立的对象中。

说明：至于如何对比，就是每次从原数组中取出一个元素，然后到对象中去访问这个属性，如果能访问到值，则说明重复。

39. 回答下列问题

Function Foo () {

getName = function() { alert (1);};

return this;

}

Foo.getName = function () { alert(2);};

Foo.prototype.getName = function(){alert ( 3 );};

Var getName = function (){alert (4);};

Function getName() {alert (5);}

//请写出以下输出结果：

Foo.getName() //2

getName() //4

new Foo.getName(); //2

new Foo().getName();//3

new new Foo().getName();//3

new Foo().getName();//3

40. 下面代码会输出什么?

var test =(function(a){

this.a=a;

return function(b){

return this.a+b;

}

}(function(a,b){

return a;

}(1,2)))

console.log(test(1));//2

console.log(test(4));//5

41. 请把

<ul>

.......

</ul>

(ul之间有10个li元素)插入body里面，注意：需要考虑到性能问题。

var bodyDom = document.body;

var bHtml = “<ul><li>第一行</li>”;

var list = [‘一’,’二’,’三’…];

for(var i = 0;i < 9; i ++){

bHtml += “<li>第”+list[i+1]+”行</li>”;

}

bHtml += “</ul>”;

bodyDom.innerHtml += bHtml;

42. 有一个长度为100的数组，不适用于for循环自出该数组的前10个元素之和。

0 0