前言

微信之父張小龍在年初的那次演講中曾表示：“我自己是很多年的程式設計師，我覺得我們應該為開發的團隊做一些事情”。幾個月後，微信正式推出微信應用號（即微信小程式），在網際網路中掀起了又一波熱潮。
於是，很多人準備要開發微信的小程式，如果你真的想要開發小程式，就要先學會一套微信特製的“開發語言”。為了更好地上手這門開發語言，下面這三件事你一定要知道：

語言與檔案

微信小程式來發與其他平臺開發的最大差異在於：微信使用的開發語言和檔案很“個性”。
小程式所使用的程式檔案型別大致分為以下幾種：

• WXML（WeiXin Mark Language， 微信標記語言）
• WXSS（WeiXin Style Sheet，微信樣式表）
• JS（JavaScript， 小遊戲的主體）

在語言方面，下程式看似重新定義了一套標準。但實際上，他們與“前端三件套”（HTML、CSS和JavaScript）差不太多。來來來，看一下微信小程式開發語言和“前端三件套”的異同點。

介面搭建

1、基本邏輯

WXML和WXSS兩種檔案是小程式介面元素宣告及樣式描述檔案。

WXML最大的特點是以檢視（View）的方式串聯介面元素，並通過程式邏輯（AppService）將資訊更新實時傳遞至檢視層。

View類似於HTML中的div元素，在構建的時候，View可以被多級巢狀，View內可以放置任意視覺元素。

需要注意的是，元素一旦超出螢幕之外，使用者就無法看到了，這是與HTML喲較大的不同。小程式喲專門用於滾動的檢視。如果希望介面是一個可以自由滾動的介面（例如列表等），可以使用scroll-view檢視，在WXSS中將其大小調整為整個螢幕，並設定scroll-y（上下滾動）或scroll-x（左右滾動）為true，

注意，小程式中不能直接使用DOM控制WXML元素。如果需要進行資料更新，就要使用WXML提供的資料繫結及元素渲染方法，還有一點，小程式的柵格排版系統使用的是Flex佈局，它是W3C在2009年提出的一種排版標準。

2、繫結資料

對於單個欄位，開發者可以使用資料繫結的方法進行資訊更新。繫結的資料除了在載入的時候可以更新，也可以在JS主程式中以函式形式進行更新，更新同樣可以反應到介面上被繫結的資料中。

3、條件渲染與列表（迴圈）渲染

條件渲染適用於有意外情況提示的頁面（如無法載入列表或詳情時，做出提示等等）。它的渲染帶有觸發條件，即符合條件時渲染這個頁面，否則忽略或渲染另一端程式碼。兩個花括號所包含的判斷條件中的變數於主程式JS程式碼中的data中宣告。將同一元素渲染程式碼進行集合。迴圈的資料可以通過陣列的方式寫入data中供WXML訪問。渲染完畢後，渲染判斷條件的變動可以影響介面變動。

4、模板與引用

WXML支援使用模板與引用減少程式碼體積。模板是在WXML程式碼中對相同的程式碼進行復用的方式。可以將多個模板寫入至同一個檔案，並使用import在其他檔案中進行引用。如果需要整個頁面引用，需要使用include。

5、樣式

通過WXSS樣式表，開發者可以定義WXML中的元素樣式。WXSS與CSS程式碼一樣，可以直接使用選擇器選擇元素，在WXML中也可以直接定義元素的id和class以便於在WXSS檔案中進行樣式定義。

6、使用者操作與事件響應

由於微信使用的不是HTML，所以也不能通過新增超連結（a元素）的方式來檢測使用者的點選事件。對於需要監聽點選事件的元素，應該在WXML中使用bindtap屬性或catchtap屬性進行繫結。除了點選一次，微信也提供按住、開始觸控、鬆手等事件響應。在WXML中繫結好一個事件之後，就能在主程式中使用。其他的API中也有相應的事件，這些事件樂意在微信小程式的官方文件中查閱到。當需要在小程式的頁面間進行跳轉時，應該使用wx.navigateTo()方式。
注意，有關於頁面層級跳轉，微信將層級跳轉限制在5層。在開發時一定注意不要超過了相應限制。

網路請求方式

網路訪問小程式支援三種請求方式：HTTP連線、WebSocket、檔案收發連線。

• HTTP連線：請求後直接返回結果，連線結束；
• Socket連線：持續性連線，當一方主動關閉連線時，連線結束；
• 檔案收發連線：顧名思義，發生在檔案傳輸時的連線。（錄製的語音和選擇的照片都需要這個連線完成）。

注意，通過小程式訪問網路需要伺服器必須支援HTTPS連線，且埠必須為443。同時，小程式只能訪問開發者在登記小程式時設定的伺服器地址。