1、簡(jiǎn)述微信小程序的相關(guān)文件類型？

• WXML 搭建頁(yè)面的結(jié)構(gòu)
• WXSS 頁(yè)面樣式文件
• js 邏輯處理，網(wǎng)絡(luò)請(qǐng)求
• json 配置當(dāng)前頁(yè)面標(biāo)題和引入組件等
• app.js 可以在里邊監(jiān)聽生命周期函數(shù)、聲明全局變量
• app.json 小程序的全局配置（頁(yè)面路徑、網(wǎng)絡(luò)超時(shí)時(shí)間、底部tabBar 、導(dǎo)航背景顏色等）

2、簡(jiǎn)述一下小程序的開發(fā)流程？

注冊(cè)微信小程序賬號(hào)
獲取微信小程序的 AppID
下載微信小程序開發(fā)者工具
創(chuàng)建demo項(xiàng)目
去微信公眾平臺(tái)配置域名
手機(jī)預(yù)覽
代碼上傳
提交審核
小程序發(fā)布

3、你是怎么封裝小程序的數(shù)據(jù)信息要求的？

• 在根目錄下創(chuàng)建utils目錄及api.js文件和apiConfig.js文件；
• 在apiConfig.js 封裝基礎(chǔ)的get, post 和 put， upload等請(qǐng)求方法，設(shè)置請(qǐng)求體，帶上token和異常處理等；
• 在api中引入apiConfig.js封裝好的請(qǐng)求方法，根據(jù)頁(yè)面數(shù)據(jù)請(qǐng)求的urls, 設(shè)置對(duì)應(yīng)的方法并導(dǎo)出；
• 在具體的頁(yè)面中導(dǎo)入；

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

• 給html元素添加data-*屬性來傳遞值，然后通過e.currentTarget.dataset或onload的params參數(shù)獲取。注：data-屬性的名稱不能有大寫字母、不可以存放對(duì)象
• 設(shè)置id的方法標(biāo)識(shí)來傳值，通過e.currentTarget.id獲取設(shè)置的id的值，然后通過設(shè)置全局對(duì)象的方式來傳遞數(shù)值
• 在navigator中添加參數(shù)數(shù)值

5、哪些方法可以提高微信小程序的應(yīng)用速度？

1. 提高頁(yè)面加載速度(壓縮靜態(tài)?件，使?精靈圖，路由分包)
2. 用戶行為預(yù)測(cè) # 什么叫行為預(yù)測(cè)
3. 減少默認(rèn)data的大小（在不操作視圖的時(shí)候，使?this.data.變量這種?式 代替this.setData({})
4. 組件化方案 # 使用

6、分析下微信小程序的優(yōu)劣勢(shì)？

優(yōu)點(diǎn)：

• 無(wú)需下載，通過搜索和掃一掃就可以打開。
• 良好的用戶體驗(yàn)：打開速度快。
• 開發(fā)成本要比App要低。
• 安卓上可以添加到桌面，與原生App差不多。
• 為用戶提供良好的安全保障。小程序的發(fā)布，微信擁有一套嚴(yán)格的審查流程， 不能通過審查的小程序是無(wú)法發(fā)布到線上的。

缺點(diǎn)：

• 限制較多。頁(yè)面大小不能超過1M。不能打開超過5個(gè)層級(jí)的頁(yè)面。
• 樣式單一。小程序的部分組件已經(jīng)是成型的了，樣式不可以修改。
• 推廣面窄，不能分享朋友圈，只能通過分享給朋友，附近小程序推廣。其中附近小程序也受到微信的限制。
• 依托于微信，無(wú)法開發(fā)后臺(tái)管理功能。

7、簡(jiǎn)述微信小程序原理？

