面试题收藏
1、希望获取到页面中所有的checkbox怎么做？(不使用第三方框架)
var domList = document.getElementsByTagName(‘input’)
var checkBoxList = [];
var len = domList.length;
//缓存到局部变量
while (len--) {
//使用while的效率会比for循环更高
if (domList[len].type == ‘checkbox’) {
checkBoxList.push(domList[len]);
}
}
8.看下列代码输出为何？解释原因。
var a; alert(typeof a); // undefined alert(b); // 报错
解释：Undefined是一个只有一个值的数据类型，这个值就是“undefined”，在使用var声明变量但并未对其赋值进行初始化时，这个变量的值就是undefined。而b由于未声明将报错。注意未申明的变量和声明了未赋值的是不一样的。
var a = null; alert(typeof a); //object
解释：null是一个只有一个值的数据类型，这个值就是null。表示一个空指针对象，所以用typeof检测会返回”object”。
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的值为什么？
var foo = "11"+2-"1"; console.log(foo); console.log(typeof foo); //执行完后foo的值为111，foo的类型为String。
var a = new Object(); a.value = 1; b = a; b.value = 2; alert(a.value); //答案：2（考察引用数据类型细节）
12.已知数组var stringArray = [“This”, “is”, “Baidu”, “Campus”]，Alert出”This is Baidu Campus”。
答案：alert(stringArray.join(“”))
已知有字符串foo=”get-element-by-id”,写一个function将其转化成驼峰表示法”getElementById”。
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;
}
13.var numberArray = [3,6,2,4,1,5]; （考察基础API）
1) 实现对该数组的倒排，输出[5,1,4,2,6,3]
2) 实现对该数组的降序排列，输出[6,5,4,3,2,1]
var nA = [3,6,2,4,1,5];
console.log(nA.reverse());倒排
console.log(nA.sort(function(a,b){return b-a;}));降序
14.输出今天的日期，以YYYY-MM-DD的方式，比如今天是2014年9月26日，则输出2014-09-26
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);
15.将字符串”<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’);
16.为了保证页面输出安全，我们经常需要对一些特殊的字符进行转义，请写一个函数escapeHtml，将<, >, &, “进行转义
function escapeHtml(str) {
return str.replace(/[<>”&]/g, function(match) {
switch (match) {
case “<”:
return “<”;
case “>”:
return “>”;
case “&”:
return “&”;
case “\””:
return “"”;
}
});
}
17.foo = foo||bar ，这行代码是什么意思？为什么要这样写？
答案：if(!foo) foo = bar; //如果foo存在，值不变，否则把bar的值赋给foo。
短路表达式：作为”&&”和”||”操作符的操作数表达式，这些表达式在进行求值时，只要最终的结果已经可以确定是真或假，求值过程便告终止，这称之为短路求值。
-——这个题有意思，在这里解释了一下短路判断
18.看下列代码，将会输出什么?
var foo = 1;
function(){
console.log(foo);
var foo = 2;
console.log(foo);
}
//答案：输出undefined 和 2。
19.用js实现随机选取10–100之间的10个数字，存入一个数组，并排序
var iArray = [];
function getRandom(istart, iend){
var iChoice = -(istart - iend +1);
return Math.floor(Math.random() * iChoice + istart);//Math.floor()是向下取整
}
for(var i=0; i<10; i++){
iArray.push(getRandom(10,100));//循环十次该方法然后push到空数组中
}
iArray.sort();//排序
console.log(iArray);
这个方法才是正确的代码，原来的有点瑕疵。
20.把两个数组合并，并删除第二个元素。
var array1 = ['a','b','c']; var bArray = ['d','e','f']; var cArray = array1.concat(bArray); //连接两个或多个数组 console.log(cArray); cArray.splice(1,1); //splice()方法删除或添加数组中一个或多个元素 cArray.splice(1,0,'3','4') //1 为起始位置 0为删除的个数，设置为0不会删除 '3' '4' 为数组要添加的项目 console.log(cArray);
21.怎样添加、移除、移动、复制、创建和查找节点（原生JS，实在基础，没细写每一步）
1）创建新节点
createDocumentFragment() //创建一个DOM片段
createElement() //创建一个具体的元素
createTextNode() //创建一个文本节点
2）添加、移除、替换、插入
appendChild() //添加
removeChild() //移除
replaceChild() //替换
insertBefore() //插入
3）查找
getElementsByTagName() //通过标签名称
getElementsByName() //通过元素的Name属性的值
getElementById() //通过元素Id，唯一性
22.有这样一个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}。
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;
}
var m = 'http://item.taobao.com/item.htm?a=1&b=2&c=&d=xxx&e';
console.log(serilizeUrl(m)); //Object {a: "1", b: "2", c: "", d: "xxx", e: undefined}
这是一道非常精彩的题目，在网上我又找到了许多其他的人给的方案，更加的严谨：
var getParams = function(url) {
if(url === undefined || typeof(url) != 'string'){
return null;
}
items = url.split('?')[1].split('&');
var json = {};
for(var i=0; i<items.length; i++) {
var item = items[i].split('=');
json[item[0]] = item[1];
}
return json;
}
作者：张若昕
链接：http://www.zhihu.com/question/25003398/answer/29754509
来源：知乎
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。
//其实就是个正则
var getQuery=function(url){
if(typeof url!=='string'){
return null;
}
var query=url.match(/[^\?]+\?([^#]*)/,'$1');
if(!query || !query[1]){
return null;
}
var kv=query[1].split('&');
var map={};
for(var i=0,len=kv.length;i<len;i++){
var result=kv[i].split('=');
var key=result[0],value=result[1];
//将"c="认为key为c，value为null，将"e"认为key为e，value为true
map[key]=value || (typeof value=='string'?null:true);
}
return map;
}
作者：猫爱吃鱼不吃耗子
链接：http://www.zhihu.com/question/25003398/answer/29751159
来源：知乎
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。
var rquery = /^(?:[^?]*\?)?([\w\d\-\/=&%]+)/;
function parseQuery(str, separator) {
var query = String(str).match(rquery),
key,
value;
if (query == null) return hash;
query = query.pop();
separator = separator || '&';
return query.split(separator).reduce(function(hash, pair) {
if (pair.indexOf('=') > 0) {
pair = decodeURIComponent(pair).split('=');
key = pair.shift();
// 如果query中某个变量值包含等号
// 我们应该重新组合起来
value = pair.join('=');
if (value != void 0) {
value = value.replace('+', ' ');
}
} else {
key = decodeURIComponent(pair);
value = void 0;
}
hash[key] = value;
return hash;
}, {});
}
parseQuery('http://item.taobao.com/item.htm?a=1&b=2&c=&d=xxx&e')
; // output: {a: "1", b: "2", c: "", d: "xxx", e: undefined}
作者：周明礼
链接：http://www.zhihu.com/question/25003398/answer/29934613
来源：知乎
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。
var isArray = function (obj) { // 判断对象是否是数组的标准方法
return Object.prototype.toString.call(obj) === "[object Array]";
};
var getParams = function (query) {
var pairs,
map,
params = {};
pairs = query.split('&');
for (var i=0, len=pairs.length; i<len; i++) {
map = pairs[i].split('=');
if (map[0] in params) {
if (isArray(params[map[0]])) { // 第三次或更多插入
params[map[0]].push(map[1]);
} else { // 第二次插入
params[map[0]] = [params[map[0]], map[1]];
}
} else { // 第一次插入
params[map[0]] = map[1];
}
}
return params;
};
var query1 = 'a=1&b=2&c=&d=xxx&e',
query2 = 'a=1',
query3 = 'a=1&a=2',
query4 = 'a=1&a=2&a=3';
console.log(getParams(query1)); // {a: "1", b: "2", c: "", d: "xxx", e: undefined}
console.log(getParams(query2)); // {a: "1"}
console.log(getParams(query3)); // {a: ["1", "2"]}
console.log(getParams(query4)); // {a: ["1", "2", "3"]}
作者：daniel ding
链接：http://www.zhihu.com/question/25003398/answer/29780446
来源：知乎
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。
真是很漂亮，找出来了这么多的方案，嘎嘎
23.正则表达式构造函数var reg=new RegExp(“xxx”)与正则表达字面量var reg=//有什么不同？匹配邮箱的正则表达式？
答案：当使用RegExp()构造函数的时候，不仅需要转义引号（即\”表示”），并且还需要双反斜杠（即\\表示一个\）。使用正则表达字面量的效率更高。
邮箱的正则匹配：
var
regMail = /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+((.[a-zA-Z0-9_-]{2,3}){1,2})$/;
for(var i=1;i<=3;i++){
setTimeout(function(){
console.log(i);
},0);
};
//答案：4 4 4。
//原因：Javascript事件处理器在线程空闲之前不会运行。追问，如何让上述代码输出1 2 3？
for(var i=1;i<=3;i++){
setTimeout((function(a){
//改成立即执行函数
console.log(a);
})(i),0);
};
//1
//输出
//2
//3
我自己的理解：for循环执行的时候，只是执行了setTimeout函数，function(){console.log(i)}只是作为参数被定义了，却没有执行；当function(){console.log(i)}执行的时候i的值是最后的4，因为4不满足i<=3这个条件，for循环停止了，所以i的最后值是4；说的有点乱，希望自己以后看的时候能看明白。
25.写一个function，清除字符串前后的空格。（兼容所有浏览器）
使用自带接口trim()，考虑兼容性：
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"
26.Javascript中callee和caller的作用？
答案：
caller是返回一个对函数的引用，该函数调用了当前函数；
callee是返回正在被执行的function函数，也就是所指定的function对象的正文。
那么问题来了？如果一对兔子每月生一对兔子；一对新生兔，从第二个月起就开始生兔子；假定每对兔子都是一雌一雄，试问一对兔子，第n个月能繁殖成多少对兔子？（使用callee完成）
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];
}
}
}