个人看视频整理出来的笔记，如果对你没有帮助，请关掉页面
js 和 ts 的区别：js实现了ES5 规范； ts实现了ES6 规范。
ts 的好处：（1）允许 为变量设置类型，像java一样 ；（2）安装开发环境，IDE语法提示； （3） 重构：很方便去修改变量名、文件名，假如 有三处 引入 了 index 变量名，只需要修改 最一处， 其余自动修改； （4）ts是 Augular2 的开发 语言， 微软公司维护，意味着有更好的支持
安装工具：
安装 compiler： sudo npm install -g typescript
查看版本： tsc --version
Webstorm自动编译 TypeScript设置：（安装完 自动编译工具， 就可以省略了 tsc Hello.ts 命令）
先补充部分ES6 知识 ：
字符串类：
function test(template, name, age) {console.log(template, name, age);}
var myname = " xiangfei";
var getAge = function () { return 23;}
test`${myname} ,my age is ${getAge()}` * test 模版调用不要 加括号。
原理：是整个 模版会根据参数 ，切成个 对应数量的数组，放到方法的第一个参数里去
arr[0] = 第一个表达式之前的字符串 =" "
arr[1] = 第一个表达式和第二个表达式之间的字符串 = "，age is"
arr[2] = 第二个表达式 和最后的表达式的字符串 =" "
参数类型： 在参数名称后面使用冒号来指定参数的类型
var name :string = "xiangfei ";
name = 13 ; // 浏览器提示标红：类型不对，但是编译以后的js 可以正常执行， 因为js 没有 强制 指定变量类型 一说。
参数类型：string、any（可以对变量设置任意类型的值 ）、number、boolean、Array、void、Enum（num类型是为了给一个数字集合更友好地命名）
声明函数返回值的
function test():void{} // 说明test 函数不需要 返回值，如果返回会报错
function test():string{} //return ""
给函数参数变量声明：
function test(name:string):string{ return ""}
test("12"); // 参数只能是字符串
自定义 声明类型
class Person {
name:string,
age:number
}
var zhangsan:Person = new Person();
zhangsan.age =12;
默认类型： 在参数声明后面用等号来指定参数的默认值
function test（a :string="jojo"){}
可选参数：在方法的参数声明后面用问号来标明此参数为可选参数（需要注意的是 ，一个必须填的参数 不能在可选的参数后面）
function test(a :string,b?:string,c:string="jojx"){}
? 对应的参数可不传， 调用test('33'); = a的参数
函数新特性
Rest and Spread 操作符：用来声明任意数量的方法参数
function fun(...arg){
args.forEach(function(arg){
console.log(arg)
})
}
...arg 实际上是个数组，可以传任意数量
fun(1,2,3);
generator 函数 ：控制函数的执行过程，手工暂停和恢复代码执行
yeild 就像一个断点一样，随时刹车。随时开车。
这个特性ts 暂时不支持，可通过babel 编辑器查看效果
function* dor(){
console.log(“start“）;
yield;
console.log(“finsh");
}
var func = dor();
func.next(); // 程序到这才会 被调起，会逐步停在 yield 的位置，执行yield 之前的代码。
// yield Math.random()*100 // 停住并返回 一个0-100 的随机数
func.next().value() ; // 获取 yield 返回回来的值
应用场景，可以作为 循环的边界条件限制 。
比如 while（true） 的时候， 每循环一次，就停住了。更容易控制代码的暂停和继续执行
懒得手打
destructuring析构表达式：通过表达式 将对象或 数组拆解成任意数量的变量
function strock(){
return {
code :'ibm',
p:{preice1:200}
}
var {code ,p:{preice1}} = strock();
console.log(code ,preice1);
箭头表达式：用来声明匿名函数，消除传统匿名函数的this指针问题 .
var arr = [1,2,3];
console.log(arr.filter(value=>value %2 ==0));
for of 和for in 唯一一点不同的地方， for of 可以 被break 打断
面向对象特性：
类是ts 的可信，使用ts开发，大部分代码都是写在类里面的。
class Per {
constructor(public name: string) {} // 此处也声明了 name
public name; //默认的，公开属性
private age; // 私有的，只有在类的内部可以访问
protected haha; //受保护的，可以在内部 和类的子类可以访问
eat(){}
}
new Per("haha");
class Yee extends Per{
constructor(name:string,code:string){
super(name); //super 有两个用法，
第一个是调父类的函数， 如果实例化 Yee 的时候，子类的构造函数，必须调用父类的构造函数，硬性规定。
第二个 调父类的其他方法， super.eat
}
} // 继承了Per ， 就拥有了Per 所有的属性和方法
泛型（generic)
参数化的类型，一般用来限制集合的内容
var workes: Array<Per> = [];
workes[0] = new Per("ceshi");
console.log(workes)
// Per 就是Array 的泛型，规定了这个数组 只能放Per的数据，也可以放Per 的子类
接口（Interface）: 用来建立某种代码约定，使得其它开发者在调用某个方法或创建新的类时 必须遵循接口所定义的代码约定
两个方法：
Interface ：声明一个接口
implements :用来声明某一个类，实现了某一个接口
interface IPerson {
name: string,
age: number
eat();
}
class Person {
constructor(public config: IPerson){
//constructor 方法的 config 参数的 IPerson 类型声明
}
}
var p1 = new Person({ name: 'zs', age: 18})
//实例化Person 的时候， 如果多传或者少传一个参数，或传入不符合接口声明的 ，都会 报错，按照接口规定来 传参
如果接口声明 定义
interface IPerson {
eat();
}
class Person implements IPerson{
eat( console.log(111) )
}
// 泛型里声明了，那implements 泛型的class 里都要 调用一次这个方法
注解（annotation）：注解为程序的严肃（类、方法、变量）加上更直观更名了的说明，这些说明信息与程序的业务逻辑无关，而是供指定的工具或框架使用的。
类型定义文件（*.d.ts)
类型定义文件用来帮助开发者在t s 中使用已有的js 的工具包 ，比如 模块方式的 报漏的jquery。 文件名：*.d.ts
去ts 的github 里下载jquery。
网友评论