• 微信小程序采用JavaScript、wxml、wxss三種技術(shù)進(jìn)行開發(fā)，與現(xiàn)有前端開發(fā)的區(qū)別：
  • JavaScript的代碼是運(yùn)行在微信APP中的，因此一些h5技術(shù)的應(yīng)用需要微信APP提供對(duì)應(yīng)的API支持；
  • wxml微信自己基于xml語(yǔ)法開發(fā)的，因此在開發(fā)時(shí)只能使用微信提供的現(xiàn)有標(biāo)簽，html的標(biāo)簽是無(wú)法使用的；
  • wxss具有css的大部分特性，但并不是所有都支持沒有詳細(xì)文檔（wxss的圖片引入需使用外鏈地址，沒有body，樣式可直接使用import導(dǎo)入）。
• 微信的架構(gòu)，是數(shù)據(jù)驅(qū)動(dòng)的架構(gòu)模式，它的UI和數(shù)據(jù)是分離的，所有的頁(yè)面更新，都需要通過對(duì)數(shù)據(jù)的更改來實(shí)現(xiàn)。
• 小程序功能分為webview和APPservice，webview主要用來展示UI，appservice用來處理業(yè)務(wù)邏輯、數(shù)據(jù)及接口調(diào)用。它們?cè)趦蓚€(gè)進(jìn)程中進(jìn)行，通過系統(tǒng)層JSBridge實(shí)現(xiàn)通信，實(shí)現(xiàn)UI的渲染、事件處理。

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

• 運(yùn)行環(huán)境不同（小程序在微信運(yùn)行，h5在瀏覽器運(yùn)行）；
• 開發(fā)成本不同（h5需要兼容不同的瀏覽器）；
• 獲取系統(tǒng)權(quán)限不同（系統(tǒng)級(jí)權(quán)限可以和小程序無(wú)縫銜接）；
• 應(yīng)用在生產(chǎn)環(huán)境的運(yùn)行流暢度（h5需不斷對(duì)項(xiàng)目?jī)?yōu)化來提高用戶體驗(yàn)）；

9、有哪幾種方式可以跳轉(zhuǎn)頁(yè)面？

navigateTo: 保留當(dāng)前頁(yè)面，跳轉(zhuǎn)到應(yīng)用內(nèi)的某個(gè)頁(yè)面。
navigateBack：關(guān)閉當(dāng)前頁(yè)面，返回上一頁(yè)面或多級(jí)頁(yè)面。
redirectTo ：關(guān)閉當(dāng)前頁(yè)面，跳轉(zhuǎn)到應(yīng)用內(nèi)的某個(gè)頁(yè)面。但是不允許跳轉(zhuǎn)到 tabbar 頁(yè)面。
switchTab：跳轉(zhuǎn)到 tabBar 頁(yè)面，并關(guān)閉其他所有非 tabBar 頁(yè)面。
reLaunch： 關(guān)閉所有頁(yè)面，打開到應(yīng)用內(nèi)的某個(gè)頁(yè)面。

10、小程序里邊的雙向綁定和vue的雙向綁定有什么區(qū)別？

1. 首先利用bindinput來觸發(fā)改變input輸入框中的值
2. 使用data-name來獲取改變的數(shù)據(jù)的內(nèi)容
3. bindinput觸發(fā)后在方法中通過e.currentTarget.dataset.name來獲取改變后的內(nèi)容‘
4. 通過this.setData()來改變data-name綁定的參數(shù)就好了

//data-name綁定的值就是value的值，這樣才能隨時(shí)更新到value中
<input type="text" bindinput="inputEdit" data-name="inputValue" placeholder="姓名" value="{{inputValue}}">

在index.js中:

