1.閉包

閉包就是在函數中嵌套函數 作用是可以讀取其他函數中的變量 突破作用域 并且在函數中涉及到的變量會永遠保存于內存中

2.作用域鏈

作用域鏈就是在執行環境中有序的限制和控制變量以及函數的可訪問范圍 在作用域鏈中變量只能向上訪問不能向下

3.JavaScript的原型 原型鏈 有什么特點

每個對象都會在其內部初始化一個屬性 就是原型 prototype

當我們訪問一個對象中不存在的屬性時 他會去他的prototype 中尋找 未找到再向prototype中尋找 以此類推 就形成了原型鏈

關系：instance.constructor.prototype = instance.proto
構造函數的原型對象=實例化對象的對象原型

特點：當我們更改構造函數的原型時 相應的構造函數中也可以繼承到該屬性 當我們需要一個對象中的屬性時 Javascript引擎會幫我們尋找當前對象中是否有 如果沒有則向上prototype中去尋找 一直檢索到 Object 內建對象

4.事件代理

事件代理又稱為事件委托 就是根據DOM的事件冒泡原理 將應該注冊的事件委托給父元素 讓其擔當事件的監聽職務 從而大量的節省內存的占用 減少事件的注冊尤其是動態添加的子元素無需為其注冊事件

5.Javascript如何實現繼承

可以使用原型對象和構造函數的混合方式實現繼承

6.this對象

在函數中的this指向函數的直接調用者
如果有new關鍵字 則this指向new實例的對象
在事件中this指向出發這個事件的對象 IE中的attchEvent（綁定事件）函數的默認this指向為window 要解決問題可以通過call改變方法的指向

7.事件模型

W3c中定義事件的發生經歷三個階段 捕獲階段 目標階段 冒泡階段
冒泡型事件 當使用冒泡事件時 子級元素先觸發 父級元素后觸發
捕獲型事件 當使用捕獲事件時 父級元素先觸發 子級元素后出發
DOM事件流 同時支持捕獲和冒泡事件
阻止冒泡 W3c中使用stoppropagation（）方法 在IE下設置cancelBubble=true
阻止捕獲 阻止事件的默認行為 在W3c中使用preventDefault（）方法 在IE下設置window.event.returnValue = false

8.new操作符

創建一個空白對象 并且this變量引用該對象 同時繼承該對象的原型
屬性和方法都被加入到this引用的對象中
新創建的對象由this所引用 并且最后隱式的返回this

9.ajax原理

Ajax的原理簡單來說是在用戶和服務器之間加了—個中間層(AJAX引擎) 通過XmlHttpRequest對象來向服務器發異步請求 從服務器獲得數據 然后用javascript來操作DOM而更新頁面 使用戶操作與服務器響應異步化 這其中最關鍵的一步就是從服務器獲得請求數據
Ajax的過程只涉及JavaScript XMLHttpRequest和DOM XMLHttpRequest是ajax的核心機制
ajax優點
通過異步模式 提升了用戶體驗
優化了瀏覽器和服務器之間的傳輸 減少不必要的數據往返 減少帶寬的占用
Ajax在客戶端運行 承擔了一部分本來由服務器承擔的工作 減少了大用戶量下的服務器負載
Ajax可以實現動態不刷新（局部刷新）
ajax缺點
安全問題 AJAX暴露了與服務器交互的細節
對搜索引擎的支持比較弱
不容易調試

10.解決跨域問題

首先了解下瀏覽器的同源策略 同源策略/SOP（Same origin policy）是一種約定，由Netscape公司1995年引入瀏覽器，它是瀏覽器最核心也最基本的安全功能，如果缺少了同源策略，瀏覽器很容易受到XSS、CSFR等攻擊。所謂同源是指"協議+域名+端口"三者相同，即便兩個不同的域名指向同一個ip地址，也非同源
解決跨域：
通過jsonp跨域
document.domain + iframe跨域
nginx代理跨域
nodejs中間件代理跨域
后端在頭部信息里面設置安全域名

11.模塊化開發怎么做

一個功能就是一個模塊 多個模塊可以組成完整應用 抽離一個模塊不會影響其他模塊的運行

立即執行函數不暴露私有成員

12.異步加載js的方式有哪些

defer 只支持IE
asyec
創建script 插入DOM中 加載完畢后callBack

13.會造成內存泄漏的操作

內存泄露指任何對象在您不再擁有和需要他之后仍然存在
setTimeout的第一個參數使用字符串而非函數的話會發生內存泄漏
閉包使用不恰當 控制臺日志、循環（在兩個對象彼此引用且彼此保留時，就會產生一個循環）

14.XML和JSON的區別

1. 數據體積方面
   JSON相對于XML來說 數據體積更小 傳遞的速度更快些
2. 數據交互方面
   JSON和script的之間的交互更加方便 更容易解析處理 更好的數據交互
3. 數據描述方面
   JSON對數據的描述比XML較差
4. 傳輸速度方面
   JSON的速度要遠快于XML

