前端面試題彙總：基礎篇2

建議你們每一道題都要畫圖（尤爲是複雜一些的題目），畫圖過程能讓咱們把基礎知識掌握的更加紮實，並且更加有效的算出正確的答案

先本身計算，都完成後在開始測試答案，千萬不要直接的輸出看答案，這樣就沒有意義了

1、選擇題

一、

console.log(a); 
var a=12; 
function fn(){
	console.log(a); 
	var a=13;	
}
fn();   
console.log(a);

/* A、undefined 12 13 B、undefined undefined 12 C、undefined undefined 13 D、有程序報錯 */
複製代碼

二、

console.log(a); 
var a=12;
function fn(){
	console.log(a);
    a=13;
}
fn();
console.log(a);

/* A、undefined 12 13 B、undefined undefined 12 C、undefined undefined 13 D、有程序報錯 */
複製代碼

三、

console.log(a);
a=12;
function fn(){
	console.log(a);
	a=13;	
}
fn();
console.log(a);

/* A、undefined 12 13 B、undefined undefined 12 C、undefined undefined 13 D、有程序報錯 */
複製代碼

四、

var foo=1; 
function bar(){
    if(!foo){
        var foo=10; 
    }
    console.log(foo); 
}
bar();

/* A、1 B、10 C、undefined D、報錯 */
複製代碼

五、無需畫圖

var n=0; 
function a(){
	var n=10; 
	function b(){
		n++; 
	    console.log(n); 
    }
    b();
    return b; 
}
var c=a();
c(); 
console.log(n);


/* A、1 1 1 B、11 11 0 C、11 12 0 D、11 12 12 */
複製代碼

六、

var a=10,b=11,c=12;
function test(a){
     a=1;
     var b=2;
     c=3;
}
test(10);
console.log(a);  
console.log(b);   
console.log(c);

/* A、1 11 3 B、10 11 12 C、1 2 3 D、10 11 3 */
複製代碼

七、

if(!("a" in window)){
   var a=1;
}
console.log(a);

/* A、1 B、undefined C、報錯 D、以上答案都不對 */
複製代碼

八、

var a=4;
function b(x,y,a) {	   
     console.log(a); 
     arguments[2]=10;        
     console.log(a); 
}
a=b(1,2,3);   
console.log(a); 

/* A、3 3 4 B、3 10 4 C、3 10 10 D、3 10 undefined */
複製代碼

九、

var foo='hello'; 
(function(foo){
   console.log(foo);
   var foo=foo||'world';
   console.log(foo);
})(foo);
console.log(foo);

/* A、hello hello hello B、undefined world hello C、hello world world D、以上答案都不正確 */
複製代碼

十、需畫圖

var a=9; 
function fn(){ 
	a=0; 	   
    return function(b){ 
	    return b+a++; 
    }    
}
var f=fn();
console.log(f(5));
console.log(fn()(5));
console.log(f(5));
console.log(a);

/* A、6 6 7 2 B、5 6 7 3 C、5 5 6 3 D、以上答案都不正確 */
複製代碼

2、問答題（須要畫圖）

一、

var ary=[1,2,3,4];
function fn(ary){
	ary[0]=0;    
	ary=[0];    
	ary[0]=100;    
	return ary; 
}
var res=fn(ary);    
console.log(ary);    
console.log(res);
複製代碼

二、

function fn(i) {
    return function (n) {
        console.log(n + (i++));
    }
}
var f = fn(10);
f(20);
fn(20)(40);
fn(30)(50);
f(30);
複製代碼

三、

var i = 10;
function fn() {
    return function (n) {
        console.log(n + (++i));
    }
}
var f = fn();
f(20);
fn()(20);
fn()(30);
f(30);
複製代碼

四、無需畫圖

var test = (function(i){
    return function(){
        alert(i*=2);
    }
})(2);
test(5);
複製代碼

五、

var a=1;
var obj ={
   "name":"tom"
}
function fn(){
   var a2 = a;
   obj2 = obj;
   a2 =a;
   obj2.name =」jack」;
}
fn();
console.log(a);
console.log(obj);
複製代碼

