• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • JavaScript
  • ASP.NET
  • PHP
  • 正则表达式
  • AJAX
  • JSP
  • ASP
  • Flex
  • XML
  • 编程技巧
  • Android
  • swift
  • C#教程
  • vb
  • vb.net
  • C语言
  • Java
  • Delphi
  • 易语言
  • vc/mfc
  • 嵌入式开发
  • 游戏开发
  • ios
  • 编程问答
  • 汇编语言
  • 微信小程序
  • 数据结构
  • OpenGL
  • 架构设计
  • qt
  • 微信公众号
您的位置:首页 > 程序设计 >微信小程序 > 怎么使用TypeScript开发微信小程序

怎么使用TypeScript开发微信小程序

作者:匿名 字体:[增加 减小] 来源:互联网 时间:2018-11-30

匿名通过本文主要向大家介绍了TypeScript,微信,小程序等相关知识,希望对您有所帮助,也希望大家支持linkedu.com www.linkedu.com

微信小程序来了!这个号称干掉传统app的玩意儿虽然目前处于内测阶段,不过目前在应用号的官方文档里已经放出了没有内测号也能使用的模拟器了。

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
    }
});

以上就是怎么使用TypeScript开发微信小程序的详细内容,更多请关注微课江湖其它相关文章!

分享到:QQ空间新浪微博腾讯微博微信百度贴吧QQ好友复制网址打印

您可能想查找下面的文章:

  • 使用TypeScript开发微信小程序的方法
  • 怎么使用TypeScript开发微信小程序
  • 如何用TypeScript开发微信小程序

相关文章

  • 2018-11-30关于微信小程序中页面之间传参的解析
  • 2018-11-30微信小程序出现wx.navigateTo页面不跳转解决办法
  • 2018-11-30微信小程序选项卡的实现方法
  • 2018-11-30微信小程序开发常用的方法总结(代码)
  • 2018-11-30微信小程序购物商城系统开发系列-工具篇
  • 2018-11-30picker滚动选择器
  • 2018-11-30微信小程序:样式模板的使用
  • 2018-11-30 微信小程序之路由问题
  • 2018-11-30微信小程序速成
  • 2018-11-30关于微信小程序中图片处理的问题总结

文章分类

  • JavaScript
  • ASP.NET
  • PHP
  • 正则表达式
  • AJAX
  • JSP
  • ASP
  • Flex
  • XML
  • 编程技巧
  • Android
  • swift
  • C#教程
  • vb
  • vb.net
  • C语言
  • Java
  • Delphi
  • 易语言
  • vc/mfc
  • 嵌入式开发
  • 游戏开发
  • ios
  • 编程问答
  • 汇编语言
  • 微信小程序
  • 数据结构
  • OpenGL
  • 架构设计
  • qt
  • 微信公众号

最近更新的内容

    • 微信小程序内轮播图怎样设置成自适应高度
    • 微信小程序开发实现tabs选项卡效果实例代码
    • 微信小程序实现摇一摇抽奖代码分享(图)
    • 什么是懒加载?小程序中图片懒加载的两种实现方法
    • 微信小程序文件类API详解
    • 微信小程序之换肤功能的实现方法
    • 案例分享小程序开发实现|个人博客KAPO的架构
    • 小程序开发DEMO实例
    • 微信小程序开发步骤的简单介绍
    • 微信小程序如何解决后台返回大量多余数据的问题

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有