小編給大家分享一下基于小程序的面試題有哪些，相信大部分人都還不怎么了解，因此分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后大有收獲，下面讓我們一起去了解一下吧！

十余年創(chuàng)新互聯(lián)網(wǎng)站建設(shè),由一走到現(xiàn)在，當(dāng)中離不開(kāi)團(tuán)隊(duì)頑強(qiáng)的創(chuàng)業(yè)精神，離不開(kāi)伴隨我們同行的客戶與專(zhuān)業(yè)的合作伙伴，創(chuàng)力信息一直秉承以“見(jiàn)一個(gè)客戶，了解一個(gè)行業(yè)，交一個(gè)朋友”的方式為經(jīng)營(yíng)理念，提出“讓每一個(gè)客戶成為我們的終身客戶”為目標(biāo)，以為用戶提供精細(xì)化服務(wù)，全面滿足用戶需求為宗旨，誠(chéng)信經(jīng)營(yíng)，更大限度為用戶創(chuàng)造價(jià)值。期待邁向下一個(gè)更好的十余年。

小程序登錄流程

第一步：wx.login獲取 用戶臨時(shí)登錄憑證code

第二步：wx.getUserInfo獲取加密過(guò)的數(shù)據(jù)encryptedData和解密參數(shù)iv

第三步：把步驟一、二中的code、encryptedData、iv傳到開(kāi)發(fā)者自己服務(wù)端 第四步：服務(wù)端獲取到code、encryptedData、iv之后用get方法請(qǐng)求如下微信接口 個(gè)人項(xiàng)目，沒(méi)有后端接口，回答了云開(kāi)發(fā)中的登錄流程

小程序頁(yè)面聲明周期

● onLoad() 頁(yè)面加載時(shí)觸發(fā)，只會(huì)調(diào)用一次，可獲取當(dāng)前頁(yè)面路徑中的參數(shù)。

● onShow() 頁(yè)面顯示/切入前臺(tái)時(shí)觸發(fā)，一般用來(lái)發(fā)送數(shù)據(jù)請(qǐng)求；

● onReady() 頁(yè)面初次渲染完成時(shí)觸發(fā)，只會(huì)調(diào)用一次，代表頁(yè)面已可和視圖層進(jìn)行交互

● onHide() 頁(yè)面隱藏/切入后臺(tái)時(shí)觸發(fā)，如底部 tab 切換到其他頁(yè)面或小程序切入后臺(tái)等

● onUnload() 頁(yè)面卸載時(shí)觸發(fā)，如 redirectTo 或 navigateBack 到其他頁(yè)面時(shí)

小程序常用的框架

WeUI WeUI 是一套同微信原生視覺(jué)體驗(yàn)一致的基礎(chǔ)樣式庫(kù)， 由微信官方設(shè)計(jì)團(tuán)隊(duì)為微信內(nèi)網(wǎng)頁(yè)和微信小程序量身設(shè)計(jì)，令用戶的使用感知更加統(tǒng)一。 小程序開(kāi)發(fā)中最常用到的一款框架，受廣大開(kāi)發(fā)人員的歡迎。 美團(tuán)小程序框架mpvue 官方介紹：mpvue是一個(gè)使用 Vue.js開(kāi)發(fā)小程序的前端框架。框架基于 Vue.js核心，mpvue修改了 Vue.js的 runtime和 compiler實(shí)現(xiàn)，使其可以運(yùn)行在小程序環(huán)境中，從而為小程序開(kāi)發(fā)引入了整套Vue.js開(kāi)發(fā)體驗(yàn)。

組件化開(kāi)發(fā)框架wepy 官方介紹：組件化開(kāi)發(fā)，完美解決組件隔離，組件嵌套，組件通信等問(wèn)題,支持使用第三方 npm 資源，自動(dòng)處理 npm 資源之間的依賴關(guān)系，完美兼容所有無(wú)平臺(tái)依賴的 npm 資源包. 官方框架MINA 官方介紹：框架提供了自己的視圖層描述語(yǔ)言 WXML 和 WXSS，以及基于 JavaScript 的邏輯層框架，并在視圖層與邏輯層間提供了數(shù)據(jù)傳輸和事件系統(tǒng)，可以讓開(kāi)發(fā)者可以方便的聚焦于數(shù)據(jù)與邏輯上。