六、無需畫圖

var a = 1;
function fn(a){
    console.log(a)
    var a = 2;
    function a(){}
}
fn(a)
複製代碼

七、

var a=0,
	b=0;
function A(a){
	A=function(b){
    	alert(a+b++);
	};
    alert(a++);
}
A(1);
A(2);
複製代碼

三：附加思考題（面試題）

一、如下代碼的功能是要實現爲5個input按鈕循環綁定click點擊事件，綁定完成後點擊一、二、三、四、5五個按鈕分別會alert輸出0、一、二、三、4五個字符。（騰訊）

• 請問以下代碼是否能實現？
• 若是不能實現那麼如今的效果是什麼樣的？
• 應該作怎樣的修改才能達到咱們想要的效果，並說明原理？

<div id="btnBox">
	<input type="button" value="button_1" />
    <input type="button" value="button_2" />
    <input type="button" value="button_3" />
    <input type="button" value="button_4" />
    <input type="button" value="button_5" />
</div>

<script type="text/javascript"> var btnBox=document.getElementById('btnBox'), inputs=btnBox.getElementsByTagName('input'); var l=inputs.length; for(var i=0;i<l;i++){ inputs[i].onclick=function(){ alert(i); } } </script>
複製代碼

二、document.parentNode 和 document.parentnode 的區別？（騰訊）

三、你理解的閉包做用是什麼，優缺點？（樂視）

四、簡述let和var的區別

四

1. 寫出下面代碼輸出結果

   var num = 10;
   var obj = {num: 20};
   obj.fn = (function (num) {
       this.num = num * 3;
       num++;
       return function (n) {
           this.num += n;
           num++;
           console.log(num);
       }
   })(obj.num);
   var fn = obj.fn;
   fn(5);
   obj.fn(10);
   console.log(num, obj.num);
   複製代碼

2. 寫出下面代碼輸出結果

   var fullName='language';
   var obj={
   	fullName:'javascript',
   	prop:{
   		getFullName:function(){
   			return this.fullName;
   		}
   	}
   };
   console.log(obj.prop.getFullName());
   var test=obj.prop.getFullName;
   console.log(test());
   複製代碼

   var name='window';
   var Tom={
   	name:"Tom",
   	show:function(){
   		console.log(this.name);
   	},
   	wait:function(){
   		var fun=this.show;
   		fun();
   	}
   };
   Tom.wait();
   複製代碼

3. 騰訊面試題

   function fun(){
   	this.a=0;
   	this.b=function(){
   		alert(this.a);
   	}
   }
   fun.prototype={
   	b:function(){
   		this.a=20;
   		alert(this.a);
   	},
   	c:function(){
   		this.a=30;
   		alert(this.a)
   	}
   }
   var my_fun=new fun();
   my_fun.b();
   my_fun.c();
   複製代碼

4. 怎麼規避多人開發函數重名的問題？（百度搜索）

5. 360面試題

   window.val=1; 
   var json={ 
       val:10, 
       dbl:function(){ 
           this.val*=2; 
       } 
   } 
   json.dbl(); 
   var dbl = json.dbl; 
   dbl(); 
   json.dbl.call(window); 
   alert(window.val + json.val);
   複製代碼

   (function(){
       var val =1;
       var json ={
             val:10,
             dbl:function(){
               val*=2;
             }
       };
       json.dbl();
       alert(json.val+val);
   })();
   複製代碼

   function C1(name){
       if(name) {
       	this.name = name;
       }
   }
   function C2(name){
       this.name =name;
   }
   function C3(name){
       this.name = name ||'join';
   }
   C1.prototype.name='Tom';
   C2.prototype.name='Tom';
   C3.prototype.name='Tom';
   alert((new C1().name)+(new C2().name)+(new C3().name));
   複製代碼

6. 滴滴面試題

   var foo = {
     bar: function () {
       console.log(this);
     }
   };
   foo.bar(); 
   (foo.bar)(); 
   複製代碼