2019 11 26 面試 小程式總結

2022-06-28 06:09:13 字數 3455 閱讀 6683

小程式分為應用、頁面和元件三個部分,所以小程式的生命週期涉及到的知識點有一下幾個:

2、頁面的生命週期:page

3、元件的生命週期:component

4、應用的生命週期對頁面生命週期的影響

},onshow: function(options) ,

onhide: function() ,

onerror: function(msg) ,

onpagenotfound: function(res) ,

globaldata:

'i am global data'

})使用者首次開啟小程式,觸發 onlaunch 方法(全域性只觸發一次)。

小程式初始化完成後,觸發 onshow 方法,監聽小程式顯示。

小程式從前台進入後台,觸發 onhide 方法。

小程式從後台進入前台顯示,觸發 onshow 方法。

小程式後台執行一定時間,或系統資源占用過高,會被銷毀。

page(object)函式用來註冊乙個頁面。接受乙個object型別引數,其指定頁面的初始資料、生命週期**、事件處理函式等。

page(,

onload: function(options) ,

onready: function() ,

onshow: function() ,

onhide: function() ,

onunload: function() ,

onpulldownrefresh: function() ,

onreachbottom: function() ,

// 使用者點選右上角**

},onpagescroll: function() ,

onresize: function() ,

ontabitemtap(item) ,

// 任意的函式,在頁面的函式中用 this 可以訪問

viewtap: function() , function() )

},// 任意資料,在頁面的函式中用 this 可以訪問

customdata:

})

總結

檢視執行緒有四大狀態:

初始化狀態:初始化檢視執行緒所需要的工作,初始化完成後向 「服務執行緒」傳送初始化完成訊號,然後進入等待狀態,等待服務執行緒提供初始化資料。

首次渲染狀態:當收到服務執行緒提供的初始化資料後(json和js中的data資料),渲染小程式介面,渲染完畢後,傳送「首次渲染完成訊號」給服務執行緒,並將頁面展示給使用者。

持續渲染狀態:此時介面執行緒繼續一直等待「服務執行緒」通過this.setdata()函式傳送來的介面資料,只要收到就重新區域性渲染,也因此只要更新資料並傳送訊號,介面就自動更新。

結束狀態:頁面被**或者銷毀、應用被系統**、銷毀時觸發。

服務執行緒五大狀態:

初始化狀態:此階段僅啟動服務執行緒所需的基本功能,比如訊號傳送模組。系統的初始化工作完畢,就呼叫自定義的onload和onshow,然後等待檢視執行緒的「初始化完成」。onload是只會首次渲染的時候執行一次,onshow是每次介面切換都會執行。

等待啟用狀態:接收到「檢視執行緒初始化完成」訊號後,將初始化資料傳送給「檢視執行緒」,等待檢視執行緒完成初次渲染。

啟用狀態:收到檢視執行緒傳送來的「首次渲染完成」訊號後,就進入啟用狀態既程式的正常執行狀態,並呼叫自定義的onready()函式。此狀態下就可以通過 this.setdata 函式傳送介面資料給介面執行緒進行區域性渲染,更新頁面。

後台執行狀態:如果介面進入後台,服務執行緒就進入後台執行狀態,從目前的官方解讀來說,這個狀態挺奇怪的,和啟用狀態是相同的,也可以通過setdata函式更新介面的。畢竟小程式的框架剛推出,應該後續會有很大不同吧。

結束狀態:頁面被**或者銷毀、應用被系統**、銷毀時觸發。

另: 寫過react的童鞋都知道,react 中使用了 will、 did、should 等一系列有時態語義的詞彙命名鉤子函式。小程式中,統一使用on,那麼on是在行為前還是行為後,從例項生命週期圖中,我們可以明顯看到:鉤子觸發執行時機都是在事件完成之後觸發的。例如set to background之後onhode

元件的生命週期,指的是元件自身的一些函式,這些函式在特殊的時間點或遇到一些特殊的框架事件時被自動觸發。

其中,最重要的生命週期是 created attached detached ,包含乙個元件例項生命流程的最主要時間點。

created 元件例項化,但節點樹還未匯入,因此這時不能用setdata

attached 元件初始化完畢,節點樹完成,可以用setdata渲染節點,但無法操作節點

ready 元件布局完成,這時可以獲取節點資訊,也可以操作節點

moved 元件例項被移動到樹的另乙個位置

detached 元件例項從節點樹中移

元件所在頁面的生命週期, 指的是那些並非與元件有很強的關聯,但有時元件需要獲知,以便元件內部處理的生命週期,在 pagelifetimes 定義段中定義。

show 元件所在的頁面被展示時執行

hide 元件所在的頁面被隱藏時執行

resize 元件所在的頁面尺寸變化時執行

component(,

attached() ,

ready() ,

moved() ,

detached() ,

error(err)

},pagelifetimes: ,

hide() ,

resize(size)

},// 以下是舊式的定義方式,可以保持對 <2.2.3 版本基礎庫的相容

attached() ,

detached() ,

// ...

})

我們來看圖:應用生命週期影響頁面生命週期

小程式初始化完成後,頁面首次載入觸發onload,只會觸發一次。

當小程式進入到後台,先執行頁面onhide方法再執行應用onhide方法。

當小程式從後台進入到前台,先執行應用onshow方法再執行頁面onshow方法。

component created

component attached

page onload

component show

page onshow

component ready

page onready

page onunload

component detached

小程式總結

const share 函式名 funciton onshowarticle1 function e onshowarticle2 function e 第一步,在相對應的頁面的json 檔案中 開啟此功能 enablepulldownrefresh true,onpulldownrefresh f...

小程式的總結

0.1.關於頁面載入 生命週期函式 2.首頁的登入和校驗 3.function getdata url,data,types else return new promise function resolve,reject success function res fail function res ...

程式猿面試總結

良好的開端是成功的一半所以面試時第一印象很重,盡量在技術面試之前就抓住hr小姐姐和面試官的眼球,以下我總結了幾點 1 著裝簡單大方 乾淨整潔 不要油頭髮亮的。2 談吐目視對方,一方面表示尊重,其次這也是自信的表現。有些人可能不習慣一直看著對方眼睛也能理解,教你一種方法,看著對方的額頭就好也不要傻乎乎...