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

參考答案：微信小程序項(xiàng)目結(jié)構(gòu)主要有四個(gè)文件類型, 如下

一. WXML （WeiXin Markup Language）是框架設(shè)計(jì)的一套標(biāo)簽語(yǔ)言，結(jié)合基礎(chǔ)組件. 事件系統(tǒng)，可以構(gòu)建出頁(yè)面的結(jié)構(gòu)。內(nèi)部主要是微信自己定義的一套組件。

二. WXSS (WeiXin Style Sheets)是一套樣式語(yǔ)言，用于描述 WXML 的組件樣式，

三.js 邏輯處理，網(wǎng)絡(luò)請(qǐng)求

四.json 小程序設(shè)置，如頁(yè)面注冊(cè)，頁(yè)面標(biāo)題及tabBar。

2. 你是怎么封裝微信小程序的數(shù)據(jù)請(qǐng)求的？

參考答案：

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

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

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

3. 有哪些參數(shù)傳值的方法？

參考答案：

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

二. 設(shè)置id 的方法標(biāo)識(shí)來(lái)傳值通過(guò)e. currentTarget. id獲取設(shè)置的id的值, 然后通過(guò)設(shè)置全局對(duì)象的方式來(lái)傳遞數(shù)值

三. 在navigator中添加參數(shù)傳值

4. 你使用過(guò)哪些方法，來(lái)提高微信小程序的應(yīng)用速度？

參考答案：

一. 提高頁(yè)面加載速度

二. 用戶行為預(yù)測(cè)

三. 減少默認(rèn)data的大小

四. 組件化方案

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

參考答案：

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

6. 簡(jiǎn)述微信小程序原理？

參考答案：

微信小程序采用JavaScript. WXML. WXSS三種技術(shù)進(jìn)行開發(fā)，從技術(shù)講和現(xiàn)有的前端開發(fā)差不多，但深入挖掘的話卻又有所不同。

JavaScript：首先JavaScript的代碼是運(yùn)行在微信App中的，并不是運(yùn)行在瀏覽器中，因此一些H5技術(shù)的應(yīng)用，需要微信App提供對(duì)應(yīng)的API支持，而這限制住了H5技術(shù)的應(yīng)用，且其不能稱為嚴(yán)格的H5，可以稱其為偽H5，同理，微信提供的獨(dú)有的某些API，H5也不支持或支持的不是特別好。

WXML：WXML微信自己基于XML語(yǔ)法開發(fā)的，因此開發(fā)時(shí)，只能使用微信提供的現(xiàn)有標(biāo)簽，HTML的標(biāo)簽是無(wú)法使用的。

WXSS：WXSS具有CSS的大部分特性，但并不是所有的都支持，而且支持哪些，不支持哪些并沒(méi)有詳細(xì)的文檔。

微信的架構(gòu)，是數(shù)據(jù)驅(qū)動(dòng)的架構(gòu)模式，它的UI和數(shù)據(jù)是分離的，所有的頁(yè)面更新，都需要通過(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的渲染. 事件的處理

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

參考答案：

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

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

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

3. 開發(fā)成本要比App要低。

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

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

劣勢(shì)：

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

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

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

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

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

參考答案：

第一條是運(yùn)行環(huán)境的不同

傳統(tǒng)的HTML5的運(yùn)行環(huán)境是瀏覽器，包括webview，而微信小程序的運(yùn)行環(huán)境并非完整的瀏覽器，是微信開發(fā)團(tuán)隊(duì)基于瀏覽器內(nèi)核完全重構(gòu)的一個(gè)內(nèi)置解析器，針對(duì)小程序?qū)ｉT做了優(yōu)化，配合自己定義的開發(fā)語(yǔ)言標(biāo)準(zhǔn)，提升了小程序的性能。

第二條是開發(fā)成本的不同

只在微信中運(yùn)行，所以不用再去顧慮瀏覽器兼容性，不用擔(dān)心生產(chǎn)環(huán)境中出現(xiàn)不可預(yù)料的奇妙BUG

第三條是獲取系統(tǒng)級(jí)權(quán)限的不同

系統(tǒng)級(jí)權(quán)限都可以和微信小程序無(wú)縫銜接

第四條便是應(yīng)用在生產(chǎn)環(huán)境的運(yùn)行流暢度

長(zhǎng)久以來(lái)，當(dāng)HTML5應(yīng)用面對(duì)復(fù)雜的業(yè)務(wù)邏輯或者豐富的頁(yè)面交互時(shí)，它的體驗(yàn)總是不盡人意，需要不斷的對(duì)項(xiàng)目?jī)?yōu)化來(lái)提升用戶體驗(yàn)。但是由于微信小程序運(yùn)行環(huán)境獨(dú)立

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

參考答案：

