整理前端面試常見問題

?1、離職多久了


2、大約多久到崗


3、離這里多遠


4、會考慮搬家嗎


5、公司會加班


6、為什么要離職


7、你們這個整個公司的技術團隊一共有幾個人


1、怎么獲取編輯頁當前數據下標和內容


2、怎么獲取報錯消息


3、loading動畫怎么用的


4、表單驗證報錯消息


5、vue里面,在哪個生命周期獲取滾動高度


? ? mounted? 掛載后 執行完頁面渲染后的生命周期函數

6、mounted 是什么生命周期


? ? 掛載后

7、下拉加載更多怎么實現的


先獲取頁面總高度offsetheight,然后獲取頁面可視高度clientheigth,最后獲取頁面滾動的高度scrollTop,如果說頁面可視高度加上頁面滾動高度大于等于頁面總高度,就再加載下一頁數據

8、在路由跳轉時候是怎么傳參的


? ? ? <router-link to="'/server/'+id"></router-link>? //拼接字符串

? ? ? 接收方式? this.$router.params

? ? ? <router-link to="{ path: '/user' ,query:? { ID : id } }"></router-link>? //query 傳參

? ? ? 接收方式? this.$router.query

? ? ? <router-link to="{ name: 'user' ,params:? { ID : id } }"></router-link>? //params 傳參

? ? ? 接收方式? this.$router.params


9、什么時候路由傳參


? ? 跳轉詳情頁?

? ? 加入購物車

10、vuex數據和頁面交互


? ? vuex核心概念

? ? state --- 狀態

? ? actions --- 異步操作

? ? mutations --- 改變狀態的方法

? ? getter --- 計算屬性

? ? module --- 模塊

1)取 state 數據

? ? ? ? ? ? computed:{

? ? ? ? ? ? ? ? 屬性名(){

? ? ? ? ? ? ? ? ? ? return? this.$store.state.XXXX

? ? ? ? ? ? ? ? }

? ? ? ? ? ? }

? ? ? ? 2) 調用 mutations

? ? ? ? ? ? methods:{

? ? ? ? ? ? ? ? 方法(){

? ? ? ? ? ? ? ? ? ? this.$store.commit("XXXX")

? ? ? ? ? ? ? ? }

? ? ? ? ? ? }

? ? ? ? 3)調用 actions

? ? ? ? ? ? methods: {

? ? ? ? ? ? ? ? 方法(參數) {

? ? ? ? ? ? ? ? this.$store.dispatch("actions方法名", 參數);

? ? ? ? ? ? ? ? }

? ? ? ? ? ?}

? ? ? ? 4)調用geeters

? ? ? ? ? ? computed: {

? ? ? ? ? ? ? ? 自定義屬性名() {

? ? ? ? ? ? ? ? ? ? return this.$store.getters.XXXX;

? ? ? ? ? ? ? ? }

? ? ? ? ? ? },

11、vuex什么時候用到


? ? ? ?購物車 存儲數據 跨組件共享數據? 跳轉詳情頁

? ? ? 父子組件通信的話,可以直接emit on,而多層嵌套組件通信就需要有vuex這樣的解決方案

12、購物車怎么判斷重復添加值


? ? ? ?some? indexOf? ?findIndex? filter

?13、對this的理解


? ? ? ? ?當前發生事件的源

??? 1、普通函數? this 指向 window?

? ??2、事件 this 指向當前發生的元素,也就是事件本身

? ??3、方法? this 指向當前方法

? ??4、使用new 實例化對象? ? this? 指向空白對象(構造函數中的this指向實例化對象)

? ??5、es6箭頭函數 this? 指向 外層作用域的this

? ??6、定時器(除了es6)? this? 指向 window

14、在json操作屬性(增,刪,改,查)


? 增? ? ? ?json.name='12'? json[name]='12'

? 刪? ? ? ?一維數組刪除 delete json.name? ?二維數組刪除 delete?json[0];

? 改? ? ? ?json.name='45'? ?json[name]='45'

? 查? ? ? ?json.name

15、什么為真,什么為假


? ? ? ? 假:

? ??????????1、false (布爾型)

? ??????????2、null (用于定義空的或者不存在的引用)

? ??????????3、undefined (未定義值)

? ??????????4、0 (數值型)

? ??????????5、" " (空字符串) (字符型)

? ??????????6、NaN

? ? ? ? ? ? 7、null==undefined? true

? ? ? ? 真:

? ? ? ? ? ? ? 1、1

? ? ? ? ? ? ? 2、0==false

? ? ? ? ? ? ? 3、!!1

? ? ? ? ? ? ? 4、!0

? ? ? ? ? ? ? 5、0!=1

? ? ? ? ? ? ? 6、假的全部加上!

? ? ? ? ? ? ? 7、0==undefined? false

??????????????8、undefined===null? false

??????????????9、undefined==true? false

? ? ? ? ? ? ?10、undefined==false? false

? ? ? ? ? ???11、NaN==NaN? false

除了加號 其他的都會隱式轉換

17、輸入一個網址以后會發生什么


????????1、瀏覽器向DNS服務器請求解析URL中的域名對應的IP地址。

????????2、根據IP地址和默認端口,和服務器建立TCP連接。

????????3、瀏覽器發出HTTP請求,該請求報文作為TCP三次握手的第三個報文的數據發送給服務器。

????????4、服務器對瀏覽器做出響應,并把html文本發送給瀏覽器。

????????5、釋放TCP連接

????????6、瀏覽器解析HTML內容,并對頁面進行渲染呈現給用戶。

18、get和post有什么區別


????????GET請求的參數是放在URL里的,POST請求參數是放在請求body里的

????????GET請求的URL傳參有長度限制,而POST請求沒有長度限制

????????GET請求的參數只能是ASCII碼,所以中文需要URL編碼,而POST請求傳參沒有這個限制

????????GET可以做分享和收藏?

????????GET 32k? POST 2G??

? ? ????GET傳輸方式在 地址欄 不安全 POST 傳輸在請求中?

19、深拷貝和淺拷貝


????????1、淺拷貝: 將原對象或原數組的引用直接賦給新對象,新數組,新對象/數組只是原對象的一個引用

????????2、深拷貝: 創建一個新的對象和數組,將原對象的各項屬性的“值”(數組的所有元素)拷貝過來,是“值”而不是“引用”

????? ? 淺拷貝只是復制了對象的引用地址,兩個對象指向同一個內存地址,所以修改其中任意的值,另一個值都會隨之變化,這就是淺拷貝 也就是存放變量的棧內存 Stack 在 堆內存 heap 中開辟的新內存 并且指向同一個定義的方法或數值中

? ? ? ? ? 深拷貝是將對象及值復制過來,兩個對象修改其中任意的值另一個值不會改變,這就是深拷貝

