自信を持ってWeChatミニプログラムのインタビューに行きましたが、これらの技術的な質問には目がくらんでいませんでした。

技術的な問題

1. WeChat Mini Programの機能について教えてください。

• project.config.jsonプロジェクト構成ファイル。最もよく使用されるのは、https検証を有効にするかどうかを構成することです。
• App.jsは、いくつかのグローバル基本データなどを設定します。
• App.jsonの下部タブ、タイトルバー、ルーティング設定。
• iconfontなどを含むApp.wxssパブリックスタイル。
• ページには特定のページが含まれます。
• index.json（現在のページタイトルの設定やコンポーネントのインポートなど）;
• index.wxml（ページ構造）;
• index.wxss（ページスタイルシート）;
• index.js（ページロジック、リクエストとデータ処理など）;

2. WeChatアプレットの関連ファイルタイプについて簡単に説明してください。

• wxmlテンプレートファイルは、フレームデザイン用のタグ言語のセットであり、基本コンポーネントとイベントシステムを組み合わせてページの構造を構築します

• wxssスタイルファイルは、WXMLコンポーネントスタイルを記述するために使用されるスタイル言語です。

• jsスクリプトロジックファイル、ロジック処理ネットワークリクエスト

• json構成ファイル、ページ登録、ページタイトル、tabBarなどのアプレット設定

• app.jsonアプレット全体のグローバル構成。

• ページ：[すべてのページパス]

• ネットワーク設定（ネットワークタイムアウト）

• インターフェース性能（ページ登録）
  ウィンドウ：{背景色、ナビゲーションスタイル、デフォルトタイトル}

• 下部タブなど

• app.jsはアプレットのライフサイクル関数を監視および処理し、グローバル変数を宣言します

• App.wxssグローバル構成スタイルファイル
  3. wxmlと標準htmlの類似点と相違点について教えてください。

• どちらもページの構造を説明するために使用されます。

• すべてタグ、属性などで構成されています。

• ラベル名が異なり、アプレットラベルが少なく、単一ラベルが多い。

• wx：ifのようなより多くの属性と{ {}}のような式

• WXMLはWeChatアプレット開発者ツールでのみプレビューできますが、HTMLはブラウザでプレビューできます。コンポーネントパッケージは異なります。WXMLはコンポーネントを再パッケージ化します。アプレットはJSコアで実行されます。DOMツリーとウィンドウオブジェクトはありません。アプレットwindowオブジェクトとdocumentオブジェクトは使用できません。
  4. WXSSとCSSの類似点と相違点について教えてください。

• ページの外観を説明するために使用されます。

• WXSSにはCSSのほとんどの機能があり、いくつかの拡張と変更も行われています。

• WXSSは新しいサイズの単位を追加し、WXSSは下部で新しいサイズの単位rpxをサポートします。

• WXSSは一部のCSSセレクターのみをサポートしています。

• WXSSはグローバルスタイルとローカルスタイルを提供します

• WXSSはウィンドウとDOMドキュメントストリームをサポートしていません

5. WeChatアプレットのデータ要求をどのようにカプセル化しますか？

• すべてのインターフェースを統合されたjsファイルに入れてエクスポートする
• app.jsでリクエストデータをカプセル化するメソッドを作成する
• サブページでパッケージ化されたリクエストデータを呼び出す

または

• ルートディレクトリにutilsディレクトリ、api.jsファイル、apiConfig.jsファイルを作成します。
• 基本的なget \ post \ put \ uploadとその他のリクエストメソッドをappConfig.jsにカプセル化し、リクエストボディを設定し、トークンと例外処理をもたらします。
• apiConfig.jsによってカプセル化されたリクエストメソッドをapi.jsに導入し、対応するメソッドを設定して、ページデータによってリクエストされたURLに従ってエクスポートします。
• 特定のページでインポートする; 6.ミニプログラムページ間でデータを転送するには、
  どのような方法がありますか？
• html要素にdata- *属性を追加して値を渡し、e.currentTarget.datasetまたはonloadのparamパラメーターを介して取得します。注：data-nameに大文字を含めたり、オブジェクトを格納したりすることはできません
• IDのメソッドIDを設定して値を渡し、設定されたIDの値をe.currentTarget.idから取得して、グローバルオブジェクトを設定して値を渡します。
• ナビゲーターにパラメーター値を追加する

または

