Shulou(Shulou.com)06/02 Report--

The editor would like to share with you what the interview questions based on Mini Program are, which I believe most people don't know yet, so share this article for your reference. I hope you will learn a lot after reading this article. Let's find out about it.

Mini Program login process

Step 1: wx.login obtains the user's temporary login credential code

Step 2: wx.getUserInfo obtains encrypted data encryptedData and decryption parameter iv

Step 3: transfer the code, encryptedData and iv in step 1 and 2 to the developer's own server. Step 4: after the server obtains the code, encryptedData and iv, the server uses the get method to request the following Wechat interface personal project. There is no back-end interface, which answers the login process in cloud development.

Mini Program page declaration cycle

Triggered when the ● onLoad () page is loaded, it is called only once to get the parameters in the current page path.

Triggered when the ● onShow () page is displayed / cut into the foreground, and is generally used to send data requests

Triggered when the ● onReady () page is rendered for the first time, it will only be called once, indicating that the page can interact with the view layer

Triggered when the ● onHide () page is hidden / cut into the background, such as switching from the bottom tab to another page or Mini Program cutting into the background, etc.

Triggered when the ● onUnload () page is unloaded, such as redirectTo or navigateBack to another page

The framework commonly used in Mini Program

WeUI WeUI is a basic style library consistent with Wechat's native visual experience, tailored by Wechat's official design team for the Wechat web page and WeChat Mini Programs, making the user perception more unified. Mini Program development in the most commonly used framework, welcomed by the majority of developers. Meituan Mini Program framework mpvue official introduction: mpvue is a front-end framework for using Vue.js to develop Mini Program. The framework is based on the Vue.js core. Mpvue modifies the runtime and compiler implementation of Vue.js to make it run in the Mini Program environment, thus introducing a complete set of Vue.js development experience for Mini Program development.

Component-based development framework wepy official introduction: component-based development, perfect solution to component isolation, component nesting, component communication and other problems, support the use of third-party npm resources, automatically deal with the dependency between npm resources, perfectly compatible with all platform-free npm resource packages. Official Framework MINA official introduction: the framework provides its own view layer description languages WXML and WXSS, as well as a logical layer framework based on JavaScript, and provides a data transfer and event system between the view layer and the logic layer, allowing developers to easily focus on data and logic.

Do you know WeChat Mini Programs? Briefly describe the principle of Mini Program.

The Wechat subscription program adopts JavaScript, WXML and WXSS technologies for further development, which is essentially a "single response". All the rendering and event handling of the browser are in a single application, but you can tune all kinds of connections to the original server through the Wechat client.

The architecture of Wechat is a data-driven architecture model, its UI and data are separate, and all updates need to be realized through changes to the data.

The webview program is divided into two parts, webview and appService. Webview is mainly used to display UI, and appService is used to handle business logic, data and call calls. They operate in two processes and communicate with each other through the system layer JSBridge to render UI and handle events.

The role of the main catalog files of the Mini Program project

Project.config.json project configuration file, do some personalized configuration, such as interface color, compilation configuration, etc.; app.json 's current global configuration of Mini Program, including all page path configuration, interface performance, network timeout, bottom tab, etc.; sitemap.json configuration Mini Program and whether its pages are allowed to be indexed by Wechat; pages contains a specific page Wxml (WeiXin Markup Language) is a set of tag language designed by the framework. Combined with the basic components and event system, the structure of the page can be constructed. Wxss (WeiXin Style Sheets) is a set of style language used to describe the component style of WXML. As a global style, app.wxss acts on all pages of the current Mini Program. The local page style page.wxss only works on the current page. App.js Mini Program logic js logic processing, network request json page configuration

What is the difference between the two-way binding of Mini Program and vue?

The properties of Mini Program's direct this.data cannot be synchronized to the view. You must call this.setData ({/ / set here})

Life cycle function of Mini Program page

Triggered when an onLoad page is loaded. A page can only be called once, and you can obtain the parameters in the path of opening the current page in the parameters of onLoad (listening for page loading)

Triggered when the onShow () page is displayed / cut into the foreground (listening page display)

Triggered when the onReady () page has finished rendering for the first time. A page will only be called once, indicating that the page is ready to interact with the view layer (listen for the first rendering of the page)

Triggered when the onHide () page is hidden / cut into the background. For example, navigateTo or bottom tab switch to another page, Mini Program cuts into the background, etc. (listening page is hidden)

Triggered when the onUnload () page is unloaded. Such as redirectTo or navigateBack to another page (listening page uninstall)

WeChat Mini Programs's advantages and disadvantages

Advantages: use-as-you-go, no installation, save traffic, save installation time, do not occupy the desktop to rely on Wechat traffic, innate promotion and communication advantages, development costs are lower than App disadvantages: users retain, that is, use is an advantage, there are also some problems compared with the traditional App entrance is deeper, many restrictions, page size can not exceed 2m, can not open more than 10 levels of pages