Page({
    data:{
        inputValue:'測(cè)試數(shù)據(jù)雙向綁定',
    },
   inputEdit(e){
   //data-開頭的是自定義屬性，可以通過dataset獲取到dataset是一個(gè)json對(duì)象。
    //通過事件參數(shù)獲取input所對(duì)應(yīng)的全局屬性名
   var inputModel = e.currentTarget.dataset.name;
      //通過value獲取當(dāng)前用戶輸入的內(nèi)容
   var value = e.detail.value;
//將input所對(duì)應(yīng)的全局屬性的屬性只更新
	this.data[inputModel] = value;   
這個(gè)時(shí)候也就是說`data-name` 的值更新了,這里就是通過bindInput記錄的value改變的值，存起來
	this. setData({
         inputValue:this.data[inputModel] 
   });
  }
})

11、什么是分包加載？如何使用分包加載？

什么是分包加載：
在小程序開發(fā)的過程中，小程序的體積會(huì)隨著版本變的越來越大，我們可以將小程序分成多個(gè)包從服務(wù)器下載，優(yōu)化首次啟動(dòng)加載時(shí)間以及后續(xù)按需加載的實(shí)現(xiàn)。


如何使用分包加載：

1、在app.json中配置項(xiàng)目分包結(jié)構(gòu)（結(jié)構(gòu)如上圖）
2、配置subpackages后，將按subpackages配置的路徑進(jìn)行打包，沒有配置的都會(huì)分到主包。所以一定要配置好路徑，避免主包超過限制報(bào)錯(cuò)
3、tabBar必須放在主包
4、分包之間不能引用，只能require app.js和自身的js
5、配置完分包之后檢查主包配置的路徑有沒有包含分包的，有的話要去掉

12、在你開發(fā)小程序的過程中遇到過什么坑？ 你是怎么解決的？

1. wx.navigateTo無(wú)法打開頁(yè)面
   一個(gè)應(yīng)用同時(shí)只能打開5個(gè)頁(yè)面，請(qǐng)避免多層級(jí)的交互方式，或使用wx.redirectTo
2. tabBar設(shè)置不顯示
   tabBar的數(shù)量少于2項(xiàng)或超過5項(xiàng)都不會(huì)顯示；
   tabBar寫法錯(cuò)誤導(dǎo)致不顯示；
   tabBar沒有寫pagePath字段（程序啟動(dòng)后顯示的第一個(gè)頁(yè)面）
3. 本地資源無(wú)法通過wxss獲取
   background-image：可以使用網(wǎng)絡(luò)圖片，或者base64，或者使用標(biāo)簽

13、小程序與webview之間是怎么跳轉(zhuǎn)的？

• 小程序跳轉(zhuǎn)到webview

需要用到web-view標(biāo)簽然后通過web-view標(biāo)簽里的src屬性跳轉(zhuǎn)到webview頁(yè)面
小程序跳轉(zhuǎn)webview必須要在小程序后臺(tái)使用管理用戶添加業(yè)務(wù)域名

• webview跳轉(zhuǎn)到小程序

首先需要引入微信小程序庫(kù)，然后使用wx. miniprogram.navigateTo()來跳轉(zhuǎn)到小程序的頁(yè)面，
跳轉(zhuǎn)tabbar頁(yè)面可以使用wx. miniprogram.switchTab()來跳轉(zhuǎn)到tabbar頁(yè)面

14、小程序的生命周期函數(shù)？

1、onLoad()頁(yè)面加載時(shí)觸發(fā)，只會(huì)調(diào)??次，可獲取當(dāng)前??路徑中的參數(shù)
2、onShow()頁(yè)面顯示/切換前臺(tái)時(shí)觸發(fā)，?般?來發(fā)送數(shù)據(jù)請(qǐng)求
3、onReady()頁(yè)面初次渲染完成時(shí)觸發(fā)，只會(huì)調(diào)??次，代表頁(yè)面已和可視圖層進(jìn)?交互
4、onHide()頁(yè)面隱藏/切?后臺(tái)時(shí)觸發(fā)，如底部tab切換到其他頁(yè)面或?程序切?后臺(tái)等
5、onUnload()頁(yè)面卸載時(shí)觸發(fā)，如redirectTo或navigateBack到其他頁(yè)面時(shí)。