20、你的項目優勢在哪里


????????1、一個頁面了解動態項目全局

????????????????在主頁面的時候 分別有動態條形圖 柱狀圖 圓形圖 可以更直觀的了解項目全局

????????2、進度逾期,超支自動預警

????????????????系統會自動預警車源不足,超支,資源超負荷等情況,盡可能早地發現和解決問題

????????3、項目+業務一體化

????????????????通過項目管控合同的執行,交付,成本以及收入,一個頁面可清晰了解成本與收入情況

????????4、加密性能強

????????????????非登陸不可進入,主要是保護了用戶的隱私,使用戶體驗更良好

21、堆和棧


????????堆:? 在計算機領域中 堆是隊列優先 先進先出 內存是( heap )內存 存放的是 一些局部變量 存放的函數的參數值

????????棧:? 棧是先進后出? 內存就是(stack)就是操作系統的自動分配 如果程序員不釋放,程序結束的時候就進行os回收機制

22、組件通信


????父子? ? --- props

? ? ? ????? 父組件? ---

? ? ? ? ? ????? < 子組件名? v-bind:自定義屬性名="要傳遞的值" ></子組件名>

? ? ? ????? 子組件

? ? ? ? ? ????? props:['自定義屬性名'],

? ? ? ? ? ????? {{ 自定義屬性名? }}

? ?子父? ? $emit

? ? ? ? 父組件

? ? ? ? ? ? <子組件? v-on:子組件定義的 自定義事件名="方法名"></子組件>

? ? ? ? ? ? methods:{

? ? ? ? ? ? ? ? 方法名(參數){

? ? ? ? ? ? ? ? ? ? 參數 === 子組件 傳遞的數據

? ? ? ? ? ? ? ? }

? ? ? ? ? ? }

? ? ? ? 子組件

? ? ? ? ? ? methods:{

? ? ? ? ? ? ? ? 事件(){

? ? ? ? ? ? ? ? ? ? this.$emit("自定義事件名",要傳遞的數據)

? ? ? ? ? ? ? ? }

? ? ? ? ? ? }

? ? 非父子(兄弟 爺孫? )?

? ? ? ? 創建一個 vue實例? ? ? $emit() 傳數據? ? $on() 取數據

? ? ? ? let bus=new Vue()

? ? ? ? 第一個組件 (兄) 傳數據

? ? ? ? ? ? methods:{

? ? ? ? ? ? ? ? 方法名(){

? ? ? ? ? ? ? ? ? ? bus.$emit("自定義事件名","要傳遞的數據")

? ? ? ? ? ? ? ? }

? ? ? ? ? ? }

? ? ? ? 第二個組件 (弟) 接受數據

? ? ? ? ? ? 組件 生命周期函數 / 鉤子函數? ? --組件已掛載

? ? ? ? ? ? mounted(){

? ? ? ? ? ? ? ? bus.$on("自定義事件名",(參數)=>{

? ? ? ? ? ? ? ? ? ? 參數 === 傳遞的數據

? ? ? ? ? ? ? ? })

? ? ? ? ? ? }

23、什么是閉包 談談你對閉包的理解? 你在那些地方使用過閉包


 ????????1)什么是閉包:閉包是指有權訪問另一個函數作用域的變量的函數

? ????????????????? 如果有一個函數fun2,它可以訪問在其它函數如fun1中的局部變量,那么它(fun2)就是閉包。創建閉包的簡單方式,就在在函數內部創建另一個函數

? ?如果不去釋放閉包,那么就會進行卡頓?

????????????2)

? ???????? ????(1)采用函數引用方式的setTimeout調用。 例子

? ???????????? (2)將函數關聯到對象的實例方法。

? ???????????? (3)封裝相關的功能集。

由于閉包會使得函數中的變量都被保存在內存中,內存消耗很大,所以不能濫用閉包,否則會造成網頁的性能問題,在IE中可能導致內存泄露。解決方法是,在退出函數之前,將不使用的局部變量全部刪除。

24、你在開發移動端app的時候 都用過哪些app打包工具


25、vue和jq有什么區別 有什么共同點? 可以一起使用嗎


Vue 的用途在于視圖和數據的綁定。如果通過JQuery 直接操作 DOM 的話,勢必會造成視圖數據和模型數據的不匹配,這樣 Vue 就失去它存在的意義了?

1、jQuery首先要獲取到dom對象,然后對dom對象進行進行值的修改等操作?

2、Vue是首先把值和js對象進行綁定,然后修改js對象的值,Vue框架就會自動把dom的值就行更新。?

3、Vue操作的是虛擬DOM JQ操作的是真實DOM?

4、Vue則是通過Vue對象將數據和View完全分離開來了。對數據進行操作不再需要引用相應的DOM對象

26、在項目開發中 開發到連條過程中 和后端遇到過什么問題 怎么樣去解決的


? ? ? ? ? ? ? 聯條:前端自己模擬數據,替換成后端的接口。

? ? ? ? ? ? ? 錯誤:自己定義的數據和后端定義的類型和名字不一樣,就會產生錯誤

27、http和https有什么區別


? ???一、傳輸信息安全性不同?

????????????1、http協議:是超文本傳輸協議,信息是明文傳輸。如果攻擊者截取了Web瀏覽器和網站服務器之間的傳輸報文,就可以直接讀懂其中的信息。?

????????????2、https協議:是具有安全性的ssl加密傳輸協議,為瀏覽器和服務器之間的通信加密,確保數據傳輸的安全。

? ???二、連接方式不同

????????????1、http協議:http的連接很簡單,是無狀態的。

????????????2、https協議:是由SSL+HTTP協議構建的可進行加密傳輸、身份認證的網絡協議。? ??

?? ??三、端口不同?

?????????????1、http協議:使用的端口是80。?

? ? ? ? ? ? ?2、https協議:使用的端口是443.?

? ? ?四、證書申請方式不同?

?????????????1、http協議:免費申請。?

?????????????2、https協議:需要到ca申請證書,一般免費證書很少,需要交費。

28、常用的接口類型有哪些 分別說出他們的優缺點


常見web接口:一類是http協議的接口,另一類是web service接口(如soup、rmi、rpc協議)。本文主要介紹http請求接口。

常見的http請求方式包括:get(查)、post(增),除此之外還有put(改)、delete(刪)等。

? ??GET:? 特點:1)請求數據量小,2)參數暴露于url地址中,故存在安全隱患

? ??POST:特點:請求數據量大,安全性高

? ??put型接口:put請求用于向指定資源位置上傳最新內容

? ??delete型接口:請求服務器刪除請求里url所標識的資源

29、當你做數據交互的時候 出了問題主要看什么來判斷問題


看報錯

