• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    公众号

ES详解 + TypeScript + Nodejs 专题

原作者: [db:作者] 来自: [db:来源] 收藏 邀请

一. ES简介

1. ECMAScript

(1). 简介

 ES 的全称是 ECMAScript , 它是由 ECMA 国际标准化组织,制定的一项脚本语言的标准化规范。

 每一次标准的诞生都意味着语言的完善,功能的加强。JavaScript语言本身也有一些令人不满意的地方。

  • 变量提升特性增加了程序运行时的不可预测性

  • 语法过于松散,实现相同的功能,不同的人可能会写出不同的代码

(2). ECMAScript和JavaScript的关系

  JavaScript包括:ECMAScript、DOM、BOM三部分组成。

  A. ECMAScript---语言核心功能基于ES规范

  B. DOM— js支持对DOM的维护,通过document,element对象实现.这些都是在ES中没有的.

  C. BOM— js支持对BOM的维护,通过window对象实现.这些都是在ES中没有的.

(2). ES6-11功能总结

 

 

 

 

二. TypeScript简介

1. JavaScript痛点

(1). 优秀的JavaScript没有缺点吗?

 A. 比如ES5以及之前的使用的var关键字关于作用域的问题;

 B. 比如最初JavaScript设计的数组类型并不是连续的内存空间

 C. 比如直到今天JavaScript也没有加入类型检测这一机制

(2). JavaScript正在慢慢变好

 A. 不可否认的是,JavaScript正在慢慢变得越来越好,无论是从底层设计还是应用层面。

 B. ES6、7、8等的推出,每次都会让这门语言更加现代、更加安全、更加方便

 C. 但是直到今天,JavaScript在类型检测上依然是毫无进展

2. 认识TypeScript

(1). 我们来看一下TypeScript在GitHub和官方上对自己的定义:

 A. GitHub说法:TypeScript is a superset of JavaScript that compiles to clean JavaScript output.p

 B. TypeScript官网:TypeScript is a typed superset of JavaScript that compiles to plain JavaScript.

 C. 翻译一下:TypeScript是拥有类型的JavaScript超集,它可以编译成普通、干净、完整的JavaScript代码。

(2). 怎么理解上面的话呢?

 A. 我们可以将TypeScript理解成加强版的JavaScript

 B. JavaScript所拥有的特性,TypeScript全部都是支持的,并且它紧随ECMAScript的标准,所以ES6、ES7、ES8等新语法标准,它都是支持的

 C. 并且在语言层面上,不仅仅增加了类型约束,而且包括一些语法的扩展,比如枚举类型(Enum)、元组类型(Tuple)等;

 D. TypeScript在实现新特性的同时,总是保持和ES标准的同步甚至是领先

 E. 并且TypeScript最终会被编译成JavaScript代码,所以你并不需要担心它的兼容性问题,在编译时也不需要借助于Babel这样的工具

 F. 所以,我们可以把TypeScript理解成更加强大的JavaScript,不仅让JavaScript更加安全,而且给它带来了诸多好用的好用特性;

3. TypeScript特点

(1).始于JavaScript,归于JavaScript

 A. TypeScript从今天数以百万计的JavaScript开发者所熟悉的语法和语义开始。使用现有的JavaScript代码,包括流行的JavaScript库,并从JavaScript代码中调用TypeScript代码;

 B. TypeScript可以编译出纯净、 简洁的JavaScript代码,并且可以运行在任何浏览器上、Node.js环境中和任何支持ECMAScript 3(或更高版本)的JavaScript引擎中;

(2). TypeScript是一个强大的工具,用于构建大型项目

 A. 类型允许JavaScript开发者在开发JavaScript应用程序时使用高效的开发工具和常用操作比如静态检查和代码重构

 B. 类型是可选的,类型推断让一些类型的注释使你的代码的静态验证有很大的不同。类型让你定义软件组件之间的接口和洞察现有JavaScript库的行为;

(3).拥有先进的 JavaScript

 A. TypeScript提供最新的和不断发展的JavaScript特性,包括那些来自2015年的ECMAScript和未来的提案中的特性,比如异步功能和Decorators,以帮助建立健壮的组件;

 B. 这些特性为高可信应用程序开发时是可用的,但是会被编译成简洁的ECMAScript3(或更新版本)的JavaScript;

4. TS的编译环境

(1). 首先要有nodejs环境 【详见:https://www.cnblogs.com/yaopengfei/p/14478126.html

(2). 需要在电脑上安装 TypeScript ,这样就可以把ts编译成js运行了。

 A. 全局安装ts npm install typescript -g 】

 B. 查看ts版本 【tsc --version】

 

(3). 测试

 进入ts文件的目录,输入 【tsc ./test1.ts】,会在当前目录下生成一个转换好的test1.js文件。

5.TS的两种运行模式

模式1:

 通过webpack,配置本地的TypeScript编译环境和开启一个本地服务,可以直接运行在浏览器上;

模式2:

 通过ts-node库,为TypeScript的运行提供执行环境 

 

三. NodeJs简介 

 

 

 

 

 

 

 

 

四. 目录

 

阶段一:ECMAScript语法(ES6-ES11)

 第一节:ES6用法之let、const、解构赋值、箭头函数、剩余参数

 第二节:ES6用法之内置对象扩展(Array、String、Set)

 第三节:ES6用法之Function、Object、Class、Symbol

 第四节:ES6用法之Map、RegExp、Number、Proxy

 第五节:ES6用法之Reflect、Promise、Iterator

 第六节:ES6用法之Generator、Module模块化导入导出

 第七节:ES7之includes、幂等运算符 和 ES8之async/await、Object扩展、String扩展、尾逗号

 第八节:ES9之for await of、RegExp扩展、Object扩展、Promise扩展、String扩展

 第九节:ES10之Object、String、Array、Function、可选Catch、JSON、Symbol扩展

 第十节:ES11之String、Dynamic、BigInt、allSettled、globalThis、Optional chaining、Nulish coalescing Operator

 第十一节:xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx

 第十一节:xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx

 

 

阶段三:TypeScript专题

 第一节:TypeScript简介、环境配置、几种编译方式(基于webpack 、ts-node)

 第二节:ts变量声明、通用js数据类型、ts新数据类型、ts类型补充

 第三节:TypeScript类型补充和函数详解(参数、返回值、类型、参数【可选/默认】、剩余参数、this、重载)

 第四节:TypeScipt类、接口、枚举类型详解

 第五节:TypeScript泛型详解 和 模块、模块化、namespace、类型查找、declare剖析

 第X节:xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx

 

阶段二:Nodejs专题

 第一节:nodejs简介/安装/用法 及 npm、nrm、VsCode的使用

 第二节:nodejs基础用法之Commonjs导入/导出、读写文件、路径等

 第三节:ES6模块化历史 及 默认、按需、直接导入导出、Vue单文件

 第四节:xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx

 

 

 

 

 

 

 

 

 

 

 

 

!

  • 作       者 : Yaopengfei(姚鹏飞)
  • 博客地址 : http://www.cnblogs.com/yaopengfei/
  • 声     明1 : 如有错误,欢迎讨论,请勿谩骂^_^。
  • 声     明2 : 原创博客请在转载时保留原文链接或在文章开头加上本人博客地址,否则保留追究法律责任的权利。
 

 


鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
上一篇:
7.typescript-数组的类型发布时间:2022-07-18
下一篇:
webpack基础 -- 编译Typescript发布时间:2022-07-18
热门推荐
热门话题
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap