摘要：對象當(dāng)調(diào)用某種方法或查找某種屬性時，首先會在自身調(diào)用和查找，如果自身并沒有該屬性或方法，則會去它的屬性中調(diào)用查找，也就是它構(gòu)造函數(shù)的中調(diào)用查找，如果構(gòu)造函數(shù)中也沒有該屬性方法，則會去構(gòu)造函數(shù)的隱式原型中查找，一直到，就這樣形成原型鏈。

此文主旨是記錄面試中遇到的面試題，包括js中常見，易錯，重要知識點

window.onload是在頁面中包含圖片在內(nèi)的所有元素全部加載完成再執(zhí)行；
$(document).ready()是DOM樹加載完成之后執(zhí)行，不包含圖片，其他媒體文件；
因此$(document).ready()快于window.onload執(zhí)行；

const arr = ["a","bb","22","a","yuci","haha","22"]; 

1.es6數(shù)據(jù)結(jié)構(gòu)Set

let unique = new Set(arr);  
console.log(Array.from(unique)); 

2.使用push()

let arr2 = [];  
for(let i = 0; i < arr.length; i++) {  
    if(arr2.indexOf(arr[i]) == -1) { //不包含某個值則返回-1  
        arr2.push(arr[i]);  
    }  
}  
console.log(arr2); 

//如果當(dāng)前數(shù)組的第i項在當(dāng)前數(shù)組中第一次出現(xiàn)的位置不是i，那么表示第i項是重復(fù)的，忽略掉。否則存入結(jié)果數(shù)組  
let arr3 = [arr[0]];  
for(let i = 1; i < arr.length; i++) {  
    if(arr.indexOf(arr[i]) == i) {  
        arr3.push(arr[i]);  
    }  
}  
console.log(arr3);  

3.排序去除相鄰重復(fù)元素

let arrSort = arr.sort();  
let arr4 = [];  
for(let i = 0; i< arrSort.length; i++) {  
    if(arrSort[i] != arrSort[i+1]) {  
        arr4.push(arrSort[i]);  
    }  
}  
console.log(arr4);  

4.使用splice()

let len = arr.length;  
for(let i = 0; i < len; i++) {  
    for(let j = i + 1; j < len; j++) {  
        if(arr[i] === arr[j]) {  
            arr.splice(i,1);  
            len--;  
            j--;  
        }  
    }  
}  
console.log(arr); 

得益于事件冒泡，當(dāng)多個元素有相同的事件，將事件綁定在父元素

var oUl = document.getElementById("oul");  
oUl.addEventListener("click", function(e) {  
    var e = e||window.event;  
    var tar = e.target;  
    if(tar.nodeName === "LI") {  
        alert(tar.innerHTML);  
    }  
}) 

更詳細(xì)請看：事件委托

typeof()用于判斷簡單數(shù)據(jù)；

判斷一個變量是對象還是數(shù)組使用instanceof，constructor或Object.prototype.toString.call()；

更詳細(xì)請看：判斷數(shù)據(jù)類型

同步：由于js單線程，同步任務(wù)都在主線程上排隊執(zhí)行，前面任務(wù)沒執(zhí)行完成，后面的任務(wù)會一直等待；

異步：不進(jìn)入主線程，進(jìn)入任務(wù)隊列，等待主線程任務(wù)執(zhí)行完成，開始執(zhí)行。最基礎(chǔ)的異步操作setTimeout和setInterval，等待主線程任務(wù)執(zhí)行完，在開始執(zhí)行里面的函數(shù)；

更詳細(xì)請看：js運行機(jī)制

false，null，0，“”，undefined，NaN

存儲地：

簡單數(shù)據(jù)類型：存儲在棧中；

引用數(shù)據(jù)類型：存儲在堆中，在棧中存儲了指針，指向存儲在堆中的地址，解釋器會先檢索在棧中的地址，從堆中獲得實體；

大小：

簡單數(shù)據(jù)類型：大小固定，占用空間小，頻繁使用，所以存儲在棧中；

引用數(shù)據(jù)類型：大小不固定，占用空間大；

何為閉包：有權(quán)訪問另一個作用域中變量的函數(shù)

閉包特性：可實現(xiàn)函數(shù)外訪問函數(shù)內(nèi)變量，外層變量可以不被垃圾回收機(jī)制回收

為什么？怎么解決？

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

輸出結(jié)果都為10，因為for()循環(huán)過程中每次傳值，匿名函數(shù)并沒有執(zhí)行，相當(dāng)于執(zhí)行10次function(){console.log(i);}，循環(huán)結(jié)束i變?yōu)?0，所以輸出全部為10；

使用閉包，自執(zhí)行匿名函數(shù)包裹:

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

外部匿名函數(shù)立即執(zhí)行，把 i 作為參數(shù)，賦值給 j ，因為是立即執(zhí)行，所以每次循環(huán)輸出不同值。

引用外層變量不被回收，會相比其他函數(shù)占用更高內(nèi)存，使用不當(dāng)容易造成內(nèi)存泄漏。