?????1xx 信息狀態碼 接收的請求正在處理?

?????2xx 成功狀態碼 請求正常處理完畢?

?????3xx 重定向狀態碼 需要進行附加操作以完成請求?

?????4xx 客戶端錯誤狀態碼 服務器無法處理請求?

?????5xx 服務器錯誤狀態碼 服務器處理請求出錯?

?????????301 Moved Permanently永久重定向,表示請求的資源已被分配了新的 URI,以后應使用資源現在所指定的 URI?

?????????304 Not Modified 該狀態碼表示客戶端發送附帶條件的請求時,服務器端允許請求訪問資源,但是從緩存獲取資源?

????????400 Bad Request該狀態碼表示請求報文中存在語法錯誤,當這種錯誤發生時,需要修改請求內容后再次發送請求?

????????403 Forbidden該狀態碼表明請求資源的訪問唄服務器拒絕了,服務器沒有必要給出拒絕的詳細理由。一般時訪問權限出現某些問題(如從未授權發送源 IP 地址試圖訪問)等情況都是可能發生 403 的?

????????404 Not Found該狀態碼表示服務器上無法找到請求的資源,除此之外,也可以是服務器端拒絕請求且不行說明理由時使用 ?

????????500 Internal Server Error該狀態碼表示服務端在執行請求時發生了錯誤,也有可能是 web 應用存在的 bug 或某些臨時的故障

30、es6是什么 它在原先的基礎上做了什么改變 談談你的理解、


什么是ES6呢,簡單通俗的說就是netscape(網景)公司創造了javascript這個腳本語言,主要是用來做check驗證的,當時的這個時期,Sun公司的java這個語言火的不行不行的,netscape公司也主要是蹭熱點,所以給這個用于在客戶端做check驗證的腳本語言起名叫做javascript,netscape看見javascript被越來越多的使用,當時出現的腳本語言也很多,就希望把它提交給國際化標準組織ECMA實行秦國的貨幣統一政策,ECMA發布的標準就叫做ECMASCRIPT。


31.圣杯布局、雙飛翼布局、BFC布局有什么區別,都怎樣實現?


? ? ? ? ?1、圣杯布局:要求三列布局,中間寬度自適應,兩邊定寬,這樣做的優勢是重要的東西放在文檔流前面可以優先渲染

? ? ? ? ? ? ????用到浮動、負邊距、相對定位,不添加額外標簽

? ???? ??2、雙飛翼布局:采用了浮動 float、負邊距 negative margin、相對定位 relative position來對div的位置改變,

? ?????????????????雙飛翼布局是在main的外層添加了一個容易,從而padding就可以不用再最外層容器content上,

????????????????而是在main-wrap上用margin實現中間部分的自適應!

? ??????3、BFC布局:是一個獨立的渲染區域,并且有自己的一套渲染規則,它決定了其子元素將如何定位,以及和其他元素的關系和相互作用

????????????????內部元素的布局方式不會影響到外部元素的布局

32、節流和防抖


? ??????函數防抖(debounce):觸發高頻事件后n秒內函數只會執行一次,如果n秒內高頻事件再次被觸發,則重新計算時間,只執行最后一次。

? ??????函數節流(throttle):高頻事件觸發,但在n秒內只會執行一次,所以節流會稀釋函數的執行頻率。

????????函數節流(throttle)與函數防抖(debounce)都是為了限制函數的執行頻次,以優化函數觸發頻率過高導致的響應速度跟不上觸發頻率,出現延遲,假死或卡頓的現象。

? ? ?1、函數防抖(debounce)

????????實現方式:每次觸發事件時設置一個延遲調用方法,并且取消之前的延時調用方法

????????缺點:如果事件在規定的時間間隔內被不斷的觸發,則調用方法會被不斷的延遲

? ???2、函數節流(throttle)

????????實現方式:每次觸發事件時,如果當前有等待執行的延時函數,則直接return

?? ? 3、總結

????函數節流不管事件觸發有多頻繁,都會保證在規定時間內一定會執行一次真正的事件處理函數,而函數防抖只是在最后一次事件后才觸發一次函數。 比如在頁面的無限加載場景下,我們需要用戶在滾動頁面時,每隔一段時間發一次 Ajax 請求,而不是在用戶停下滾動頁面操作時才去請求數據。這樣的場景,就適合用節流技術來實現。


33、預解析


????預解析規則

????????script:自上而下進行解析,變量函數 ,

????????函數:由里到外進行解析。

????????但是瀏覽器在執行JS代碼的時候會分成兩部分操作:預解析以及逐行執行代碼

34、js執行過程


? ?????????1.? ? ?先統計多少變量和函數? 然后進行預解析

? ?????????2.? ? ?有多少方法 多少事件 多少定時器? 直接執行函數 方法

????????? ?3.? ? ?執行事件? 定時器? 各種事件? 然后進入事件流的執行方法

35、事件冒泡、事件捕獲、事件委托


????????????事件冒泡會從當前觸發的事件目標一級一級往上傳遞,依次觸發,直到document為止。

? ? ? ? ? ? ? ? ? ? 監聽事件捕獲? ?document.getElementById('box3').addEventListener('click', sayBox3, false);????????????

????????????事件捕獲會從document開始觸發,一級一級往下傳遞,依次觸發,直到真正事件目標為止。

? ? ? ? ? ? ????????監聽事件捕獲? ?document.getElementById('box3').addEventListener('click', sayBox3, true);

? ? ? ? ??? 事件委托,通過監聽一個父元素,來給不同的子元素綁定事件,減少監聽次數,從而提升速度

