2019 前端面试押题卷（2）【初级】

1.把两个数组合并，并删除第二个元素？

var a = [1,2,3]
var b = [4,5,6]
var c= a.concat(b);
c.splice(1, 1);

2.原生javascript怎么创建、添加、移除、替换和查找dom节点？

var a = document.createElement("p");
var b = document.getElementById("my_div");
b.appendChild(a);
b.removeChild(a);
var c = document.createElement("div");
b.replaceChild(c,a);
document.getElementById("id");
document.getElementsByClassName("class");
document.getElementsByTagName("div");

3.javascript同源策略是什么？如何实现跨域请求？JSONP的原理是什么？

JavaScript出于安全方面的考虑，不允许跨域调用其他页面的对象

利用jsonp 方式

利用javascript 的 src 属性允许访问使用不同源的js文件

4.请编写一个JavaScript函数parseQueryString,他的用途是把URL参数解析为一个对象，

如：var url = "http://www.hnfcedu.com/eg?key0=0&key1=1&key2=2";

答：

var url = "http://www.hnfcedu.com/eg?key0=0&key1=1&key2=2";

function parseQueryString(url){
    var index=url.indexOf("?");
    var paraStr=url.substring(index+1);
    var json=eval("({"+paraStr.replace(/=/igm,":\"").replace(/&/igm,"\",")+"\"})");
    console.log(json);
    return json;
}
parseQueryString(url);
// { key0: '0', key1: '1', key2: '2' }

5.如何消除一个数组里面重复的元素？

//数组排序，再比较相邻的值:
var ary = new Array("bbb","cc","dd","bbb");
var nary=ary.sort();
for(var i=0;i<ary.length;i++){
    if (nary[i]==nary[i+1]){
        alert("数组重复内容为:"+nary[i]);
        nary.splice(i,1);
    }
}

6. 定义一个log方法，让他可以带你console.log的方法

console.log = (function(ori){
    return function(str)
    {
        ori.call(console,"hello:"+str);
    }
})(console.log);
console.log("word");

7.在javascript中什么是伪数组？如何将伪数组转化为标准数据组？

能通过Array.prototype.slice转换为真正数组的带有length属性的对象

对于arguments：Array.prototype.slice.call(arguments)

兼容ie8:

function realArray(c){
    try{
        return Array.prototype.slice.call(c);
    }catch(e){
        var ret = [], i =0, len = c.length;
        for(; i<len; i++){
            ret[i] = (c[i]);
        }
        return ret;
    }
}

8. 如何用原生js实现一个对页面某个节点的拖拽

1. 捕获 onmousedown 鼠标按下事件、onmousemove 鼠标移动事件、onmouseup 鼠标抬起事件

2.当mousedown时记下鼠标点击位置离拖拽容器左边沿的距离和上边沿的距离，即tmpX,tmpY；mousemove时通过定位拖拽容器的style.left/style.top，使拖拽容器进行移动，定位到哪里则由刚刚的tmpX/tmpY和当前鼠标所在位置计算得出；mouseup时，结束移动。

9.HTML5中的本地存储有哪些？

localStorage 永久性的本地存储

sessionStorage 会话级别的本地存储

10、已知有字符串foo="get-element-by-id"，写一个function将其转为驼峰表示法"getElementById"。

foo="get-element-by-id";
function test(str){
    var arr=str.split('-');
    for(var i=1;i<arr.length;i++){
        arr[i]=arr[i].charAt(0).toUpperCase()+arr[i].substring(1);
    }
    var result=arr.join('');
    return result;
}
console.log(test(foo));