了解微信小程序嗎？簡(jiǎn)述小程序的原理。

微信?程序采?JavaScript、WXML、WXSS三種技術(shù)進(jìn)?開(kāi)發(fā),本質(zhì)就是?個(gè)單??應(yīng)?，所有的??渲染和事件處理，都在?個(gè)??內(nèi)進(jìn)?，但?可以通過(guò)微信客戶端調(diào)?原?的各種接?；

微信的架構(gòu)，是數(shù)據(jù)驅(qū)動(dòng)的架構(gòu)模式，它的UI和數(shù)據(jù)是分離的，所有的??更新，都需要通過(guò)對(duì)數(shù)據(jù)的更改來(lái)實(shí)現(xiàn)；

?程序分為兩個(gè)部分 webview 和 appService 。其中 webview 主要?來(lái)展現(xiàn) UI ，appService用來(lái)處理業(yè)務(wù)邏輯、數(shù)據(jù)及接?調(diào)?。它們?cè)趦蓚€(gè)進(jìn)程中運(yùn)?，通過(guò)系統(tǒng)層 JSBridge 實(shí)現(xiàn)通信，實(shí)現(xiàn) UI 的渲染、事件的處理

小程序項(xiàng)目的主要目錄文件作用

project.config.json 項(xiàng)目的配置文件，做一些個(gè)性化配置，例如界面顏色、編譯配置等等； app.json 當(dāng)前小程序的全局配置，包括小程序的所有頁(yè)面路徑配置、界面表現(xiàn)、網(wǎng)絡(luò)超時(shí)時(shí)間、底部tab等； sitemap.json 配置小程序及其頁(yè)面是否允許被微信索引； pages 里面包含了一個(gè)個(gè)具體的頁(yè)面； wxml （WeiXin Markup Language）是框架設(shè)計(jì)的一套標(biāo)簽語(yǔ)言，結(jié)合基礎(chǔ)組件、事件系統(tǒng)，可以構(gòu)建出頁(yè)面的結(jié)構(gòu) wxss (WeiXin Style Sheets)是一套樣式語(yǔ)言，用于描述 WXML 的組件 樣式 app.wxss作為全局樣式，會(huì)作用于當(dāng)前小程序的所有頁(yè)面，局部頁(yè)面樣式 page.wxss僅對(duì)當(dāng)前頁(yè)面生效； app.js 小程序的邏輯 js 邏輯處理，網(wǎng)絡(luò)請(qǐng)求 json 頁(yè)面配置

小程序的雙向綁定和vue哪里不一樣

