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. 关于MATLAB处理大数据坐标文件201762

    经过头脑风暴法想出了很多特征,目前经过筛选已经提交了两次数据,数据提交结果不尽如人意,但是收获很大. 接下来继续提取特征,特征数达到27时筛选出20条特征,并找出最佳搭配

  2. linux下查找某个文件或目录

    以查找samba为例:find / -name samba 查找之后得到的结果集如下:/var/lib/samba/var/spool/samba/var/log/samba/usr/lib64/sa ...

  3. 【Android Developers Training】 20. 创建一个Fragment

    注:本文翻译自Google官方的Android Developers Training文档,译者技术一般,由于喜爱安卓而产生了翻译的念头,纯属个人兴趣爱好. 原文链接:http://developer ...

  4. 如何利用keytool查看一个apk的签名

  5. 信息安全的核心:CIA三元组 | 安全千字文系列1

    我们总是在说信息安全管理,那么信息安全管理到底是在管什么?我们要如何定义信息安全? 这里就要引出信息安全最基本的概念:CIA三元组. 这里的 C,指的是Confidentiality机密性 这里的 I ...

  6. 利用MUI滑动进行利息计算(移动端APP显示)

    在开发移动端的应用时,会用到很多的手势操作,比如滑动.长按等,为了方便开放者快速集成这些手势,mui内置了常用的手势事件,其中滑动应用是比较常见的应用操作,本篇文章将讲述如何利用滑动改变对应值进行计算 ...

  7. 关闭chrome浏览器的developer tools

    背景 Chrome使用过程中,很容易启动Chrome developer tools,一些误触如按到F12.CTRL+Shift+C等都会启动developer tools.对于不开发Web的人来说, ...

  8. Spring MVC 项目搭建 -3- 快速 添加 spring security

    Spring MVC 项目搭建 -3- 快速 添加 spring security 1.添加 spring-sample-security.xml <!-- 简单的安全检验实现 --> & ...

  9. Vijos 1981 跳石头 二分

    描述 一年一度的"跳石头"比赛又要开始了! 这项比赛将在一条笔直的河道中进行,河道中分布着一些巨大岩石.组委会已经选择好了两块岩石作为比赛起点和终点.在起点和终点之间,有 N 块岩 ...

  10. 基于REM的移动端响应式适配方案

    视口 在前一段时间,我曾经写过一篇关于viewport的文章.最近由于在接触移动端开发,对viewport有了新的理解.于是,打算重新写一篇文章,介绍移动端视口的相关概念. 关于这篇文章说到的所有知识 ...