JS常見問題總結一

不廢話，直接上題

1、變量類型和計算

1.1 js中使用typeof能獲得的哪些類型？

答：1.值類型 VS 引用類型

typeof undefined   //undefined
typeof 'abc'       //string
typeof 123         //number
typeof true        //boolean
typeof {}          //object
typeof []          //object
typeof null        //object
typeof console.log //function

　　

1.2 什麼時候使用=== ， 什麼時候使用==？

答：強制類型轉換：字符串拼接、==運算符、if語句、邏輯運算 ,其他全用三等號

 

 1 100 == '100'       //true
 2 0== ''             //true
 3 null == undefined  //true
 4 if (obj.a == null) {
 5     //這裏至關於 obj.a === null || obj.a === undefined的簡寫形式
 6     //這是JQuery源碼中的推薦寫法
 7 }
 8 console.log(10 && 0)   //0
 9 console.log('' || 'abc')  //'abc'
10 console.log(!window.abc)  //true
11 
12 //判斷一個變量會被看成 true 仍是 false
13 var a = 100
14 console.log(!!a)

 

1.3 Js有哪些內置函數？

答：數據封裝類對象

            Object , Array , Boolean , Number , String , Function , Date , RegExp , Error。

 

1.4 Js變量按照存儲方式區分爲哪些類型，並描述其特色

 

 1 //值類型
 2 var a = 10
 3 var b = a
 4 a = 11
 5 console.log(b)     //10
 6 
 7 //引用類型
 8 var obj1 = {x:100}
 9 var obj2 = obj1
10 obj1.x = 200
11 console.log(obj2.x)  //200

 1.5 如何理解json?

 答：JSON只不過是一個JS對象而已

          JSON.stringify({a:10,b:20})
          JSON.parse('{"a":10,"b":20}')

 

2、原型和原型鏈

知識點：

1.構造函數

 

2.原型五大規則

   全部的引用類型（數組、對象、函數），都具備對象特性，便可自由擴展屬性（除了「null」之外）；

   全部的引用類型（數組、對象、函數），都有一個_proto_屬性（隱式屬性），屬性值是一個普通的對象；

   全部的函數，都有一個prototype屬性（顯式屬性），屬性值也是一個普通對象；

   全部的引用類型（數組、對象、函數），_proto_屬性值指向它的構造函數的「prototype」屬性值；

   當試圖獲得一個對象的某個屬性時，若是這個對象自己沒有這個屬性，那麼會去它的_proto_（即它的構造函數的prototype）中尋找。

 

 

 

3.原型鏈

 

4.instanceof:用於判斷引用類型屬於哪一個構造函數的方法

 f的_proto_一層一層往上，可否對應到Foo.prototype,再試着判斷f.instanceof Object。

2.1 如何準確判斷一個變量是數組類型？

 

var arr = []
arr instanceof Array   //true
typeof arr         //object      
//typeof 是沒法判斷是不是數組的

Object.prototype.toString.call(arr) === '[object Array]';

 

 

 

2.2 寫一個原型鏈繼承的例子。

答：

var Parent = function(name){
  this.name = name || 'parent' ;
} ;
Parent.prototype.getName = function(){
  return this.name ;
} ;
Parent.prototype.obj = {a : 1} ;
var Child = function(name){
  Parent.apply(this,arguments) ;
} ;
Child.prototype = Parent.prototype ;
var parent = new Parent('myParent') ;
var child = new Child('myChild') ;
console.log(parent.getName()) ; //myParent
console.log(child.getName()) ; //myChild

 

2.3 描述new一個對象的過程。

 

3、做用域和閉包

 

3.1 說一下對變量提高的理解

 

函數聲明會提高，通常的變量以及變量表達式不提高

3.2 說明this幾種不一樣的使用場景

 答：1.做爲構造函數執行

     2.做爲對象屬性執行

     3.做爲普通函數執行

     4.call，apply，bind

 

//call , apply , bind
function fn1(name,age){
    alert(name)
    console.log(this)   
}
fn1.call({x:100},'Lily',20)   //彈出Lily,this ={x:100}


function fn2(name,age){
    alert(name)
    console.log(this)   
}
fn2.apply(({y:200},['Lily',20])) //彈出Lily,this ={y:200}


var fn3 = function(name,age){
    alert(name)
    console.log(this)
}.bind({z:300})
fn3('Lily',20)          //彈出Lily,this ={z:300}

 

 

 

3.3 建立10個<a>標籤，點擊的時候彈出來對應的序號

var i
for (var i = 0; i < 10; i++) {
    (function(i){
        var a = document.createElement('a')
        a.innerHTML = i + '<br>'
        a.addEventListener('click',function(e){
            e.preventDefault()
            alert(i)
        })
        document.body.appendChild(a)
    })(i)
}

 

 

 

3.4 如何理解做用域

1.自由變量

var a = 100
function F1(){
    var b = 200
    function F2(){
        var c=300
        //當前的做用域沒有定義的變量，即「自由變量」
        console.log(a) //自由變量
        console.log(b)  //自由變量
        console.log(c)
    }
}

 

2.閉包

function F1(){
    var a = 100
    //返回一個函數（函數做爲返回值）
    return function(){
        console.log(a)
    }
}
//f1 獲得一個函數
var f1 = F1()
var a = 200
f1()        //a=100

 

 

3.5 實際開發中閉包的應用