TypeScript学习

简介: 是什么优势搭建开发环境就是加一个TypeScript的编译器。在线编译器http://www.typescriptlang.

是什么

img_2c8bf120460623aa3ddd7d1a9345e091.png
img_df39a1175ca09bbf0ca594f6c8654c7c.png

优势

img_7ac76ad7e64a2ecef4756bd344b3effd.png

搭建开发环境

就是加一个TypeScript的编译器。
在线编译器http://www.typescriptlang.org/play/index.html

img_fea616a2da9d7fce48d28d8747d48505.png

离线编译器

npm install -g typescript

实际功能就是编译代码

  • tsc xxx.ts
    把.ts 编译成.js
    类似java,把.java编译成.class

新特性

几乎就是ES6的完成版,全部来自es6
https://babeljs.io/learn-es2015/

字符串新特性

  • 多行字符串
    双撇号``声明字符串


    img_a386655a0a63367731d078a66339abff.png
img_14a0036e844038fe2b0d445a42804d3d.png
  • 字符串模板
img_64ac03979e74f8cf0435457ec905e3d0.png
img_702a898d6328963f8c5a15eb202b97c6.png

-自动拆分字符串

img_785450083602cee271876dd7a956ec29.png
img_c5463a3d58a751ad169907464f538244.png

参数类型新特性

类型声明


img_61910227588be761493ce5b1272beea4.png

参数默认值


img_807ab7b5695db6ab8df2636c79de6fad.png

可选参数
img_b02a835899b2169ec2d95db95ea247b9.png

函数新特性

可变参数

img_7f4cbdf28158987ffcba843e3dd626c0.png

generator方法

img_79d657ec1bfacd58301a4bb9b45701de.png

析构表达式

img_b3317f098060a96c4e76b27bd1663d82.png
img_bee146673724d5adf2a6eaebbf18ebb4.png
img_493a22ee20c017c34446f6c190e050ed.png
img_62ccc4c25c0f8a0afac7e83a0a1d4dd5.png

lamadba表达式

img_204c47d0fb6180ca3b94fefd204430ee.png

foreach ,for in ,for of

forEach 不能break

img_f16a7a584978ed778436cfe8bcdef95d.png

for in 展示的是名字,如果取值要去obj[n]

img_4527e099c222809cb44be42fc5c2abd8.png
img_66c0ffbdefd600f723ac843fbd2456d5.png
img_3f0b152b1109adb69c42380290e49ed9.png
img_5d8bcfdd72547f59455eb7e3a570fcd3.png

for of 可以被打断,直接取得值

img_d3e9af40d8c1497774361e481d3b5f8c.png

面向对象特性


泛型
接口
模块(类似java的包,这里简化了,import和export)

img_b05562be4a2367265bbbb214bb29aeca.png
img_a49aa36a310cf677ef9544a0313eba3b.png

注解

img_6515e5604df73cab00732af6a69443e2.png

类型定义文件,使用其他js包,如jquary
引入jquary


img_7ce1f49d9422d22e9c674335de0a179d.png
相关文章
|
2月前
|
JavaScript 前端开发 编译器
TypeScript【泛型1、泛型2、声明合并、命名空间 、模块1、模块2、声明文件简介】(五)-全面详解(学习总结---从入门到深化)
TypeScript【泛型1、泛型2、声明合并、命名空间 、模块1、模块2、声明文件简介】(五)-全面详解(学习总结---从入门到深化)
64 0
|
2月前
|
编解码 JavaScript 前端开发
TypeScript【第三方声明文件、自定义声明文件、tsconfig.json文件简介、tsconfig.json 文件结构与配置】(六)-全面详解(学习总结---从入门到深化)
TypeScript【第三方声明文件、自定义声明文件、tsconfig.json文件简介、tsconfig.json 文件结构与配置】(六)-全面详解(学习总结---从入门到深化)
63 0
|
3月前
|
JavaScript
TypeScript【类的继承、访问修饰符、readonly 修饰符、存取器、实例方法与静态方法、实例属性与静态属性、静态属性、抽象类】(三)-全面详解(学习总结---从入门到深化)
TypeScript【类的继承、访问修饰符、readonly 修饰符、存取器、实例方法与静态方法、实例属性与静态属性、静态属性、抽象类】(三)-全面详解(学习总结---从入门到深化)
20 0
|
3月前
|
JavaScript 前端开发 编译器
TypeScript【泛型1、泛型2、声明合并、命名空间 、模块1、模块2、声明文件简介】(五)-全面详解(学习总结---从入门到深化)(下)
TypeScript【泛型1、泛型2、声明合并、命名空间 、模块1、模块2、声明文件简介】(五)-全面详解(学习总结---从入门到深化)
27 0
TypeScript【泛型1、泛型2、声明合并、命名空间 、模块1、模块2、声明文件简介】(五)-全面详解(学习总结---从入门到深化)(下)
|
3月前
|
JavaScript
TypeScript【泛型1、泛型2、声明合并、命名空间 、模块1、模块2、声明文件简介】(五)-全面详解(学习总结---从入门到深化)(上)
TypeScript【泛型1、泛型2、声明合并、命名空间 、模块1、模块2、声明文件简介】(五)-全面详解(学习总结---从入门到深化)
30 0
|
3月前
|
JavaScript 前端开发 编译器
TypeScript【可选属性、只读属性、额外的属性检查、函数类型、类类型、继承接口】(四)-全面详解(学习总结---从入门到深化)
TypeScript【可选属性、只读属性、额外的属性检查、函数类型、类类型、继承接口】(四)-全面详解(学习总结---从入门到深化)
23 0
|
3月前
|
JavaScript 前端开发 程序员
TypeScript【枚举、联合类型函数_基础、函数_参数说明 、类的概念、类的创建】(二)-全面详解(学习总结---从入门到深化)
TypeScript【枚举、联合类型函数_基础、函数_参数说明 、类的概念、类的创建】(二)-全面详解(学习总结---从入门到深化)
19 0
|
3月前
|
JavaScript 前端开发 编译器
TypeScript【什么是TypeScript、安装并编译TypeScript、变量声明、原始数据类型、数组、元组、任意值】(一)-全面详解(学习总结---从入门到深化)
TypeScript【什么是TypeScript、安装并编译TypeScript、变量声明、原始数据类型、数组、元组、任意值】(一)-全面详解(学习总结---从入门到深化)
17 0
|
3月前
|
存储 JavaScript 前端开发
【第10期】学习TypeScript你要知道的JavaScript
【第10期】学习TypeScript你要知道的JavaScript
19 0
|
3月前
|
JavaScript 前端开发 安全
推荐12个值得学习的TypeScript宝库!
推荐12个值得学习的TypeScript宝库!