????????????????document.getElementById('isUl').addEventListener('click',function(event){

? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?//判斷

? ? ? ? ? ? ? ? ? ? ?}

36、阻止冒泡 和 阻止事件?


? ? ?? ?1.window.event.cancelBubble = true

????????????這是阻止事件的冒泡方法,不讓事件向documen上蔓延,但是默認事件任然會執行,當你掉用這個方法的時候,如果點擊一個連接,這個連接仍然會被打開,

????? ? 2.return false ;

????????????這個方法比較暴力,他會同事阻止事件冒泡也會阻止默認事件;寫上此代碼,連接不會被打開,事件也不會傳遞到上一層的父元素;可以理解為return false就等于同時調用了event.stopPropagation()和event.preventDefault()

37、阻止事件捕獲


? ? ? ? ? ? 1.event.stopImmediatePropagation()??除此之外還會阻止該元素的其他事件發生

? ??????????2.event.preventDefault()??這是阻止默認事件的方法,調用此方法是,連接不會被打開,但是會發生冒泡,冒泡會傳遞到上一層的父元素;


38、選擇器的優先級


1、!important,加在樣式屬性值后,權重值為 10000

2、內聯樣式,如:style=””,權重值為1000

3、ID選擇器,如:#content,權重值為100

4、類,偽類和屬性選擇器,如: content、:hover 權重值為10

5、標簽選擇器和偽元素選擇器,如:div、p、:before 權重值為1

6、通用選擇器(*)、子選擇器(>)、相鄰選擇器(+)、同胞選擇器(~)、權重值為0

39、元素的類型


塊狀元素

????????1.塊狀元素在網頁中就是以塊的形式顯示,所謂塊狀就是元素顯示為矩形區域

????????????????常用的塊狀元素包塊div,dl,dt,dd,ol,ul,fieldset,(h1-h6),p,form,hr,colgroup,col,table,tr,td,等;

????????2.塊元素的特點:

????????????①默認情況下,塊狀元素都會獨占一行,塊狀元素會按順序自上而下排列。

????????????②塊狀元素都可以直接定義自己的寬度和高度。

????????????③塊狀元素遵循盒模型的所有規則,一般都作為其他元素的容器,它可以容納其它內聯元素和其它塊狀元素。(p標簽除外)

內聯元素

????????????1.常見的內聯元素如:a,span,i,em,strong,b等

????????????2.內聯元素的特點:

????????????????①內聯元素其后如果是內聯元素則會在一行內逐個進行顯示;

????????????????②內聯元素顯示的寬度、高度只能根據所包含內容的高度和寬度來確定,不能直接定義它的寬和高,它的最小內容單元也會呈現矩形形狀;

????????????????③內聯元素也會遵循盒模型基本規則,但個別屬性不能正確顯示;

元素類型的轉換

?塊元素

? ? ? ? 設置寬高 獨占一行

????????????????????div p h1~h6

????????????????????dl dt dd

????????????????????ul li

????????????????????herder

????????????????????footer

????????????????????nav

行內元素

????????不能設置寬高 不獨占一行 識別換行和空格

????????????????????a

????????????????????span

????????????????????em

????????????????????srong

行內塊元素

????????支持寬高 不獨占一行??識別換行和空格

????????????????????img imput testext


37、常用的計時器


setTiemout、setInterval、setImmediate、requestAnimationFrame。

setTiemout(超時調用,只執行一次)?

setInterval(間隔調用,如果不做處理會一直執行) 。兩者的相同點:第一個參數為函數,第二個為時間數

setImmediate: 在瀏覽器完全結束當前運行的操作之后立即執行指定的函數(僅IE10和Node 0.10+中有實現),類似setTimeout(func, 0)

requestAnimationFrame: 專門為實現高性能的幀動畫而設計的API,但是不能指定延遲時間,而是根據瀏覽器的刷新頻率而定(幀)

38、普通盒模型和怪異盒模型


標準盒模型:這種盒模型設置width的時候的值是內容區的寬度,如果再設置padding和margin,border的話盒子的實際寬度會增大

計算寬度:padding*2+border*2+margin*2+content

怪異盒模型:這種盒子的width設置的值為盒子實際的寬度,border和padding的設置不會影響盒子的實際寬度和高度

計算寬度:content( padding和broder是往內占用盒子的寬度,故直接用總寬度就可以)

39、同步異步


同步:

????????????同步的思想是:所有的操作都做完,才返回給用戶。這樣用戶在線等待的時間太長,給用戶一種卡死了的感覺(就是系統遷移中,點擊了遷移,界面就不動了,但是程序還在執行,卡死了的感覺)。這種情況下,用戶不能關閉界面,如果關閉了,即遷移程序就中斷了。

異步:

????????????將用戶請求放入消息隊列,并反饋給用戶,系統遷移程序已經啟動,你可以關閉瀏覽器了。然后程序再慢慢地去寫入數據庫去。這就是異步。但是用戶沒有卡死的感覺,會告訴你,你的請求系統已經響應了。你可以關閉界面了。

????同步,是所有的操作都做完,才返回給用戶結果。即寫完數據庫之后,在相應用戶,用戶體驗不好。

????異步,不用等所有操作等做完,就相應用戶請求。即先相應用戶請求,然后慢慢去寫數據庫,用戶體驗較好。

39、原生ajax


1.1.2 Ajax的運行原理頁面發起請求,會將請求發送給瀏覽器內核中的Ajax引擎,Ajax引擎會提交請求到服務器端,在這段時間里,客戶端可以進行任意操作,直到服務器端將數據返回給Ajax引擎后,會觸發你設置的事件,從而執行自定義的js邏輯代碼完成某種功能。Ajax異步請求與同步請求對比如下圖所示。

40、js三大組成


1.ECMAScript 2.DOM(document object model)3.BOM(browser object document )?

(1)ECMA是(歐洲計算機制造商協會)它規定了js的語法標準。?

(2)DOM是文檔對象模型,規定了文檔的顯示結構,可以輕松地刪除、添加和替換節點?

(3)BOM是瀏覽器對象模型,就是瀏覽器自帶的一些功能樣式,如搜索框,設置,等學習瀏覽器窗口交互的對象

41、1rem等于多少px


1rem等于html根元素設定的font-size的px值,假如我們在css里面設定下面的css。

html{font-size:14px}

那么后面的CSS里面的rem值則是以這個14來換算,例如設定一個div寬度為3rem,高度為2.5rem.則它換算成px為width:42px.height:35px,同理,假如一個設計稿為寬度42px,高度為35px,則換成成rem,則是42/14=3rem,35/14=2.5rem。

如果css里面沒有設定html的font-size,則默認瀏覽器以1rem=16px來換算。

42、op和oop的區別



43、jsonp實現原理


????一般使用ajax請求數據,但是ajax有同源策略,也就是不能請求跨域,但是,我們發現了script中的src屬性不受跨域的影響,所以就可以動態的創建src設置屬性, 所以就產生了jsonp,jsonp屬于一種非正式傳輸協議,這個協議主要就是客戶端向服務器發送一個callback的參數,然后服務器會返回一個callback(回調函數)參數包裹住json數據,然后就可以使用回調函數來操作服務器返回過來的數據

所謂同源是指域名,協議,端口相同。

44、js 處理過那些兼容問題


? ??????????1、鍵盤事件兼容

????????????????????vareve=eve||window.eventvarkeyC=eve.keyCode||eve.which

? ? ? ? ? ? 2、獲取觸發的事件源

????????????????????vartarget=e.target||e.srcElement;

? ? ? ? ? ? 3、阻止事件冒泡兼容

? ? ? ? ? ? ? ? ? ? eve.stopPropagation(); eve.cancelBubble=true;//兼容IE`

? ? ? ? ? ? 4、事件對象兼容

????????????????? ? IE中:? ? ?window.event

? ? ? ? ? ? ? ? ? ? 正常瀏覽器中:? ? 對象.on事件 = function(event){}

? ? ? ? ? ? ? ? ? ? 兼容方式:

? ? ????????????????? function fn(eve){

? ? ? ? ????????????????? var e = eve || window.event;

? ? ????????????????? }

? ? ? ? ? ? ?1、 滾動條兼容:

????????????????????? document.documentElement.scrollTop||document.body.scrollTop

? ??????????2、網頁可視區域兼容

? ???????????????????? window.innerHeight || document.documentElement.clientHeight

?????????????????? ????window.innerWidth || document.documentElement.clientWidth?


44、字符串和數組常用方法


字符串的方法

? ? ? ? ? ? ? ? join:分隔字符串

????????????????indexOf:第一次出現的位置,返回-1,表示字符串沒有該字符

????????????????concat(),連接兩個或多個字符串,返回連接后的新字符串。

????????????????trim:去掉字符串兩端多余空格

????????????????length:字符串長度

????????????????split:分割字符串成數組

? ? ? ? ? ? ? ? match(),找到一個或者多個子串或者正則表達式的匹配。

????????????????slice(),提取字符串中兩個指定索引號之間的字符(索引可以為負值,-1就是倒數第二位)

????????????????toString(),返回字符串對象,比如把數字轉換成字符串對象。

? ?數組的方法

? ?????? ? ? ???Array.map()? ? ??遍歷輸出數組內容

????????????????Array.forEach()? 遍歷輸出數組內容

????????????????Array.filter()? ? ? ? 過濾輸出所需內容

????????????????Array.some()? ? ? 根據指定條件判斷返回一個布爾值,則返回true,若所有元素都不滿足判斷條件,則返回false:

????????????????Array.push()? ? ? 數組的后面添加新加元素

????????????????Array.pop()????????數組后面刪除最后一個元素

????????????????Array.shift()????????數組后面刪除第一個元素

????????????????Array.unshift()????一個或多個元素添加到數組的開頭

????????????????Array.concat()? ? 此方法是一個可以將多個數組拼接成一個數組

45、ready 和onload的區別


? ??onload:

????????????加載時機:必須等待網頁全部加載完畢之后再執行JS代碼

????????????執行次數:只執行一次,如果第二次,就會覆蓋第一次

? ??ready:

????????????加載時機,等到DOM結構完成之后就可以JS代碼

????????????執行次數:可以執行多次,且不會覆蓋之前

????????????簡寫$(function(){})

46、瀏覽器的內核有哪些


????????1、Trident內核:IE最先開發或使用的,也稱IE內核,360瀏覽器使用的也是IE內核;

????????2、Webkit內核:谷歌chrome瀏覽器最先開發或使用,也叫谷歌內核,楓樹瀏覽器、太陽花使用的也是谷歌內核;

????????3、Gecko內核: Netscape6開始采用的內核,后來的Mozilla FireFox (火狐瀏覽器) 也采用了該內核,K-Meleon瀏覽器也是使用這種內核;

????????4、Presto內核:目前只有Opera瀏覽器采用該內核

47、vue插槽


? ??什么是插槽?

????????插槽(Slot)是Vue提出來的一個概念,正如名字一樣,插槽用于決定將所攜帶的內容,插入到指定的某個位置,從而使模板分塊,具有模塊化的特質和更大的重用性。

????????插槽顯不顯示、怎樣顯示是由父組件來控制的,而插槽在哪里顯示就由子組件來進行控制

? ??????一、插槽內容

  ? ? ? ? ? ? ?一句話:插槽內可以是任意內容。

????????????????????父組件:? 引入子組件 <zi> 123 </zi>

????????????????????子組件:? <slot></slot>

? ??????二、具名插槽

????????????????????具名插槽,就是給這個插槽起個名字,slot屬性對應的內容都會和組件中name一一對應。

????????????????????父組件:<template slot="girl">我是子組件中name為‘girl’的內容</template?>

? ? ? ? ? ? ? ? ? ? 子組件:<slot name="girl"></slot>

48、怎么判斷瀏覽器類型


????var userAgent = navigator.? ? e; //取得瀏覽器的userAgent字符串

? ? var isOpera = userAgent.indexOf("Opera") > -1;

? ? ?//判斷是否Opera瀏覽器

? ????????????? if (isOpera) {

? ? ? ? ????????????????return "Opera"

? ????????????? };

? ? //判斷是否Firefox瀏覽器

? ? ????????????if (userAgent.indexOf("Firefox") > -1) {

? ? ? ? ? ? ? ? ? ? ? ? ?return "FF";

????????????? ? }

? ? //判斷是否chorme瀏覽器

? ????????????? if (userAgent.indexOf("Chrome") > -1){

????????????????????????return "Chrome";

? ????????????? }

? ? //判斷是否Safari瀏覽器

? ? ????????????if (userAgent.indexOf("Safari") > -1) {

? ? ? ????????????????? return "Safari";

? ????????????? }

? ? //判斷是否IE瀏覽器

? ????????????? if (userAgent.indexOf("compatible") > -1 && userAgent.indexOf("MSIE") > -1 && !isOpera) {

? ????????????????? ? ? return "IE";

? ????????????? }

? ? //判斷是否Edge瀏覽器

? ? ????????????if (userAgent.indexOf("Trident") > -1) {

? ? ? ????????????????? return "Edge";

????????????? ? };

49、mvc,mvvm,mvp分別有什么區別?


M(Model)V(View)M(Controller)

View:視圖:用戶界面--是直接面向最終用戶的“視圖層”,是能與用戶操作交互的界面。

Model:模型:數據保存--是核心的“數據層”,是程序要操作的數據或信息。

Controller:控制器:業務邏輯--負責根據用戶從“視圖層”輸入 的指令,選取“數據層”中的數據,然后對其進行相應操作后,產生最后結果。

MVP 模式將 Controller 改名為 Presenter,同時改變了通信方向


M(Model)V(View)P(Presenter)

1、各部分之間的通信,都是雙向的。

2、View 與 Model 不發生聯系,都通過 Presenter 傳遞。

3、View 非常薄,不部署任何業務邏輯,稱為"被動視圖"(Passive View),即沒有任何主動性,而 Presenter非常厚,所有邏輯都部署在那里。


M(Model)V(View)V(View)M(ViewModel)

MVVM 模式將 Presenter 改名為 ViewModel,基本上與 MVP 模式完全一致。

唯一的區別是,它采用雙向綁定(data-binding):View的變動,自動反映在 ViewModel,反之亦然。Angular?和?Ember?都采用這種模式。


50、面向對象、面向過程


1、面向對象

????????????面向對象的編程的主要思想是把構成問題的各個事物分解成各個對象,建立對象的目的不是為了完成一個步驟,而是為了描述一個事物在解決問題的過程中經歷的步驟和行為。對象作為程序的基本單位,將程序和數據封裝其中,以提高程序的重用性,靈活性和可擴展性。類是創建對象的模板,一個類可以創建多個對象。對象是類的實例化。

類是 抽象的,不占用存儲空間;而對象具體的,占用存儲空間。

面向對象有三大特性:封裝,繼承,多態。

面向過程就是分析出解決問題所需要的步驟,然后用函數把這些步驟一步一步實現,使用的時候一個一個依次調用就可以了。

面向對象是把構成問題事務分解成各個對象,建立對象的目的不是為了完成一個步驟,而是為了描敘某個事物在整個解決問題的步驟中的行為。


51、Vue的雙向數據綁定原理


Vue采用數據劫持結合發布者-訂閱者模式的方法,通過Object.defineProperty()來劫持各個屬性的setter,getter屬性,在數據變動話,通知訂閱者,觸發更新回調函數,重新渲染視圖

????a、 Vue 將遍歷data對象中的所有的屬性,并使用 Object.defineProperty 把這些屬性全部加上set和get訪問

? ? b、 這樣在修改data的屬性值的時候,會觸發set方法,那么set方法主要有兩個作用,一是改變data里面的屬性值,二是發出數據變化的通知。

? ? c、 Observer作為數據的觀察者,當數據發生變化set會發出通知,會被Observer觀察到,然后通知到Watcher,最后更新視圖

52、回調函數是干什么的


????執行時機不確定的時候 需要得到數據時

回調函數!

????回調函數對于許多同學不陌生。ajax就是很好的例子

????回調函數究竟是什么?

? ??????????回調函數就是一個參數,將這個函數作為參數傳到另一個函數里面,當那個函數執行完之后,再執行傳進去的這個函數。這個過程就叫做回調

? ? ? ? ? ??通俗一點,就是把方法體當成參數傳遞給另一個方法體,然后另一個方法體內部執行傳遞的方法體。并支持傳入參數

53、全局變量、局部變量、閉包


全局變量

????好處:每個地方都可以訪問到??

????壞處:耗性能 所有地方都監聽? 等到瀏覽器關閉以后才會釋放?

局部變量

????在函數內? 因為函數才會有作用域

????壞處:只能用在指定的代碼里面

????好處:在不用的時候 內存直接釋放了??

閉包

????好處:子函數可以使用父函數的局部變量

????壞處:不去釋放 就會存在整個作用域上

????用好的話 就是好的東西? 用不好就是特別占性能的東西 return釋放

54、塊級作用域


? ? ? ? ?ES5 中作用域有:全局作用域、函數作用域。沒有塊作用域的概念。

???????? ES6 中新增了塊級作用域。塊作用域由 { } 包括,if語句和 for語句里面的{ }也屬于塊作用域。

55、var、let、const的區別


????var? ?? ? 定義的變量,沒有塊的概念,可以跨塊訪問, 不能跨函數訪問。

????let? ? ? ??定義的變量,只能在塊作用域里訪問,不能跨塊訪問,也不能跨函數訪問。

? ??const? 用來定義常量,使用時必須初始化(即必須賦值),只能在塊作用域里訪問,而且不能修改。

56、本地存儲有多少種,分別有哪些特點


cookie?數據始終在同源的http請求中攜帶(即使不需要),即cookie在瀏覽器和服務器間來回傳遞。而sessionStorage和 localStorage不會自動把數據發給服務器,僅在本地保存。

Cookie? 小 數據不能超過4k

LocalStorage 和 sessionStorage 5M 數據有效期不同

LocalStorage? ? 永久保存? 數據可以共享

sessionStorage? 會話級 關閉窗口就銷毀 數據不能共享

57、前后端分離和不分離區別


不分離?

優點:最大優勢就是安全 便于優化? 項目清晰? 接口優化? 便于 su 優化??

缺點:傳輸的話數據量比較大?用戶體驗不太好? 獲取數據 分頁 必須刷新頁面 不便于以后的維護和修改 所有代碼混合在一起 不便于修改

分離?

優點:分工明確 用戶體驗良好 ajax請求不用刷新頁面? 后端提供接口 優化數據庫? 前端 根據后端的數據接口 渲染頁面 做功能??

58、es6類的繼承


59、vue指令實現原理


通過正則判斷 獲取整個頁面 整個字符串? 通過字符串進行匹配

通過正則截取標簽 然后進行正則操作

60、同時獲取多個接口


1、axios all 數據獲取過來 然后返回過來

functiongetUserAccount(){? ? //第一個請求

? return axios.get('/user/12345');

}

functiongetUserPermissions(){? //第二個請求

? return axios.get('/user/12345/permissions');

}

axios.all([getUserAccount(), getUserPermissions()])

? .then(axios.spread(function(acct, perms){

? ? console.log('兩個請求都完成了')

? }));

2、

61、基本類型和引用類型


 JS分兩種數據類型:

基本數據類型Number、String、Boolean、Null、?Undefined、Symbol(ES6),這些類型可以直接操作保存在變量中的實際值。

引用數據類型object、array、function、data等(在JS中除了基本數據類型以外的都是對象,數據是對象,函數是對象,正則表達式是對象)

1、聲明變量時內存分配不同

 *原始類型:在棧中,因為占據空間是固定的,可以將他們存在較小的內存中-棧中,這樣便于迅速查詢變量的值

 *引用類型:存在堆中,棧中存儲的變量,只是用來查找堆中的引用地址。

 ? ?這是因為:引用值的大小會改變,所以不能把它放在棧中,否則會降低變量查尋的速度。相反,放在變量的棧空間中的值是該對象存儲在堆中的地址。地址的大小是固定的,所以把它存儲在棧中對變量性能無任何負面影響

2、不同的內存分配帶來不同的訪問機制

在javascript中是不允許直接訪問保存在堆內存中的對象的,所以在訪問一個對象時,首先得到的是這個對象在堆內存中的地址,然后再按照這個地址去獲得這個對象中的值,這就是傳說中的按引用訪問

? ? 而原始類型的值則是可以直接訪問到的。

3、復制變量時的不同

1)原始值:在將一個保存著原始值的變量復制給另一個變量時,會將原始值的副本賦值給新變量,此后這兩個變量是完全獨立的,他們只是擁有相同的value而已。

