使用TypeScript開發(fā)微信小程序的方法
TypeScript簡(jiǎn)介:
TypeScript是一種由微軟開發(fā)的自由和開源的編程語(yǔ)言。它是JavaScript的一個(gè)超集,而且本質(zhì)上向這個(gè)語(yǔ)言添加了可選的靜態(tài)類型和基于類的面向?qū)ο缶幊?。安德斯·海爾斯伯格,C#的首席架構(gòu)師,已工作于TypeScript的開發(fā)。
TypeScript擴(kuò)展了JavaScript的語(yǔ)法,所以任何現(xiàn)有的JavaScript程序可以不加改變的在TypeScript下工作。TypeScript是為大型應(yīng)用之開發(fā)而設(shè)計(jì),而編譯時(shí)它產(chǎn)生 JavaScript 以確保兼容性。
TypeScript 支持為已存在的 JavaScript 庫(kù)添加類型信息的頭文件,擴(kuò)展了它對(duì)于流行的庫(kù)如 jQuery,MongoDB,Node.js 和 D3.js 的好處。
微信小程序來了!這個(gè)號(hào)稱干掉傳統(tǒng)app的玩意兒雖然目前處于內(nèi)測(cè)階段,不過目前在應(yīng)用號(hào)的官方文檔里已經(jīng)放出了沒有內(nèi)測(cè)號(hào)也能使用的模擬器了。
工具和文檔可以參考官方文檔:https://mp.weixin.qq.com/debug/wxadoc/dev/?t=1477926804193
TypeScript:
TypeScript是C#之父Anders Hejlsberg的又一力作,相信喜歡C#語(yǔ)法的朋友們對(duì)TypeScript一定也會(huì)愛不釋手。
簡(jiǎn)單的聊一聊TypeScript吧
TS是一個(gè)應(yīng)用程序級(jí)的JavaScript開發(fā)語(yǔ)言。
TS是JavaScript的超集,可以編譯成純JavaScript。
TS跨瀏覽器、跨操作系統(tǒng)、跨主機(jī),開源。
TS始于JS,終于JS。遵循JavaScript的語(yǔ)法和語(yǔ)義,方便了無數(shù)的JavaScript開發(fā)者。
TS可以重用現(xiàn)有的JavaScript代碼,調(diào)用流行的JavaScript庫(kù)。
TS可以編譯成簡(jiǎn)潔、簡(jiǎn)單的JavaScript代碼,在任意瀏覽器、Node.js或任何兼容ES3的環(huán)境上運(yùn)行。
TypeScript比JavaScript更具開發(fā)效率,包括:靜態(tài)類型檢查、基于符號(hào)的導(dǎo)航、語(yǔ)句自動(dòng)完成、代碼重構(gòu)等。
TS提供了類、模塊和接口,更易于構(gòu)建組件。
順便說一句,TypeScript雖然只關(guān)心生成JavaScript之前的這些內(nèi)容(意味著不關(guān)心生成出的JS代碼的運(yùn)行效率),但是根據(jù)鄙人的觀察和比較,TypeScript所生成的JavaScript代碼比絕大部分的前臺(tái)開發(fā)自己寫的JavaScript的代碼質(zhì)量高至少一個(gè)數(shù)量級(jí)?。?/p>
TypeScript另一個(gè)優(yōu)點(diǎn):
TypeScript在各大主流的IDE和編輯器里有智能提示!
重要的事情要說三遍!寫TypeScript有智能提示!寫TypeScript有智能提示!寫TypeScript有智能提示!
用TypeScript開發(fā)微信小程序
扯了半天TypeScript,那么究竟怎么用TypeScript開發(fā)微信小程序呢?
非常簡(jiǎn)單,和微信官方的JavaScript開發(fā)方式?jīng)]有太大區(qū)別,依舊是4個(gè)核心文件
App: 代碼整個(gè)應(yīng)用程序的抽象對(duì)象,可以設(shè)置全局的方法和變量
Page: 頁(yè)面抽象對(duì)象,承載頁(yè)面業(yè)務(wù)邏輯
WXML: 頁(yè)面的結(jié)構(gòu),相當(dāng)于html
JSON: 配置文件
WXSS: 頁(yè)面的樣式,相當(dāng)于css
由于目前騰訊沒有小程序的TypeScript版本的API,所以O(shè)neCode team針對(duì)目前騰訊放出的所有的小程序JavaScript API開發(fā)了一個(gè)TypeScript版本的API類型定義文件 wxAPI.d.ts
只需要在您的程序中引用該文件,如果是使用Visual Studio來開發(fā)的話,就能有代碼提示了。
下面是用TypeScript開發(fā)的Demo App的代碼示例:
/// <reference path="./wxAPI.d.ts"/> App({ onLaunch: function() { //調(diào)用API從本地緩存中獲取數(shù)據(jù) 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 { //調(diào)用登錄接口 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 上面下載完整的代碼樣例以及非常關(guān)鍵的微信小程序TypeScript API定義文件!
更多腳本樣例, 訪問微軟One Code樣例庫(kù):http://aka.ms/onescriptsamples 更多代碼樣例, 訪問微軟One Script樣例庫(kù):http://aka.ms/onecodesamples
以上所述是小編給大家介紹的使用TypeScript開發(fā)微信小程序的方法,希望對(duì)大家有所幫助,如果大家有任何疑問歡迎給我留言,小編會(huì)及時(shí)回復(fù)大家的!
相關(guān)文章
詳解C#如何實(shí)現(xiàn)一個(gè)安全的事件訂閱器
事件訂閱器是一個(gè)對(duì)象,它訂閱(或監(jiān)聽)某個(gè)事件,并在事件發(fā)生時(shí)執(zhí)行相應(yīng)的操作,本文主要介紹了C#實(shí)現(xiàn)一個(gè)安全的事件訂閱器的相關(guān)知識(shí),感興趣的可以了解下2024-01-01.NET/C#實(shí)現(xiàn)識(shí)別用戶訪問設(shè)備的方法
這篇文章主要介紹了.NET/C#實(shí)現(xiàn)識(shí)別用戶訪問設(shè)備的方法,結(jié)合實(shí)例形式分析了C#識(shí)別用戶訪問設(shè)備的操作技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2017-02-02C#實(shí)現(xiàn)實(shí)體類和XML相互轉(zhuǎn)換
這篇文章主要為大家詳細(xì)介紹了C#實(shí)現(xiàn)實(shí)體類和XML相互轉(zhuǎn)換的資料,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-03-03Unity中 ShaderGraph 實(shí)現(xiàn)旋渦傳送門效果入門級(jí)教程(推薦)
通過Twirl 旋轉(zhuǎn)節(jié)點(diǎn)對(duì)Gradient Noise 梯度噪聲節(jié)點(diǎn)進(jìn)行操作,就可得到一個(gè)旋轉(zhuǎn)的旋渦效果。具體實(shí)現(xiàn)代碼跟隨小編一起通過本文學(xué)習(xí)下吧2021-07-07C# WINFORM 強(qiáng)制讓窗體獲得焦點(diǎn)的方法代碼
C# WINFORM 強(qiáng)制讓窗體獲得焦點(diǎn)的方法代碼,需要的朋友可以參考一下2013-04-04C#?wpf實(shí)現(xiàn)任意控件更多拖動(dòng)功能
這篇文章主要為大家詳細(xì)介紹了C#?wpf如何實(shí)現(xiàn)任意控件(包括窗口)更多拖動(dòng)功能,文中的示例代碼講解詳細(xì),有興趣的小伙伴可以跟隨小編一起學(xué)習(xí)一下2023-11-11