从项目中由浅入深的学习typescript (3)

序列文章

从项目中由浅入深的学习vue,微信小程序和快应用 (1)
从项目中由浅入深的学习react (2)

前言

为什么会有TS? 大家有没想过这个问题,原因是JS是弱类型编程语言,也就是申明变量类型可以任意变换。所以这个时候TS出现了。
TS 是 JS 的超集，也相当于预处理器,本文通过一个template项目来让你快速上手TS。

1.效果图

vue-ts-template , 欢迎star

2.技术栈

1.vue
2.vue-cli3
3.vue-router
4.vuex
5.typescript
6.iconfont

3.核心插件

vue-property-decorator暴露的API

4.TS语法

5.问题来了

1.怎么在项目手动配置ts？
vue+ts项目配置

2.接口和类的区别？
接口只声明成员方法，不做实现 ，class通过implements 来实现接口
ts中接口和类的区别

3.接口和对象的区别？
接口是公共属性或方法的集合，可以通过类去实现；
对象只是键值对的实例

4.类class和函数的区别？
类是关键字class，函数是function
类可以实现接口

5.接口实现继承方法？

interface Person { 
   age:number 
} 
 
interface Musician extends Person { 
   instrument:string 
} 
 
var drummer = <Musician>{}; 
drummer.age = 27 
drummer.instrument = "Drums" 
console.log("年龄:  "+drummer.age)
console.log("喜欢的乐器:  "+drummer.instrument)