摘要：原型是由構(gòu)造器函數(shù)創(chuàng)建的。從原型繼承的方法與屬性是在構(gòu)造器函數(shù)中定義的。可以將此屬性作為構(gòu)造器使用獲得某個對象實(shí)例的構(gòu)造器的名字，可以這么用該屬性的值是那個函數(shù)本身，而不是一個包含函數(shù)名稱的字符串。

寫文目的：總結(jié)前端面試過程中沒回答上來的點(diǎn)，深化印象，也方便日后溫習(xí)。

寫文方法：寫之前先自己看相關(guān)知識，理解好后過段時間根據(jù)記憶來寫，最后對比糾正。

1.更新簡歷，多參考其他的優(yōu)秀簡歷

2.復(fù)習(xí)面試題

筆者就是因?yàn)橹桓铝撕啔v沒有復(fù)習(xí)導(dǎo)致基礎(chǔ)不過關(guān)，錯過兩家心儀的公司。

順便說下，平時工作中的確很多時候用不到也不會去背某些面試中的問題，不過面試題中基礎(chǔ)部分很重要，理解好基礎(chǔ)才更輕松掌握新框架新知識。時不時去看看面試題也不失為一種鞏固基礎(chǔ)的方法。一般一面面基礎(chǔ)，二面面項(xiàng)目，項(xiàng)目經(jīng)驗(yàn)再多，一面過不了，什么戲也不會有。

css優(yōu)先級，屬性選擇器的優(yōu)先級在哪

0.類型選擇器（如， h1）和偽元素（如， ::before）
1.類選擇器，屬性選擇器，偽類(如，:hover)
3.ID選擇器

通用選擇器（universal selector）(*), 組合子（combinators） (+, >, ~, " ") 和 否定偽類（negation pseudo-class）(:not()) 對特異性沒有影響。（但是，在 :not() 內(nèi)部聲明的選擇器是會影響優(yōu)先級，在計算選擇器數(shù)量時還是會把其中的選擇器當(dāng)做普通選擇器進(jìn)行計數(shù)）。

4.給元素添加的內(nèi)聯(lián)樣式總會覆蓋外部樣式表的任何樣式 ，因此可看作是具有最高的優(yōu)先級。

權(quán)重記憶口訣。一個元素名，或者偽元素+1，一個屬性選擇器/class或者偽類+10，一個id+100，一個行內(nèi)樣式+1000。

**!important 規(guī)則例外
當(dāng)在一個樣式聲明中使用一個!important 規(guī)則時，此聲明將覆蓋任何其他聲明。**

直接定位的樣式權(quán)重大于繼承的樣式，無論繼承的規(guī)則的特異性（優(yōu)先級）如何。

Styles for a directly targeted element will always take precedence over inherited styles, regardless of the specificity of the inherited rule.

h1 {
  color: purple;
}
#parent {
  color: green;
}

當(dāng)它應(yīng)用在下面的HTML時:

  
Here is a title!

瀏覽器會將h1渲染成紫色。
因?yàn)閔1選擇器清晰地定位了元素。

~ 組合器

A + B 匹配任意元素，滿足條件：B是A的下一個兄弟節(jié)點(diǎn)（AB有相同的父結(jié)點(diǎn)，并且B緊跟在A的后面）

A ~ B 滿足條件：B是A之后的兄弟節(jié)點(diǎn)中的任意一個（AB有相同的父節(jié)點(diǎn)，B在A之后，但不一定是緊挨著A）(會盡可能多匹配)

什么是閉包

閉包是由函數(shù)與創(chuàng)建該函數(shù)的環(huán)境所組成的

優(yōu)點(diǎn)：減少全局變量污染

缺點(diǎn)：影響腳本性能

3==true 打印出什么

會打印出false，這里會將true轉(zhuǎn)變成1

Number 和 String 或者 Bool 類型比較，會對String 或者 Bool 類型進(jìn)行ToNumber()轉(zhuǎn)換

Number(true) // 1
Number(false) // 0
1==true //true
1===true //false
3==true //false

變量聲明提升

變量聲明無論出現(xiàn)在代碼的任何位置，都會在代碼執(zhí)行前處理。所以在代碼的任何位置聲明變量就好像在代碼開頭聲明一樣。

var a = 100;
function fn() {
    alert(a);
    var a = 200;
    alert(a);
}
fn();
alert(a);
var a;
alert(a); //這里alert出100
var a = 300;
alert(a);

not defined 與 undefined

console.log(a) //報錯 Uncaught ReferenceError: a is not defined