• グローバル変数を使用してデータ転送を実現する
• ページがリダイレクトまたはリダイレクトされるとき、URLを使用してパラメーターを指定してデータを渡す
• コンポーネントテンプレートテンプレートを使用してパラメーターを渡す
• キャッシュを使用してパラメーターを渡す
• データベースを使用してパラメーターを渡す

7.アプレットとビューの双方向バインディングの類似点と相違点について教えてください。

ほぼ同じですが、アプレットのthis.dataの属性をビューに直接同期することはできません。this.setData（）メソッドを呼び出す必要があります！

1.双方向バインディング：Vueはデフォルトで双方向バインディングをサポートしており、WeChatアプレットはデータを使用する必要があります。
2.値：Vueでは、値はthis.reasonを通じて取得されます。アプレットで、this.data.reasonを使用して値を取得します。
3.定義方法：小さなプログラムはapp.jsで定義でき、vueメソッドはメソッドに書き込むことで定義されます。

1.変数に移動する場合：-smallプログラムwx：for = "lists" -Vueはv-for = "list in item"

• データモデルを呼び出すとき（割り当て）：-ミニプログラム：this.data.item // call this.setData（{item：1}）// assignment- vue：this.item // call this.item = 1 //割り当て
  アプレットの双方向バインディングは、実際には双方向バインディングではありません。applet.jsファイルで変数の値が変更されても、ページの値は変更されません。ページの値も変更する場合setDataで操作する必要があり、Vueはデフォルトで双方向バインディングになり、変数の値のみが変更されます。ページも変更されます

8.アプレットのライフサイクル機能について教えてください。

• onLoad（）は、ページが読み込まれたときにトリガーされます。現在のページパスのパラメーターを取得するために1回だけ呼び出されます。

• onShow（）ページがフォアグラウンドに表示/カットされたときにトリガーされ、通常はデータ要求を送信するために使用されます。

• onReady（）は、ページの最初のレンダリングが完了したときにトリガーされ、1回だけ呼び出されます。つまり、ページはビューレイヤーと対話できます。

• onHide（）下部のタブが他のページに切り替わったり、アプレットが背景に切り替わったりするなど、ページが非表示/背景に切り取られたときにトリガーされます。

• onUnload（）ページがアンロードされるとトリガーされます（redirectToやnavigateBackなど）。

• onPullDownRefresh（）プルダウンリフレッシュのフック関数。ユーザーはプルダウンリフレッシュ時にこの関数に自動的に移動します。

9. onReachBottom（）上下に反転するフック関数9. WeChatアプレットの原理を簡単に説明してください。

• ミニプログラムは基本的に単一ページアプリケーションです。すべてのページレンダリングとイベント処理は1ページで実行されますが、さまざまなネイティブインターフェイスをWeChatクライアントから呼び出すことができます。

• そのアーキテクチャはデータ駆動型アーキテクチャモデルであり、UIとデータは分離されています。すべてのページの更新は、データの変更を通じて実装する必要があります。

• これは、JavaScript、WXML、WXSSの3つのテクノロジーを開発に使用して、既存のフロントエンド開発と技術的に類似しています。

• 関数は2つの部分に分割できます。webviewとappServiceです。

• Webviewを使用してUIを表示し、appServiceを使用してビジネスロジック、データ、およびインターフェイスの呼び出しを処理します。

• 2つの部分は2つのプロセスで実行され、システムレイヤーJSBridgeを介して通信して、UIレンダリングとイベント処理を実現します。

または

WeChatミニプログラムは、JavaScript、wxml、wxssの3つのテクノロジーを使用して開発されています。既存のフロントエンド開発との違いは次のとおりです。

• JavaScriptコードはWeChat APPで実行されるため、一部のh5テクノロジーアプリケーションは、対応するAPIサポートを提供するためにWeChat APPを必要とします。
• wxml WeChatはxml構文に基づいて開発されているため、開発中にWeChatによって提供される既存のタグのみを使用でき、htmlタグは使用できません。
• Wxssはcssのほとんどの機能を備えていますが、詳細なドキュメントがないとすべてがサポートされているわけではありません（wxssの画像は、外部リンクアドレスを使用してインポートする必要があります。本文なしで、インポートを使用してスタイルを直接インポートできます）。

WeChatのアーキテクチャは、データ駆動型のアーキテクチャモデルです。UIとデータは分離されています。すべてのページの更新は、データの変更を通じて実装する必要があります。

