使用TypeScript開(kāi)發(fā)微信小程序的方法
TypeScript簡(jiǎn)介:
TypeScript是一種由微軟開(kāi)發(fā)的自由和開(kāi)源的編程語(yǔ)言。它是JavaScript的一個(gè)超集,而且本質(zhì)上向這個(gè)語(yǔ)言添加了可選的靜態(tài)類(lèi)型和基于類(lèi)的面向?qū)ο缶幊獭0驳滤埂ず査共?,C#的首席架構(gòu)師,已工作于TypeScript的開(kāi)發(fā)。
TypeScript擴(kuò)展了JavaScript的語(yǔ)法,所以任何現(xiàn)有的JavaScript程序可以不加改變的在TypeScript下工作。TypeScript是為大型應(yīng)用之開(kāi)發(fā)而設(shè)計(jì),而編譯時(shí)它產(chǎn)生 JavaScript 以確保兼容性。
TypeScript 支持為已存在的 JavaScript 庫(kù)添加類(lèi)型信息的頭文件,擴(kuò)展了它對(duì)于流行的庫(kù)如 jQuery,MongoDB,Node.js 和 D3.js 的好處。
微信小程序來(lái)了!這個(gè)號(hào)稱(chēng)干掉傳統(tǒng)app的玩意兒雖然目前處于內(nèi)測(cè)階段,不過(guò)目前在應(yīng)用號(hào)的官方文檔里已經(jīng)放出了沒(méi)有內(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ì)愛(ài)不釋手。
簡(jiǎn)單的聊一聊TypeScript吧
TS是一個(gè)應(yīng)用程序級(jí)的JavaScript開(kāi)發(fā)語(yǔ)言。
TS是JavaScript的超集,可以編譯成純JavaScript。
TS跨瀏覽器、跨操作系統(tǒng)、跨主機(jī),開(kāi)源。
TS始于JS,終于JS。遵循JavaScript的語(yǔ)法和語(yǔ)義,方便了無(wú)數(shù)的JavaScript開(kāi)發(fā)者。
TS可以重用現(xiàn)有的JavaScript代碼,調(diào)用流行的JavaScript庫(kù)。
TS可以編譯成簡(jiǎn)潔、簡(jiǎn)單的JavaScript代碼,在任意瀏覽器、Node.js或任何兼容ES3的環(huán)境上運(yùn)行。
TypeScript比JavaScript更具開(kāi)發(fā)效率,包括:靜態(tài)類(lèi)型檢查、基于符號(hào)的導(dǎo)航、語(yǔ)句自動(dòng)完成、代碼重構(gòu)等。
TS提供了類(lèi)、模塊和接口,更易于構(gòu)建組件。
順便說(shuō)一句,TypeScript雖然只關(guān)心生成JavaScript之前的這些內(nèi)容(意味著不關(guān)心生成出的JS代碼的運(yùn)行效率),但是根據(jù)鄙人的觀察和比較,TypeScript所生成的JavaScript代碼比絕大部分的前臺(tái)開(kāi)發(fā)自己寫(xiě)的JavaScript的代碼質(zhì)量高至少一個(gè)數(shù)量級(jí)??!
TypeScript另一個(gè)優(yōu)點(diǎn):
TypeScript在各大主流的IDE和編輯器里有智能提示!
重要的事情要說(shuō)三遍!寫(xiě)TypeScript有智能提示!寫(xiě)TypeScript有智能提示!寫(xiě)TypeScript有智能提示!
用TypeScript開(kāi)發(fā)微信小程序
扯了半天TypeScript,那么究竟怎么用TypeScript開(kāi)發(fā)微信小程序呢?
非常簡(jiǎn)單,和微信官方的JavaScript開(kāi)發(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
由于目前騰訊沒(méi)有小程序的TypeScript版本的API,所以O(shè)neCode team針對(duì)目前騰訊放出的所有的小程序JavaScript API開(kāi)發(fā)了一個(gè)TypeScript版本的API類(lèi)型定義文件 wxAPI.d.ts
只需要在您的程序中引用該文件,如果是使用Visual Studio來(lái)開(kāi)發(fā)的話,就能有代碼提示了。

下面是用TypeScript開(kāi)發(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定義文件!
更多腳本樣例, 訪問(wèn)微軟One Code樣例庫(kù):http://aka.ms/onescriptsamples 更多代碼樣例, 訪問(wèn)微軟One Script樣例庫(kù):http://aka.ms/onecodesamples
以上所述是小編給大家介紹的使用TypeScript開(kāi)發(fā)微信小程序的方法,希望對(duì)大家有所幫助,如果大家有任何疑問(wèn)歡迎給我留言,小編會(huì)及時(shí)回復(fù)大家的!
相關(guān)文章
C#使用泛型隊(duì)列Queue實(shí)現(xiàn)生產(chǎn)消費(fèi)模式
這篇文章介紹了C#使用泛型隊(duì)列Queue實(shí)現(xiàn)生產(chǎn)消費(fèi)模式的方法,文中通過(guò)示例代碼介紹的非常詳細(xì)。對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2022-10-10
C#中委托的基礎(chǔ)入門(mén)與實(shí)現(xiàn)方法
這篇文章主要給大家介紹了關(guān)于C#中委托的基礎(chǔ)入門(mén)與實(shí)現(xiàn)方法的相關(guān)資料,究竟什么是委托,用最通俗易懂的話來(lái)講,你就可以把委托看成是用來(lái)執(zhí)行方法(函數(shù))的一個(gè)東西,需要的朋友可以參考下2021-08-08
C#實(shí)現(xiàn)獲取電腦硬件顯卡信息的示例代碼
這篇文章主要為大家詳細(xì)介紹了如何使用C#實(shí)現(xiàn)獲取電腦硬件顯卡信息,文中的示例代碼講解詳細(xì),感興趣的小伙伴可以跟隨小編一起學(xué)習(xí)一下2024-01-01
C#多線程同步不同實(shí)現(xiàn)方式小結(jié)
本文主要介紹了C#多線程同步不同實(shí)現(xiàn)方式,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2025-01-01
Unity實(shí)現(xiàn)簡(jiǎn)單手勢(shì)識(shí)別
這篇文章主要為大家詳細(xì)介紹了Unity實(shí)現(xiàn)簡(jiǎn)單手勢(shì)識(shí)別,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2020-07-07
c#使用正則表達(dá)式匹配字符串驗(yàn)證URL示例
這篇文章主要介紹了c#使用正則表達(dá)式的小示例,匹配字符串、驗(yàn)證URL,大家參考使用吧2013-12-12

