TypeScript是一种由微软开发的自由和开源的编程语言。它是JavaScript的一个超集,而且本质上向这个语言添加了可选的静态类型和基于类的面向对象编程。
安装TypeScript,安装node.js之后,使用命令:cnpm install -g typescript
自动拆分字符串
function test(template, name, age) {
console.log(template);
console.log(name);
console.log(age);
}
var myname = "james curry";
var getAge = function () {
return 18;
}
test `hello my name is ${myname}, i'm ${getAge()}`
参数类型
var myname: string = "james";
// myname = 13; //报错
var alias = "xixi";
// alias = 12; //报错,类型推断机制
var str : any = "curry";
str = 12;
var age: number = 13;
var man: boolean = true;
function test(name:string): string {//声明返回值类型
return "";
}
class Person{
name: string;
age: number;
}
var zhangsan: Person = new Person();
zhangsan.name = "james";
zhangsan.age = 32;
默认参数
function test(a: string, b: string, c: string = "default") {//带默认值的参数声明在后面
console.log(a);
console.log(b);
console.log(c);
}
test("xx", "yy", "zz");
test("mm","nn");
可选参数
function test(a: string, b?: string, c: string = "default") {//b参数为可选参数,不能在必选参数前面,不用时是undefined
console.log(a);
console.log(b);
console.log(c);
}
test("mm");
Rest and Spread 操作符:
function fun(...args) { //声明任意数量的参数
args.forEach(function (arg) {
console.log(arg);
})
}
fun("a", "b", "c");
fun(1,2,3,4);
第二种用法,这种方法目前tepescript还不支持,但是生成的js不报错
function fun(a,b,c) {
console.log(a);
console.log(b);
console.log(c);
}
var args = [1, 2];
fun(...args);
var args2 = [7, 8, 9, 10];
fun(...args2);
generator函数:
function* getStockPrice(stock){ //通过*号声明generator函数
while(true){
yield Math.random()*100;
}
}
var priceGenertor = getStockPrice("HW");
var limitPrice = 15;
var price = 100;
while(price > limitPrice){
price = priceGenertor.next().value;
console.log(`the generator return ${price}`);
}
console.log(`buying at ${price}`);
destructuring析构表达式:
function getStock() {
return {
code: "ali",
price: {
startPrice: 200,
endPrice:300
},
other:"mm"
}
}
var { code:codec, price:{endPrice} } = getStock(); //本地变量与函数变量名称相同或者声明别名
console.log(codec);
console.log(endPrice);
//针对数组的析构表达式
var arr = [1, 2, 3, 4];
var [, , num3, num4] = arr;
console.log(num3);
console.log(num4);
//与可变参数一起使用
var arr = [1, 2, 3, 4];
var [num1,num2,...others] = arr;
console.log(num1);
console.log(num2);
console.log(others);
var arr = [1, 2, 3, 4];
function test([num1, num2, ...others]) {
console.log(num1);
console.log(num2);
console.log(others);
}
test(arr);
箭头表达式
var arr = [1, 2, 3, 4, 5];
console.log(arr.filter(value => value%2 == 0));
function getStock(name: string) {
this.name = name;
setInterval(function () {
console.log("name is " + this.name);
},1000);
}
var stock1 = new getStock("ali");
function getStock2(name: string) {
this.name = name;
setInterval(() => {
console.log("name is " + this.name);
},1000);
}
var stock2 = new getStock2("hw");
for循环
var arr = [1, 2, 3, 4];
arr.desc = "four number";
arr.forEach(value => console.log(value));
for (var n in arr) {
console.log(arr[n]);
}
//for of循环,可被打断
for (var n of arr) {
if (n > 2) break;
console.log(n);
}
类型定义文件(*d.ts):类型定义文件用来帮助开发者在TypeScript中使用已有的JavaScript的工具包。如:JQuery。类型定义文件从github项目DefinitelyTyped中获取。安装github中typings项目工具。
interface Iperson{
name: string;
age: number;
}
class Person{
constructor(public config: Iperson) {
}
}
var p1 = new Person({
name: "zhangsan",
age:22
});
模块:
a.ts
//导入a.ts中变量
export var prop1;
var prop2;
export function fun1();
function fun2(){
}
export class Clazz1{
}
class Clazz2{
}
b.ts
import {prop1, fun1, Clazz1} from "./a"; //导入a.ts中变量、方法、类
console.log(prop1);
fun1();
new Clazz1();
export function fun3(){
}