自动拆分字符串
function test(templage, name, age) {
console.log(templage);// ["hello,my name is ", ",i am ", ""]
console.log(name);// Aaayang
console.log(age);// 18
}
var myname = 'Aaayang';
var getAge = function() {
return 18;
};
test`hello,my name is ${myname},i am ${getAge()}`;
参数类型
// 参数类型:在参数名称后面使用冒号来指定参数的类型
var myname: string = "Aaayang";
myname = "Bbb";
// 类型推断机制
var alias = "Jiangjun";
// 推断这里应该是字符串,赋值数字会报错
alias = 'a';
// 任意类型
var aaa: any = "Doudou";
// aaa赋值啥都行
aaa = 13;
var age: number = 13;
var man: boolean = true;
// 不需要任何返回值
function test() :void {
}
// 要返回string
function test2() :string {
return "";
}
function test3(name: string) :string {
return "";
}
// 只能传字符串
test3('aaa');
// 自定义类型
class Person {
name: string;
age: number;
}
var zhangsan: Person = new Person();
zhangsan.name = "zhangsan";
zhangsan.age = 18;
参数默认值
var myname: string = "Aaayang";
// 注意带默认值的参数要声明在后面
function test(a:string, b:string, c:string = 'Doudou') {
console.log(a);
console.log(b);
console.log(c);
}
// 正常只有传3个参数才不会报错,第三个参数有默认值,这里传2个也行
test('111', '222', '333');
test('xxx', 'yyy');
可选参数
var myname: string = "Aaayang";
// 注意可选参数必须声明在必选参数的后面
function test(a:string, b?:string, c:string = 'Doudou') {
console.log(a);
console.log(b);
console.log(c);
}
// 正常只有传3个参数才不会报错,第三个参数有默认值,这里传2个也行
test('xxx');// xxx,undefined,Doudou
test('aaa', 'bbb');// aaa,bbb,Doudou
test('111', '222', '333');// 111,222,333
Rest and Spread
// 把任意数量参数转为数组
function func1(...args) {
args.forEach(function(arg) {
console.log(arg);
});
}
func1('a', 'b', 'c', 'd');
// 把任意数量参数转为数组
function func1(a, b, c) {
console.log(a);
console.log(b);
console.log(c);
}
var args = [1, 2];
func1(...args);// 1,2,undefined
var args2 = [6, 7, 8, 9];// 6,7,8
func1(...args2);
Generator方法
function* doSomething() {
console.log("start");
yield;
console.log("finish");
}
var func1 = doSomething();
func1.next();// start
func1.next();// finish
yield写法研究
function* getStockPrice(stock) {
while(true) {
yield Math.random() * 100;// ??
}
}
var priceGenerator = getStockPrice("IBM");
var limitPrice = 15;
var price = 100;
while(price > limitPrice) {
price = priceGenerator.next().value;
console.log(`the generator return ${price}`);
}
console.log(`buying at ${price}`);
解构赋值
function getStock() {
return {
code: "IBM",
price: 100
}
}
// var stock = getStock();
// var code = stock.code;
// var price = stock.price;
var {code, price} = getStock();
var {code: codex, price} = getStock();
console.log(code);// IBM
console.log(codex);// IBM
console.log(price);
箭头函数
// 单行
var sum = (arg1, arg2) => arg1 + arg2;
console.log(sum(1, 2));
// 多行
var sum2 = (arg1, arg2) => {
var result = arg1 + arg2;
console.log(result);
}
sum2(3, 4);
var sum3 = () => {
console.log('无参数的');
}
sum3();
var sum4 = arg1 => {
console.log(`只有一个参数也是不需要写括号的${arg1}`);
}
sum4('Aaayang');
var myArray = [1, 2, 3, 4, 5];
var aaa = myArray.filter(item => item % 2 == 0);
console.log(aaa);
箭头函数中的this
// 正常写
function getStock(name:string) {
this.name = name;
setInterval(function() {
console.log("my name is " + this.name);
}, 1000);
}
var stock = new getStock('Aaayang');// my name is
// 箭头函数写法
function getStock2(name:string) {
this.name = name;
setInterval(() => {
console.log("my name is " + this.name);
}, 1000);
}
var stock2 = new getStock2('Aaayang');// my name is Aaayang
forEach, for in, for of
var myArray = [1, 2, 3, 4];
myArray.desc = "four number";// tsc编译会报错,便宜JS是可以执行的
// forEach会忽略desc,不能用break跳出循环
myArray.forEach(value => console.log(value));
// desc属性也会被循环
for(var n in myArray) {
// console.log(n);// 0, 1, 2, 3, desc
console.log(myArray[n]);// 1, 2, 3, 4, four number
}
// 可以break,forEach一样不会循环desc
for(var n of myArray) {
if(n > 2) break;
console.log(n);
}
类
class Person {
name;// 默认public
// private name;// 私有的
// protected name;// 内部和子类可以访问
eat() {
console.log("i am eating");
}
}
var p1 = new Person();
p1.name = "Aaayang";
p1.eat();
var p2 = new Person();
p2.name = "Jiangjun";
p2.eat();
构造函数
class Person {
/*constructor(public name: string) {
}*/
// 和上面等价
constructor(name: string) {
this.name = name;
}
name;
eat() {
console.log(this.name);
}
}
var p1 = new Person('Aaayang');// 必须传参
p1.name = "Aaayang";
p1.eat();
继承
class Person {
constructor(public name: string) {
console.log('haha');
}
name;
eat() {
console.log('i am eating');
}
}
class Employee extends Person {
constructor(name: string, code: string) {
super(name);// 子类的构造函数必须调用父类的构造函数
console.log('xixi');
this.code = code;
}
code: string;
work() {
super().eat();// 调用方法
this.doWork();
}
private doWork() {// e1.doWork()不让直接干活,规定先吃饭再干活
console.log('do work');
}
}
var e1 = new Employee("Aaayang", "1");
e1.work();
泛型
...
接口
interface IPerson {
name: string;
age: number;
}
class Person {
// 接口:作为方法的参数的类型声明
constructor(public config: IPerson) {
}
}
var p1 = new Person({
name: "Aaayang",
age: 18
});
interface Animal {
eat();
}
class Sheep implements Animal {
eat() {
// 类必须要实现接口对应的方法
console.log('i eating grass');
}
}
模块
a.ts
export var prop1;
export function func1() {
}
export class Class1 {
}
index.ts
import {prop1, func1, Class1} from "./a";
注解
类型定义文件
// 在TypeScript中使用已有的工具包
// from github "DefinitelyTyped"
*.d.ts