小程序直接 this.data 的屬性是不可以同步到視圖的，必須調(diào)用： this.setData({ // 這里設(shè)置 })

小程序頁(yè)面的生命周期函數(shù)

onLoad 頁(yè)面加載時(shí)觸發(fā)。一個(gè)頁(yè)面只會(huì)調(diào)用一次，可以在 onLoad 的參數(shù)中獲取打開(kāi)當(dāng)前頁(yè)面路徑中的參數(shù)(監(jiān)聽(tīng)頁(yè)面加載)

onShow() 頁(yè)面顯示/切入前臺(tái)時(shí)觸發(fā)(監(jiān)聽(tīng)頁(yè)面顯示)

onReady() 頁(yè)面初次渲染完成時(shí)觸發(fā)。一個(gè)頁(yè)面只會(huì)調(diào)用一次，代表頁(yè)面已經(jīng)準(zhǔn)備妥當(dāng)，可以和視圖層進(jìn)行交互(監(jiān)聽(tīng)頁(yè)面初次渲染完成)

onHide() 頁(yè)面隱藏/切入后臺(tái)時(shí)觸發(fā)。 如 navigateTo 或底部 tab 切換到其他頁(yè)面，小程序切入后臺(tái)等(監(jiān)聽(tīng)頁(yè)面隱藏)

onUnload() 頁(yè)面卸載時(shí)觸發(fā)。如 redirectTo 或 navigateBack 到其他頁(yè)面時(shí)(監(jiān)聽(tīng)頁(yè)面卸載)

微信小程序的優(yōu)劣勢(shì)

優(yōu)勢(shì) : 即用即走，不用安裝，省流量，省安裝時(shí)間，不占用桌面 依托微信流量，天生推廣傳播優(yōu)勢(shì) 開(kāi)發(fā)成本比 App 低 缺點(diǎn) : 用戶留存，即用即走是優(yōu)勢(shì)，也存在一些問(wèn)題 入口相對(duì)傳統(tǒng) App 要深很多 限制較多 , 頁(yè)面大小不能超過(guò)2M , 不能打開(kāi)超過(guò)10個(gè)層級(jí)的頁(yè)面

小程序的wxss和css有哪些不一樣的地方

WXSS 和 CSS 類(lèi)似，不過(guò)在 CSS 的基礎(chǔ)上做了一些補(bǔ)充和修改

尺寸單位 rpx rpx 是響應(yīng)式像素,可以根據(jù)屏幕寬度進(jìn)行自適應(yīng)。規(guī)定屏幕寬為 750rpx。如在 iPhone6 上，屏幕寬度為 375px，共有 750 個(gè)物理像素，則 750rpx = 375px = 750 物理像素

使用 @import 標(biāo)識(shí)符來(lái)導(dǎo)入外聯(lián)樣式。@import 后跟需要導(dǎo)入的外聯(lián)樣式表的相對(duì)路徑，用;表示語(yǔ)句結(jié)束

小程序頁(yè)面間有哪些傳遞數(shù)據(jù)的方法

(1) 使用全局變量實(shí)現(xiàn)數(shù)據(jù)傳遞在 app.js 文件中定義全局變量 globalData , 將需要存儲(chǔ)的信息存放在里面 使用的時(shí)候，直接使用 getApp() 拿到存儲(chǔ)的信息

(2) 使用 wx.navigateTo 與 wx.redirectTo 的時(shí)候，可以將部分?jǐn)?shù)據(jù)放在 url 里面,并在新頁(yè)面 onLoad 的時(shí)候初始化 需要注意的問(wèn)題： wx.navigateTo 和 wx.redirectTo 不允許跳轉(zhuǎn)到 tab 所包含的頁(yè)面 onLoad 只執(zhí)行一次 (3) 使用本地緩存 Storage 相關(guān)

小程序關(guān)聯(lián)微信公眾號(hào)如何確定用戶的唯一性

如果開(kāi)發(fā)者擁有多個(gè)移動(dòng)應(yīng)用、網(wǎng)站應(yīng)用、和公眾帳號(hào)（包括小程序），可通過(guò) unionid 來(lái)區(qū)分用戶的唯一性，因?yàn)橹灰峭粋€(gè)微信開(kāi)放平臺(tái)帳號(hào)下的移動(dòng)應(yīng)用、網(wǎng)站應(yīng)用和公眾帳號(hào)（包括小程序），用戶的 unionid 是唯一的。換句話說(shuō)，同一用戶，對(duì)同一個(gè)微信開(kāi)放平臺(tái)下的不同應(yīng)用，unionid 是相同的

如何實(shí)現(xiàn)下拉刷新

首先在全局 config 中的 window 配置 enablePullDownRefresh 在 Page 中定義 onPullDownRefresh 鉤子函數(shù) , 到達(dá)下拉刷新條件后 , 該鉤子函數(shù)執(zhí)行, 發(fā)起請(qǐng)求方法 請(qǐng)求返回后，調(diào)用 wx.stopPullDownRefresh 停止下拉刷新

bindtap和catchtap的區(qū)別是什么

相同點(diǎn)：首先他們都是作為點(diǎn)擊事件函數(shù)，就是點(diǎn)擊時(shí)觸發(fā)。在這個(gè)作用上他們是一樣的，可以不做區(qū)分

不同點(diǎn)：他們的不同點(diǎn)主要是bindtap是不會(huì)阻止冒泡事件的，catchtap是阻止冒泡的

‘wx.navigateTo()’, ‘wx.redirectTo()’,‘wx.switchTab()’, ‘wx.navigateBack()’,'wx.reLaunch()'的區(qū)別