var b;
console.log(b) //undefined

判斷變量是不是數(shù)組的幾個方法

var a=[];
a.constructor===Array //true
a instanceof Array === true //true

?? 注意：以上方法在跨frame時會有問題，跨frame實(shí)例化的對象不共享原型

var iframe = document.createElement("iframe");   //創(chuàng)建iframe  
document.body.appendChild(iframe);   //添加到body中  
xArray = window.frames[window.frames.length-1].Array;     
var arr = new xArray(1,2,3); // 聲明數(shù)組[1,2,3]     
  
alert(arr instanceof Array); // false     
  
alert(arr.constructor === Array); // false   

解決：

Object.prototype.toString.call(a) // "[object Array]"
Array.isArray(a) //true

bind,call,apply用法與區(qū)別

用法：都是改變函數(shù)內(nèi)this指向

bind:返回一個新的函數(shù)，調(diào)用新的函數(shù)才執(zhí)行，新函數(shù)里this永久地被綁定到了bind的第一個參數(shù)上

而call與apply能直接執(zhí)行

fuc.call(thisObj,a,b,c)

fuc.apply(thisObj,[a,b,c]) // apply 傳數(shù)組

原型 與 prototype屬性

原型：

JavaScript的對象中都包含了一個" [[Prototype]]"內(nèi)部屬性，這個屬性所對應(yīng)的就是該對象的原型。對象從原型繼承方法與屬性。原型可能也有原型，這種關(guān)系被稱為原型鏈。

"[[Prototype]]"作為對象的內(nèi)部屬性，是不能被直接訪問的。所以為了方便查看一個對象的原型，大多數(shù)現(xiàn)代瀏覽器還是提供了一個名為"__proto__"這個非標(biāo)準(zhǔn)（不是所有瀏覽器都支持）的訪問器（ECMA引入了標(biāo)準(zhǔn)對象原型訪問"Object.getPrototype(object)"）。

原型是由構(gòu)造器函數(shù)創(chuàng)建的。從原型繼承的方法與屬性是在構(gòu)造器函數(shù)中定義的。

prototype屬性:

prototype屬性并不指向當(dāng)前對象的原型對象（原型對象是一個內(nèi)部對象，應(yīng)當(dāng)使用 __proto__ 訪問）。prototype屬性是繼承成員被定義的地方。

常見的對象定義模式是，在構(gòu)造器（函數(shù)體）中定義屬性、在 prototype 屬性上定義方法。（在prototype屬性中定義屬性會不夠靈活）

發(fā)現(xiàn)的比較奇異的點(diǎn)：一個變量不是函數(shù)的話默認(rèn)沒有 prototype屬性，是函數(shù)的話默認(rèn)就有 prototype屬性，并且prototype對象中的constructor屬性就是它本身

  var a = {};
  console.log(a.__proto__) //{constructor: ?, __defineGetter__: ?, __defineSetter__: ?, hasOwnProperty: ?, __lookupGetter__: ?,?…}
  console.log(a.__proto__ === Object.prototype) //true 
  console.log(a.constructor) //? Object() { [native code] }
  console.log(a.constructor === Object) //true

  //******不是函數(shù)的話默認(rèn)沒有 prototype屬性
  console.log(a.prototype) //undefined 

  console.log("b:")
  var b = function c() { };
  console.log(b.__proto__) //? () { [native code] }
  console.log(b.__proto__ === Function.prototype) //true

  console.log(b.constructor) //? Function() { [native code] }
  console.log(b.constructor === Function) //true

  //******函數(shù)默認(rèn)就有 prototype屬性，并且prototype對象中的constructor屬性就是它本身
  console.log(b.prototype) //{constructor: ?}
  console.log(b.prototype.constructor) //? c() { }
  console.log(b.prototype.constructor===b) //true

constructor

每個對象實(shí)例都具有 constructor 屬性，它指向創(chuàng)建該實(shí)例的構(gòu)造器函數(shù)。

可以將此屬性作為構(gòu)造器使用：

var person3 = new person1.constructor("Karen", "Stephenson", 26, "female", ["playing drums", "mountain climbing"]);

獲得某個對象實(shí)例的構(gòu)造器的名字，可以這么用：

person1.constructor.name

該屬性的值是那個函數(shù)本身，而不是一個包含函數(shù)名稱的字符串。對于原始值（js中有5種：null undefined number boolean string），該屬性為只讀。

    var a = 1;
    console.log(a.prototype) //undefined
    console.log(a.constructor) //? Number() { [native code] }

    var b = [];
    console.log(b.prototype) //undefined
    console.log(b.constructor) //? Array() { [native code] }

    //改變 a b 的constructor為 {}
    a.constructor = {}
    b.constructor = {}
    console.log(a.constructor) //沒有變，還是 ? Number() { [native code] }
    console.log(b.constructor) //{}

