小程序面試題

1 請談談微信小程序主要目錄和文件的做用？

·  project.config.json 項目配置文件，用得最多的就是配置是否開啓https校驗；

·  App.js 設置一些全局的基礎數據等；

·  App.json 底部tab, 標題欄和路由等設置；

·  App.wxss 公共樣式，引入iconfont等；

·  pages 裏面包含一個個具體的頁面；

·  index.json (配置當前頁面標題和引入組件等)；

·  index.wxml (頁面結構)；

·  index.wxss (頁面樣式表)；

·  index.js (頁面的邏輯，請求和數據處理等)；

2 請談談wxml與標準的html的異同？

·  都是用來描述頁面的結構；

·  都由標籤、屬性等構成；

·  標籤名字不同，且小程序標籤更少，單一標籤更多；

·  多了一些 wx:if 這樣的屬性以及 {{ }} 這樣的表達式

·  WXML僅能在微信小程序開發者工具中預覽，而HTML能夠在瀏覽器內預覽

·  組件封裝不一樣， WXML對組件進行了從新封裝，

·  小程序運行在JS Core內，沒有DOM樹和window對象，小程序中沒法使用window對象和document對象。

3 請談談WXSS和CSS的異同？

·  都是用來描述頁面的樣子；

·  WXSS 具備 CSS 大部分的特性，也作了一些擴充和修改；

·  WXSS新增了尺寸單位，WXSS 在底層支持新的尺寸單位 rpx；

·  WXSS 僅支持部分 CSS 選擇器；

·  WXSS 提供全局樣式與局部樣式

4 你是怎麼封裝微信小程序的數據請求的？

·  在根目錄下建立utils目錄及api.js文件和apiConfig.js文件；

·  在apiConfig.js 封裝基礎的get, post 和 put， upload等請求方法，設置請求體，帶上token和異常處理等；

·  在api中引入apiConfig.js封裝好的請求方法，根據頁面數據請求的urls, 設置對應的方法並導出；

·  在具體的頁面中導入；

5 小程序頁面間有哪些傳遞數據的方法？

·  使用全局變量實現數據傳遞

·  頁面跳轉或重定向時，使用url帶參數傳遞數據

·  使用組件模板 template傳遞參數

·  使用緩存傳遞參數

·  使用數據庫傳遞數據

6 請談談小程序的雙向綁定和vue的異同？

大致相同，但小程序直接this.data的屬性是不能夠同步到視圖的，必須調用this.setData()方法！

7 請談談小程序的生命週期函數？

·  onLoad() 頁面加載時觸發，只會調用一次，可獲取當前頁面路徑中的參數。

·  onShow() 頁面顯示/切入前臺時觸發，通常用來發送數據請求；

·  onReady() 頁面初次渲染完成時觸發, 只會調用一次，表明頁面已可和視圖層進行交互。

·  onHide() 頁面隱藏/切入後臺時觸發, 如底部 tab 切換到其餘頁面或小程序切入後臺等。

·  onUnload() 頁面卸載時觸發，如redirectTo或navigateBack到其餘頁面時。

8 簡述微信小程序原理？

·  小程序本質就是一個單頁面應用，全部的頁面渲染和事件處理，都在一個頁面內進行，但又能夠經過微信客戶端調用原生的各類接口；

·  它的架構，是數據驅動的架構模式，它的UI和數據是分離的，全部的頁面更新，都須要經過對數據的更改來實現；

·  它從技術講和現有的前端開發差很少，採用JavaScript、WXML、WXSS三種技術進行開發；

·  功能可分爲webview和appService兩個部分；

·  webview用來展示UI，appService有來處理業務邏輯、數據及接口調用；

·  兩個部分在兩個進程中運行，經過系統層JSBridge實現通訊，實現UI的渲染、事件的處理等。

9 請談談原生開發小程序、wepy、mpvue 的對比？

·  我的認爲，若是是新項目，且沒有舊的 h5 項目遷移，則考慮用小程序原生開發，好處是相比於第三方框架，坑少。