2)引用值:在將一個保存著對象內存地址的變量復制給另一個變量時,會把這個內存地址賦值給新變量,

    也就是說這兩個變量都指向了堆內存中的同一個對象,他們中任何一個作出的改變都會反映在另一個身上。

(這里要理解的一點就是,復制對象時并不會在堆內存中新生成一個一模一樣的對象,只是多了一個保存指向這個對象指針的變量罷了)。多了一個指針

4、參數傳遞的不同(把實參復制給形參的過程)

首先我們應該明確一點:ECMAScript中所有函數的參數都是按值來傳遞的。

但是為什么涉及到原始類型與引用類型的值時仍然有區別呢?還不就是因為內存分配時的差別。

  1)原始值:只是把變量里的值傳遞給參數,之后參數和這個變量互不影響。

  2)引用值:對象變量它里面的值是這個對象在堆內存中的內存地址,這一點你要時刻銘記在心!

    因此它傳遞的值也就是這個內存地址,這也就是為什么函數內部對這個參數的修改會體現在外部的原因了,因為它們都指向同一個對象。


62、優化代碼


63、async / await


????????通常async、await都是跟隨Promise一起使用的。為什么這么說呢?因為async返回的都是一個Promise對象同時async適用于任何類型的函數上。這樣await得到的就是一個Promise對象(如果不是Promise對象的話那async返回的是什么?就是什么);