wx.navigateTo()：保留當(dāng)前頁(yè)面，跳轉(zhuǎn)到應(yīng)用內(nèi)的某個(gè)頁(yè)面。但是不能跳到 tabbar 頁(yè)面

wx.redirectTo()：關(guān)閉當(dāng)前頁(yè)面，跳轉(zhuǎn)到應(yīng)用內(nèi)的某個(gè)頁(yè)面。但是不允許跳轉(zhuǎn)到 tabbar 頁(yè)面

wx.switchTab()：跳轉(zhuǎn)到 tabBar 頁(yè)面，并關(guān)閉其他所有非 tabBar 頁(yè)面

wx.navigateBack(): 關(guān)閉當(dāng)前頁(yè)面，返回上一頁(yè)面或多級(jí)頁(yè)面?？赏ㄟ^(guò) getCurrentPages() 獲取當(dāng)前的頁(yè)面棧，決定需要返回幾層

wx.reLaunch()：關(guān)閉所有頁(yè)面，打開(kāi)到應(yīng)用內(nèi)的某個(gè)頁(yè)面

typeof 運(yùn)算符和 instanceof 運(yùn)算符以及 isPrototypeOf() 方法的區(qū)別

typeof是一個(gè)運(yùn)算符，用于檢測(cè)數(shù)據(jù)的類(lèi)型，比如基本數(shù)據(jù)類(lèi)型null、undefined、string、number、boolean， 以及引用數(shù)據(jù)類(lèi)型object、function，但是對(duì)于正則表達(dá)式、日期、數(shù)組這些引用數(shù)據(jù)類(lèi)型，它會(huì)全部識(shí)別為object；

instanceof同樣也是一個(gè)運(yùn)算符，它就能很好識(shí)別數(shù)據(jù)具體是哪一種引用類(lèi)型。它與isPrototypeOf的區(qū)別就是 它是用來(lái)檢測(cè)構(gòu)造函數(shù)的原型是否存在于指定對(duì)象的原型鏈當(dāng)中； 而isPrototypeOf是用來(lái)檢測(cè)調(diào)用此方法的對(duì)象是否存在于指定對(duì)象的原型鏈中，所以本質(zhì)上就是檢測(cè)目標(biāo)不同。

call()和apply()的區(qū)別

實(shí)際上，apply和call的功能是一樣的，只是傳入的參數(shù)列表形式不同。 apply(this對(duì)象，[參數(shù)1，參數(shù)2，…]) 即使只有一個(gè)參數(shù)，也要寫(xiě)進(jìn)數(shù)組里 call(this對(duì)象，參數(shù)1，參數(shù)2，…) 它可以接受多個(gè)任意參數(shù)，第一個(gè)參數(shù)與apply一樣，后面則是一串參數(shù)列表

微信小程序怎樣跟事件傳值

給 HTML 元素添加 data-*屬性來(lái)傳遞我們需要的值，然后通過(guò) e.currentTarget.dataset 或 onload 的 param 參數(shù)獲取。 但 data -名稱不能有大寫(xiě)字母, 不可以存放對(duì)象

微信小程序與 vue 區(qū)別

? 生命周期不一樣，微信小程序生命周期比較簡(jiǎn)單 ? 數(shù)據(jù)綁定也不同，微信小程序數(shù)據(jù)綁定需要使用{{}}，vue 直接 : 就可以 ? 控制元素的顯示和隱藏，小程序中，使用 wx-if 和 hidden 控制元素的顯示和隱藏 ; vue 中，使用 v-if 和 v-show ? 事件處理不同，小程序中，全用 bindtap(bind+event)，或者catchtap(catch+event) 綁定事件,vue：使用 v-on:event 綁定事件，或者使用@event 綁定事件 ? 數(shù)據(jù)雙向綁定也不一樣, 在 vue 中, 只需要在表單元素上加上 v-model, 然后再綁定 data 中對(duì)應(yīng)的一個(gè)值，當(dāng)表單元素內(nèi)容發(fā)生變化 時(shí)，data 中對(duì)應(yīng)的值也會(huì)相應(yīng)改變，這是 vue 非常 nice 的一點(diǎn)。微信小程序必須獲取到表單元素改變的值，然后再值賦給一個(gè) data 中 聲明的變量。