15.webpack

WebPack 是一個模塊打包工具，你可以使用WebPack管理你的模塊依賴，并編繹輸出模塊們所需的靜態文件。它能夠很好地管理、打包Web開發中所用到的HTML、Javascript、CSS以及各種靜態文件（圖片、字體等），讓開發過程更加高效。對于不同類型的資源，webpack有對應的模塊加載器。webpack模塊打包器會分析模塊間的依賴關系，最后 生成了優化且合并后的靜態資源

16.AMD和Commonjs

Commonjs是后端服務器模塊的規范 node.js采用這個規范 Common規范加載模塊是同步的也就是說只有加載完成后才能進行后面的操作
AMD規范則是非同步加載模塊 允許指定回調函數 AMD推薦的風格通過返回一個對象作為模塊對象
Commonjs的風格通過對module.exports或exports的屬性賦值來達到暴露模塊對象的目的
es6模塊 CommonJS、AMD、CMD
CommonJS 的規范中，每個 JavaScript 文件就是一個獨立的模塊上下文（module context），在這個上下文中默認創建的屬性都是私有的。也就是說，在一個文件定義的變量（還包括函數和類），都是私有的，對其他文件是不可見的。
CommonJS是同步加載模塊,在瀏覽器中會出現堵塞情況，所以不適用
AMD 異步，需要定義回調define方式
es6 一個模塊就是一個獨立的文件，該文件內部的所有變量，外部無法獲取。如果你希望外部能夠讀取模塊內部的某個變量，就必須使用export關鍵字輸出該變量 es6還可以導出類、方法，自動適用嚴格模式

17.常見web安全及護理原理

• sql注入原理
  就是通過把SQL命令插入到Web表單遞交或輸入域名或頁面請求的查詢字符串，最終達到欺騙服務器執行惡意的SQL命令
  總結以下幾點：
  永遠不要信任用戶的輸入，要對用戶的輸入進行校驗，可以通過正則表達式，或限制長度，對單引號和雙"-"進行轉換等
  永遠不要使用動態拼裝SQL，可以使用參數化的SQL或者直接使用存儲過程進行數據查詢存取
  永遠不要使用管理員權限的數據庫連接，為每個應用使用單獨的權限有限的數據庫連接
  不要把機密信息明文存放，請加密或者hash掉密碼和敏感的信息
• XSS原理及防范
  Xss(cross-site scripting)攻擊指的是攻擊者往Web頁面里插入惡意html標簽或者javascript代碼。比如：攻擊者在論壇中放一個看似安全的鏈接，騙取用戶點擊后，竊取cookie中的用戶私密信息；或者攻擊者在論壇中加一個惡意表單，當用戶提交表單的時候，卻把信息傳送到攻擊者的服務器中，而不是用戶原本以為的信任站點
• XSS防范方法
  首先代碼里對用戶輸入的地方和變量都需要仔細檢查長度和對”<”,”>”,”;”,”’”等字符做過濾；其次任何內容寫到頁面之前都必須加以encode，避免不小心把html tag 弄出來。這一個層面做好，至少可以堵住超過一半的XSS 攻擊
• XSS與CSRF有什么區別嗎？
  XSS是獲取信息，不需要提前知道其他用戶頁面的代碼和數據包。CSRF是代替用戶完成指定的動作，需要知道其他用戶頁面的代碼和數據包。要完成一次CSRF攻擊，受害者必須依次完成兩個步驟

1. 登錄受信任網站A，并在本地生成Cookie
2. 在不登出A的情況下，訪問危險網站B

• CSRF的防御
  服務端的CSRF方式方法很多樣，但總的思想都是一致的，就是在客戶端頁面增加偽隨機數
  通過驗證碼的方法

18 用過哪些設計模式？

1. 工廠模式：
   工廠模式解決了重復實例化的問題，但還有一個問題,那就是識別問題，因為根本無法
   主要好處就是可以消除對象間的耦合，通過使用工程方法而不是new關鍵字
2. 構造函數模式
   使用構造函數的方法，即解決了重復實例化的問題，又解決了對象識別的問題，該模式與工廠模式的不同之處在于
   直接將屬性和方法賦值給 this對象;

19 為什么要有同源限制？

同源策略指的是：協議，域名，端口相同，同源策略是一種安全協議
舉例說明：比如一個黑客程序，他利用Iframe把真正的銀行登錄頁面嵌到他的頁面上，當你使用真實的用戶名，密碼登錄時，他的頁面就可以通過Javascript讀取到你的表單中input中的內容，這樣用戶名，密碼就輕松到手了。

20 offsetWidth/offsetHeight,clientWidth/clientHeight與scrollWidth/scrollHeight的區別

• offsetWidth/offsetHeight返回值包含content + padding + border，效果與e.getBoundingClientRect()相同
• clientWidth/clientHeight返回值只包含content + padding，如果有滾動條，也不包含滾動條
• scrollWidth/scrollHeight返回值包含content + padding + 溢出內容的尺寸

