小程序開發

開發流程：

1. 申請帳號
2. 下載安裝開發者工具
3. 熟悉默認demo
4. 代碼構成：JSON,WXML,WXSS,JS
5. 小程序能力：
-- 啓動：微信客戶端下載小程序代碼-根據配置啓動加載app.json中pages的第一個頁面--啓動後回調執行app.js中App實例的onLaunch。
-- 程序和頁面：加載一個頁面，首先加載json配置, 在加載wxml,wxss，最後加載js,結合js中的data數據進行渲染，渲染完成後執行onLoad回調。
-- 組件：微信提供的各類樣式組件，如：view,swiper,text,input,navigator,image,map,canvas等。
-- API: 提供微信自己能力的一些接口，如：獲取微信用戶信息，微信支付，獲取地理位置，掃一掃等。
注：啓動前後順序爲onLaunch(app)-onShow(app)-onLoad(index)-onShow(index)-onReady(index)
onUnload: 返回和redirectTo觸發
onHide: navigationTo觸發
6. 構思設計/開發/預覽/發佈/運營

組件：

視圖容器：view, swiper, scroll-view, movable-view, cover-view;
基礎內容：text, icon, rich-text, progress;
表單組件：input, label, checkbox, radio, button, form, picker, picker-view, slider, switch, textarea;
導航：navigator;
媒體組件：audio, image, video, camera, live-player, live-pusher;
地圖：map;
畫布：canvas;
開放能力：open-data, web-view;

API:

網絡：發起請求、上傳下載、WebSocket

媒體：圖片、錄音、錄音管理、音頻播放控制、音樂播放控制、背景音頻播放管理、音頻組件控制、視頻、視頻組件控制、相機組件控制、實時音視頻

文件：文件的獲取、存儲、打開、刪除

數據緩存：緩存的設置、獲取、移除、清空

位置：獲取位置、查看位置、地圖組件控制

設備：系統信息、網絡狀態、加速度計、羅盤、撥打電話、掃碼、剪貼板、藍牙、iBeacon、屏幕亮度、用戶截屏事件、振動、手機聯繫人、NFC、Wi-Fi

界面：交互反饋、設置導航條、設置tabBar、設置置頂信息、導航、動畫、位置、繪圖、下拉刷新、WXML節點信息、WXML節點佈局相交狀態

第三方平臺：獲取配置信息

開放接口：登錄、受權、用戶信息、微信支付、模板消息、客服消息、轉發、獲取二維碼、收貨地址、卡卷、設置、微信運動、打開小程序、打開APP、獲取發票擡頭、生物認證、附近、插件管理

數據：常規分析、自定義分析

更新：版本更新管理

多線程：建立多線程程序

調試接口：打開/關閉調試

 JSON配置：

app.json: 當前小程序全局配置，包括了小程序的全部頁面路徑，界面表現，網絡超時，底部tab等。
project.config.json: 開發者工具的個性化配置文件，修改工具的顏色，編譯方式等都會寫入這個文件。
page.json: 每一個頁面的屬性配置

  JSON:
  -- json文件不支持註釋
  -- json文件使用雙引號

WXML模板：

1. 相似HTML,只是打包成了經常使用的組件
2. 不直接操做DOM，進行了狀態管理，即便用了wx:if,{{}}等模板表達式

  WXML:
  -- 數據綁定：經過{{變量名}}綁定到內容或屬性
  -- 邏輯語法：三元運算，算數運算，字符串拼接，直接置入（數字，字符串，數組）
  -- 條件列表：wx:if,elif,else | wx:for,wx:for-index,wx:for-item | block標籤 | wx:key="property/*this"當標籤節點變化時保持原有標籤狀態隨着變化
  -- 模板引用：template | import(只引入template) / include(只引入template以外的)
  -- 共同屬性：id, class, style, hidden, data-*, bind*/catch*

WXSS樣式：

相似CSS，作了一些修改
-- 新增了尺寸單位：rpx
-- 提供了全局樣式，和局部樣式
-- WXSS僅支持部分CSS選擇器

  WXSS:
  -- 文件組成：項目公共樣式，頁面樣式，其餘樣式
  -- 樣式的引用：@import './test_0_wxss'
  -- 尺寸單位：rpx, 寬度爲375物理像素屏幕下1rpx=375/750=0.5px, iphone6:1rpx=0.5px
  -- 內聯樣式：與web網頁同樣，但可使用變量
  -- 選擇器：類、id、元素、僞元素（::after,::before）,權重：!important>style>#id>.class>element
  -- 樣式庫：https://github.com/Tencent/weui-wxss

WXS:

小程序的一套腳本語言

JS交互邏輯：

與用戶交互：響應用戶點擊，獲取用戶位置等

  JAVASCRIPT:
  -- ECMAScript：ECMAScript+小程序框架+小程序API
  -- 執行環境: ES6,ES5
  -- 模塊化: module.export,require
  -- 腳本的執行順序: app.js,根據app.json中順序的pages.json
  -- 做用域：文件獨立該文件聲明的變量只在該文件中有效，全局：使用getApp()得到實例給她賦值，會存在前後順序，或者直接在app.js中添加全局變量

 其餘：

-- backgroundTextStyle: 下拉文字背景色，只支持black/light
-- 在app.json中添加頁面，會自動建立wxml等文件