What are the differences between wxss and css in Mini Program?

WXSS is similar to CSS, but some additions and modifications have been made to CSS.

The size unit rpx rpx is responsive pixels, which can be adapted according to the width of the screen. Specify the screen width as 750rpx. On iPhone6, if the screen width is 375px and there are 750 physical pixels, then 750rpx = 375px = 750 physical pixels

Use the @ import identifier to import the outreach style. @ import is followed by the relative path of the outreach stylesheet to be imported, using; to indicate the end of the statement

What are the ways to transfer data between Mini Program pages

(1) use global variables to achieve data transfer. Define the global variable globalData in the app.js file. When storing the information that needs to be stored in it, you can directly use getApp () to get the stored information.

(2) when using wx.navigateTo and wx.redirectTo, you can put part of the data in url, and initialize the problems you need to pay attention to when a new page onLoad: wx.navigateTo and wx.redirectTo do not allow you to jump to the page contained in tab. OnLoad is only executed once. (3) use local cache Storage.

How to determine the uniqueness of users when Mini Program is associated with Wechat official account

If developers have multiple mobile applications, web apps, and public accounts (including Mini Program), they can distinguish the uniqueness of users through unionid, because as long as they are mobile apps, web apps and public accounts (including Mini Program) under the same Wechat open platform account, the user's unionid is unique. In other words, the same user, unionid is the same for different applications under the same Wechat open platform.

How to implement drop-down refresh

First, the window configuration enablePullDownRefresh in the global config defines the onPullDownRefresh hook function in Page. When the drop-down refresh condition is reached, the hook function executes. After the request method request is returned, the wx.stopPullDownRefresh is called to stop the drop-down refresh.

What's the difference between bindtap and catchtap?

What they have in common: first of all, they all function as click events, which are triggered when they are clicked. In this role, they are the same, they can not make a distinction.

Difference: the main difference between them is that bindtap will not stop bubbling events, catchtap will prevent bubbling.

The differences between 'wx.navigateTo ()', 'wx.redirectTo ()', 'wx.switchTab ()', 'wx.navigateBack ()' and 'wx.reLaunch ()'

Wx.navigateTo (): keep the current page and jump to a page within the application. But you can't jump to the tabbar page.

Wx.redirectTo (): closes the current page and jumps to a page within the application. But you are not allowed to jump to the tabbar page

Wx.switchTab (): jump to the tabBar page and close all other non-tabBar pages

Wx.navigateBack (): closes the current page and returns to the previous or multi-level page. You can get the current page stack through getCurrentPages () and decide how many layers you need to return.

Wx.reLaunch (): close all pages and open to a page within the application

Differences between typeof operator and instanceof operator and isPrototypeOf () method

Typeof is an operator that detects data types, such as basic data types null, undefined, string, number, boolean, and reference data types object, function, but it is all recognized as object for reference data types such as regular expressions, dates, and arrays

Instanceof is also an operator, which can well identify the specific reference type of the data. The difference between isPrototypeOf and isPrototypeOf is that it is used to detect whether the prototype of the constructor exists in the prototype chain of the specified object, while isPrototypeOf is used to detect whether the object calling this method exists in the prototype chain of the specified object, so it essentially detects that the target is different.

The difference between call () and apply ()

In fact, the functions of apply and call are the same, except that the passed-in parameter lists are different. Apply (this object, [parameter 1, parameter 2,...]) Even if there is only one parameter, write call (this object, parameter 1, parameter 2,...) in the array. It can accept multiple arbitrary parameters, the first of which is the same as apply, followed by a list of parameters

How does WeChat Mini Programs pass the value to the event?

Add a data-* attribute to the HTML element to pass the value we need, and then get it through the param parameter of e.currentTarget.dataset or onload. But data-the name cannot have uppercase letters and cannot store objects.

The difference between WeChat Mini Programs and vue

The life cycle of WeChat Mini Programs is different. WeChat Mini Programs's life cycle is relatively simple and data binding is also different. WeChat Mini Programs data binding needs to use {{}}, vue directly: you can control the display and hiding of elements. In Mini Program, you use wx-if and hidden to control the display and hiding of elements. In vue, using v-if and v-show event handling is different. In Mini Program, all use bindtap (bind+event) or catchtap (catch+event) to bind events. Vue: use v-on:event to bind events, or use @ event to bind event data. In vue, you only need to add v-model to the form element, and then bind a corresponding value in data. When the content of a form element changes, the corresponding value in data changes accordingly, which is a very nice point in vue. WeChat Mini Programs must get the changed value of the form element, and then assign the value to a variable declared in data.

Which methods can be used to improve the application speed of WeChat Mini Programs

A component-based scheme for improving page loading speed and predicting user behavior and reducing default data

How to solve the asynchronous request problem of Mini Program