????????await得到Promise對象之后就等待Promise接下來的resolve或者reject。

?async?函數返回的是一個promise?對象,有兩個參數 一個是返回結果Promise.solve()? 一個是錯誤結果Promise.reject(),如果要獲取到promise?返回值,我們應該用then?方法,但如果函數內部拋出錯誤,就應該用catch 方法

????await 函數從字面意思上是“等待”的意思,就是用于等待異步完成。并且await只能在async函數中使用

64、es5和es6面向對象區別


es5沒有真正的面向對象 不存在真正的一個類

es6有面向對象這種東西? 屬性放在 構造函數里面? 方法放在類里面

65、vue中生命周期


beforeCreate( 創建前 )

????????在實例初始化之后,數據觀測和事件配置之前被調用,此時組件的選項對象還未創建,el 和 data 并未初始化,因此無法訪問methods, data, computed等上的方法和數據。

created ( 創建后 )

????????實例已經創建完成之后被調用,在這一步,實例已完成以下配置:數據觀測、屬性和方法的運算,watch/event事件回調,完成了data 數據的初始化,el沒有。 然而,掛在階段還沒有開始, $el屬性目前不可見,這是一個常用的生命周期,因為你可以調用methods中的方法,改變data中的數據,并且修改可以通過vue的響應式綁定體現在頁面上,,獲取computed中的計算屬性等等,通常我們可以在這里對實例進行預處理,也有一些童鞋喜歡在這里發ajax請求,值得注意的是,這個周期中是沒有什么方法來對實例化過程進行攔截的,因此假如有某些數據必須獲取才允許進入頁面的話,并不適合在這個方法發請求,建議在組件路由鉤子beforeRouteEnter中完成

