前端笔试题汇总

这些都是朋友和学生在面试中，公司的一些笔试题，分享出来，为了查看起来更方便。

2019.05.27 北京 笔试题

一、web 开发中会话跟踪的方法有哪些？ 

二、HTTP methods？ 

三、从浏览器地址输入 url 到显示页面的步骤（以http为例）？  

四、如何进行网站性能优化？ 

五、容器包含若干浮动元素时如何清理（包含）浮动？ 

六、css hack 原理及经常使用hack？ 

七、垂直居中的方法？ 

八、重绘和回流（重排）是什么，如何避免？ 

九、PNG，GIF，JPG的区别及如何选？ 

十、JavaScript 跨域通讯？ 

十一、对象到字符串的转换步骤？ 

十二、函数内部的 arguments 变量有哪些特性，有哪些属性，如何将他转换为数组？ 

1三、评价一下三种方法实现继承的的优缺点，并改进。 

1四、focus/blur 与 focusin/focusout 的区别与联系。 

1五、sessionStorage ，localStorage， cookie 区别？ 

1六、JavaScript 有哪几种方法定义函数？ 

1七、什么是闭包，闭包有什么用？ 

1八、let 与 var 的区别，以及 箭头函数 与 function 的区别？  

1九、HTTP 状态码 10一、200、30一、30二、304的具体含义。  

20、什么是防护性编程？与其相对的 let it crash 又是什么？ 

 

笔试题2

一、请写出判断变量类型的几种方法，并谈谈这几种方法的差别或者局限；  

二、请写一下你记得的字符串操做方法，并说一下该方法的做用；  

三、请写一下你记得的数组的操做方法，并简明说明一下该方法的做用； 

四、[1, 2, 3, 4, 5, 2, 3, 4, 2, 3, 4, 2, 3, 4] 数组去重，只要是数组迭代方法，皆可去重，除了数组的迭代方法还有 ES6 的 set 数据结构； 

五、原生实现一个 ES5 的 bind( ) 

六、简述一下 src 与 href 的区别； 

七、sessionStorage、localStorage 和 cookie 之间的区别； 

八、简述 Ajax 工做原理； 

九、简述一下浏览器的渲染流程；  

十、设想如下场景：公司有个项目，该项目须要作成单页应用，此时在不使用其余框架的状况下，说一下你该如何实现这个单页应用； 

十一、简单说一下 vue 的双向绑定原理； 

十二、简单说一下对于 node 的了解，了解其中的哪些模块，哪些方法，或是其余； 

1三、继承的方式； 

1四、经常使用跨域方式； 

1五、请写出几个经典的 this 使用场景 

1六、如何理解闭包？使用闭包时的注意点有哪些？ 

1七、谈一谈你所了解到的垃圾回收机制； 

1八、let、const、var 有什么区别？ 

1九、怎样添加，移除，移动，建立，复制，查找 DOM 节点？

笔试题3

一、输出结果

console.log(Number(true))//1   
console.log(Number(null))//0      
console.log(Number(undefined))//NaN    
console.log(typeof NaN)//number
console.log(0.1 + 0.2 == 0.3, 0.5 + 0.1 == 0.6);//false true      
console.log(true == 1);//true      
console.log(true === 1);//false复制代码

 二、写出 JS 中的数据类型 

 三、请把如下对象变为数组； var data = [a: 1, b: 2, c: 3] 

 四、请写出如下结果 

fn (); //2
function fn () {
    console.log(1)
};
fn() //2
var fn = 10;
fn (); //Uncaught TypeError: fn is not a function 到这里，程序终止，不往下执行了
function fn() {
    console.log(2)
};
fn(); 复制代码

五、请自选一种方法来实现 fn(1)(2) == 3 的方法； 

六、请写出下面的输出结果，最好说明一下缘由； 

function Fn() {
    var num = 10;
    this.x =100;
    this.getx = function () {
        console.log(x)
    }
}
var f1 = new Fn;
console.log(f1.num);//undefined
console.log(num);//Uncaught ReferenceError: num is not defined，到这里，程序终止，不往下执行了
console.log(f1.getx);复制代码

七、请简述一下 JS 绑定事件的方法，这些方法与 live 有什么不一样之处？ 

八、请写出下面的结果，为何？ 

for (var i = 0; i < 5; i++) {
    setTimeout(function() {
        console.log(i)
    }, 1000*i)
}

答案：一共 5个5，瞬时出现一个5，而后1秒出现一个5，由于开始 i 为 0
思考：
(function () {
    console.log(1);
    setTimeout(function () {
        console.log(2);
    }, 1000);
    setTimeout(function () {
        console.log(3)
    }, 0);
    console.log(4);
})()
console.log(5)
答案：结果为1 4 5 3 2，其中1 4 5 3 时顺时出来，2 是在1秒以后出来，缘由是 setTimeout( ) 是异步的，
执行的机制是 将指定的代码移出本轮事件循环，等到下一轮事件循环，先执行 同步的任务 ； 复制代码

 九、请简单叙述你所知道的 ES6 新属性； 

 十、下面的代码将输出什么？ 

console.log(1 + "2"+"2");//122
console.log(1 + +"2" +"2");//32
console.log(1 + -"1" + "2");//02
console.log(+ "1" + "1" + "2");//112
console.log("A" - "B" + "2");//NaN2
console.log("A" - "B" + 2);//NaN
console.log("0||1=" +(0||1));//0||1=1
console.log("0||1=" +(1||2));//0||1=1
console.log("0&&1=" +(1&&2));//0&&1=2
console.log("0&&1=" +(1&&2))//0&&1=2复制代码

十一、数组去重：请用你所知道的实现下面的数组去重；

fn([0, 1, 2, '1', '1', 3, '3']) =>[0, 1, 2, '1',, 3, '3'] 复制代码

十二、如下代码将输出什么？ 

var a = {},
b = {key: "b"},
c = {key: "c"};
a[b] = 123;
a[c] = 456;
console.log(a[b]);//456复制代码

面试题4

一、说说Vue双向绑定的原理/MVVM的理解 *n 

二、 Vue与React的区别 *n 

三、 谈谈你对闭包的理解 *n 

四、 你项目中遇到最困难的问题是什么 *n 

五、 你以为你拿得出手的东西 *n 

六、 Promise 核心原理/工做机制 *3 

七、有封装过哪些组件，有什么心得？ *3 

8 、vue路由生命周期都有哪些，销毁钩子函数里你一般会作些什么 *2 

九、 Webpack、Gulp打包的原理是什么、有什么不一样 *2 

十、谈谈类的继承 

十一、原型链和做用域链 

十二、经常使用的伪类伪元素 

1三、vuex 为何要用 action去调用 metation 

1四、谈谈你所熟悉的设计模式 

1五、谈谈你对虚拟DOM的理解 

1六、谈谈你对NodeJS的了解 

1七、谈谈你对匿名函数的了解