15、小程序頁(yè)面生命周期？

1. data：頁(yè)面的初始數(shù)據(jù)
2. onLoad：生命周期回調(diào)—監(jiān)聽頁(yè)面加載
3. onShow：生命周期回調(diào)—監(jiān)聽頁(yè)面顯示;
4. onReady：生命周期回調(diào)—監(jiān)聽頁(yè)面初次渲染完成
5. onHide：生命周期回調(diào)—監(jiān)聽頁(yè)面隱藏
6. onUnload:生命周期回調(diào)—監(jiān)聽頁(yè)面卸載
7. onPullDownRefresh:監(jiān)聽用戶下拉動(dòng)作
8. onReachBottom:頁(yè)面上拉觸底事件的處理函數(shù)
9. onShareAppMessage:用戶點(diǎn)擊右上?轉(zhuǎn)發(fā)
10. onPageScroll:頁(yè)面滾動(dòng)觸發(fā)事件的處理函數(shù)
11. onResize:頁(yè)面尺寸改變時(shí)觸發(fā)
12. onTabItemTap:當(dāng)前是 tab 頁(yè)時(shí)，點(diǎn)擊 tab

16、如何自定義tabbar？以及如何自定義組件？

自定義tabbar：

創(chuàng)建一個(gè)custom文件夾，里面創(chuàng)建一個(gè)tabbar頁(yè)面，取消原有的tabbar頁(yè)面。需要在app.json中輸入custom:ture，然后在自定義的pages頁(yè)面中寫入《tabbar selected="{{0}}"》《/tabbar》進(jìn)行選中效果顯示

自定義組件：

1、在根目錄新建一個(gè)components文件夾，然后在這個(gè)文件夾下放置自定義的組件。
2、需要用到某個(gè)自定義組件時(shí)，就在它里面的json文件中配置 "component": true
3、然后在父組件的json文件中的usingComponents中導(dǎo)入這個(gè)組件：
{
“usingComponents”: {
“自定義組件名”:"…/…/components/路徑"
}
}

17、微信小程序和app有什么不同之處？

微信小程序?qū)儆谳p量級(jí)的app 但是限制在微信中，開發(fā)周期短，功能較少，占用空間少， app就相反 需要占用額外內(nèi)存 開發(fā)周期長(zhǎng)

18、如何實(shí)現(xiàn)登錄數(shù)據(jù)的持久化 ?

可以通過wx.setStorageSync(‘鍵名’, 對(duì)應(yīng)的值)來進(jìn)行數(shù)據(jù)持久化

19、微信小程序如何實(shí)現(xiàn)下拉刷新？

用view代替scroll-view，設(shè)置onPullDownRefresh函數(shù)實(shí)現(xiàn)

20、怎么解決微信小程序的異步請(qǐng)求問題？

• 小程序支持 ES6 語(yǔ)法 在返回成功的回調(diào)里面處理邏輯 Promise 異步 async/await

在回調(diào)函數(shù)中調(diào)用下一個(gè)組件的函數(shù)：

**app.js**
success:function(info){
	that.apirtnCallback(info)
}
**index.js**
onLoad:function(){
	app.apirtnCallback = res =>{
		console.log(res)
	}
}

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

可通過 unionid 來區(qū)分用戶的唯一性，同一用戶，對(duì)同一個(gè)微信開放平臺(tái)下的不同應(yīng)用，unionid 是相同的
使用wx.getUserInfo方法 withCredentials為true時(shí)，可獲取encryptedData，里面有union_id.后端需要進(jìn)行對(duì)稱解密。

22、使用webview直接加載要注意哪些事項(xiàng)？

• 必須要在小程序后臺(tái)使用管理員添加業(yè)務(wù)域名；
• h5頁(yè)面跳轉(zhuǎn)至小程序的腳步必須是1.3.1以上；
• 微信分享只可以是小程序的主名稱，如要自定義分享內(nèi)容，需小程序版本在1.7.1以上；
• h5的支付不可以是微信公眾號(hào)的appid，必須是小程序的appid，而且用戶的openid也必須是用戶和小程序的

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