ミニプログラム機能は、webviewとAPPserviceに分かれています。webviewは主にUIを表示するために使用され、appserviceはビジネスロジック、データ、インターフェイスの呼び出しを処理するために使用されます。これらは2つのプロセスで実行され、システムレイヤーJSBridgeを介して通信し、UIレンダリングとイベント処理を実現します。

10.ネイティブ開発アプレット、wepy、mpvueの比較について教えてください。

• 私は個人的に、それが新しいプロジェクトであり、古いh5プロジェクトの移行がない場合は、ネイティブ開発に小さなプログラムを使用することを検討します利点は、サードパーティのフレームワークと比較して、ピットが少ないことです。
• また、vueで開発された古いh5プロジェクトがある場合、またはh5プロジェクトも小規模なプログラム開発を必要とする場合は、wepyまたはmpvue
  の移行または開発に適しています。Wepyは最近更新されていないため、Meituanのmpvueをお勧めします。
• そして、チームのフロントエンドが強力であれば、自分でフレームワークを構築しても問題ありません。
  11. WeChatミニプログラムの適用速度を改善できる方法は何ですか？
• ページの読み込み速度を改善する
• ユーザー行動予測＃行動予測とは
• デフォルトデータのサイズを小さくする
• コンポーネント化されたソリューション＃使用

12. WeChat Miniプログラムの利点と欠点を分析しますか？

利点：

• 使いやすく、基本的なコンポーネントライブラリは比較的完全であり、基本的に互換性の問題を考慮する必要はありません。
• 開発ドキュメントは比較的完全であり、開発コミュニティは比較的活発で、プラグイン開発がサポートされています。
• 優れたユーザーエクスペリエンス：ダウンロードする必要はありません。検索とスキャンによって開くことができ、開く速度が速く、ネイティブAPPと同様にAndroidのデスクトップに追加できます。
• 開発コストはAPPよりも低くなります。
• ユーザーに適切なセキュリティ保護を提供する（小規模なプログラムリリースの厳密なレビュープロセス）

短所：

• 多くの制限があり、ページサイズは1Mを超えることはできません。また、5レベルを超えるページを開くことはできません。
• スタイルは単一で、一部のコンポーネントは既に形成されており、スタイルは変更できません（スライドショー、ナビゲーションなど）。
• プロモーションエリアは狭く、モーメントで共有することはできません。友達や近くのミニプログラムと共有することによってのみプロモーションできます
• WeChatに依存しているため、バックグラウンド管理機能を開発できません
• APIインターフェースはhttpsリクエストとパブリックネットワークアドレスである必要があるため、バックグラウンドデバッグは面倒です
• 実際のマシンテストでは、AndroidとAppleの一部の機能のパフォーマンスが大きく異なります（たとえば、Androidの位置決め機能の読み込みが遅い）13 .
  WeChatアプレットの非同期リクエストの問題を解決するにはどうすればよいですか？

アプレットはES6構文をサポートし、成功を返すコールバック内のロジックを処理します。非同期の非同期/待機を約束します。

コールバック関数の次のコンポーネントの関数を呼び出します。

app.js

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

14.ミニプログラムがWeChat公式アカウントに関連付けられている場合、ユーザーの一意性をどのように判断しますか？

wx.getUserInfoメソッドwithCredentialsがtrueの場合、union_idを含むencryptedDataを取得できます。バックエンドは対称復号化を実行する必要があります。

15. WebViewを使用して直接ロードする場合、注意すべき点は何ですか？

• 管理者を使用して、ビジネスドメイン名をアプレットのバックグラウンドで追加する必要があります。
• アプレットにジャンプするためのh5ページの足跡は1.3.1を超えている必要があります。
• WeChatの共有は、ミニプログラムのメイン名にしかできません。共有コンテンツをカスタマイズする場合、ミニプログラムのバージョンは1.7.1以降です。
• h5の支払いをWeChat公式アカウントのappidにすることはできません。これはアプレットのappidである必要があり、ユーザーのopenidはユーザーとアプレットの16.である必要があり
  ます。バックグラウンドインターフェイスを呼び出すときにアプレットはどのような問題に遭遇しますか？
• データサイズの制限、範囲を超えると、アプレットが再起動されない限り、アプレット全体が直接クラッシュします。
• ミニプログラムは記事コンテンツのhtmlテキストを直接レンダリングできません。ディスプレイはプラグインを使用する必要があります