Mini Program supports that most ES6 grammars handle logic Promise asynchronism in callbacks that return success.

What are the similarities and differences between Mini Program wxml and standard html?

Same: all are used to describe the structure of the page; all consist of tags, attributes, etc.; different: tag names are different, and Mini Program tags have fewer tags, more single tags; some attributes like wx:if and expressions like {{}} are added; WXML can only be previewed in WeChat Mini Programs developer tools, while HTML can be previewed in browsers Component encapsulation is different, WXML re-encapsulates the component; Mini Program runs in JS Core, without DOM tree and window object, Mini Program can not use window object and document object.

Mini Program briefly introduces the attribute list of the next three event objects?

Basic event (BaseEvent) type: event type timeStamp: timestamp when the event is generated target: collection of property values of the component that triggered the event currentTarget: collection of some properties of the current component custom event (CustomEvent) detail touch event (TouchEvent) touches changedTouches

Mini Program's understanding of the use of wx:if and hidden?

Wx:if has a higher handover cost. Hidden has a higher initial rendering cost. Therefore, it is better to use hidden if you need to switch frequently, and wx:if if the conditions are unlikely to change at run time

The difference between WeChat Mini Programs and H5

Different running environment: the traditional HTML5 runs on a browser, including webview, while WeChat Mini Programs's running environment is not a complete browser, but a built-in parser for Wechat development team based on browser kernel complete refactoring, specially optimized for Mini Program and in line with self-defined development language standards to improve the performance of Mini Program. Differences in development costs: only run in Wechat, so you don't have to worry about browser compatibility or the unexpected and wonderful differences in obtaining system-level permissions for BUG in a production environment.

App.json is the current global configuration of Mini Program, describing the meaning of each item of the three configurations?

Pages field-used to describe all the current Mini Program page paths, this is to let Wechat clients know the directory in which your Mini Program pages are currently defined. Window field-- the top background color of all Mini Program pages. The text color is defined in the tab field here-- the global top or bottom tab of Mini Program.

What should I pay attention to when using the Mini Program onPageScroll method?

Because this method is called frequently, it can be removed when it is not needed, do not keep the empty method, and when using onPageScroll, try to avoid using setData () and minimize the frequency of using setData ().

Mini Program view rendering end callback?

Add the subsequent operation code to the callback callback method using setData (data, callback)

What should I pay attention to when using synchronous API and asynchronous API in Mini Program?

Wx.setStorageSync uses API ending with Sync as synchronous API. Try-catch is used to view exceptions. If API is determined to be asynchronous, you can proceed to the next step in its callback methods success, fail, and complete.

How to encapsulate WeChat Mini Programs's data request?

1. Put all the interfaces in a unified js file and export them.

2. Create a method to encapsulate the request data in app.js.

3. Call the encapsulated method to request data in the child page.

Which is better, Mini Program or native App?

In addition to the advantages of low development cost, low customer acquisition cost and no need to download, Mini Program has been greatly improved in service request delay and user experience, making it able to carry complex service functions and enable users to get a better user experience.

How do pages in webview jump back to Mini Program?

First you need to introduce the latest version of jweixin-x.x.x.js, and then

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

How does the page of webview jump to the page of Mini Program navigation?

Pages navigated by Mini Program can be accessed via switchTab, but the data is not reloaded by default. To load new data, add the following code to the success property:

What are the problems encountered when Mini Program calls the backend API?

1. The size of the data is limited, and exceeding the range will directly cause the entire Mini Program to collapse unless Mini Program is restarted.

2. Mini Program cannot directly render the html text content of the article content page, if you need to display it, you need to borrow the plug-in, but the plug-in rendering will cause the page to load slowly, so it is best to filter the html of the article content in the background, and directly process the batch replacement of the p tag div tag to the view tag in the background, and then let the plug-in do other tags to reduce the front-end time.

What are WeChat Mini Programs's strengths and weaknesses?

Advantages:

1. No need to download, you can open it by searching and scanning.

2. Good user experience: fast opening speed.

3. The development cost is lower than that of App.

4. Android can be added to the desktop, similar to native App.

5. Provide good security for users. For the release of Mini Program, Wechat has a strict review process, and Mini Program that cannot be censored cannot be released online.

Disadvantages:

1. There are many restrictions. The page size cannot exceed 1m. You cannot open pages with more than 5 levels.

2. The style is single. Some of the components of Mini Program are already formed and the style cannot be modified. For example: slide show, navigation.

3, the promotion area is narrow, can not share the circle of friends, can only be shared with friends, nearby Mini Program to promote. Among them, nearby Mini Program is also restricted by Wechat.

4. Relying on Wechat, the background management function can not be developed.

The above is all the contents of the article "what are the interview questions based on Mini Program"? thank you for reading! I believe we all have a certain understanding, hope to share the content to help you, if you want to learn more knowledge, welcome to follow the industry information channel!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.