学习angualr之前需要了解的typeScript知识

 
1.编译型语言
2.强类型语言
3.真正的面向对象的语言: 有借口、有泛型、有枚举、有访问修饰符
AMD类型的面向对象的语言
 
 
npm install -g typescript        下载编译工具
 
编译ts文件       tsc xxx.ts/xxx.tsx/xxx.d.ts
 
 
一、有类型的script   ----  在编译期进行检查,ts只编译不执行
    【声明变量】
      var 变量名: 类型
      var a:number;
 
    【基本类型】
    number
    string    
    boolean   : 只有两个值,true、false
    symbol  :  
    void  :  空,一般情况下用做返回值。不允许赋值
    null : 只有一个类型 --- null 
    undefined : 只有一个类型---undefined
    enum   :  枚举, 列举所有的东西 
            性别、星期---有限的可能性
 
enum Gender{
male,
female
} var sex:Gender;
   
any :  任何类型。 变体变量---没有固定类型,可以是任何类型
 
    js的变量都是变体变量.
 
var a: any;

a = 12;
a = 'abc';

【类型推理、类型推测】---根据初始化的值推测类型(隐式类型推测)

【类型推理、类型推测】---根据初始化的值推测类型(隐式类型推测)

var a = 13;

a = 'abc';  //  报错  , ts 已经推理 a: number;
var a;

a = 12;
a = 'abc'; // a: any;

【冲突检测】编译器会自动排除掉无用的选项

enum WEEK {
SUN,
SAT,
FRE,
TUS
} var w = WEEK.SUN; switch(w) {
case WEEK.SUN:
break;
case WEEK.STA;
break;
} // 报错,不会出现WEEK.STA,所以ts编译器认为不应该写第二种case

【联合类型】

var a:number | string;

a = 12;
a = 'abc';
var a:number | string;

var b: boolean;

a = b ? 12: false;
// 报错,false不能作为结果

【数组的类型】

var arr = [12, 5, 8];    // 隐式类型声明  var arr:number[] = [12, 5, 8];

arr[3] = 'abc';   //  报错
arr: 类型[]  = [];
 
数组其实还是一种泛型;
 
Array --- 典型的泛型  
 
interface Array<T> {
reverse(): T[];
sort(compare?: (a: T, b:T) => number):T[];
...
}
var arr:number[] = [12, 5];

//  等同于

var arr: Array<number> = new Array<number>();

【函数的类型】 参数和返回值都可以定义类型

function show(a: any, b:number) {
console.log(a + b);
} show(12,5); // 报错

参数不仅可以有类型还有函数签名检查(匹配参数的数量)

function show(a: number, b: number) {
console.log(a + b);
} show(12); // 报错

返回值

function sum(a:number, b:number):string {
return a + b;
} console.log(sum(12,5)); // 报错,返回值是string

【外部变量声明】 declare

console.log(a);    // 报错
declare var $;

$(function() {
$('#div')
})
// 不报错
window、 document   叫内置外部声明,不用再次声明。
 
【函数签名】
 
function ajax(url: string, success: (res: string, code: number) => vodi, error: (code:number) => void) {
;
} ajax('1.txt', () => {}, () => {}); // 参数和返回值都有约定
 
【类型】
 
1.基本类型
2.联合类型
3.函数签名
4.对象类型
5.联合类型(复合类型)
 
 
【符合类型--可选类型】
 
var point: {x:number, y:number, z?:number};

point = {x:12,y:5}

point = {x:12,y:5,z:8}
function show(a: Object) {

}
// json
二、接口:interface
 
java中:
 
class Click implements inter {

}
 
接口就是一种约定和限制,是一种必须遵守的规范
 
    比如说 汽车---接口:能开、必须加油
 
interface Point {
x: number,
y: number,
z?: number
} var p:Point p = { x:12, y:5};

三、class

class Person {
// 成员属性
name: string;
age: number; // 构造器
constructor(name: string, age:number) {
this.name = name;
this.age = age;
} // 成员方法
showMe() {
console.log(`我的名字是${this.name},我的年龄是${this.age}`)
}
} var p = new Person('jason', 18); p.showMe();
包括class、extend、多继承
 
 
【访问修饰符】
 
1.public          共有属性            任何类可访问,全局
2.private         私有属性            只有类内部可以访问
3.protected    受保护--友元
 
class Person {
public name: string,
private age: number
} var p = new Person(); p.name = 'jason'; // 报错,name只能在class内部使用
四、泛型。(模板)
 
请区别于any,泛:宽泛(主要原因)
 
class Calc<T> {
a: T;
b: T; constructor(a:T, b: T) {
this.a = a;
this.b = b;
} show(c: T) {
console.log(this.a);
}
} var obj = new Calc<number>(12, 5); obj.a = 12;
obj.b = 'abc'; // 没生命类型为any,但是<number>会替换class中的<T> obj.show(99);

有限制,但不是any,是一个有范围的any。

 
上一篇:如何让自己的Dev C++用上C++11,c++14标准


下一篇:android 自定义控件二之仿QQ长按删除