new

class

函數(shù)堆棧

ECMAScript中變量的兩種類型

原始值：
引用值：

js三大組成部分

1.ECMAScript
2.dom
3.bom

除了 GET POST,還有哪些方法

keep-alive

http返回碼100 200 300 400分別代表什么，即響應(yīng)的5種類型

100:信息響應(yīng)

200:成功

300:重定向

400:客戶端錯誤

500:服務(wù)端錯誤

理解重定向

http無狀態(tài)含義

解釋三次握手，四次揮手

三次握手

1.客戶端發(fā)syn包給服務(wù)端，等待服務(wù)器確認(rèn)（syn:同步序列編號（Synchronize Sequence Numbers））

2.服務(wù)端發(fā)syn+ack包給客戶端

3.客戶端發(fā)確認(rèn)包ack給服務(wù)端

四次揮手

中斷連接端可以是Client端，也可以是Server端。

1.關(guān)閉主動方發(fā)送fin包

2.被動方發(fā)送ack包

3.被動方關(guān)閉連接，發(fā)送fin包

4.主動方發(fā)送ack包確認(rèn)

鏈表和數(shù)組的區(qū)別

了解過哪些排序算法

自己實(shí)現(xiàn)個jQuery，可以傳選擇器進(jìn)去，然后實(shí)現(xiàn)css()與height()方法

demo

var myJquery4 = function (selector) {
        //console.log(this) //window
        return new jqNodes(selector) //new會創(chuàng)造一個對象實(shí)例，對象實(shí)例繼承自構(gòu)造函數(shù)的prototype,這里是jqNodes.prototype
    }

    var jqNodes = function (selector) {
        console.log(this)
        //1.以new調(diào)用時this指向即將創(chuàng)建的新對象 
        //2.直接調(diào)用則指向 window
        this._items = document.querySelectorAll(selector)
        return this
    }

    var myJqueryCore = {
        //放核心方法
        css: function () {
            console.log(this) //myJquery4("li").css("color") 這樣調(diào)用時是作為new出來的對象原型里的方法調(diào)用的，this指向new出來的對象
            var prop = arguments[0],
                val = arguments[1]
            if (!val) return getComputedStyle(this._items[0]).getPropertyValue(prop);

            Array.prototype.map.call(this._items, function (c) {
                return c.setAttribute("style", prop + ":" + val)
            })
            return this
        }
    }

    jqNodes.prototype = myJqueryCore //關(guān)鍵

寫個輪播圖

之前感覺比較困擾的是從最后一頁到第一頁如何無縫滑動。無縫滑動的關(guān)鍵在于在第一頁前放上最后一頁，在最后一頁后面再放上第一頁。在最后一頁點(diǎn)擊后一頁時，先滑動到放置在后邊的第一頁，滑動完成后立刻改變父元素的left值到排列在第二個的第一頁。

demo

html結(jié)構(gòu)：

    
5
    
1
    
2
    
3
    
4
    
5
    
1

關(guān)鍵js:

$("#list").animate({ left: newLeft }, function () {
    if (newLeft < -3000) {
        list.style.left = -600 + "px";
    } else if (newLeft > -600) {
        list.style.left = -3000 + "px";
    }
})

菜單高亮滾動監(jiān)聽

主要參考了 http://blog.csdn.net/sinrryzh...
我修改成了可以有多個固定導(dǎo)航的

demo

    
    
    




    

        

            
欄目1內(nèi)容
        
        

            
欄目2內(nèi)容
        
        

            
欄目3內(nèi)容
        
        

            
欄目4內(nèi)容
        
        

            
欄目5內(nèi)容
        
        

            
欄目6內(nèi)容
        
        

            
欄目7內(nèi)容
        

    
    

        欄目1
        欄目2
        欄目3
        欄目4
        欄目5
        欄目6
        欄目7
    


    

        

            
欄目2-1內(nèi)容
        
        

            
欄目2-2內(nèi)容
        
        

            
欄目2-3內(nèi)容
        
        

            
欄目2-4內(nèi)容
        
        

            
欄目2-5內(nèi)容
        
        

            
欄目2-6內(nèi)容
        
        

            
欄目2-7內(nèi)容
        

    
    

        欄目2-1
        欄目2-2
        欄目2-3
        欄目2-4
        欄目2-5
        欄目2-6
        欄目2-7
    

    
    
    