哪些方法可以用來(lái)提高微信小程序的應(yīng)用速度

提高頁(yè)面加載速度 用戶行為預(yù)測(cè) 減少默認(rèn) data 的大小 組件化方案

怎么解決小程序的異步請(qǐng)求問(wèn)題

小程序支持大部分 ES6 語(yǔ)法 ? 在返回成功的回調(diào)里面處理邏輯 Promise 異步

小程序 wxml 與標(biāo)準(zhǔn)的 html 的異同？

相同： ? 都是用來(lái)描述頁(yè)面的結(jié)構(gòu)； ? 都由標(biāo)簽、屬性等構(gòu)成； 不同： ? 標(biāo)簽名字不一樣，且小程序標(biāo)簽更少，單一標(biāo)簽更多； ? 多了一些 wx:if 這樣的屬性以及 {{ }}這樣的表達(dá)式; ? WXML 僅能在微信小程序開(kāi)發(fā)者工具中預(yù)覽，而 HTML 可以在瀏覽器內(nèi)預(yù) 覽； ? 組件封裝不同， WXML 對(duì)組件進(jìn)行了重新封裝; ? 小程序運(yùn)行在 JS Core 內(nèi)，沒(méi)有 DOM 樹(shù)和 window 對(duì)象，小程序中無(wú)法使 用 window 對(duì)象和 document 對(duì)象。

小程序簡(jiǎn)單介紹下三種事件對(duì)象的屬性列表？

基礎(chǔ)事件（BaseEvent） ? type:事件類(lèi)型 ? timeStamp：事件生成時(shí)的時(shí)間戳 ? target：觸發(fā)事件的組件的屬性值集合 ? currentTarget：當(dāng)前組件的一些屬性集合 自定義事件（CustomEvent） ? detail 觸摸事件（TouchEvent） ? touches ? changedTouches

小程序?qū)?wx:if 和 hidden 使用的理解？

? wx:if 有更高的切換消耗。 ? hidden 有更高的初始渲染消耗。 ? 因此，如果需要頻繁切換的情景下，用 hidden 更好，如果在運(yùn)行時(shí)條件不大可能改變則 wx:if 較好

微信小程序與 H5 的區(qū)別

運(yùn)行環(huán)境的不同 : 傳統(tǒng)的 HTML5 的運(yùn)行環(huán)境是瀏覽器，包括 webview，而微信小程序的運(yùn)行環(huán)境并非完整的瀏覽器，是微信開(kāi)發(fā)團(tuán)隊(duì)基于瀏覽器內(nèi)核完全重構(gòu)的一個(gè)內(nèi)置解析器，針對(duì)小程序?qū)ｉT(mén)做了優(yōu)化，配合自己定義的開(kāi)發(fā)語(yǔ)言標(biāo)準(zhǔn)，提升了小程序的性能。 ? 開(kāi)發(fā)成本的不同 : 只在微信中運(yùn)行，所以不用再去顧慮瀏覽器兼容性，不用擔(dān)心生產(chǎn)環(huán)境中出現(xiàn)不可預(yù)料的奇妙 BUG ? 獲取系統(tǒng)級(jí)權(quán)限的不同

app.json 是對(duì)當(dāng)前小程序的全局配置，講述三個(gè)配置各個(gè)項(xiàng)的含義？

? pages 字段 —— 用于描述當(dāng)前小程序所有頁(yè)面路徑，這是為了讓 微信客戶端知道當(dāng)前你的小程序頁(yè)面定義在哪個(gè)目錄。 ? window 字段 —— 小程序所有頁(yè)面的頂部背景顏色, 文字顏色定義在這里的 ? tab 字段 —— 小程序全局頂部或底部 tab

小程序 onPageScroll 方法的使用注意什么？

由于此方法調(diào)用頻繁，不需要時(shí)可以去掉，不要保留空方法，并且使用 onPageScroll 時(shí)，盡量避免使用 setData()，盡量減少 setData()的使用頻 次。