1. 數(shù)據(jù)的大小限制，超過范圍會(huì)直接導(dǎo)致整個(gè)小程序崩潰，除非重啟小程序；
2. 小程序不可以直接渲染文章內(nèi)容這類型的html文本，顯示需借助插件

注：插件渲染會(huì)導(dǎo)致頁(yè)面加載變慢，建議在后臺(tái)對(duì)文章內(nèi)容的html進(jìn)行過濾，后臺(tái)直接處理批量替換p標(biāo)簽div標(biāo)簽為view標(biāo)簽。然后其他的標(biāo)簽讓插件來做

24、bindtap和catchtap的區(qū)別？

• 相同點(diǎn)：首先他們都是作為點(diǎn)擊事件函數(shù)，就是點(diǎn)擊時(shí)觸發(fā)。在這個(gè)作用上他們是一樣的，可以不做區(qū)分
• 不同點(diǎn)：他們的不同點(diǎn)主要是bindtap是不會(huì)阻止冒泡事件的，catchtap是阻值冒泡的

25、微信小程序如何進(jìn)行雙向綁定？

1. 通過bind-tap點(diǎn)擊事件 向app.js 定義的方法中獲取回執(zhí)
2. 設(shè)置data的值 實(shí)現(xiàn)雙向綁定

26、小程序授權(quán)登錄流程

1. 調(diào)用wx.login()
2. 從微信端獲取用戶信息
3. 檢測(cè)登錄狀態(tài)
4. 檢查是否授權(quán)過

用戶通過 button組件來設(shè)置的button樣式getuserinfo和規(guī)定好的點(diǎn)擊事件，點(diǎn)擊 button彈出授權(quán)窗，
如果同意授權(quán)則可以從 bindgetuserinfo回調(diào)中獲取到用戶信息最后來設(shè)置界面，只能通過點(diǎn)擊 button設(shè)置的opensetting的樣式來跳轉(zhuǎn)到設(shè)置界面

27、小程序有哪些組件可以實(shí)現(xiàn)什么功能？

視圖容器

• view視圖容器
• scroll-view視圖容器
• swiper 可滑動(dòng)的視圖容器

基礎(chǔ)內(nèi)容

• icon圖標(biāo)
• text文字
• progress進(jìn)度條

表單組件（form）

• button按鈕
• form表單
• input輸入框
• checkbox多項(xiàng)選擇器
• radio單項(xiàng)選擇器
• picker列表選擇器

28、簡(jiǎn)單說一下微信支付環(huán)節(jié)？

• 臨時(shí)憑證 獲取 wxid
• 生成repayid
• json，返回給小程序，小程序調(diào)支付窗口。
• 支持成功提示 + POST回調(diào)。

29、微信小程序，為什么使用js閉包？

因?yàn)槲⑿判〕绦蛱幚砗瘮?shù)是異步執(zhí)行的，異步執(zhí)行造成的結(jié)果可能和預(yù)期的不合，如果函數(shù)中有循環(huán)，最后的結(jié)果都一樣，所以使用js閉包可以解決這個(gè)問題。

30、小程序頁(yè)面間有哪些通報(bào)數(shù)據(jù)的要領(lǐng)？

• 運(yùn)用全局變量完成數(shù)據(jù)通報(bào)
• 頁(yè)面跳轉(zhuǎn)或重定向時(shí)，運(yùn)用url帶參數(shù)通報(bào)數(shù)據(jù)
• 運(yùn)用組件模板 template通報(bào)參數(shù)
• 運(yùn)用緩存通報(bào)參數(shù)
• 運(yùn)用數(shù)據(jù)庫(kù)通報(bào)數(shù)據(jù)