TypeScript入门-基本数据类型
▓▓▓▓▓▓ 大致介绍
TypeScript是由C#语言之父Anders Hejlsberg主导开发的一门编程语言,TypeScript本质上是向JavaScript语言添加了可选的静态类型和基于类的面向对象编程,它相当于是JavaScript的超集
ES5、ES6和TypeScript的关系:
▓▓▓▓▓▓ 安装
首先需要安装npm,然后在输入
npm install -g typescript
安装完成后,因为TypeScript是以.ts结尾的,要想运行就得把他编译js文件,编译的方法特别简单就是使用tsc命令
tsc hello.ts
通常在项目中ts文件比较多的情况下,我们需要自己配置tsconfig.json文件,以便能更好的编译ts文件,配置tsconfig.json文件不难,这里就不赘述,可以自行百度
▓▓▓▓▓▓ 基本类型
在TypeScript中有以下基本数据类型
• 布尔类型(boolean)
• 数字类型(number)
• 字符串类型(string)
• 数组类型(array)
• 元组类型(tuple)
• 枚举类型(enum)
• 任意值类型(any)
• null和undefined
• void类型
• never类型
▓▓▓▓▓▓ 布尔类型(boolean)
布尔类型是最简单的数据类型,只有true和false两种值
注意:布尔类型是不能赋予其他值的
let flag: boolean = true;
flag = 1; //报错
▓▓▓▓▓▓ 数字类型(number)
和JavaScript一样,TypeScript数字都是浮点型,也支持二进制、八进制、十进制和十六进制
let decLiteral: number = 6;
let hexLiteral: number = 0xf00d;
let binaryLiteral: number = 0b1010;
let octalLiteral: number = 0o744;
▓▓▓▓▓▓ 字符串类型(string)
可以用单引号(')和双引号(")来表示字符串类型,除此之外还支持使用模板字符串反引号(`)来定义多行文本和内嵌表达式。使用${ expr }的形式嵌入变量或表达式
let name: string = 'Angular';
let years: string = 7;
let words: string = `今年是 ${ name } 发布 ${ years } 周年`;
▓▓▓▓▓▓ 数组类型(array)
TypeScript数组的操作类似于JavaScript中数组的操作,TypeScript建议开发者最好只为数组元素赋一种类型的值,定义数组有两种方式
1、在元素类型后面加上[]
let arr: number[] = [2,3];
2、使用数组泛型
let arr: Array<number> = [2,3];
▓▓▓▓▓▓ 元组类型(tuple)
元组类型用来表示已知数量和类型的数组,各元素的类型不必相同
let x: [string,number];
x = ['Angular',5]; //正确
x = [5,'Angular']; //报错
▓▓▓▓▓▓ 枚举类型(enum)
枚举是一个可被命名的整型常数的集合,枚举类型为集合成员赋予有意义的名称增强可读性
enum Color {red,green,blue};
let c: Color = Color.blue;
console.log(c); //
枚举默认下标是0,也可以手动修改
enum Color {red = 2,green = 3,blue = 6};
let c: Color = Color.blue;
console.log(c); //
▓▓▓▓▓▓ 任意值类型(any)
任意值是TypeScript针对编程时类型不明确的变量使用的一种数据类型,常用于以下三种类型
1、值可能来自于动态的内容,比如来自用户输入或第三方代码库。 这种情况下,我们不希望类型检查器对这些值进行检查而是直接让它们通过编译阶段的检查。
let x: any = 1;
x = 'I am a string';
x = false;
2、允许你在编译时可选择地包含或移除类型检查
let x: any = 4;
x.toFixed(); //正确,并不检查是否存在
3、定义储存各种类型数据的数组时
let arrarList: any[] = [1,'qwe',true];
▓▓▓▓▓▓ null和undefined
默认情况下null和undefined是所有类型的子类型。 就是说你可以把null和undefined赋值给number类型的变量。
然而,如果启用--strictNullChecks,就可以使得null和undefined只能被赋值给void或本身对应的类型
let x: number;
x = 1;
x = null; //正确 启用 --strictNullChecks
let y: number;
y = 1;
y = null; //错误
▓▓▓▓▓▓ void类型
使用void表示没有任何类型,例如一个函数没有返回值,意味着返回void
function hello(): void{
alert('hello Angular');
}
▓▓▓▓▓▓ never类型
never是其他类型(包括null和undefined)的子类型,代表从不会出现的值,这意味着声明为never类型的变量只能被never类型所赋值,在函数中通常表示为抛出异常或无法执行到终止点
let x: never;
let y: number; //报错
x = 123; //正确
y = x;
参考资料:
揭秘Angular2第3章
TypeScript入门-基本数据类型的更多相关文章
- TypeScript入门
博客园首发,转载请注明出处,多谢支持.http://www.cnblogs.com/xuema/ 一.TypeScript TypeScript是一种由微软开发的自由和开源的编程语言.它是JavaSc ...
- TypeScript学习笔记—数据类型
TypeScript 数据类型 Boolean 类型 let isDone: boolean = false; // tsc => var isDone = false; Number 类型 l ...
- typescript 入门教程一
##### 从今天开始,持续更新typescript入门教程系列.... 目前ts越来越火,主流的前端框架,好比*angular,vue 3*均是采用ts来编写,所有很多公司的项目都是用**ts**来 ...
- TypeScript 入门教程学习笔记
TypeScript 入门教程学习笔记 1. 数据类型定义 类型 实例 说明 Number let num: number = 1; 基本类型 String let myName: string = ...
- TypeScript之基本数据类型
前言 最近项目很急,所以没有什么时间回答关于Xamarin.Android方面的问题,也有一段时间没有更新.主要是手头很缺人,如果有谁有兴趣加入我们的话,可以私聊我,这样我就能继续造福社区了,同时还有 ...
- TypeScript入门指南(JavaScript的超集)
TypeScript入门指南(JavaScript的超集) 你是否听过 TypeScript? TypeScript 是 JavaScript 的超集,TypeScript结合了类型检查和静态分析 ...
- TypeScript入门实例
前言 TypeScript是JavaScript的超集,微软公司开发,利用es6语法,实现对js的面向对象编程思想,写代码的时候会像强类型语言一样,指定参数类型.返回值类型,类型不对会报错,但编译后还 ...
- typeScript中的数据类型
/* typeScript中的数据类型 typescript中为了使编写的代码更规范,更有利于维护,增加了类型校验,在typescript中主要给我们提供了以下数据类型 布尔类型(boolean) 数 ...
- TypeScript入门一:配置TS工作环境
配置手动编译TS文件工作环境 配置webpack自动化打包编译工作环境(后面补充) 一.TypeScript入门学习引言 进入主题之前,首先说明这个系列的博客是我刚刚接触TypeScript的学习笔记 ...
随机推荐
- 面向UI编程:ui.js 1.1 使用观察者模式完成组件之间数据流转,彻底分离组件之间的耦合,完成组件的高内聚
开头想明确一些概念,因为有些概念不明确会导致很多问题,比如你写这个框架为什么不去解决啥啥啥的问题,哎,心累. 什么是框架? 百度的解释:框架(Framework)是整个或部分系统的可重用设计,表现为一 ...
- H5中背景音乐无法自动播放问题
苹果禁止了Autoplay和JS "onload" 加载播放,使在html文件里使用了preload和autoplay属性,在移动版 Safari 上,此属性会被忽视,并且不会加载 ...
- unity Editor的使用
1.首先定义一个需要控制数值的类,类中定义若干个变量 using UnityEngine;using System.Collections; using UnityEngine; using Syst ...
- 3D Touch开发全面教程之Peek and Pop - 预览和弹出
## 3D Touch开发全面教程之Peek and Pop - 预览和弹出 --- ### 了解3D Touch 在iPhone 6s和iPhone 6s Plus中Apple引入了3D Touch ...
- tornado学习 - TCPServer 实现聊天功能
最近学习tornado框架,其中有很多值得学习的模块,鉴于某位学长的建议,也决定好好看看tornado.tcpserver. 关于TCP协议详细介绍可查阅wiki. 对于TCP服务器,基本的操作tor ...
- 深入探讨 CSS 特性检测 @supports 与 Modernizr
什么是 CSS 特性检测?我们知道,前端技术日新月异的今天,各种新技术新属性层出不穷.在 CSS 层面亦不例外. 一些新属性能极大提升用户体验以及减少工程师的工作量,并且在当下的前端氛围下: 很多实验 ...
- Angular2 路由问题修复 、求解
Angular2 提供了比angular1 更为强大的路由功能,但是在具体使用路由过程中,可是出现了很多路由不按照预想的方式执行的问题.为了说明今天的问题,我特地新建了一个测试工程.欢迎交流. 首先介 ...
- 用JS常规方法是否离开当前页面
该方法在 关闭页面时 会提示 <script type="text/javascript"> var DispClose = true; function CloseE ...
- VUE2.0实现购物车和地址选配功能学习第六节
第六节 地址列表过滤和展开所有的地址 html:<li v-for="(item,index) in filterAddress">js: new Vue({ el:' ...
- ERP免费模拟上线
为了让更多中小企业在应用管理软件之前可以评估企业执行力和规避实施风险,普实在云端部署了AIO5的试用环境,免费供大家导入实际数据进行学习和测试.因资源有限,申请要求如下: 1.填写申请信息并加盖公章: ...