小程序視圖渲染結(jié)束回調(diào)？

使用 setData(data, callback)，在 callback 回調(diào)方法中添加后續(xù)操作代碼

小程序同步 API 和異步 API 使用時(shí)注意事項(xiàng)？

wx.setStorageSync 是以 Sync 結(jié)尾的 API 為同步 API， 使用時(shí)使用 try-catch 來(lái)查看異常，如果判定 API 為異步，可以在其回調(diào)方法 success、fail、 complete 中進(jìn)行下一步操作。

如何封裝微信小程序的數(shù)據(jù)請(qǐng)求的？

1、將所有的接口放在統(tǒng)一的 js 文件中并導(dǎo)出。

2、在 app.js 中創(chuàng)建封裝請(qǐng)求數(shù)據(jù)的方法。

3、在子頁(yè)面中調(diào)用封裝的方法請(qǐng)求數(shù)據(jù)。

小程序與原生 App 哪個(gè)好？

小程序除了擁有公眾號(hào)的低開(kāi)發(fā)成本、低獲客成本低以及無(wú)需下載等優(yōu)勢(shì)，在 服務(wù)請(qǐng)求延時(shí)與用戶使用體驗(yàn)是都得到了較大幅度 的提升， 使得其能夠承載跟 復(fù)雜的服務(wù)功能以及使用戶獲得更好的用戶體驗(yàn)。

webview 中的頁(yè)面怎么跳回小程序中？

首先要引入最新版的 jweixin-x.x.x.js，然后

wx.miniProgram.navigateTo({
url: '/pages/login/login'+'$params'
})

webview 的頁(yè)面怎么跳轉(zhuǎn)到小程序?qū)Ш降捻?yè)面？

小程序?qū)Ш降捻?yè)面可以通過(guò) switchTab，但默認(rèn)情況是不會(huì)重新加載數(shù)據(jù) 的。若需加載新數(shù)據(jù)，則在 success 屬性中加入以下代碼即可：

小程序調(diào)用后臺(tái)接口遇到哪些問(wèn)題？

1、數(shù)據(jù)的大小有限制，超過(guò)范圍會(huì)直接導(dǎo)致整個(gè)小程序崩潰，除非重啟小程 序；

2、小程序不可以直接渲染文章內(nèi)容頁(yè)這類(lèi)型的 html 文本內(nèi)容，若需顯示要借住插件，但插件渲染會(huì)導(dǎo)致頁(yè)面加載變慢，所以最好在后臺(tái)對(duì)文章內(nèi)容的 html 進(jìn)行過(guò)濾，后臺(tái)直接處理批量替換 p 標(biāo)簽 div 標(biāo)簽為 view 標(biāo)簽，然后其它的標(biāo)簽讓插件來(lái)做，減輕前端的時(shí)間

微信小程序的優(yōu)劣勢(shì)？

優(yōu)勢(shì)：

1、無(wú)需下載，通過(guò)搜索和掃一掃就可以打開(kāi)。

2、良好的用戶體驗(yàn)：打開(kāi)速度快。

3、開(kāi)發(fā)成本要比 App 要低。

4、安卓上可以添加到桌面，與原生 App 差不多。

5、為用戶提供良好的安全保障。小程序的發(fā)布，微信擁有一套嚴(yán)格的審 查流程，不能通過(guò)審查的小程序是無(wú)法發(fā)布到線上的。

劣勢(shì)：

1、限制較多。頁(yè)面大小不能超過(guò) 1M。不能打開(kāi)超過(guò) 5 個(gè)層級(jí)的頁(yè)面。

2、樣式單一。小程序的部分組件已經(jīng)是成型的了，樣式不可以修改。例 如：幻燈片、導(dǎo)航。

3、推廣面窄，不能分享朋友圈，只能通過(guò)分享給朋友，附近小程序推 廣。其中附近小程序也受到微信的限制。

4、依托于微信，無(wú)法開(kāi)發(fā)后臺(tái)管理功能。

以上是“基于小程序的面試題有哪些”這篇文章的所有內(nèi)容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內(nèi)容對(duì)大家有所幫助，如果還想學(xué)習(xí)更多知識(shí)，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道！