TypeScript
文章平均质量分 59
LIMI_伞梦
这个作者很懒,什么都没留下…
展开
-
TypeScript快速上手学习笔记-第十二篇——实战项目“贪吃蛇”
一、项目前准备项目主要用到的工具包括typecript,webpack,css拓展语言(less或者scss)博主这边使用的是scss。1-使用命令npm install @babel/core @babel/preset-env babel-loader clean-webpack-plugin core-js css-loader html-webpack-plugin node-sass postcss postcss-loader postcss-preset-env sass-loader s原创 2021-02-13 22:45:40 · 295 阅读 · 1 评论 -
TypeScript快速上手学习笔记-第十一篇——泛型
一、什么是泛型软件工程中,我们不仅要创建一致的定义良好的API,同时也要考虑可重用性。 组件不仅能够支持当前的数据类型,同时也能支持未来的数据类型,这在创建大型系统时为你提供了十分灵活的功能。在像C#和Java这样的语言中,可以使用泛型来创建可重用的组件,一个组件可以支持多种类型的数据。 这样用户就可以以自己的数据类型来使用组件。在定义函数或者类时,如果遇到类型不明确的情况可以使用泛型。二、函数中泛型的使用这是是输入某个值,并将此制输出的过程,因为不清楚输入值的类型,所以可以使用泛型。泛型在调原创 2021-02-08 19:33:51 · 258 阅读 · 0 评论 -
TypeScript快速上手学习笔记-第十篇——属性
一、 publicpublic修饰属性可以是属性在任意位置访问(修改)默认值class Person { // public修饰属性可以是属性在任意位置访问(修改)默认值 public _name:string; constructor(name:string){ this._name=name; }}let per=new Person("ts");console.log(per);console.log(per._name);per._name="js";c原创 2021-02-08 19:33:32 · 263 阅读 · 0 评论 -
TypeScript快速上手学习笔记-第九篇——抽象类&接口
一、抽象类abstract抽象类:以abstract开头的类称为抽象类,其与普通类差别不大,但无法创建实例对象,所以抽象类是一种专门被用来继承的类。抽象类可以定义抽象方法,即以abstract开头的方法称为抽象方法,是没有方法体的,且只能定义在抽象类中。如果子类继承了抽象类,如果其中包含抽象方法,那么子类必须对抽象方法进行重写。//以abstract开头的类称为抽象类,其与普通类差别不大,//但无法创建实例对象,所以抽象类是一种专门被用来继承的类。abstract class Fruit {原创 2021-02-08 10:14:47 · 272 阅读 · 1 评论 -
TypeScript快速上手学习笔记-第八篇——继承
一、什么是继承?继承是类与类之间的关系,是通过扩展其他类而形成新类来实现的,原来的类称为父类(super class)或基类,新类称为原来类的子类或派生类。在子类中,不仅包含父类的属性和方法,还可以增加新的属性和方法,使得父类的基本特征可被所有子类的对象共享。二、继承的简单样例Cat extends Animal, 此时Cat为子类,Animal为父类,使用继承之后子类会自动继承父类中的所有属性和方法。 class Animal{ } class Cat extends Animal{原创 2021-02-07 20:12:55 · 178 阅读 · 0 评论 -
TypeScript快速上手学习笔记-第七篇——类
一、面向对象二、类的简单使用使用class关键字来定义类,类中包含两个部分:属性+方法class Person { //定义类属性 name='ts'; //方法 sayhello(){ console.log('Hello,TS',"实例方法"); }};其中不论属性还是方法,分为直接定义实例的和使用static开头的静态的(类的)其中实例的需要通过对象的实例才能访问,而类的可以通过类直接访问。class Person { //定义类属性 //原创 2021-02-07 20:12:28 · 182 阅读 · 0 评论 -
TypeScript快速上手学习笔记-第六篇——联合webpack打包ts文件
1、在项目中安装npm使用代码:npm install在项目中安装npm,安装成功会生成node-modules文件夹和package.json文件2、在项目中安装webpack,webpack-cli,typescript,ts-loader依赖使用代码:npm install webpack webpack-cli typescript ts-loader --save-dev安装所需的依赖,安装成功,会在package.json文件中生成依赖3、配置webpack打包配置文件webpack原创 2021-02-06 18:25:40 · 577 阅读 · 0 评论 -
TypeScript快速上手学习笔记-第五篇——TypeScript编译配置选项
前言之前,我们了解到我们可以采用tsc xxx.ts对ts文件进行编译,但是需要我们在修改文件之后自己手动输入,而不是自动编译的,这十分麻烦,那有没有什么方法可以自动编译呢有,输入代码:tsc xxx.ts -w进入自动检测编译模式。每次文件更新之后。尽管,我们实现了自动编写,但是还只是对单一的文件,如果工程巨大,需要编译的文件众多,那这又是十分不可取的,之前我们讲过TS有丰富的配置选项,接下来我们就来编写TS配置文件。我们在项目外围新建TS配置文件 tsconfig.json博主这边默认是原创 2021-02-06 11:24:23 · 1924 阅读 · 0 评论 -
TypeScript快速上手学习笔记-第四篇——TypeScript类型
类型概览TS中有如下数据类型:number——数字类型let num:number;num=10;let num:number=10;num=20;let num=10;num=20;function fun_num(a:number,b:number):number{ return a+b;}string——字符串类型let str:string;str='ts';let str:string='js';str='ts';let str='js';str='原创 2021-02-05 16:29:33 · 298 阅读 · 0 评论 -
TypeScript快速上手学习笔记-第三篇——类型声明
前言我们知道JS的变量等的类型是动态,这在一定程度上使我们的开发过程变得十分不方便。而TS一个主要的作用就是解决JS动态类型的问题,让js数据类型变得固定,这就是TS的类型声明,主要应用在变量和函数部分。一、变量的类型首先我们写下如下的代码://声明一个变量a,同时指定它的类型为numberlet a:number;//以为a的类型为number,那么给a赋值只能为数字a=10;a=30;//此时赋值为字符串会报错,但是因为符合js要求则暂时会编译成功a='1';//报错通过tsc原创 2021-02-04 22:26:28 · 242 阅读 · 0 评论 -
TypeScript快速上手学习笔记-第二篇——环境搭建与“Hello,TypeScript”
0、在保证了电脑上安装好node.js并可以运行npm,再进行以下操作1、安装全局TS再命令行cmd中输入代码:npm i -g typescript,安装完成输入代码:tsc -v检查是否安装成功。2、创建一个ts文件创建一个ts文件:xxx.ts 并编写一个ts代码:console.log("Hello,TypeScript");在这里TS和JS是没有区别的。3、编译ts文件为js文件因为ts不能被js解析器直接运行,所以无法直接执行ts文件,需要先编译成js才可以执行,在cm原创 2021-02-04 18:17:29 · 156 阅读 · 0 评论 -
TypeScript快速上手学习笔记-第一篇——简介
什么是TypeScript?TypeScript是一种由微软开发的以javascript为基础的自由和开源的编程语言。它是JavaScript的一个超集,而且本质上向这个语言添加了可选的静态类型和基于类的面向对象编程。2012年十月份,微软发布了首个公开版本的TypeScript,2013年6月19日,在经历了一个预览版之后微软正式发布了正式版TypeScript 0.9,向未来的TypeScript 1.0版迈进了很大一步。TypeScript扩展了JavaScript的语法,所以任何现有的Java原创 2021-02-04 17:52:23 · 376 阅读 · 1 评论