注：プラグインレンダリングではページの読み込みが遅くなります。バックグラウンドで記事コンテンツのhtmlをフィルタリングし、pタグとdivタグのバッチ置換をバックグラウンドで直接ビュータグに処理することをお勧めします。次に、プラグインに他のタグを実行させます。

17. WeChatアプレットはプルダウンリフレッシュをどのように実装しますか？

スクロールビューの代わりにビューを使用し、onPullDownRefresh関数を設定して、

18. webviewのページからアプレットに戻る方法は？

wx.miniProgram.navigateTo({
    
    
 url:’pages/login/login’+’$params’
})
 
**//跳转到小程序导航页面**
 
wx.miniProgram.switchTab({
    
    
 url:’/pages/index/index’
})

19. bindtapとcatchtapの違いは何ですか？
同じ点：まず、これらはすべてクリックイベント関数として使用され、クリックされたときにトリガーされます。この関数は同じであり、区別する必要はありません
。違いは、主にbindtapがバブリングイベントを防止せず、catchtapがバブリングを防止することです。

20. 5つのルートの違いを簡単に説明してください

• wx.navigateTo（）
• wx.redirectTo（）
• wx.switchTab（）
• wx.navigateBack（）
• wx.reLaunch（）

wxmlページで：

• 新しいページにジャンプ
• 現在のページで開く
• ホームページタブに切り替え

jsページ：「アプリ内ページ」と「tabBarページ」に分かれています。

上記のジャンプでジャンプが失敗するか無効であるという問題が発生した場合は、次のWebサイトにアクセスしてください：wx.navigateTo / wx.redirectTo is invalid

• wx.navigateTo（）：現在のページを保持し、アプリケーションのページにジャンプします。しかし、タブバーページにジャンプすることはできません
• wx.redirectTo（）：現在のページを閉じて、アプリケーションのページにジャンプします。ただし、タブバーページにジャンプすることはできません。
• wx.switchTab（）：tabBarページにジャンプし、他のすべての非tabBarページを閉じます
• wx.navigateBack（）は現在のページを閉じ、前のページまたは複数レベルのページに戻ります。getCurrentPages（）を使用し
  て現在のページスタックを取得し、返す必要があるレイヤーの数を決定できます
• wx.reLaunch（）：すべてのページを閉じて、アプリケーションのページを開きます

21. WeChat Mini ProgramとH5の違いは何ですか？

• 動作環境は異なります（アプレットはWeChatで実行され、h5はブラウザーで実行されます）。

• 異なる開発コスト（h5は異なるブラウザーと互換性がある必要があります）;

• システム権限の取得は異なります（システムレベルの権限は小さなプログラムとシームレスに接続できます）。

• 本番環境でのアプリケーションのスムーズさ（h5はユーザーエクスペリエンスを向上させるためにプロジェクトを継続的に最適化する必要があります）。

22.アプレットはページの値をどのように更新するのですか？
this.setDataを使用して変更できます。

23.ログインデータの永続性を実現するにはどうすればよいですか？データの永続性には
wx.setStorageSync（ 'キー名'、対応する値）を使用できます

24.
WeChat Mini Programとアプリの違いは何ですか？ WeChat Mini Programは軽量のアプリですが、WeChatに限定されており、開発サイクルが短く、機能が少なく、場所を取りません。

逆に、アプリは追加のメモリを消費する必要があり、開発サイクルは長いです

[[意味がフラスコとジャンゴの違いに相当することを理解しています]]

25. WeChat Mini Programの双方向バインディングを実行する方法

• bind-tap clickイベントを介してapp.jsで定義されたメソッドからレシートを取得します
• データの値を設定して双方向バインディングを実現する

26. toobarをカスタマイズする方法

• 現在のトゥーバーをキャンセル

• カスタムtoobarコンポーネントを挿入する

• app.json呼び出しコンポーネント

• ページにtootarコンポーネントが表示されます

オフトピック

情報が多すぎるため、この記事はスペースが限られており、情報のごく一部しか共有していません。実際のインタビューの質問（すべての質問への回答を含む）の完全なセットが必要な場合は、ここをクリックしてください。コード：qf
最近、仕事を見つけるのに最適な時期です。誰もがあなたの好きな仕事をスムーズに見つけます！