全局范圍：指向window（嚴(yán)格模式下不存在全局變量，指向undefined）;

普通函數(shù)調(diào)用：指向window;

對象方法調(diào)用：指向最后調(diào)用它的對象；

構(gòu)造函數(shù)調(diào)用：指向new出來的對象；

顯示設(shè)置this：call，apply方法顯示將this指向第一個參數(shù)指明的對象

創(chuàng)建一個新對象foo；

并將它的__proto__指向其構(gòu)造函數(shù)的prototype，foo.__proto__ = Foo.prototype;

動態(tài)將this指向新對象，F(xiàn)oo.apply(foo，arguments);

執(zhí)行函數(shù)體中的代碼；

放回新對象foo;

創(chuàng)建一個函數(shù)就會為其創(chuàng)建一個prototype屬性，指向這個函數(shù)的原型對象，原型對象會自動獲得constructor屬性，指向prototype屬性所在函數(shù)。

Function.prototype.a = "a";    
Object.prototype.b = "b";    
function Person(){}    
console.log(Person);    //function Person()    
let p = new Person();    
console.log(p);         //Person {} 對象    
console.log(p.a);       //undefined    
console.log(p.b);       //b 

p.__proto__ === Person.prototype；Person.prototype.constructor === Person

當(dāng)調(diào)用某種方法或查找某種屬性時，首先會在自身調(diào)用和查找，如果自身并沒有該屬性或方法，則會去它的__proto__屬性中調(diào)用查找，也就是它構(gòu)造函數(shù)的prototype中調(diào)用查找，如果構(gòu)造函數(shù)中也沒有該屬性方法，則會去構(gòu)造函數(shù)的隱式原型中查找，一直到null，就這樣形成原型鏈。

更多有關(guān)原型請看：原型和原型鏈

原型鏈繼承：

Child()的原型作為Parent()的實例來繼承Parent()的方法屬性

因為所有實例都繼承原型方法屬性，其中一個實例對原型屬性值更改后，所有實例調(diào)用該屬性的值全部更改

function Parent() {}  
Parent.prototype.parentSay = function() {  
    return "i am parent";  
}  
function Child() {}  
Child.prototype.childSay = function() {  
    return "i am child";  
}  
Child.prototype = new Parent();  
var par = new Parent();  
var kid = new Child();  
  
console.log(kid.parentSay());           //i am parent 

構(gòu)造函數(shù)繼承：

在子類的構(gòu)造函數(shù)內(nèi)部通過call或apply來調(diào)用父類構(gòu)造函數(shù)

無法實現(xiàn)函數(shù)的復(fù)用

function People() {  
    this.name = ["zhangsan","lisi","wangwu"];  
}  
function Person() {  
    People.call(this);  
}  
var per1 = new Person();  
per1.name.push("zhanliu");  
console.log(per1.name);     //["zhangsan", "lisi", "wangwu", "zhanliu"]  
  
var per2 = new Person();  
console.log(per2.name);     //["zhangsan", "lisi", "wangwu"]  

組合繼承：

將原型鏈繼承和構(gòu)造函數(shù)繼承結(jié)合，最常用的繼承模式

原型鏈繼承共享的屬性和方法，構(gòu)造函數(shù)繼承實例屬性

function People(num) {  
    this.num = num;  
    this.name = ["zhangsan","lisi","wangwu"];  
}  
People.prototype.numCount = function() {  
    console.log(this.num);  
}  
function Person(num) {  
    People.call(this, num);  
}  
//繼承方式  
Person.prototype = new People();  
Person.prototype.constructor = Person;  
  
var per1 = new Person(10);  
per1.name.push("zhaoliu");  
console.log(per1.name);     //["zhangsan", "lisi", "wangwu", "zhanliu"]  
per1.numCount();            //10  
  
var per2 = new Person(20);  
console.log(per2.name);     //["zhangsan", "lisi", "wangwu"]  
per2.numCount();            //20  

更多繼承方式請看：繼承方式

改變原數(shù)組：

尾部刪除pop()，尾部添加push()，頭部刪除shift()，頭部添加unshift()，排序sort()，顛倒數(shù)組元素reverse()，刪除或插入元素splice();

不會改變元素組：

合并數(shù)組concat()，拼接數(shù)組元素join()，截取元素slice()，indexOf()，lastIndexOf()，toString()

更詳細(xì)數(shù)組方法總結(jié)請看：Array數(shù)組方法總結(jié)

Cookie：用于客戶端與服務(wù)端通信，也具有本地存儲的功能

localStorage，sessionStorage：專門用于存儲

區(qū)別：

大小：Cookie容量為4K，因為用于客戶端與服務(wù)端通信，所有http都攜帶，如果太大會降低效率； localStorage，sessionStorage大小為5M。

失效時間：Cookie會在瀏覽器關(guān)閉時刪除，除非主動設(shè)置刪除時間；localStorage一直都在直到用戶主動刪除或清除瀏覽器緩存；sessionStorage在瀏覽器關(guān)閉時刪除。

如有錯誤，歡迎指正