一、javaScript中如何檢測一個變數是 String 型別：
1. typeto（obj） === "srting" 2. typeTo obj === "string" 3. obj.constructor === string
二、用js去除字串空格的方法？
1. 使用正則匹配的方式：
a: str = str.replace(/s*/g,"") //去掉所有空格 b: str = str.replace(/^s|s$/g,"") // 去掉兩邊的空格 c： str = str.replace(/^s/,"") // 去掉左邊的空格 d： str = str.replace(/s$/g,"") // 去掉後面的空格
2： 使用 str.trim() 方法
a: str = str.trim(str) // 缺點無法去掉中間的空格 b: str.trimLeft() str.trimRight() // 去除左右的空格
3. 使用jquery的 $.strim() 方法
a: str = $.trim(str) // 缺點無法去掉中間的空格
三、如何獲取瀏覽器url查詢字串的引數值？
function showWindowHref(){ var shHref = window.location.href var args = shHref.split(`?`) if(args[0] === shHref){ return "" } var arr = args[1].split(`&`) var obj = {} for(var i = 0 ; i < arr.length; i++){ var stg = arr[i].split(`=`) obj[stg[0]] = stg[1]; } return obj; } var href = showWindowHref(); var value = href[`name`]
四、js對字串的操作函式
-
concat() 將兩個或者多個文字的字串連線起來，返回一個新字串。
-
indexOf() 返回字元在字串的匹配位置。如果沒有匹配到返回 -1 。
-
charAt() 返回指定位置的字元。
-
lastIndexOf() 返回匹配到的字元最後一次出現的位置。
-
match() 檢查一個字元是否匹配到正規表示式。
-
substr() 返回從字串的 startPos 位置開始。長度為 length的字串。
-
substring() 返回字串的一個子串。第一個引數是開始位置，第二個是結束位置。
-
slince() 提取字串的一部分，返回一個新字串。
-
replace() 用來查詢匹配一個正則字串，使用新字串代替匹配字串。
-
search() 執行一個正規表示式，如果匹配成功返回索引位置，如果沒有成功返回 -1 。
-
split() 將一個字串劃分為一個字串陣列。
-
toLowerCase() 將整個字串轉成小寫。
-
toUpperCase() 將整個字串換成大寫。
五、如何新增、移動、移除、複製、建立、查詢節點？
1、新增節點：
a: createDocumentFragment() // 建立一個DOM節點 b: createElement() // 建立一個具體元素 c：createTextNode() // 建立一個文字節點
2 、新增、移除、替換、插入
a： appendChild() // 新增 b: removeChild() // 移除 c： replaceChild() // 替換 d： insertBefore() // 插入
3、查詢
a： getElementsByTagName() // 根據標籤名稱查詢 b： getElementsByName() // 根據標籤元素的Name 屬性 c： getElementsById() // 根據標籤的 id查詢 唯一性
六、 寫出3個關於this的經典應用
1. 在html中的應用
<input type="button" onclick=“showInfo(this);” value="點選一下" />
2. 在建構函式中的應用
function Animal(name,color){ this.name = name; this.color = color; }
3. 在 input點選 後獲取值
var sBtn = getElementById(`#botton`) sBtn.onclick = function(){ console.log(this.value) }
4. 在 apply 和 call 求陣列最值時的應用
var number = [22,44,55,66,33,88,99] var applyNumber = Math.max.apply(this,number) console.log(applyNumber) var callNumber = Math.min.call(this,22,44,55,66,33,88,99) console.log(callNumber)
七、比較 typeof 和 instancefo 區別 ？
相同點： 都是用來判斷一個變數是否為空，或者是什麼型別。
不同點： typeof 是返回資料型別。而instanceof是返回一個boolean 值。
詳細區別：
1. typeof 一般只能返回這幾種：number、boolean、undefined、fucntion、object、string
2. typeof 用於判斷一個變數是否存在 if(typeof a!=undefined)
3. typeof 對於 Array ，null 等特殊對線都會判斷為 object
instanceof 用於判斷一個變數是否是於一個物件。
a instanceof b ? "true" : "false" var array = new Array() console.log(array instanceof Array); console.log(array instanceof Object);
2. 判斷建構函式的型別
function test(){} var a = new test() console.log(a instanceof test)
3. instanceof 判斷的 object 只是js 語法中的物件，不是dom模型對像
if (window instanceof Object){ alert(`Y`)} else { alert(`N`);} // 我的到的是true
八、如何理解閉包？
1.定義： 一個函式的返回值是 另一個函式，並且另一個函式應用了其父函式的內部變數，並且在外部被執行了，就形成了閉包。
2.使函式外部可以呼叫內部申明的變數。
3. 例項： 根據作用域鏈的規則，底層作用域沒有申明的變數會向上一級查到。知道找到window的變數，如果沒有就返回 undefined , 有就返回。
var count = 10 function add(){ var count = 0 ; return function(){ console.log( count += 1); } } var s = add(); s(); s();
4. 變數的作用域： 全域性作用域和區域性作用域
a. 函式書內部可以讀取函式外部的變數，外部不可以讀取內部的變數。
b. 內部申明變數的時候要用var 。
5. 閉包需要注意的地方：
a. 濫用閉包，會的造成記憶體洩露，由於閉包中的變數是儲存在記憶體中的，記憶體消耗過大會影響網頁效能，解決辦法是在函式退出之前刪除區域性變數。
b. 改變父元素的值，隨意改變父元素的值會影響父元素的其他地方。
九、什麼是跨域？跨域請求的資源方法有哪些？
1.什麼是跨域？
瀏覽器的同源策略導致的，方式傳送請求url的協儀、域名、埠三者有一個與當前頁面地址不同即為跨域。
2. 方法？
a. porxy 代理
定義： 用於將請求先傳送給後臺伺服器，後臺伺服器在傳送請求，然後將結果返回給前端。
實現方法： nginx 方向代理。
注意點： 1.如果代理是請求的 https協議。那麼porxy需要先新人改證照。否則請求失敗。
3. CORS
定義： 現在瀏覽器自身支援跨域的一種方法。
用法： 一般需要後端工作人員在請求資料的時候允許跨域的操作。
res.writeHead(200, { "Content-Type": "text/html; charset=UTF-8", "Access-Control-Allow-Origin":`http://localhost`, `Access-Control-Allow-Methods`: `GET, POST, OPTIONS`, `Access-Control-Allow-Headers`: `X-Requested-With, Content-Type` });
4. jsonp 跨域
定義： 動態插入一個script 標籤。原因為瀏覽器對script資源的請求沒有同源策略的限時。資源請求到就會執行沒有阻塞。
實現方式：
1. 首先在客戶端註冊一個callback, 然後把callback的名字傳給伺服器。此時，伺服器先生成JSON資料。然後以JavaScript 語法的方式，生成一個function,function名字就是傳遞上來的引數jsonp.
2.然後，將JSON資料直接以入參的方式，放置到function中，這樣就生成了一段 js 語法的文件，返回給客戶端。
3。最後，在客戶端瀏覽器中解析script標籤，並執行返回的JavaScript文件，此時資料作為引數，傳入到了客戶端預先定義好的回撥函式裡(動態執行回撥函式)。
特點： 通過動態的建立script標籤來請求其它域的資料，資料為 json 格式。
缺點： 1. 無法實現post請求。2. 請求是否失敗很難判斷。
十、談談垃圾回收機制的方式以及記憶體管理？
1. 回收機制方式？
a：垃圾回收機制：執行環境負責管理的程式碼執行過程中的的記憶體。
b: 垃圾收集器會 定期（週期性）的找出那些不在繼續使用的變數，然後釋放記憶體，但是這個不是真實的，開銷比較大，實際垃圾回收機制會定期的執行。
c: 示例如下
var fn1 = function(){ var obj = { name: "張三" } } var fn2 = function(){ var obj = {name: "張三"} return obj } var a = fn1(); var b = fn2();
fn1 中申明的變數是區域性變數，在執行fn1 後，該記憶體會被js引擎中的垃圾回收機制釋放。而fn2 中返回的變數被全域性變數b所指所以改記憶體並不會被釋放。
d: 回收策略： 標記清理 和 引用計數
標記清理： 當變數進入環境是被標記為“進入環境”離開環境是“離開環境” 某時候立即回收器會過濾掉所環境中所有的變數，以及進入的變數。剩下的就是準備回收的變數。
引用標記：就是變數的應用次數，當變數引用次數為0時，就準備回收。
十一、開發中遇到記憶體洩漏是如何解決的？
1： 定義：記憶體洩漏是指一塊被分配的記憶體，既不能使用，也不能回收。知道瀏覽器程式結束。c#和java中使用自動垃圾回收方法管理記憶體，幾乎不會發生洩漏。瀏覽器也是自動垃圾回收方法，但是瀏覽器方法有bug會產生記憶體洩露。
2： 記憶體洩漏的幾種情況：
（1）：當頁面中的元素被移除替換而繫結的事件沒有被移除，IE中沒有做出恰當處理。需要手工移除事件。
（2）： 由於函式裡面定義函式，內部函式或者事件回撥外爆了。就形成了閉包。閉包會使得函式內區域性變數得不到釋放。
function bindEvent(){ var obj = document.getElementById(`test`) obj.onclick = function(){ } } function bindEvent(){ var obj = document.getElementById(`test`) obj.onclick = function(){ } obj = null }
十二、物件導向繼承的實現。
物件導向的基本特徵是： 多型、繼承、封閉
java中繼承的方法：
-
prototype 原型鏈繼承
-
call/apply 繼承
-
混合方法 （prototype 和 call /applay ）
-
物件冒充
-
只繼承原型鏈的繼承
-
完美組合繼承
-
Object.create 繼承
1: 原型鏈繼承 （內部函式和原型鏈上都可以繼承）
function teacher(name){ this.name = name } teacher.prototype.sayName = function(){ console.log(`name` + this.name) } var teacher1 = new teacher(`張三`) function student(name){ this.name = name } student.prototype = new teacher() var student1 = new student(`李四`) teacher1.sayName() student1.sayName()
缺點： 1. 子類的原型是父類的例項化，父類的內部申明的方法被繼承在子類原型鏈上。
2. 在建立子類例項時不能向父類建構函式傳遞引數。
2： call()和apply()方法 （只能繼承內部申明的函式，不能繼承原型連上）
function teacher(name,age){ this.name = name ; this.age = age; this.sayAge = function(){ console.log(`內部方法`) } } teacher.prototype.sayName = function(){ console.log(`name` + this.name , "age" + this.age) } function student(){ var args = arguments teacher.call(this,args[0] ,args[1]); } var teacher1 = new teacher(`張三` ,`25`); var student1 = new student(`王五`,`26`); console.log(teacher1) console.log(student1) teacher1.sayName(); teacher1.sayAge(); //student1.sayName(); // 報錯 student1.sayAge();
缺點： 無法繼承原型鏈上的方法
3： 混合適用法 （原型和內部申明的方法都可繼承）
function teacher(name,age){ this.name = name ; this.age = age; this.sayAge = function(){ console.log(`內部方法`) } } teacher.prototype.sayName = function(){ console.log(`name` + this.name , "age" + this.age) } function student(){ var args = arguments teacher.call(this,args[0] ,args[1]); } student.prototype = new teacher() var teacher1 = new teacher(`張三` ,`25`); var student1 = new student(`王五`,`26`); console.log(teacher1) console.log(student1) teacher1.sayName(); teacher1.sayAge(); student1.sayName(); // 不報錯 由於繼承下來了。 student1.sayAge();
缺點： 兩次呼叫的父元素的建構函式，子類繼承父類的屬性，一組在例項上面繼承，一組在原型上面繼承（原型上建立不多餘的本該在例項的上的屬性。內部函式被經常在子類的原型上。）
-
物件冒充 (只能繼承內部申明的函式，不能繼承原型鏈上的方法)
function Teacher(name,age){ this.name = name; this.age = age; this.sayAge = function(){ console.log(`物件方法`) } } Teacher.name = "牛逼" Teacher.sayName = function(){ console.log(`name`+ this.name + `靜態方法` ) } Teacher.prototype.sayAAA = function(){ console.log(`prototype -- teacher`) } function Student(name,age){ this.student = Teacher ; this.student(name,age); delete this.student ; } // Student.prototype.sayAAA = function(){ // console.log(`student`) // } var teacher1 = new Teacher(`張三`,`17`); var student1 = new Student(`李四`,`25`); // console.log(teacher1) teacher1.sayAAA(); student1.sayAAA();
缺點： 原型鏈上的方法無法繼承
-
只繼承原型鏈的繼承(無法繼承內部函式)
function teacher(name){ this.name = name } teacher.prototype.sayName = function(){ console.log(`name` + this.name) } var teacher1 = new teacher(`張三`) function student(name){ this.name = name } student.prototype = teacher.prototype var student1 = new student(`李四`) teacher1.sayName() student1.sayName()
缺點：無法繼承建構函式的物件方法
-
完美組合繼承
function teacher(name,age){ this.name = name ; this.age = age; this.sayAge = function(){ console.log(`內部方法`) } } teacher.prototype.sayName = function(){ console.log(`name` + this.name , "age" + this.age) } function student(){ var args = arguments teacher.call(this,args[0] ,args[1]); } student.prototype = teacher.prototype var teacher1 = new teacher(`張三` ,`25`); var student1 = new student(`王五`,`26`); console.log(teacher1) console.log(student1) teacher1.sayName(); teacher1.sayAge(); student1.sayName(); // 不報錯 由於繼承下來了。 student1.sayAge();
缺點：=========
7. Object.create 繼承
function teacher(name){ this.name = name this.sayAge = function(){ console.log(`內部方法`) } } teacher.prototype.sayName = function(){ console.log(`prototype`) } function student(name){ this.name = name } student.prototype = Object.create(teacher.prototype) var student1 = new student(`張三`) console.log(student1) student1.sayAge(); // 報錯 student1.sayName(); // prototype
缺點：無法繼承內部申明的方法。與student.prototype = teacher.prototype 的區別在於一個是在自己的原型裡面生成另一個父元素一樣的原型鏈，一個是將原型指向父元素的原型。
十二、建構函式的三種方法申明
1. 靜態方法： 就是通過建構函式 XXX.test = function (){} 來申明的方法。例項化是無法繼承的，通過繼承也會是無法繼承的，呼叫方式只有 XXX.test() 方式來呼叫。
2. 物件方法一般是 在建構函式裡面通過 this.test = function(){} 來申明的。例項化和繼承都可以繼承屬性。
3. 物件的原型方法，通過例項化和繼承都可以被繼承。
十三、判斷一個字串中出現次數最多的的字母？
var str = `asdfssaaasasasasaa` var json = {} for(var i = 0 ; i < str.length ; i++){ if(!json[str[i]]){ json[str[i]] = 1 }else{ json[str[i]]++ } } var iMax = 0; var iIndex = "" for( key in json){ if(json[key] > iIndex){ iIndex = json[key]; iMax = key } } console.log(`出現次數最多的是:`+iMax+`出現`+iIndex+`次`);
十四、Array 物件屬性
constructor 返回對建立此物件的陣列函式的引用。
length 設定或返回陣列中元素的數目。
prototype 使您有能力向物件新增屬性和方法。
Array 物件方法
concat() 連線兩個或更多的陣列，並返回結果。
join() 把陣列的所有元素放入一個字串。元素通過指定的分隔符進行分隔。
pop() 刪除並返回陣列的最後一個元素。
shift() 刪除並返回陣列的第一個元素
push() 向陣列的末尾新增一個或更多元素，並返回新的長度。
unshift() 向陣列的開頭新增一個或更多元素，並返回新的長度。
reverse() 顛倒陣列中元素的順序。
slice() 從某個已有的陣列返回選定的元素
sort() 對陣列的元素進行排序
splice() 刪除元素，並向陣列新增新元素。
toSource() 返回該物件的原始碼。
toString() 把陣列轉換為字串，並返回結果。
toLocaleString() 把陣列轉換為本地陣列，並返回結果。
valueOf() 返回陣列物件的原始值
十五、編寫一個方法 去掉一個陣列的重複元素
方法一：
var arr = [0,2,3,4,4,0,2]; var obj = {}; var tmp = []; for(var i = 0 ;i< arr.length;i++){ if( !obj[arr[i]] ){ obj[arr[i]] = 1; tmp.push(arr[i]); } } console.log(tmp); 結果如下： [0, 2, 3, 4]
方法二：
var arr = [2,3,4,4,5,2,3,6], arr2 = []; for(var i = 0;i< arr.length;i++){ if(arr2.indexOf(arr[i]) < 0){ arr2.push(arr[i]); } } console.log(arr2); 結果為：[2, 3, 4, 5, 6]
HTML & CSS:
一、什麼是盒模型？
一個元素佔空間大小的構成：border、padding、margin、content 組成。
二、什麼是行內元素、塊級元素、空元素。
行內元素： span i em img a b strong input button textarea label select
塊級元素： div ui li p h1-h6 dl dd dt blockquote
空元素：（系沒有內容的元素） ： img input br link mate hr
三、css的垂直居中5種方式：
-
父元素設定： position：relative ；
子元素設定為： position： absolute; top:0; left:0; right:0; bottom:0; margin: auto;
2. 父元素設定為： position： relative ；
子元素設定為： position： absolute：top：50%；left：50%；margin-top: 高度一半；margin- left：寬度的一半
3. 父元素設定為： poistion： relative；
子元素設定為：position： absolute；top: 50%; left: 50%; trasform: translate(-50%,-50%);
4. 父元素設定為: display: felx ; align-items: conter ; justify-content: conter ;
子元素不設定：
5. 文字的垂直和水平居中： text-align： conter ； line-height： height ；
四、簡述一下 src 和 href 的區別？
src： 用於指向外部資源的位置，將內容巢狀到文件所在位置，將所引用的資源下載並應用到文件。在下此類文件的時候瀏覽器引擎會暫停其他資源的下載和處理。知道此類檔案被下載、編譯、執行完成，更像是嵌入到當前標籤內。這也是js為什麼需要在最後載入。
href： 用於指向網路資源的位置，建立當前文件和當前連線的聯絡。用於超連結。
五、簡述同步和非同步的區別：
同步是阻塞模式，非同步是不阻塞模式
同步是在當一個程式進行某個請求的時候，不在執行後面的程式碼，一直處於等待狀態。直到受到返回資訊。
非同步是指當一個程式進行某個請求的時候，繼續執行後面的程式碼，受到返回在執行返回的程式碼。效率高。
六、px 和 em 的區別
px和em 都是長度單位
px： 是一個固定大小的單位。
em: 值不是固定的。並且會繼承父元素的font-size:的大小。
瀏覽器預設font-size： 是16px ； 所以 16px = 1em
七、瀏覽器核心分別是什麼？
IE: trident 核心
Firfox: gecko 核心
Safari： webkit 核心
Opera : Blink 核心
Chrome： Blink核心
八、什麼叫優雅降級和漸進增強？
優雅降級： 一開始就構建完整功能，然後在相容低版本的瀏覽器。
漸進增強： 針對低版本的瀏覽器時先保證最基本的功能，然後在根據高版本的瀏覽器追加功能。
九、localstorage 、 sessionstorage 、 cookie 的區別？
共同點: 儲存瀏覽器的快取資料
區別：
1. 儲存內容是否傳送到伺服器：設定cookie後會將儲存的資料自動發到伺服器，造成寬頻浪費。
web storage 會將資料快取在本地。
2. 資料儲存的大小不同： cookie 是不能超過4K, web storage 可以大到5M
3. 資料儲存的時間區別： cookie 在這支時間之前都有效。 sessionstorage 在關閉瀏覽器之前有效。
localstorage 是永久有效的。
4. 作用域不同： cookie 和 localstorage 是在同源視窗中共享的。sessionstorage不會在
十、 web storage 於 cookie的優勢：
1. 儲存空間大 2. 不會向伺服器傳送內容，3.豐富易用的介面，4獨立的儲存空間。
十一、ajax的優缺點以及工作原理？
定義和用法： asynchronous javascript and xml ；。是一種快速建立動態網頁的技術，無需重新載入真個頁面，只需要部分重新整理的技術。
優點： 1.減少了伺服器端壓力，按需請求，最大程度的減少了冗餘請求。
2. 區域性重新整理。
3. 基於XML的標準。廣泛應用。
缺點： 1.大量的ajax情求，在編輯的時候需要考錄瀏覽器相容。
2. 只是區域性重新整理，對後退沒有用。
3.對流媒體的和移動裝置的支援不太好。
ajax 實現步驟：
1.建立ajax物件。（XMLHttpRequest）
2.判斷傳輸方式 （GET/POST）
3.開啟連線 （open）
4.傳送請求 （send）
5.完成前四步。onreadystatechange 判斷響應碼在200-300.或者 304.執行回撥。
十二、請指出document load 和 document ready 的區別？
相同點: 頁面文件載入是觸發。
不同點： ready 表示文件已經載入完成，不包含圖片和和非文字檔案
load 表示文件載入完成，包含圖片檔案在內的所有元素
十三、正則表達
1. 寫一個function 清楚字串前後的空格。
function trim(str){ if(str && typeof str === "string"){ return str.replace(/(^s*)| (s*)$ /g ,""); } }
-
郵箱校驗
var reg = /^(w)+(.w+)*@(w)+((.w{2,3}){1,3})$/; var email = "example@qq.com"; console.log(reg.test(email)); // true
十四、開發以及效能的優化
1、規避多人開發函式重名命名的問題？
名稱空間、封閉 空間、變數轉化為物件變數、模組化、物件化
2、請說出三種減低頁面的載入時間的方法?
(1) 壓縮css，js 檔案
（2）合併css，js 檔案，減少http請求
（3）外部引入的js、css放在最底部
(4) 減少dom操作。儘可能的用變數替換不必要的dom操作。
3、你所瞭解的web技術攻擊
（1）XSS 跨站指令碼攻擊： 通過存在安全漏洞的網站，使得註冊使用者使用者的瀏覽器執行非法html或者jacascript程式碼。
（2）SQL 注入攻擊
（3）SCRF 攻擊：通過已經設定好的陷阱，對註冊使用者做一些資訊更改。
4、web前端如何提高效能的優化？
內容方面：
1. 減少HTTP請求 2. 減少dom 3. 使用ajax請求，（可快取）
針對css：
1.將css程式碼放在上端。 2.從頁面中剝離js、css 3. 精簡css。4 避免css表示式、
針對jacascript：
1. 指令碼放在底部。 2.從頁面剝離js程式碼。3. 精簡程式碼。4.移除重複
針對圖片：
1. 優化圖片。2不要在html中使用縮放圖。3。給圖片上設定寬高。一面圖片為載入不影響後面的載入。
5、瀏覽器如何渲染頁面？
1. 解析html檔案，建立dom樹，遇到 link style 和 script 會阻塞。外部樣式不會阻塞 script的載入。
2. 解析css。優先順序別： 瀏覽器預設樣式< 使用者設定物件 < 外部樣式 < 內聯樣式 < html中的style
3. 將css於html結合。渲染dom樹。
4. 佈局和重繪。重繪和重排。
6.頁面閃爍 –》 頁面中先載入出html的結構，之後再載入我們的樣式
vue.js 題目
1、v-model是什麼？ vue中標籤怎麼繫結事件？
答：v-model這個指令只能用在表單元素上，可以用他進行雙向資料繫結。繫結事件：<input @click=doLog() />
2、mvvm框架是什麼？說說對雙向資料繫結的理解？它和其它框架（jquery）的區別是什麼？哪些場景適合？
答：mvvm的m模型就是用來定義驅動的資料、v經過資料改變後的html、vm就是連線資料和檢視，用來實現雙向繫結
雙向繫結:一個變了另外一個跟著變了，例如：檢視一個繫結了模型的節點有變化，模型對應的值會跟著變
區別：vue資料驅動，通過資料來顯示檢視層而不是節點操作。
場景：資料操作比較多的場景，更加便捷
3、自定義指令的方法有哪些？它有哪些鉤子函式？還有哪些鉤子函式引數？
答：全域性定義指令：在vue物件的directive方法裡面有兩個引數，一個是指令名稱，另外一個是函式。元件內定義指令（區域性定義指令）：directives
鉤子函式：bind（繫結事件觸發）、inserted(節點插入的時候觸發)、update（元件內相關更新）、componentUpdated（被繫結元素所在模板完成一次更新週期時呼叫）、unbind（只呼叫一次，指令與元素解綁時呼叫）
鉤子函式引數：el、binding
4、說出至少4種vue當中的指令和它的用法？
答：v-if：判斷是否隱藏；v-for：資料迴圈出來；v-bind:class：繫結一個屬性；v-model：實現雙向繫結
5、請詳細說下你對vue生命週期的理解？
總共分為8個階段建立前/後，載入前/後，更新前/後，銷燬前/後。
建立前/後： 在beforeCreated階段，vue例項的掛載元素$el和資料物件data都為undefined，還未初始化。在created階段，vue例項的資料物件data有了，$el還沒有。
載入前/後：在beforeMount階段，vue例項的$el和data都初始化了，但還是掛載之前為虛擬的dom節點，data.message還未替換。在mounted階段，vue例項掛載完成，data.message成功渲染。
更新前/後：當data變化時，會觸發beforeUpdate和updated方法。
銷燬前/後：在執行destroy方法後，對data的改變不會再觸發周期函式，說明此時vue例項已經解除了事件監聽以及和dom的繫結，但是dom結構依然存在
6、請說下 vue 元件的優點，以及註冊使用的過程？
答：首先，元件可以提升整個專案的開發效率。能夠把頁面抽象成多個相對獨立的模組，解決了我們傳統專案開發：效率低、難維護、複用性等問題。
使用Vue.component方法註冊元件。子元件需要資料，可以在props中接受定義。而子元件修改好資料後，想把資料傳遞給父元件。可以採用emit方法。
7、Vue.js內建的指令，用什麼開頭？
v-開頭的
以上內容借鑑：