1. 程式人生 > >微信小程式面試題

微信小程式面試題

1、簡單描述下微信小程式的相關檔案型別?答:微信小程式專案結構主要有四個檔案型別,如下:一、WXML (WeiXin Markup Language)是框架設計的一套標籤語言,結合基礎元件、事件系統,可以構建出頁面的結構。內部主要是微信自己定義的一套元件。二、WXSS (WeiXin Style Sheets)是一套樣式語言,用於描述 WXML 的元件樣式,二、js 邏輯處理,網路請求三、json 小程式設定,如頁面註冊,頁面標題及tabBar。四、app.json必須要有這個檔案,如果沒有這個檔案,專案無法執行,因為微信框架把這個作為配置檔案入口,整個小程式的全域性配置。包括頁面註冊,網路設定,以及小程式的

window背景色,配置導航條樣式,配置預設標題。五、app.js必須要有這個檔案,沒有也是會報錯!但是這個檔案建立一下就行 什麼都不需要寫以後我們可以在這個檔案中監聽並處理小程式的生命週期函式、宣告全域性變數。六、app.wxss2、你是怎麼封裝微信小程式的資料請求的?答:一、將所有的介面放在統一的js檔案中並匯出二、在app.js中建立封裝請求資料的方法三、在子頁面中呼叫封裝的方法請求資料3、有哪些引數傳值的方法?答:一、給HTML元素新增data-*屬性來傳遞我們需要的值,然後通過e.currentTarget.dataset或onload的param引數獲取。但data-名稱不能有大寫字母和不可以存放物件
二、設定id 的方法標識來傳值通過e.currentTarget.id獲取設定的id的值,然後通過設定全域性物件的方式來傳遞數值三、在navigator中新增引數傳值4、你使用過哪些方法,來提高微信小程式的應用速度?答:一、提高頁面載入速度二、使用者行為預測三、減少預設data的大小四、元件化方案5、小程式與原生App哪個好? 答: 小程式除了擁有公眾號的低開發成本、低獲客成本低以及無需下載等優勢,在服務請求延時與使用者使用體驗是都得到了較大幅度  的提升,使得其能夠承載跟複雜的服務功能以及使使用者獲得更好的使用者體驗。6、簡述微信小程式原理? 答:微信小程式採用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的渲染、事件的處理7、分析下微信小程式的優劣勢?答:優勢:1、無需下載,通過搜尋和掃一掃就可以開啟。2、良好的使用者體驗:開啟速度快。3、開發成本要比App要低。4、安卓上可以新增到桌面,與原生App差不多。5、為使用者提供良好的安全保障。小程式的釋出,微信擁有一套嚴格的審查流程, 不能通過審查的小程式是無法釋出到線上的。劣勢:1、限制較多。頁面大小不能超過1M。不能開啟超過5個層級的頁面。2、樣式單一。小程式的部分元件已經是成型的了,樣式不可以修改。例如:幻燈片、導航。3、推廣面窄,不能分享朋友圈,只能通過分享給朋友,附近小程式推廣。其中附近小程式也受到微信的限制。4、依託於微信,無法開發後臺管理功能。8、微信小程式與H5的區別?答:第一條是執行環境的不同傳統的HTML5的執行環境是瀏覽器,包括webview,而微信小程式的執行環境並非完整的瀏覽器,是微信開發團隊基於瀏覽器核心完全重構的一個內建解析器,針對小程式專門做了優化,配合自己定義的開發語言標準,提升了小程式的效能。第二條是開發成本的不同只在微信中執行,所以不用再去顧慮瀏覽器相容性,不用擔心生產環境中出現不可預料的奇妙BUG第三條是獲取系統級許可權的不同系統級許可權都可以和微信小程式無縫銜接第四條便是應用在生產環境的執行流暢度長久以來,當HTML5應用面對複雜的業務邏輯或者豐富的頁面互動時,它的體驗總是不盡人意,需要不斷的對專案優化來提升使用者體驗。但是由於微信小程式執行環境獨立9、怎麼解決小程式的非同步請求問題?答:在回撥函式中呼叫下一個元件的函式:app.js

success: function (info) {                      that.apirtnCallback(info) }

index.js

 onLoad: function () {    app.apirtnCallback = res => { console.log(res)     }

10、小程式的雙向繫結和vue哪裡不一樣?答:小程式直接this.data的屬性是不可以同步到檢視的,必須呼叫:

this.setData({          noBind:true   })