注：自己發(fā)現(xiàn)的面試知識點(diǎn)一般是在工作學(xué)習(xí)中發(fā)現(xiàn)的基礎(chǔ)重要但之前被自己忽略的知識點(diǎn)。

全等號優(yōu)先級大于邏輯與

var a=1===2&&3?4:5

逗號操作符

逗號操作符 對它的每個操作數(shù)求值（從左到右），并返回最后一個操作數(shù)的值。

var x=(0,1) //x=1

比較對象

兩個獨(dú)立聲明的對象永遠(yuǎn)也不會相等，即使他們有相同的屬性，只有在比較一個對象和這個對象的引用時，才會返回true.

encodeURI   encodeURIComponent

encodeURI
encodeURI 會替換所有的字符，但不包括以下字符，即使它們具有適當(dāng)?shù)腢TF-8轉(zhuǎn)義序列：

類型         包含
保留字符    ; , / ? : @ & = + $
非轉(zhuǎn)義的字符    字母 數(shù)字 - _ . ! ~ * " ( )
數(shù)字符號    #

encodeURI自身無法產(chǎn)生能適用于HTTP GET 或 POST 請求的URI，例如對于 XMLHTTPRequests, 因?yàn)?"&", "+", 和 "=" 不會被編碼，然而在 GET 和 POST 請求中它們是特殊字符。然而encodeURIComponent這個方法會對這些字符編碼。

encodeURIComponent
轉(zhuǎn)義除了字母、數(shù)字、(、)、.、!、~、*、"、-和_之外的所有字符。

dangerouslysethtml會過濾掉__html屬性里的 ，是因?yàn)橛昧薳ncodeURI函數(shù)來避免xss攻擊

encodeURI("http:////") -->”////“
encodeURI("") --> Uncaught SyntaxError: Invalid or unexpected token
encodeURIComponent("http:////") -->"%2F%2F%2F%2F"
encodeURIComponent("/") --> "%2F"
encodeURIComponent("") --> Uncaught SyntaxError: Invalid or unexpected token

xss

cross-site scripting，跨站腳本，屬于代碼注入的一種。它允許惡意用戶將代碼注入到網(wǎng)頁上，其他用戶在觀看網(wǎng)頁時就會受到影響。這類攻擊通常包含了html以及用戶端腳本語言。
攻擊實(shí)例：用戶A提交表單事加入類似以下代碼，如果提交表單時沒有做檢測，而之后的結(jié)果頁面是其他用戶也能看到的，那么其他頁面看到的結(jié)果頁就會受到影響。

解決辦法：不信賴用戶輸入，對特殊字符如”<”,”>”轉(zhuǎn)義。

uri url urn

uri:統(tǒng)一資源標(biāo)識符
url:統(tǒng)一資源定位符
urn:統(tǒng)一資源名稱
url與urn是uri的子集。
讓uri能成為url的是那個“訪問機(jī)制”，“網(wǎng)絡(luò)位置”。e.g. http:// or ftp://.。
urn是唯一標(biāo)識的一部分，就是一個特殊的名字。

etag是什么

ETag(entity tag)唯一地表示一份資源的實(shí)體標(biāo)簽。
標(biāo)簽是由 ASCII 字符組成的字符串，用雙引號括起來（如 "675af34563dc-tr34"）。前面可以加上 W/ 前綴表示應(yīng)該采用弱比較算法。

ETag: "33a64df551425fcc55e4d42a148795d9f25f89d4"
ETag: W/"0815"

ETag由Web服務(wù)器根據(jù)URL上的資源的特定版本而指定。如果那個URL上的資源內(nèi)容改變，一個新的不一樣的ETag就會被分配。ETag的比較只對同一個URL有意義——不同URL上的資源的ETag值可能相同也可能不同，從他們的ETag的比較中無從推斷。

用法：
1.檢測"空中碰撞"(資源同步更新而相互覆蓋):
在ETag和 If-Match 頭部的幫助下，可以檢測到"空中碰撞"的編輯沖突。

2.緩存未更改的資源
如果用戶再次訪問給定的URL（設(shè)有ETag字段），顯示資源過期了且不可用，客戶端就發(fā)送值為ETag的If-None-Match header字段：

