Cet article résume et partage avec vous quelques questions d'entretien basées sur des petits programmes (avec analyse), afin que vous puissiez gagner l'entretien avec certitude. J'espère qu'il sera utile à tout le monde !
Processus de connexion au mini programme
Étape 1 : wx.login obtient le code d'identification de connexion temporaire de l'utilisateur
Étape 2 : wx.getUserInfo obtient les données cryptées cryptées et le paramètre de décryptage iv
Étape 3 : Transférez le code, les données chiffrées et iv aux étapes 1 et 2 vers le propre serveur du développeur Étape 4 : Une fois que le serveur a obtenu le code, les données chiffrées et iv, utilisez la méthode get pour demander le projet personnel d'interface WeChat suivant. Il n'y a pas d'interface back-end qui répond au processus de connexion dans le développement cloud
mini programme. cycle de déclaration de page
● onLoad() est déclenché lorsque la page est chargée et ne sera appelé qu'une seule fois pour obtenir les paramètres dans le chemin de la page actuelle.
weight onShow() est déclenché lorsque la page est affichée/coupée au premier plan, et est généralement utilisé pour envoyer des requêtes de données ; appelé une fois, ce qui signifie que la page peut interagir avec la couche d'affichage
● onHide() est déclenché lorsque la page est masquée/basculée en arrière-plan, par exemple l'onglet du bas passe à d'autres pages ou l'applet passe en arrière-plan , etc.
Quantity onUnload() est déclenché lorsque la page est déchargée, comme redirectTo ou naviguerBack vers d'autres pages
applet Frameworks couramment utilisésWeUI WeUI est une bibliothèque de styles de base cohérente avec l’expérience visuelle native de WeChat. L’équipe de conception officielle de WeChat a conçu sur mesure les pages Web et les mini-programmes WeChat pour rendre la perception de l’utilisation des utilisateurs plus unifiée. Il s'agit du framework le plus couramment utilisé dans le développement de mini-programmes et il est populaire parmi les développeurs. Cadre du mini-programme Meituan mpvue Introduction officielle : mpvue est un framework front-end qui utilise Vue.js pour développer de petits programmes. Le framework est basé sur le noyau de Vue.js. mpvue a modifié l'implémentation du runtime et du compilateur de Vue.js afin qu'il puisse s'exécuter dans un environnement de mini-programme, introduisant ainsi un ensemble complet d'expériences de développement de Vue.js pour le développement de mini-programmes. .
Cadre de développement de composants wepy Introduction officielle : le développement basé sur les composants résout parfaitement les problèmes tels que l'isolation des composants, l'imbrication des composants et la communication des composants. Il prend en charge l'utilisation de ressources npm tierces, gère automatiquement les dépendances entre les ressources npm et est parfaitement compatible avec tous les packages de ressources npm sans. dépendances de la plateforme. Cadre officiel MINA Introduction officielle : le framework fournit ses propres langages de description de couche de vue WXML et WXSS, ainsi qu'un cadre de couche logique basé sur JavaScript, et fournit des systèmes de transmission de données et d'événements entre la couche de vue et la couche logique, permettant aux développeurs de se concentrer facilement. sur les données et logiquement.
Connaissez-vous les mini-programmes WeChat ? Décrivez brièvement les principes des mini-programmes. L'applet WeChat est développée à l'aide de trois technologies : JavaScript, WXML et WXSS. Il s'agit essentiellement d'une application d'une seule page. Tous les rendus de page et le traitement des événements sont effectués sur une seule page. Client WeChat ;
L'architecture de WeChat est un modèle d'architecture basé sur les données. Son interface utilisateur et ses données sont séparées. Toutes les mises à jour de page doivent être traitées via les données. Pour réaliser les modifications
⼼Le mini-programme est divisé en deux parties : et appService. Parmi eux, webview est principalement utilisé pour afficher l'interface utilisateur et appService est utilisé pour gérer la logique métier, les données et les appels d'interface. Ils s'exécutent en deux processus, communiquent via la couche système JSBridge et implémentent le rendu de l'interface utilisateur et le traitement des événements. Le fichier de répertoire principal du projet de mini-programme sert de fichier de configuration du projet project.config.json. comme la couleur de l'interface, la configuration de la compilation, etc. ; app.json est la configuration globale du mini-programme actuel, y compris toutes les configurations de chemin de page du mini-programme, les performances de l'interface, le délai d'attente du réseau, l'onglet inférieur, etc. sitemap.json configure si le mini-programme et ses pages peuvent être indexés par WeChat ; pages contient des pages spécifiques ; wxml (WeiXin Markup Language) est un ensemble de langages de balises conçus par le framework. Combiné avec des composants de base et des systèmes d'événements, il peut construire la structure de la page. wxss (WeiXin Style Sheets) est un langage de style utilisé pour décrire les styles de composants WXML app.wxss, en tant que style global, s'appliquera à toutes les pages de l'applet actuelle et aux styles de page locaux page.wxss ne prend effet que sur la page actuelle ; Logique de l'applet app.js js traitement logique, requêtes réseau Configuration de la page json
En quoi la liaison bidirectionnelle de l'applet est-elle différente de vue ?La propriété this.data directement dans l'applet ne peut pas être synchronisée avec la vue et doit être appelée : this.setData({ //Définir ici })
La fonction de cycle de vie de la page appletonLoad se déclenche au chargement de la page. Une page ne sera appelée qu'une seule fois. Vous pouvez récupérer les paramètres dans le chemin pour ouvrir la page en cours dans les paramètres de onLoad (surveillance du chargement de la page)
onShow() se déclenche lorsque la page est affichée/coupée au premier plan (surveillance). affichage de la page)
onReady() est déclenché lorsque le rendu initial de la page est terminé. Une page ne sera appelée qu'une seule fois, ce qui signifie que la page est prête et peut interagir avec la couche de vue (en surveillant l'achèvement du rendu initial de la page)
onHide() est déclenché lorsque la page est masquée/passée en arrière-plan . Comme naviguerTo ou l'onglet du bas pour passer à d'autres pages, l'applet passe en arrière-plan, etc. (surveillance du masquage de la page)
onUnload() se déclenche lorsque la page est déchargée. Tels que redirigerVers ou naviguerRetour vers d'autres pages (désinstallation de la page de surveillance)
Avantages et inconvénients du mini programme WeChat
Avantages : Prêt à l'emploi, aucune installation requise, économisant du trafic, économisant du temps d'installation et n'occupant pas le bureau S'appuyer sur le trafic WeChat, la promotion naturelle et les avantages de la communication Les coûts de développement sont inférieurs à ceux des applications lacune : La fidélisation des utilisateurs, l'utilisation instantanée est un avantage, mais il y a aussi quelques problèmes L'entrée est beaucoup plus profonde que les applications traditionnelles Il existe de nombreuses restrictions, la taille de la page ne peut pas dépasser 2 Mo et les pages de plus de 10 niveaux ne peuvent pas être ouvertes. Quelles sont les différences entre wxss et css dans le mini-programme ? WXSS est similaire au CSS, mais il est basé sur CSS. ajouts et modifications
Unité de dimension rpx rpx est un pixel réactif qui s'adapte à la largeur de l'écran. La largeur d'écran spécifiée est de 750rpx. Par exemple, sur iPhone6, la largeur de l'écran est de 375 pixels et il y a 750 pixels physiques au total, alors 750rpx = 375px = 750 pixels physiquesUtilisez l'identifiant @import pour importer des styles externes. @import est suivi du chemin relatif de la feuille de style externe qui doit être importée, avec ; pour indiquer la fin de l'instruction
Quelles sont les méthodes de transfert de données entre les mini pages du programme
(1) Utilisez des variables globales pour implémenter le transfert de données dans app.js. Définissez la variable globale globalData dans le fichier et stockez les informations qui doivent y être stockées. Lors de l'utilisation, utilisez directement getApp() pour obtenir les informations stockées
(2) Lors de l'utilisation de wx.navigateTo et wx.redirectTo, vous pouvez mettre une partie des données dans l'url et l'initialiser lorsque la nouvelle page est en chargement Points à noter : wx.navigateTo et wx.redirectTo ne permettent pas d'accéder à la page contenue dans l'onglet onLoad n'est exécuté qu'une seule fois (3) Utiliser le cache local lié au stockage Comment déterminer le caractère unique d'un utilisateur en associant le mini-programme au compte officiel WeChat
Si le développeur dispose de plusieurs applications mobiles, applications de sites Web et comptes publics (y compris mini-programmes), vous pouvez Le caractère unique des utilisateurs se distingue par l'unionid, car tant qu'il existe des applications mobiles, des applications de sites Web et des comptes publics (y compris des mini-programmes) sous le même compte de plateforme ouverte WeChat, l'unionid de l'utilisateur est unique. En d'autres termes, pour le même utilisateur, l'unionid est le même pour différentes applications sous la même plateforme ouverte WeChat. Comment implémenter l'actualisation déroulante ? Configurez d'abord activatePullDownRefresh dans la fenêtre de configuration globale. Définissez la fonction de hook onPullDownRefresh dans Page. Après avoir atteint la condition d'actualisation déroulante, la fonction de hook est exécutée et la méthode de requête est lancée. Une fois la requête renvoyée, appelez wx.stopPullDownRefresh pour arrêter l'actualisation du menu déroulant
Quelle est la différence entre bindtap et catchtap
La même chose : tout d'abord, ce sont toutes deux des fonctions d'événement de clic, qui sont déclenchées lorsqu'on clique dessus. Dans cette fonction, ils sont identiques et il n'y a pas besoin de les différencier. La différence : La principale différence entre eux est que bindtap n'empêche pas les événements de bouillonnement, tandis que catchtap empêche le bouillonnement. Différence 'wx.redirectTo()', 'wx.switchTab()', 'wx.navigateBack()', 'wx.reLaunch()'
wx.navigateTo() : conserver la page actuelle, sauter Accédez à une page de l'application. Mais vous ne pouvez pas accéder à la page de la barre d'ongletswx.redirectTo() : Fermez la page actuelle et accédez à une page de l'application. Cependant, accéder à la page TabBar n'est pas autorisé
wx.switchTab() : Accédez à la page TabBar et fermez toutes les autres pages non-tabBar
wx.navigateBack() : Fermez la page actuelle et revenez à la page précédente ou page à plusieurs niveaux. Vous pouvez obtenir la pile de pages actuelle via getCurrentPages() et décider du nombre de couches que vous devez renvoyer wx.reLaunch() : fermez toutes les pages et ouvrez une page dans l'application
typeof Operator, instanceof Operator et isPrototypeOf( ) La différence entre les méthodes
typeof est un opérateur utilisé pour détecter le type de données, tel que les types de données de base null, indéfini, chaîne, nombre, booléen, En plus des types de données de référence objet et fonction, mais pour les types de données de référence tels que les expressions régulières, les dates et les tableaux, ils seront tous reconnus comme des objets instanceof est également un opérateur, qui peut facilement identifier le type spécifique de données ; .Type de référence. La différence entre celui-ci et isPrototypeOf est que Il est utilisé pour détecter si le prototype du constructeur existe dans la chaîne de prototypes de l'objet spécifié ; isPrototypeOf est utilisé pour détecter si l'objet appelant cette méthode existe dans la chaîne de prototypes de l'objet spécifié, donc essentiellement les cibles de détection sont différentes.
La différence entre call() et apply()
En fait, les fonctions d'application et d'appel sont les mêmes, mais la forme de la liste des paramètres transmise est différente. apply(this object, [paramètre 1, paramètre 2,...]) Même s'il n'y a qu'un seul paramètre, il doit être écrit dans le tableau call(cet objet, paramètre 1, paramètre 2,...) Il peut accepter plusieurs paramètres arbitraires. Le premier paramètre est le même que apply, suivi d'une liste de paramètres
Comment l'applet WeChat transfère-t-elle les valeurs. aux événements
Ajoutez l'attribut data-* à l'élément HTML pour transmettre la valeur dont nous avons besoin, puis obtenez-la via le paramètre param de e.currentTarget.dataset ou onload. Mais le nom des données ne peut pas avoir de majuscules et ne peut pas stocker d'objets.
La différence entre l'applet WeChat et la vue
• Le cycle de vie est différent et le cycle de vie de l'applet WeChat est relativement simple. • La liaison de données est également différente. La liaison de données de l'applet WeChat doit utiliser directement {{}}, vue : simplement. • Contrôler l'affichage et le masquage des éléments. Dans les mini-programmes, utilisez wx-if et Hidden pour contrôler l'affichage et le masquage des éléments dans vue, utilisez v-if et v-show ; • Le traitement des événements est différent. Dans le mini-programme, bindtap(bind+event) ou catchtap(catch+event) sont utilisés pour lier des événements Vue : utilisez v-on:event pour lier des événements, ou utilisez @event pour lier des événements. • La liaison bidirectionnelle des données est également différente. Dans vue, il vous suffit d'ajouter un v-model à l'élément de formulaire, puis de lier une valeur correspondante dans les données. Lorsque le contenu de l'élément de formulaire change, la valeur correspondante. dans les données change également. Cela changera en conséquence, ce qui est une très bonne chose à propos de vue. L'applet WeChat doit obtenir la valeur modifiée de l'élément de formulaire, puis attribuer la valeur à une variable déclarée dans data.
Quelles méthodes peuvent être utilisées pour améliorer la vitesse d'application des mini-programmes WeChat
Améliorer la vitesse de chargement des pages Prédiction du comportement des utilisateurs Réduire la taille des données par défaut Solution composée de composants
Comment résoudre le problème de requête asynchrone des mini-programmes
Le mini-programme prend en charge la plupart des syntaxes ES6 • Traitez la promesse logique de manière asynchrone dans le rappel qui renvoie le succès
Quelles sont les similitudes et les différences entre l'applet wxml et le HTML standard ?
Identique à : • Ils servent à décrire la structure de la page ; • Ils sont composés de balises, d'attributs, etc. ; différent: • Les noms d'étiquettes sont différents et il y a moins d'étiquettes de mini-programmes et plus d'étiquettes simples ; • Il existe davantage d'attributs tels que wx:if et d'expressions telles que {{ }} ; • WXML ne peut être prévisualisé que dans les outils de développement d'applets WeChat, tandis que HTML peut être prévisualisé dans le navigateur ; • L'encapsulation des composants est différente, WXML ré-encapsule les composants ; • L'applet s'exécute dans JS Core et n'a pas d'arborescence DOM ni d'objet fenêtre. L'objet fenêtre et l'objet document ne peuvent pas être utilisés dans l'applet.
L'applet présente brièvement la liste d'attributs des trois objets événementiels ?
Événement de base (BaseEvent) • type : type d'événement • timeStamp : horodatage de la génération de l'événement • cible : une collection de valeurs de propriétés du composant qui a déclenché l'événement • currentTarget : une collection de propriétés du composant actuel Événement personnalisé (CustomEvent) • détail TouchEvénement • touche • Comment l'applet changesTouches
comprend-elle l'utilisation de wx:if et caché ?
• wx : if a un coût de changement plus élevé. • Hidden a un coût de rendu initial plus élevé. • Par conséquent, si des changements fréquents sont nécessaires, il est préférable d'utiliser caché. S'il est peu probable que les conditions changent pendant l'exécution, wx:if est préférable
La différence entre l'applet WeChat et H5
La différence entre. environnement d'exécution : L'environnement d'exploitation HTML5 traditionnel est un navigateur, y compris une vue Web, tandis que l'environnement d'exploitation des mini-programmes WeChat n'est pas un navigateur complet. Il s'agit d'un analyseur intégré entièrement reconstruit par l'équipe de développement de WeChat sur la base du noyau du navigateur, et est spécialement conçu pour les mini-programmes. L'optimisation, en conjonction avec des normes de langage de développement auto-définies, améliore les performances des petits programmes. • Différence de coûts de développement : il fonctionne uniquement sur WeChat, vous n'avez donc pas à vous soucier de la compatibilité du navigateur ou des bugs imprévisibles dans l'environnement de production. • La différence dans l'obtention des autorisations au niveau du système
app.json est la configuration globale de l'applet actuelle. Quelle est la signification de chacun des trois éléments de configuration ?
• Champ pages - utilisé pour décrire le chemin de toutes les pages du mini programme actuel. Ceci permet au client WeChat de savoir dans quel répertoire votre mini page de programme est actuellement définie. • champ de fenêtre - la couleur d'arrière-plan supérieure de toutes les pages du mini programme, la couleur du texte est définie ici • Champ d'onglet - l'onglet global supérieur ou inférieur du mini programme
À quoi dois-je faire attention lorsque j'utilise la méthode onPageScroll du mini programme ?
Étant donné que cette méthode est appelée fréquemment, elle peut être supprimée lorsqu'elle n'est pas nécessaire. Ne conservez pas la méthode vide Lorsque vous utilisez onPageScroll, essayez d'éviter d'utiliser setData() et de minimiser la fréquence d'utilisation de setData().
Rappel de fin de rendu du rendu de la vue du mini programme ?
Utilisez setData(data, callback) et ajoutez le code d'opération suivant dans la méthode de rappel
À quoi devez-vous faire attention lorsque vous utilisez l'API synchrone et l'API asynchrone du mini-programme ?
wx.setStorageSync est une API se terminant par Sync, qui est une API de synchronisation. Utilisez try-catch pour afficher les exceptions lors de son utilisation. Si l'API est déterminée comme étant asynchrone, vous pouvez effectuer l'étape suivante dans ses méthodes de rappel Succès, Échec et Terminer.
Comment encapsuler la demande de données de l'applet WeChat ?
1. Mettez toutes les interfaces dans un fichier js unifié et exportez-le.
2. Créez une méthode pour encapsuler les données de la requête dans app.js.
3. Appelez la méthode encapsulée dans la sous-page pour demander des données.
Lequel est le meilleur, un mini programme ou une application native ?
En plus d'avoir les avantages de faibles coûts de développement, de faibles coûts d'acquisition de clients et de l'absence de téléchargement du compte public, le mini programme a grandement amélioré le délai de demande de service et l'expérience utilisateur. Cela lui permet d'exécuter des fonctions de service complexes et d'offrir aux utilisateurs une meilleure expérience utilisateur.
Comment revenir au mini programme à partir d'une page en webview ?
Nous devons d'abord présenter la dernière version de jweixin-x.x.x.js, puis
wx.miniProgram.navigateTo({
url: '/pages/login/login'+'$params'
})Comment accéder à la page de navigation du mini programme à partir de la page d'affichage Web ?
La page parcourue par l'applet peut être commutéeTab, mais les données ne seront pas rechargées par défaut. Si vous avez besoin de charger de nouvelles données, ajoutez simplement le code suivant à l'attribut success :
Quels problèmes les mini-programmes rencontrent-ils lors de l'appel de l'interface en arrière-plan ?
1. La taille des données est limitée. Le dépassement de la plage entraînera directement le crash de l'ensemble du mini-programme à moins que le mini-programme ne soit redémarré.
2. Le mini-programme ne peut pas restituer directement le contenu texte HTML de ce type ; la page de contenu de l'article. S'il doit être affiché Vous devez utiliser le plug-in, mais le rendu du plug-in ralentira le chargement de la page, il est donc préférable de filtrer le html du contenu de l'article en arrière-plan, directement. traitez le remplacement par lots des balises p et div par des balises d'affichage en arrière-plan, puis laissez le plug-in s'occuper des autres balises. Réduisez le temps de démarrage
Quels sont les avantages et les inconvénients des mini-programmes WeChat ?
Avantages :
1. Pas besoin de télécharger, vous pouvez l'ouvrir en recherchant et en scannant.
2. Bonne expérience utilisateur : vitesse d'ouverture rapide.
3. Le coût de développement est inférieur à celui de l'App.
4. Il peut être ajouté au bureau sur Android, ce qui est similaire à l'application native.
5. Offrir aux utilisateurs une bonne sécurité. WeChat a un processus d'examen strict pour la publication des mini-programmes qui ne peuvent pas passer l'examen, ne peuvent pas être publiés en ligne.
Inconvénients :
1. Plus de restrictions. La taille de la page ne peut pas dépasser 1 M. Les pages comportant plus de 5 niveaux ne peuvent pas être ouvertes.
2. Style unique. Certains composants du mini-programme sont déjà formés et les styles ne peuvent pas être modifiés. Par exemple : diaporama, navigation.
3. La portée de la promotion est étroite et ne peut pas être partagée dans le cercle d'amis. Elle ne peut être promue qu'en partageant avec des amis et des mini-programmes à proximité. Parmi eux, les mini-programmes à proximité sont également restreints par WeChat.
4. En s'appuyant sur WeChat, il est impossible de développer des fonctions de gestion backend.
【Recommandations d'apprentissage associées : Tutoriel de développement de mini-programmes】
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!
![[Web front-end] Démarrage rapide de Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