在回調(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)
    }
}

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

參考答案：小程序直接this. data的屬性是不可以同步到視圖的，必須調(diào)用

this.setData({
    noBind: true
})

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

參考答案：

一.wxss的圖片引入需使用外鏈地址；

二. 沒(méi)有Body, 樣式可直接使用import導(dǎo)入；

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

參考答案：首先要引入最新版的jweixin-1. 3. 2. js，然后

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

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

參考答案：使用wx. getUserInfo方法withCredentials為 true 時(shí) 可獲取encryptedData，里面有 union_id。后端需要進(jìn)行對(duì)稱解密

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

參考答案：用view代替scroll-view, , 設(shè)置onPullDownRefresh函數(shù)實(shí)現(xiàn)

15. 使用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也必須是用戶和小程序的。

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

參考答案：

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

二. 小程序不可以直接渲染文章內(nèi)容頁(yè)這類型的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í)間。

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

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

success: function(e) {
    var page = getCurrentPages().pop();
    if (page == undefined || page == null) return;
    page.onLoad();
}

webview的頁(yè)面，則通過(guò)

wx.miniProgram.switchTab({
    url: '/pages/index/index'
})

18. 小程序和Vue寫法的區(qū)別？

參考答案：

一. 循環(huán)遍歷的時(shí)候：小程序是wx:for=“l(fā)ist”，而Vue是v-for=“(item, index) in list”

二. 調(diào)用data模型的時(shí)候：小程序是this. data. uinfo，而Vue是this. uinfo；給模型賦值也不一樣，小程序是this. setData({uinfo:1})，而Vue是直接this. uinfo=1

19. 小程序生命周期

參考答案：

// app.js
App({
    onLaunch(options) {
        // Do something initial when launch.
    },
    onShow(options) {
        // Do something when show.
    },
    onHide() {
        // Do something when hide.
    },
    onError(msg) {
        console.log(msg)
    },
    globalData: 'I am global data'
})

//index.js
Page({
  data: {

    text: "This is page data."

  }, 
  onLoad: function(options) {

    // 頁(yè)面創(chuàng)建時(shí)執(zhí)行

  }, 
  onShow: function() {

    // 頁(yè)面出現(xiàn)在前臺(tái)時(shí)執(zhí)行

  }, 
  onReady: function() {

    // 頁(yè)面首次渲染完畢時(shí)執(zhí)行

  }, 
  onHide: function() {

    // 頁(yè)面從前臺(tái)變?yōu)楹笈_(tái)時(shí)執(zhí)行

  }, 
  onUnload: function() {

    // 頁(yè)面銷毀時(shí)執(zhí)行

  }, 
  onPullDownRefresh: function() {

    // 觸發(fā)下拉刷新時(shí)執(zhí)行

  }, 
  onReachBottom: function() {

    // 頁(yè)面觸底時(shí)執(zhí)行

  }, 
  onShareAppMessage: function () {

    // 頁(yè)面被用戶分享時(shí)執(zhí)行

  }, 
  onPageScroll: function() {

    // 頁(yè)面滾動(dòng)時(shí)執(zhí)行

  }, 
  onResize: function() {

    // 頁(yè)面尺寸變化時(shí)執(zhí)行

  }, 
  onTabItemTap(item) {

    // tab 點(diǎn)擊時(shí)執(zhí)行
    console.log(item.index)
    console.log(item.pagePath)
    console.log(item.text)

  }, 
  // 事件響應(yīng)函數(shù)
  viewTap: function() {

    this.setData({
      text: 'Set some data for updating view.'
    }, function() {
      // this is setData callback
    })

  }, 
  // 自由數(shù)據(jù)
  customData: {

    hi: 'MINA'

  }
})

[外鏈圖片轉(zhuǎn)存失敗,源站可能有防盜鏈機(jī)制,建議將圖片保存下來(lái)直接上傳(img-mNUAtpcs-1675613277237)(…/images/miniProgram_001.png)]

20. h5頁(yè)面如何傳遞參數(shù)給小程序？

參考答案：

1、H5頁(yè)面
<script src="${base}/resources/common/js/jweixin.miniProgram.js"></script>

wx.miniProgram.postMessage({
  data: {
    shareUrl:href
  }
});

注意：傳參必須使用data

2、小程序頁(yè)面接收

Page({
//獲取H5傳給小程序的參數(shù)
getMessage: function(e) {
  if (!e.detail) {
    return
  }
  var datas = e.detail.data
  var shareUrl = datas.shareUrl;
}
})

index.wxml文件

文章來(lái)源地址http://www.zghlxwxcb.cn/news/detail-561117.html

到了這里，關(guān)于微信小程序面試問(wèn)答（2023）的文章就介紹完了。如果您還想了解更多內(nèi)容，請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！