21.Javascript有哪些方法定義對象

對象字面量：var obj={}
構造函數：var obj=new object（）
Object.create（）：var obj=Object.create（Object.prototype）

22.常見的兼容性問題

png24位的圖片在IE瀏覽器上出現背景解決方案是做成png8
瀏覽器默認的margin和padding不同 可通過 全局添加margin：0；padding：0；來統一
IE下evevnt對象有x，y屬性 但是沒有pagex，pagey屬性
Firefox下event對象有pagex pagey屬性沒有x y 屬性

23.promise

依照promise/A+的定義 promise有四種狀態
pending ：初始狀態 非 fulfilled（成功的操作）或 rejected（失敗的操作）
fulfilled和rejected合稱settled
promise對象用于延遲（deferred）和異步（asynchronous）計算
promise的構造函數
基本用法如下：

var p1=new promise（（resolve，reject）=>{
if（---）{resolve（data）
}else{reject（err）
}
}）

promise實例擁有then方法（具有then方法的對象 通常被稱為thenable）使用方法如下
p1.then（（aa，bb）
接收兩個函數做為參數aa就是在fulfilled的時候被調用 bb在rejected的被調用 接收的參數就是future aa對應resolve bb對應reject

24.Jquery有哪些寫得好的地方

1>jquery源碼封裝在一個匿名函數的自執行環境中 有助于防止變量的全局污染 然后通過傳入window對象參數 可以使windown對象作為局部變量使用 好處是當jquery 訪問windown對象的時候 就不用將作用域鏈退回訪頂級作用域了 從而可以更快的訪問windown對象了 同樣傳遞undefined參數 可以縮短查找undefined時的作用域鏈
2>jquery將一些原型屬性和方法封裝在了jquery.prototype中 為了縮短名稱 又賦值給了jquery.fn 這是很形象的寫法
3>有一些數組和對象的方法經常能使用到 jquery將其保存為局部變量以提高訪問速度
4>jquery實現的鏈式調用可以節約代碼 所有返回的都是同一對象 可以提高代碼效率

25.vue react angular

vue.js一個用于創建web交互頁面的庫 是一個精簡的MVVM 他通過雙向數據綁定把view層和model層連接起來 實際的DOM封裝和輸出格式都被抽象為了Directives和Filtes
AngularJs是一個比較完善的前端MVVM框架 包含模板 數據雙向綁定 路由 模塊化 服務 依賴注入等所有功能 模板功能強大豐富自帶豐富的Angular指令
react React僅僅是VIEW層facebook公司 推出的用于構建ui的一個庫能都是先服務器端的渲染使用virtual dom 所以性能很好

26.Node的應用場景

特點
他是一個Javascript運行環境
依賴于chrome V8引擎進行代碼解釋
事件驅動
非堵塞I/O
單進程 單線程
優點
高并發（最重要的優點）
缺點
只支持單核cpu 不能充分利用cpu
可靠性能低 一旦代碼某個環節崩潰整個代碼崩潰

27.web開發中會話跟蹤的方法

cookie
session
url重寫
隱藏input
ip地址

28.js的基本數據類型

• 未定義undefined
• 空 null
• 布爾 boolean
• 數字 number
• 字符串 string

29.Js中的內置對象

• object是Javascript中的所有對象的父對象
  數據封裝類對象有：
  object Array Boolean Number String
  其他對象：
  Function Arguments Math Data RegExp Error

30.寫Javascript的規范

1. 不要再同一行聲明多個變量
2. 盡量使用=== / !== 來比較true/false 或者數值
3. 適用對象字面量替代new Array這個形式
4. 不要使用全局函數
6. Switch語句必須帶有的default分支
7. if語句必須有大括號
8. for-in循環中的變量 應該使用var關鍵字明確限定作用域 從而避免作用域污染

31.Javascript有幾種類型的值

• 棧：原始數據類型（Undefined，Null，Boolean，Number、String）
• 堆：引用數據類型（對象、數組和函數）
• 兩種類型的區別是：存儲位置不同；
• 原始數據類型直接存儲在棧(stack)中的簡單數據段，占據空間小、大小固定，屬于被頻繁使用數據，所以放入棧中存儲；
• 引用數據類型存儲在堆(heap)中的對象,占據空間大、大小不固定,如果存儲在棧中，將會影響程序運行的性能；引用數據類型在棧中存儲了指針，該指針指向堆中該實體的起始地址。當解釋器尋找引用值時，會首先檢索其
• 在棧中的地址，取得地址后從堆中獲得實體

32.null和undefined的區別

• null 表示不存在這個值
  表示一個對象被定義了值為空值 可以理解為一個空對象里面沒有屬性跟方法
• undefined 表示表示缺少值 或者說是應該有這個值而并沒有定義
  變量被聲明了但是沒有賦值 返回就是undefined
• 如果作為函數的參數 表示該函數的參數不是對象 在驗證null時 一定要用 === 因為 == 無法分別null和undefined