beforeMount(掛載前)

????????掛在開始之前被調用,相關的render函數首次被調用(虛擬DOM),實例已完成以下的配置: 編譯模板,把data里面的數據和模板生成html,完成了el和data 初始化,注意此時還沒有掛在html到頁面上。

mounted(掛載后)

????????掛在完成,也就是模板中的HTML渲染到HTML頁面中,此時一般可以做一些ajax操作,mounted只會執行一次。

beforeUpdata (更新前)

????????在數據更新之前被調用,發生在虛擬DOM重新渲染和打補丁之前,可以在該鉤子中進一步地更改狀態,不會觸發附加地重渲染過程

updated (更新后)

????????在由于數據更改導致地虛擬DOM重新渲染和打補丁只會調用,調用時,組件DOM已經更新,所以可以執行依賴于DOM的操作,然后在大多是情況下,應該避免在此期間更改狀態,因為這可能會導致更新無限循環,該鉤子在服務器端渲染期間不被調用

beforeDestrioy (銷毀前)

????????在實例銷毀之前調用,實例仍然完全可用,

????????這一步還可以用this來獲取實例,

????????一般在這一步做一些重置的操作,比如清除掉組件中的定時器 和 監聽的dom事件

destroyed(銷毀后)

????????在實例銷毀之后調用,調用后,所以的事件監聽器會被移出,所有的子實例也會被銷毀,該鉤子在服務器端渲染期間不被調用

66、v-show 和 v-if 的區別


相同點:v-if與v-show都可以動態控制dom元素顯示隱藏

不同點:v-if顯示隱藏是將dom元素整個添加或刪除,而v-show隱藏則是為該元素添加css--display:none,dom元素還在。

67、塊級作用域


在ES5中,只全局作用域和函數作用域。這會導致函數作用域覆蓋了全局作用域;亦或者循環中的變量泄露為全局變量。

用let命令新增了塊級作用域,外層作用域無法獲取到內層作用域,非常安全明了。即使外層和內層都使用相同變量名,也都互不干擾。

68、暫時性死區


ES6新增了let命令,用來聲明變量。它的用法類似于var,但是所聲明的變量,只在let命令所在的代碼塊內有效。

和var不同的還有,let命令不存在變量提升,所以聲明前調用變量,都會報錯,這就涉及到一個概念——暫時性死區。

暫時性死區:

只要塊級作用域內存在let命令,它所聲明的變量就“綁定”(binding)這個區域,不再受外部的影響。

69、局部變量怎么在外部訪問到


1、去掉 var? ??

2、return?

3、綁定到window上

4、使用對象方式??

5、閉包

70、js綁定事件以及解除


????綁定事件:addEventListener

????解綁事件:removeEventListener

????阻止事件冒泡:event.stopPropagation

????取消默認事件:event.preventDefault

????IE7~8:? attachEvent()和derachEvent()

????tips:onblur

71、移動端事件的集合


? ??touchstart: 當手指觸摸屏幕的時候出發

? ??touchmove: 當手指在屏幕移動的時候

? ??touchend: 手指離開屏幕的時候觸發

? ??touchcancel:? 當被迫中止滑動的時候觸發(彈消息,來電等等)

72、import和link有什么區別


? ??1.從屬關系區別

????????????@import是 CSS 提供的語法規則,只有導入樣式表的作用;link是HTML提供的標簽,不僅可以加載 CSS 文件,還可以定義 RSS、rel 連接屬性等。

? ??2.加載順序區別

????????????加載頁面時,link標簽引入的 CSS 被同時加載;@import引入的 CSS 將在頁面加載完畢后被加載。

? ??3.兼容性區別

????????????@import是 CSS2.1 才有的語法,故只可在 IE5+ 才能識別;link標簽作為 HTML 元素,不存在兼容性問題。

? ??4.DOM可控性區別

????????????可以通過 JS 操作 DOM ,插入link標簽來改變樣式;由于 DOM 方法是基于文檔的,無法使用@import的方式插入樣式。

? ??5.權重區別(該項有爭議,下文將詳解)

????????????link引入的樣式權重大于@import引入的樣式。

73、vue核心


