文档章节

typescript初涉

sunshinewyf
 sunshinewyf
发布于 2016/04/04 12:05
字数 607
阅读 121
收藏 0

刚来实习,才开始接触了typescript,typescript的官网为http://www.typescriptlang.org/docs/handbook/variable-declarations.html

(1)安装typescript:npm install -g typescript 表示全局安装typescript
(2)typescript的后缀名为.ts,.tsx, .d.ts,然后可以在控制台中进行编译成js文件
(3)首次尝试typescript demo
ts文件代码:
 function sayHello(greeter:string){
    return "hello"+greeter;
}
var user = "sunshine";
document.body.innerHTML = sayHello(user);
然后在控制台中进行编译:tsc greeter.ts,在该文件的同级目录下就会生成一个greeter.js文件,然后在html中引入即可:
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>typescript test</title>
    
</head>
<body>
    <script src="greeter.js"></script>
</body>
</html>
即可在浏览器中看到输出的信息
(4)typescript中的类型:boolean,number,string,Array,Enum,any,void
1:定义布尔类型:let test:boolean = false;
2:定义数组类型:let num :number = 3.4;
3:定义字符串类型:let str:string="sunshine"; //可以使用"",'',`` ,在使用``的时候,可以字符串常量和字符串变量一起定义
    例如:
    let sentence: string = `Hello, my name is ${ name }.

    I'll be ${ age + 1 } years old next month.`;
    与此等价的方式为:
    let sentence: string = "Hello, my name is " + name + ".\n\n" +
      "I'll be " + (age + 1) + " years old next month.";
 4:定义枚举类型:
   枚举类型默认是从0开始算起
    let color ={red,black,green};
    let get:color = color.red; //   get 为0

    let color={red=1,black,green};
    let get:color = color.red; //red为1
5:定义any类型:当有的数据类型不是很确定的时候,就可以定义为any类型
let num:any = 4;
num = 'sunshine';

6:定义数组类型:ar list:number[] = [1, 2, 3];也可以使用泛型的数组类型:var list:Array<number> = [1, 2, 3];
7:定义void类型,表示没有任何的返回值,例如用在函数中:
function test(){
    alert('typescript is amazing');
}

(5)typescript中的const 和let
let在typesript中是和传统js中的var是想似的概念,但是let定义的变量只在声明它的代码块中可以使用,而var却可以在提升为整个作用域进行使用。要想详细知道两者更深层次的区别,请移步:http://es6.ruanyifeng.com/#docs/let
const也用来声明变量,但是声明的是常量。一旦声明,常量的值就不能改变。const声明的变量不得改变值,这意味着,const一旦声明变量,就必须立即初始化,不能留到以后赋值。const的作用域与let命令相同:只在声明所在的块级作用域内有效。

© 著作权归作者所有

sunshinewyf
粉丝 17
博文 97
码字总数 64205
作品 0
武汉
程序员
私信 提问
Deno下一代Nodejs?Deno初体验

前言 Ryan Dahl之父发布了新的项目Deno,很多IT媒体都使用了标题“下一代Nodejs”,首先我们看一下Deno的特性: 1.支持typescript (nodejs目前也支持)。 2.无package.json,无npm,不兼容nod...

peiyu1988
2018/08/12
0
0
如何将三万行代码从Flow移植到TypeScript?

作者 | David Gomes 译者 | 弯月 责编 | 郭芮 来源 | CSDN(ID:CSDNnews) 【编者按】在内存安全中,类型安全是很重要的一个命题。为了确保JavaScript项目运行的类型安全,本文的作者介绍了...

AI科技大本营
01/29
0
0
TypeScript系列1-简介及版本新特性

简介 随着PC端快速向移动端迁移,移动(体验)优先的概念也越来越响。由于ReactJS目前移动端仅仅支持iOS,因此移动端Web开发框架只能选择: AngularJS/Angula2 + Ionic框架 + Cordova。想要学...

一配
2015/08/15
1K
0
来用 TypeScript(技术周刊 2019-04-01)

前端快爆 WebKit 已经实现了 ResizeObserver API,此前该 API 已被 Chrome 支持。通过 ResizeObserver 可以监听元素盒子尺寸的变化。🔗 点评:随着 Edge 迁移到 Chromium 内核,只剩 Fire...

阿里妈妈前端快爆
04/03
0
0
[译] TypeScript 和 Babel:一场美丽的婚姻

原文地址:TypeScript With Babel: A Beautiful Marriage 作者: Matt Turnbull, Feb 12,2019 感谢 Babel 的 TypeScript 插件(),TypeScript 从未变得如此简单,这是 TypeScript 和 Babel ......

司南free
03/08
0
0

没有更多内容

加载失败,请刷新页面

加载更多

nginx+tomcat配置https

1、nginx配置https和【proxy_set_header X-Forwarded-Proto $scheme;】 2、java代码: String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServe......

perofu
31分钟前
4
0
必看的Linux系统新手进阶老手心得

不知道从什么时候起,linux这个话题变得越来越普及,成为大家经常讨论的话题。无论在网络上还是实际生活中,竟然很多人都在纠结学习linux的问题。网络上给的答案千千万万,而却还有很多人踌躇...

Linux就该这么学
34分钟前
4
0
Spring Boot 配置元数据指南

1. 概览 在编写 Spring Boot 应用程序时,将配置属性映射到 Java bean 上是非常有用的。但是,记录这些属性的最好方法是什么呢? 在本教程中,我们将探讨 Spring Boot Configuration Proces...

liululee
37分钟前
3
0
foreach查找子类

$list = $menu_model -> menu_list();$parent_list = [];foreach ($list as $v){ if ($v['pid'] == 0) { $parent = $v; foreach ($list as $v1) ......

小小小壮
49分钟前
3
0
基于 HTML5 Canvas 实现的 TP-LINK 电信拓扑设备面板

前言 今天我们以真实的 TP-LINK 设备面板为模型,完成设备面板的搭建,和指示灯的闪烁和图元流动。 先来目睹下最终的实现效果:http://www.hightopo.com/demo/blog_tplink_20170511/index.h...

htdaydayup
55分钟前
4
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部