微信小程序來了！這個號稱干掉傳統app的玩意兒雖然目前處于內測階段，不過目前在應用號的官方文檔里已經放出了沒有內測號也能使用的模擬器了。

工具和文檔可以參考官方文檔：https://mp.weixin.qq.com/debug/wxadoc/dev/?t=1477926804193?

TypeScript:

TypeScript是C#之父Anders Hejlsberg的又一力作，相信喜歡C#語法的朋友們對TypeScript一定也會愛不釋手。

簡單的聊一聊TypeScript吧

• TS是一個應用程序級的JavaScript開發語言。

• TS是JavaScript的超集，可以編譯成純JavaScript。

• TS跨瀏覽器、跨操作系統、跨主機，開源。

• TS始于JS，終于JS。遵循JavaScript的語法和語義，方便了無數的JavaScript開發者。

• TS可以重用現有的JavaScript代碼，調用流行的JavaScript庫。

• TS可以編譯成簡潔、簡單的JavaScript代碼，在任意瀏覽器、Node.js或任何兼容ES3的環境上運行。

• TypeScript比JavaScript更具開發效率，包括：靜態類型檢查、基于符號的導航、語句自動完成、代碼重構等。

• TS提供了類、模塊和接口，更易于構建組件。

順便說一句，TypeScript雖然只關心生成JavaScript之前的這些內容（意味著不關心生成出的JS代碼的運行效率），但是根據鄙人的觀察和比較，TypeScript所生成的JavaScript代碼比絕大部分的前臺開發自己寫的JavaScript的代碼質量高至少一個數量級！！?

TypeScript另一個優點:

TypeScript在各大主流的IDE和編輯器里有智能提示！

重要的事情要說三遍！寫TypeScript有智能提示！寫TypeScript有智能提示！寫TypeScript有智能提示！?

用TypeScript開發微信小程序

扯了半天TypeScript，那么究竟怎么用TypeScript開發微信小程序呢？

非常簡單，和微信官方的JavaScript開發方式沒有太大區別，依舊是4個核心文件

• App： ? ? 代碼整個應用程序的抽象對象，可以設置全局的方法和變量

• Page： ? ?頁面抽象對象，承載頁面業務邏輯

• WXML： ?頁面的結構，相當于html?

• JSON： ? 配置文件

• WXSS： ?頁面的樣式，相當于css

由于目前騰訊沒有小程序的TypeScript版本的API，所以OneCode team針對目前騰訊放出的所有的小程序JavaScript API開發了一個TypeScript版本的API類型定義文件?wxAPI.d.ts

只需要在您的程序中引用該文件，如果是使用Visual Studio來開發的話，就能有代碼提示了。

下面是用TypeScript開發的Demo App的代碼示例：

/// <reference path="./wxAPI.d.ts"/>
? ?App({onLaunch: function() { ? ? ? ?//調用API從本地緩存中獲取數據 ? ? ? ?let logs: any = wx.getStorageSync('logs'); ? ? ? ? ? ? ? ?if (!Array.isArray(logs)) { ? ? ? ? ? ?logs = []; ? ? ? ?} ? ? ? ?(<any[]>logs).unshift(Date.now()); ? ? ? ?wx.setStorageSync('logs', logs); ? ?}, ? ?getUserInfo: function(cb: (param: any) => void) { ? ? ? ?let that = this ? ? ? ?if (this.globalData.userInfo) { ? ? ? ? ? ?cb(this.globalData.userInfo) ? ? ? ?} else { ? ? ? ? ? ?//調用登錄接口 ? ? ? ? ?
? ? ? ? ? ??wx.login({ ? ? ? ? ? ? ? ?success: () => { ? ? ? ? ? ? ? ? ? ?wx.getUserInfo({ ? ? ? ? ? ? ? ? ? ? ??success: (res) => { ? ? ? ? ? ? ? ? ? ? ? ? that.globalData.userInfo = res.userInfo; ? ? ? ? ? ? ? ? ? ? ? ? ? ?cb(that.globalData.userInfo); ? ? ? ? ? ? ? ? ? ? ? ?} ? ? ? ? ? ? ? ? ? ?}); ? ? ? ? ? ? ? ?} ? ? ? ? ? ?}); ? ? ? ?} ? ?}, ? ?globalData: { ? ? ? ?userInfo: null ? ?} });

感興趣的朋友，可以去?https://code.msdn.microsoft.com/How-to-develop-WeChat-1105555e?上面下載完整的代碼樣例以及非常關鍵的微信小程序TypeScript API定義文件！

原文地址：http://www.cnblogs.com/onecodeonescript/p/6060862.html

---

.NET社區新聞，深度好文，微信中搜索dotNET跨平臺或掃描二維碼關注

創作挑戰賽新人創作獎勵來咯，堅持創作打卡瓜分現金大獎

總結

以上是生活随笔為你收集整理的如何用TypeScript开发微信小程序的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。