Vue核心思想:數據驅動、組件化

????數據(model)改變驅動視圖(view)自動更新

74、普通函數和箭頭函數的區別


????普通函數

????????普通函數的this總是指向它的直接調用者。

????????在嚴格模式下,沒找到直接調用者,則函數中的this是undefined。

????????在默認模式下(非嚴格模式),沒找到直接調用者,則函數中的this指向window。

????箭頭函數

????????箭頭函數中的this始終指向其父級作用域中的this

????????任何方法都改變不了其指向,如call(), bind(), apply()

75、router-link和a標簽的區別


最本質的區別是 對比<a>,Link組件避免了不必要的重渲染

通過a標簽進行跳轉,頁面會被重新渲染,即相當于重新打開一個新的網頁,體現為視覺上的“閃爍”(如果是本地的項目基本看不出來)

通過router-link進行跳轉不會跳轉到新的頁面,也不會重新渲染,它會選擇路由所指的組件進行渲染,避免了重復渲染的“無用功”

76、行為 樣式 結構 分離


????行為:js??

????樣式:css??

????結構:html??

????分離:html? 分離不寫行內樣式

77、form和ajax區別


1.ajax在提交,請求,接收時,都是異步進行的,網頁不需要刷新。

????from表單提交時是新建一個頁面,哪怕是提交給自己本身的頁面,也是需要刷新的。

2.ajax在提交時,是在后臺新建一個請求。

????from表單趨勢放棄本頁面,再次申請。

3.ajax必須使用js來實現,不啟用js的瀏覽器,無法完成操作。

????from是瀏覽器的功能,無論是否開啟js,都可以提交表單。

4.ajax在提交,請求,接收時,整個過程都是需要使用程序來對其數據進行處理。

????from提交時,是根據你的表單結構自動完成,不需要代碼干預。

78、call、apply、bind方法的區別與內部實現


call方法,表示傳入的對象參數調用call前面對象的方法,并且被調用的函數會被執行,call方法的參數是當前上下文的對象以及參數列表

apply也是如此,只不過它傳入的參數是對象參數數組

而bind,用法與apply, call一樣,但是它被對象綁定的函數不會被執行,而是返回這個函數,需要你手動去調用返回的函數,才會返回結果。

call是一個一個傳

apply是數組傳

bind是寫在方法和時間后面來改變this指向

79、怎么減少http協議


性能黃金法則(Performance Golden Rule)

????????改善響應時間最簡單途徑是減少組件的數量,并由此減少HTTP請求的數量。

CSS Sprites

????????CSS精靈,通過使用合并圖片,通過制定css的Backgroud-image和background-position來顯示元素。

合并腳本和樣式表

????????使用外部的JS和CSS文件應用的方式,因為這要比直接寫在頁面中性能更好

????????但增加了HTTP請求,不過可以合并,獨立的JS比用多個JS文件的頁面載入塊38%

????????把多個腳本合并成一個腳本,把多個樣式表合并成一個樣式表

80、promise


new Promise(?

????????function (resolve, reject) {?

????????????// 一段耗時的異步操作

????????????????resolve('成功') // 數據處理完成

????????????// reject('失敗') // 數據處理出錯

????????}

????????).then(

????????????????(res) => {console.log(res)}, // 成功

????????????????(err) => {console.log(err)} // 失敗

????)

resolve作用是,將Promise對象的狀態從“未完成”變為“成功”(即從 pending 變為 resolved),在異步操作成功時調用,并將異步操作的結果,作為參數傳遞出去;

reject作用是,將Promise對象的狀態從“未完成”變為“失敗”(即從 pending 變為 rejected),在異步操作失敗時調用,并將異步操作報出的錯誤,作為參數傳遞出去。

81、promise有三個狀態:


1、pending[待定]初始狀態

2、fulfilled[實現]操作成功

3、rejected[被否決]操作失敗

當promise狀態發生改變,就會觸發then()里的響應函數處理后續步驟;

promise狀態一經改變,不會再變。

Promise對象的狀態改變,只有兩種可能:

從pending變為fulfilled

從pending變為rejected。

這兩種情況只要發生,狀態就凝固了,不會再變了。

82、ajax和axios


axios是通過promise實現對ajax技術的一種封裝,就像jQuery實現ajax封裝一樣。

簡單來說: ajax技術實現了網頁的局部數據刷新,axios實現了對ajax的封裝。

axios是ajax ajax不止axios。

?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市,隨后出現的幾起案子,更是在濱河造成了極大的恐慌,老刑警劉巖,帶你破解...
    沈念sama閱讀 229,763評論 6 539
  • 序言:濱河連續發生了三起死亡事件,死亡現場離奇詭異,居然都是意外死亡,警方通過查閱死者的電腦和手機,發現死者居然都...
    沈念sama閱讀 99,238評論 3 428
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人,你說我怎么就攤上這事?!?“怎么了?”我有些...
    開封第一講書人閱讀 177,823評論 0 383
  • 文/不壞的土叔 我叫張陵,是天一觀的道長。 經常有香客問我,道長,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 63,604評論 1 317
  • 正文 為了忘掉前任,我火速辦了婚禮,結果婚禮上,老公的妹妹穿的比我還像新娘。我一直安慰自己,他們只是感情好,可當我...
    茶點故事閱讀 72,339評論 6 410
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著,像睡著了一般。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發上,一...
    開封第一講書人閱讀 55,713評論 1 328
  • 那天,我揣著相機與錄音,去河邊找鬼。 笑死,一個胖子當著我的面吹牛,可吹牛的內容都是我干的。 我是一名探鬼主播,決...
    沈念sama閱讀 43,712評論 3 445
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了?” 一聲冷哼從身側響起,我...
    開封第一講書人閱讀 42,893評論 0 289
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后,有當地人在樹林里發現了一具尸體,經...
    沈念sama閱讀 49,448評論 1 335
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 41,201評論 3 357
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發現自己被綠了。 大學時的朋友給我發了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 43,397評論 1 372
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖,靈堂內的尸體忽然破棺而出,到底是詐尸還是另有隱情,我是刑警寧澤,帶...
    沈念sama閱讀 38,944評論 5 363
  • 正文 年R本政府宣布,位于F島的核電站,受9級特大地震影響,放射性物質發生泄漏。R本人自食惡果不足惜,卻給世界環境...
    茶點故事閱讀 44,631評論 3 348
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧,春花似錦、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 35,033評論 0 28
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至,卻和暖如春,著一層夾襖步出監牢的瞬間,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 36,321評論 1 293
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人。 一個月前我還...
    沈念sama閱讀 52,128評論 3 398
  • 正文 我出身青樓,卻偏偏與公主長得像,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 48,347評論 2 377

推薦閱讀更多精彩內容