·  而若是有 老的 h5 項目是 vue 開發 或者 也有 h5 項目也須要小程序開發，則比較適合 wepy 或者 mpvue 來作遷移或者開發，近期看wepy幾乎不更新了，因此推薦美團的mpvue。

·  而若是若是團隊前端強大，本身作一套框架也沒問題。

一：小程序與原生App哪一個好？ 

答： 小程序除了擁有公衆號的低開發成本、獲客成本低以及無需下載等優點，在服務請求延時與用戶使用體驗是都獲得了較大幅度的提高，使得其可以承載跟複雜的服務功能以及使用戶得到更好的用戶體驗。

二：簡述微信小程序原理？  

答： 微信小程序採用JavaScript、WXML、WXSS三種技術進行開發，從技術講和現有的前端開發差很少，但深刻挖掘的話卻又有所不一樣。

JavaScript：首先JavaScript的代碼是運行在微信App中的，並非運行在瀏覽器中，所以一些H5技術的應用，須要微信App提供對應的API支持，而這限制住了H5技術的應用，且其不能稱爲嚴格的H5，能夠稱其爲僞H5，同理，微信提供的獨有的某些API，H5也不支持或支持的不是特別好。

WXML：WXML微信本身基於XML語法開發的，所以開發時，只能使用微信提供的現有標籤，HTML的標籤是沒法使用的。

WXSS：WXSS具備CSS的大部分特性，但並非全部的都支持，並且支持哪些，不支持哪些並無詳細的文檔。

微信的架構，是數據驅動的架構模式，它的UI和數據是分離的，全部的頁面更新，都須要經過對數據的更改來實現。

小程序分爲兩個部分webview和appService。其中webview主要用來展示UI，appService有來處理業務邏輯、數據及接口調用。它們在兩個進程中運行，經過系統層JSBridge實現通訊，實現UI的渲染、事件的處理

三：分析下微信小程序的優劣勢？

答：
優點：

1、無需下載，經過搜索和掃一掃就能夠打開。
2、良好的用戶體驗：打開速度快。
3、開發成本要比App要低。
4、安卓上能夠添加到桌面，與原生App差很少。
5、爲用戶提供良好的安全保障。小程序的發佈，微信擁有一套嚴格的審查流程， 不能經過審查的小程序是沒法發佈到線上的。

劣勢：
1、限制較多。頁面大小有限制（持續更新中）。不能打開超過10個層級的頁面（持續更新中）。
2、樣式單一。小程序的部分組件已是成型的了，樣式不能夠修改。例如：幻燈片、導航。
3、推廣面窄，不能分享朋友圈，只能經過分享給朋友，附近小程序推廣。其中附近小程序也受到微信的限制。
4、依託於微信，沒法開發後臺管理功能。

四：微信小程序與H5的區別？

答：
第一條是運行環境的不一樣
傳統的HTML5的運行環境是瀏覽器，包括webview，而微信小程序的運行環境並不是完整的瀏覽器，是微信開發團隊基於瀏覽器內核徹底重構的一個內置解析器，針對小程序專門作了優化，配合本身定義的開發語言標準，提高了小程序的性能。

第二條是開發成本的不一樣
只在微信中運行，因此不用再去顧慮瀏覽器兼容性，不用擔憂生產環境中出現不可預料的奇妙BUG

第三條是獲取系統級權限的不一樣
系統級權限均可以和微信小程序無縫銜接


第四條即是應用在生產環境的運行流暢度
長久以來，當HTML5應用面對複雜的業務邏輯或者豐富的頁面交互時，它的體驗老是不盡人意，須要不斷的對項目優化來提高用戶體驗。可是因爲微信小程序運行環境獨立

五：小程序的雙向綁定和vue哪裏不同？

小程序直接this.data的屬性是不能夠同步到視圖的，必須調用：

1 2 3

this.setData({           noBind:true })