最近入坑v-cli 3.0,发现ts越来越常用了,于是开始入坑学习。
1.构建ts环境
npm install -g typescript
Mac和vscode用户可以用以下方式构建tsdemo项目
mkdir tsdemo && cd tsdemo && tsc --init
在生成的tsconfig.json中的配置“outDir”的值改成'./js’
然后就是“终端”—>“运行任务”,监视tsconfig.json
最后新建一个index.html和index.ts,index.html引入的js路径是./js/index.js,因为index.ts会被编译到./js/index.js里。
2.ts的数据类型
布尔类型(boolean)
数字类型(number)
字符串类型(string)
数组类型(array)
元组类型(tuple)
枚举类型(enum)
任意类型(any)
null 和 undefined
void类型
never类型
 
1)布尔类型(boolean)
var flag:boolean=true;
2)数字类型(number)
var num:number=123;
3)字符串类型(string)
var str:string='this is ts’;
4)数组类型(array)
var arr:number[]=[11,22,33];
var arr:Array<number>=[11,22,33];
var arr3:any[]=['131214',22,true];
这两种定义数组的方式都是对的
5)元组类型(tuple)
元组类型允许表示一个已知元素数量和类型的数组
let arr:[number,string]=[123,'this is ts'];
6)枚举类型(enum)
为了考虑到一个变量有多种可能的值称为枚举类型。
enum Flag {success=1,error=2};
let f:Flag=Flag.error;
赋值的时候需要注意一下,它是:Flag,表示在这个枚举中取值。
7)任意类型(any)
any可以是其他的任意ts类型,用于不清楚变量的类型但又想为其指定类型
比如:var oBox:any=document.getElementById('box’);
8)null 和 undefined
默认情况下null和undefined是所有类型的子类型。 就是说你可以把 null和undefined赋值给任何类型的变量。但是你在开启strictNullChecks标记后,就需要在定义的时候,给你变量多种类型
var nums:number | null;
9)void类型 :typescript中的void表示没有任何类型,一般用于定义方法的时候方法没有返回值。
function run():void{
   console.log('run')
}
run();
10)never类型
never类型表示的是那些永不存在的值的类型,比如闭包
var a:never;
a=(()=>{
   throw new Error('错误');
})()
 
 
 
 
 
 
 
 
 

typeScript入门(一)构建环境和数据类型的更多相关文章

  1. TypeScript 入门教程学习笔记

    TypeScript 入门教程学习笔记 1. 数据类型定义 类型 实例 说明 Number let num: number = 1; 基本类型 String let myName: string = ...

  2. Grunt JS构建环境搭建以及使用入门

    Grunt JS构建环境搭建以及使用入门 1.应用场景 一种自动化任务处理工具,对于日常的需求(代码规则检查.代码合并)可以实现自动化执行,只需要保留package.json和Gruntfile.js ...

  3. TypeScript入门一:配置TS工作环境

    配置手动编译TS文件工作环境 配置webpack自动化打包编译工作环境(后面补充) 一.TypeScript入门学习引言 进入主题之前,首先说明这个系列的博客是我刚刚接触TypeScript的学习笔记 ...

  4. 用Vagrant创建Jenkins构建环境

    这是一个关于Vagrant的学习系列,包含如下文章: Vagrant入门 创建自己的Vagrant box 用Vagrant搭建Jenkins构建环境 用Vagrant和Ansible搭建持续交付平台 ...

  5. TypeScript入门指南(JavaScript的超集)

    TypeScript入门指南(JavaScript的超集)   你是否听过 TypeScript? TypeScript 是 JavaScript 的超集,TypeScript结合了类型检查和静态分析 ...

  6. angular入门一之环境安装及项目创建

    angular入门一之环境安装及项目创建 1.安装node.js 下载,安装,在终端测试安装是否成功:node -v(查看nodejs版本) npm -v(查看npm版本) 下载地址:https:// ...

  7. PHP入门及服务环境配置(Nginx+PHP)

    PHP入门及服务环境配置(Nginx+PHP) PHP入门 PHP维基百科: PHP(全称:PHP:Hypertext Preprocessor,即"PHP:超文本预处理器")是一 ...

  8. TypeScript入门实例

    前言 TypeScript是JavaScript的超集,微软公司开发,利用es6语法,实现对js的面向对象编程思想,写代码的时候会像强类型语言一样,指定参数类型.返回值类型,类型不对会报错,但编译后还 ...

  9. typescript 入门教程一

    ##### 从今天开始,持续更新typescript入门教程系列.... 目前ts越来越火,主流的前端框架,好比*angular,vue 3*均是采用ts来编写,所有很多公司的项目都是用**ts**来 ...

随机推荐

  1. Python DataFrame 如何删除原来的索引,重新建立索引

    删除行索引重排: ser.reset_index(drop = True) df.reset_index(drop = True) ---------------------------------- ...

  2. 从图片中提取html格式的布局

    制作界面的自动化 意义:对于程序设计人员来说,比较痛苦的是制作界面.从设计人员发送的稿件(通常为jpg格式),到完成html的布局,需要将图像转化为div标记,自动化这一过程十分有意义 1.设计一个工 ...

  3. WinForm中如何实现在容器控件中嵌入form窗体(panel与子窗体)

    今天在做项目时候遇到一个问题,窗体分为左右两部分,要求在左边栏点击按钮时,右边动态加载窗体最后想到用panel实现,经历几次失败,并查找资料后,终于搞定 说明:如果多次切换需加入 panel.clea ...

  4. rabbitMq使用学习笔记

    rabbitmq的工作原理: MQ全称为Message Queue,即消息队列, RabbitMQ是由erlang语言开发,基于AMQP(Advanced MessageQueue 高级消息队列协议) ...

  5. Python + gevent模块对单个接口进行并发测试 1

    本文知识点 利用gevent模块进行并发测试 代码如下 from gevent import monkey monkey.patch_all() import requests import geve ...

  6. 【转】idea中applicationContext-trans.xml中的Cannot resolve bean 'dataSource'...的问题解决

    问题如下: (applicationContext-trans.xml中的部分截图) 先了解问题是怎么出现的: 此处的dataSource是在applicationContext-dao.xml中配置 ...

  7. python学习之路---day06

    一:is 和 == 的区别 01)a b 两个变量 is 是比较变量的内存地址,如果地址相等,则返回True,如果不相等,则返回False == 是比较变量两边内容是否一样,如果一样则返回True,不 ...

  8. python shell 清屏(window)

    IDLE增加一个清屏的扩展ClearWindow就可以了(在Issue 6143: IDLE中可以看到这个扩展的说明) 安装使用的方法 1.下载ClearWindow.py(右击-目标另存为,格式为p ...

  9. QDU_组队训练(ABEFGHKL)

    A - Accurately Say "CocaCola"! In a party held by CocaCola company, several students stand ...

  10. asp.net mvc 静态化

    静态化的基本理解就是,常用的资源以文本形式保存,客户端访问时无需经过程序处理,直接下载 但是不存在的文件需要经过程序处理,文件内容如果需要有更动或删除,则直接删除文件本身 1.IIS Express ...