Typescript与Javascript

  • 二者的区别

  作为前端开发的基础语言javascript已经深入人心,人人皆知。作为变成入门的最简单语言,Javascript语言以动态、弱类型语言而著名,学习入门快,变量随心所欲(呵呵。。),没有其他语言那样严禁的语法规范,可以自由发挥,然而由此换个角度也可以看出,Javascript也并不是一门好语言。尤其是一个新手在构建一个大型项目,就感觉用竹篮子打水,漏洞百出。那么前端开发有没有一门强类型的语言那,答案是必然的,这里就引出了我们的Typescript.

Typescript官网的快速上手给出了typescript的4个主要特点:编译代码、类型注解、接口、类;作为给予面向对象的语言。类和接口的良好配合使用,决定一个程序员的抽象水平。

  简单来说,typescript作为javascript的超集,不仅仅在于支持javascript,其最大的优势在于scalable,即可扩展性。

  原因, 其实也很简单, 静态类型检查, 代码重构和语言服务,这些都是 JavaScript 的弱势. 项目大了, 很多时候自己的代码怎么用都记不清楚, 当然第三发的类库就不用说了. 而TypeScript, 可以看清楚每一个对象的属性, 方法的参数等, 便利很多. 一些脑残的 typeof 也无影遁形.

 虽然编程语言没有好坏,只有适合不适合,但当你自身升级之后,特别是大型超大型项目,你就越加对强类型语言需求更多。

  • Typescript的基本数据类型

    和其他所有语言一样,typescript需要操作最简单的数据单元,typescript支持与javascript几乎(注意是‘几乎’)相同的数据类型,具体来说有一下12种类型:

1.布尔值  2.数字  3.字符串  4.数组  5.元组    6.枚举     7.任意值      8.空值     9.null       10.undefined       11.类型断言      12.关于  

  1. 布尔值:最基本的数据 true/false

    let isDone: boolean = false;
  2. 数字:和Javascript一样,typescript的所有数值均为浮点数,此外支持二进制、八进制、十进制、十六进制
    let decLiteral: number = 6;
    let hexLiteral: number = 0xf00d;
    let binaryLiteral: number = 0b1010;
    let octalLiteral: number = 0o744;
  3. 字符串:
    1. 和JavaScript一样,可以使用双引号( ")或单引号(')表示字符串
    2. 此外还支持模板字符串,可以内嵌表达式:
      //string
      let name: string = "bob";
      name = "smith";
      //模板字符串
      let name: string = `Gene`;
      let age: number = 37;
      let sentence: string = `Hello, my name is ${ name }. I'll be ${ age + 1 } years old next month.`;
  4. 数组:与Javascript一样可以操作数组元素,两种定义方式:
      4.1元素类型+[]
         4.2数组泛型
    let list:number[]=[1,2,3];            //元素+[]
    let list:Array<number>=[1,2,3]; //数组泛型
  5. 元组:允许表示一个已知数量和类型的数组,数组的各个元素不必相同,如下:
    let x:[string,number];//Declar a tuple type
    x=['hello',10] //initialize the tuple
    //元组的访问
    //1.访问已知索引元素,返回正确类型
    console.log(x[0].substr(1)); //ok
    console.log(x[1].substr(1)); //Error,'number' dosen't have 'substr'
    //2.访问元组的一个越界元素,会使用联合类型替代
    x[3]='world'; //ok , 字符串可赋值给(string|number)类型
    console.log(x[5].toString()); //ok , 'string'和‘number'都有toString方法
    x[6]=true; //error,布尔类型不是(string|number)类型
  6. 枚举:enum类型是对Javascript标准数据类型的一个扩充,可用枚举类型为一组数值赋予名字;
    enum Color{Red, Green,Blue};
    let c:Color=Color.Green; //1.为枚举类型元素指定数值/索引下标,(默认从0开始为元素编号)
    enum Color {Red=1,Green,Blue};
    let c:Color=Color.Green; //2.利用枚举值得到元素名字
    enum Color {Red=1,Green=2,Blue=4};
    let colorName:string=Color[2]; //Green
  7. 任意值:定义那些编程阶段还不清楚类型的变量——避免类型检查
    let notSure:any=4;
    notSure='may a string';//ok
    notSure=false; //ok
  8. void:没有任何数据类型,比如一个函数没有返回值时:
    //1.没有返回值的函数
    function warnUser():void{
    alert('There is my waring mesage!');
    }
    //2.一个void类型变量只能赋值undefined和null
    let unusable:void=undefined;
  9. null/undefined:默认情况下是所有类型的子类型
  10. Never:表示那些永远不存在值的类型,never类型是那些总是会抛出异常或根本就不会有返回值的函数表达式或箭头函数表达式的返回值类型; 变量也可能是 never类型,当它们被永不为真的类型保护所约束时。
    //1.返回never的函数必须存在无法到达的终点
    function error(message:string):never{
    throw new Error(message);
    }
    //2.推断返回值类型为never
    function fail(){
    return error('sonthing failed!')
    }
    //3.返回never的函数必须无法到达终点
    function infiniteLoop():never{
    while(true){
    }
    }
  11. 类型断言:手动设置变量类型
    11.1 尖括号法
    11.2 as语法
    //1.尖括号法
    let someValue:any='this is a string';
    let stringLen=number=(<string>someValue).length; //2. as语法
    let someValue:any='this is a string';
    let strLength:number=(someValue as string).length;
  12. 关于let:类似Javascript中的var      

    ____end!

TypeScript基础数据类型的更多相关文章

  1. TypeScript学习指南第一章--基础数据类型(Basic Types)

    基础数据类型(Basic Types) 为了搭建应用程序,我们需要使用一些基础数据类型比如:numbers,strings,structures,boolean等等. 在TypeScript中除了Ja ...

  2. 《前端之路》 - 初试 TypeScript(一)基础数据类型

    一.先讲讲 TypeScript 什么是 typeScript ? typeScript 是 Javascript 的超集 我们用一张图来简单介绍下 ts 和 js 清清楚楚明明白白的关系- 为什么会 ...

  3. TypeScript基础学习

    什么是TypeScript? TypeScript是一种由微软开发的自由的和开源的编程语言,它是JavaScript的一个超集,扩展了JavaScript的语法. TypeScript支持任意浏览器, ...

  4. TypeScript基础以及在Vue中的应用

    TypeScript推出已经很长时间了,在Angular项目中开发比较普遍,随着Vue 3.0的即将推出,TypeScript在Vue项目中使用也即将成为很大的趋势,笔者也是最近才开始研究如何在Vue ...

  5. TypeScript_基础数据类型

    TypeScript 的基础数据类型包含: string.number.boolean.array .object.null.undefined.enmu.void.never.any.tuple 注 ...

  6. [.net 面向对象编程基础] (3) 基础中的基础——数据类型

    [.net 面向对象编程基础] (3) 基础中的基础——数据类型 关于数据类型,这是基础中的基础. 基础..基础..基础.基本功必须要扎实. 首先,从使用电脑开始,再到编程,电脑要存储数据,就要按类型 ...

  7. 【Swift】学习笔记(一)——熟知 基础数据类型,编码风格,元组,主张

    自从苹果宣布swift之后,我一直想了解,他一直没有能够把它的正式学习,从今天开始,我会用我的博客来驱动swift得知,据我们了解还快. 1.定义变量和常量 var  定义变量,let定义常量. 比如 ...

  8. 二、Windows基础数据类型

    六.Windows Data Types 简介: 6.1.这些数据类型都是C语言数据类型的再次的进行包装. 6.2.因为考虑到如果使用的是C中的基础数据类型可能无法表示,想表示的精准的含义. 6.3. ...

  9. java基础数据类型包装类

    */ .hljs { display: block; overflow-x: auto; padding: 0.5em; color: #333; background: #f8f8f8; } .hl ...

随机推荐

  1. watchdog(IWDG)

    1.为了避免程序忙跑跑死了没反应,加上一个看门狗watchdog实时监控着程序,一旦程序没有在规定的时间喂狗,则狗叫使得单片机复位. 2.Independent watchdog(IWDG)内部有时钟 ...

  2. error: open of glibc-devel-2.12-1.132.el6.i686.rpm failed: 没有那个文件或目录

    在安装qt的时候出现了错误: error: open of glibc-devel-2.12-1.132.el6.i686.rpm failed: 没有那个文件或目录 错误原因:缺少glibc-dev ...

  3. Java 基础 标识符的命名

    java标识符的命名规则和规范 首先,标识符是在Java程序中能够自己进行命名的地方,例如:类名,方法名,接口名,变量名,常量名...等. 命名规则: 1.由26个英文字母的大小写,0-9的数字,_或 ...

  4. 推荐几款.NET客户端开源报表图

    如果你正在开发客户端报表图相关的应用,除了.NET自带的控件,你还可以考虑使用以下几个控件库. [OxyPlot] OxyPlot是一个支持.NET的跨平台绘图库.你可以在很多平台上使用它,如WPF, ...

  5. js-txt文本处理

    js-txt文本处理 写自己主页项目时所产生的小问题拿出来给大家分享分享,以此共勉. ---DanlV TextArea的换行符处理 TextArea文本转换为Html:写入数据库时使用 js获取了t ...

  6. centos7安装图形化界面

    yum groups install -y "GNOME Desktop" "Graphical Administration Tools"

  7. 掌握好这23个Linux命令常用项

    运维工程师(Operations)在国内又称为运维开发工程师(Devops),在国外称为 SRE(SiteReliability Engineering).负责维护并确保整个服务的高可用性,同时不断优 ...

  8. Unity3D拖尾组件在Ui界面下正常显示

    在项目中Canvas下UI添加拖尾效果,会发现Ui完全遮挡住了拖尾. 如果要正常显示通常需要对Canvas进行设置,Render Mode 我这里用的是-Camera模式 其次要对Material 下 ...

  9. 终于等到你!MobileTest免费公测,华为带你走出安卓适配大坑

    一.安卓适配之痛真的无解吗? Android平台的诞生对智能手机的普及功不可没,但设备繁多.品牌众多.版本各异,芯片.摄像头.分辨率不统一等等,这些都逐渐成为Android系统发展的障碍,碎片化严重不 ...

  10. java在控制台输出空心正方形,菱形,空心菱形

     使用for和if打印一个空心正方形 /*思路:要想打印一个5x5的空心正方形,首先它的第一横行和最后一行都是填满的,需要全部遍历出来,第二三四行和只有左右两条边是出来的,中间部分为空的.因此在打印第 ...