If-None-Match: "33a64df551425fcc55e4d42a148795d9f25f89d4"
服務(wù)器將客戶端的ETag（作為If-None-Match字段的值一起發(fā)送）與其當(dāng)前版本的資源的ETag進(jìn)行比較，如果兩個值匹配（即資源未更改），服務(wù)器將返回不帶任何內(nèi)容的304未修改狀態(tài)，告訴客戶端緩存版本可用（新鮮）。

If-Match 頭部

請求首部 If-Match 的使用表示這是一個條件請求。在請求方法為 GET 和 HEAD 的情況下，服務(wù)器僅在請求的資源滿足此首部列出的 ETag 之一時才會返回資源。而對于 PUT 或其他非安全方法來說，只有在滿足條件的情況下才可以將資源上傳。

應(yīng)用：

GET 和 HEAD 方法，搭配 Range首部使用，可以用來保證新請求的范圍與之前請求的范圍是對同一份資源的請求。如果 ETag 無法匹配，那么需要返回 416 (Range Not Satisfiable，范圍請求無法滿足) 響應(yīng)。

2.對于其他方法來說，尤其是 PUT, If-Match 首部可以用來檢測用戶想要上傳的不會覆蓋獲取原始資源之后做出的更新。如果請求的條件不滿足，那么需要返回 412 (Precondition Failed，先決條件失敗) 響應(yīng)。

語法：

If-Match: , , …

樂觀并發(fā)控制

ASCII字符串

ASCII (發(fā)音： /??ski/ ，American Standard Code for Information Interchange，美國信息交換標(biāo)準(zhǔn)碼) 是計算機(jī)中最常用的編碼方式，用于將字母，數(shù)字，標(biāo)點(diǎn)符號和控制字符轉(zhuǎn)換為計算機(jī)可以理解的數(shù)字形式。

ASCII的局限在于只能顯示26個基本拉丁字母、阿拉伯?dāng)?shù)目字和英式標(biāo)點(diǎn)符號，因此只能用于顯示現(xiàn)代美國英語（而且在處理英語當(dāng)中的外來詞如na?ve、café、élite等等時，所有重音符號都不得不去掉，即使這樣做會違反拼寫規(guī)則）。而ASCII雖然解決了部分西歐語言的顯示問題，但對更多其他語言依然無能為力。因此現(xiàn)在的軟件系統(tǒng)大多采用Unicode。

ASCII主要用于顯示現(xiàn)代英語和其他西歐語言。從2007年開始逐漸被UTF-8 代替。

Unicode

Unicode（中文：萬國碼、國際碼、統(tǒng)一碼、單一碼）是計算機(jī)科學(xué)領(lǐng)域里的一項(xiàng)業(yè)界標(biāo)準(zhǔn)。它對世界上大部分的文字系統(tǒng)進(jìn)行了整理、編碼，使得電腦可以用更為簡單的方式來呈現(xiàn)和處理文字。

UTF-8

UTF-8（8-bit Unicode Transformation Format）是一種針對Unicode的可變長度字符編碼，也是一種前綴碼。它可以用來表示Unicode標(biāo)準(zhǔn)中的任何字符，且其編碼中的第一個字節(jié)仍與ASCII兼容，這使得原來處理ASCII字符的軟件無須或只須做少部分修改，即可繼續(xù)使用。因此，它逐漸成為電子郵件、網(wǎng)頁及其他存儲或發(fā)送文字的應(yīng)用中，優(yōu)先采用的編碼。

Range首部

Range 是一個請求首部，告知服務(wù)器返回文件的哪一部分。在一個 Range 首部中，可以一次性請求多個部分，服務(wù)器會以 multipart 文件的形式將其返回。如果服務(wù)器返回的是范圍響應(yīng)，需要使用 206 Partial Content 狀態(tài)碼。假如所請求的范圍不合法，那么服務(wù)器會返回 416 Range Not Satisfiable 狀態(tài)碼，表示客戶端錯誤。服務(wù)器允許忽略 Range 首部，從而返回整個文件，狀態(tài)碼用 200 。

語法：

Range: =-
Range: =-
Range: =-, -

Range: bytes=200-1000, 2000-6576, 19000-

一級域名，二級域名

以www.baidu.com為例子
最右邊一個點(diǎn)右邊的為頂級域名（一級域名）com
一級域名左邊是二級域名 baidu

主域，子域

子域名域名系統(tǒng)等級中，屬于更高一層域的域。比如，mail.example.com
和calendar.example.com是example.com的兩個子域，而example.com
則是頂級域.com的子域

為什么換工作

不要說是因?yàn)殄X少。上一家的薪資不要做假，因?yàn)楣究赡軙椤Ｆ谕劫Y可以要高點(diǎn)，說明。