TypeScript 常用方法简述

@TypeScript 常用方法简述

Record

定义一个简单的map ,由key-value组成。

例如: 
type  hero= {
      age: number ,
     name: string
}
构建一个map方便的装载hero型数据
public heroMap:Record<number,hero>

filter

Array.filter()是内置的TypeScript函数,该函数用于创建一个新数组。

内置方法;
filter(predicate: (value: T, index: number, array: T[]) => unknown, thisArg?: any): T[];
使用说明:
array.filter(predicate, thisArg)
参数:此方法接受下面提到和描述的两个参数:
predicate:此参数是要测试每个元素的功能。
thisArg:此参数是执行回调时用作此对象的Object。
例子:
type item={
    age:number,
    name:string
}
//班级1
let class1:Array<item>=[{age:10,name:"一班1号"},{age:8,name:"一班2号"},{age:12,name:"一班3号"},{age:16,name:"一班4号"}];
//班级2
let class2:Array<item>=[{age:10,name:"二班1号"},{age:8,name:"二班2号"},{age:12,name:"二班3号"}];
//找到班级1年纪大于10岁的同学
let check1=class1.filter(_=>_.age>10);
console.log("check1",check1);
//找到班级1年纪比 班级2中3号同学年纪还小的同学
let check2=class1.filter((item)=>{
    let mate2=class2[2];
    return item.age<mate2.age;
});
console.log("check2",check2);

map

map() 方法返回一个由原数组中的每个元素调用一个指定方法后的返回值组成的新数组。

array.map(callbackfn,thisArg)
map<U>(callbackfn: (value: T, index: number, array: T[]) => U, thisArg?: any): U[];
callbackfn  原数组中的元素经过该方法后返回一个新的元素
thisArg 执行 thisArg 函数时 this 指向的对象。
type newBody={
    age:number,
    name:string,
    school:string
}
//返回新的班级结构
//此时的class3的类型是newBody[]
let class3 = class1.map(_ => {
    let str:newBody={
        age:_.age,
        name:_.name,
        school:"希望小学"
    };
    return str;
});
console.log("class3",class3);
//取出年纪作为新的数组
//此时的class4的类型是number[]
let class4 = class1.map(_ => {
    let str=_.age;
    return str;
});
console.log("class4",class4);

some

some() 方法测试数组中的某些元素是否通过了指定函数的测试。

arr.some(predicate, thisArg)
some(predicate: (value: T, index: number, array: T[]) => unknown, thisArg?: any): boolean;
 predicate
用来测试每个元素的函数。
thisArg
执行 callback 时使用的 this 值。
//找到年纪大于11岁的同学,找到就结束遍历
let result1= class1.some((_)=>{
    console.log("年龄",_.age)
     if(_.age>11){
        return true
     }
})
console.log("result1",result1)

assign

Object.assign() 方法用于把一个或多个源对象的可枚举属性值复制到目标对象中,返回值为目标对象。

Object.assign(target, ...sources)
target: 目标对象
sources: 源对象
type type1={
    age:number,
    name:string,
    six:string,
}
type type2={
    age:number,
    height:number
}
let grad1:type1={age:1,name:"lila",six:"男"}
let grad2:type2={age:1,height:100}
//合并两种类型的数据 bind 类型是 type1 & type2
let bind=Object.assign(grad1,grad2);
console.log("bind",bind)

includes

es6中新增的字符串方法includes()方法简化判断,indexOf()返回的是包含字符串的位置,如果 == -1的话,那也就是不包含这个字符串了,而includes()方法返回的是布尔值,也就是true和false

reduce

相当于计算积累的函数,.reduce()方法的回调需要两个参数:累加器和当前值。累加器将是第一个参数,是“向下传递”值。

 reduce(callbackfn: (previousValue: T, currentValue: T, currentIndex: number, array: T[]) => T, initialValue: T): T;
let age = [10, 14, 15, 17, 20];
//计算年龄总和 ,0(传入值)+10+14.......
let total = age .reduce((total,donation)=> {
return total + donation;
}, 0);

泛型 T

实例
//构建一个可以返回任意需要类型的方法
// 如果 test改成 test< T extends boolean|number> 这里是对传入类型做一定限制
async test<T>(){
    return new Promise<T>((res,rej)=>{
        let x : T;
         res(x)
        });
}
  async test1(){
      //这个时候传啥类型就返回啥类型 
        let y = await this.test<boolean>(); //返回 boolean
        let y2 = await this.test<number>(); //返回 number
   }
}

你可能感兴趣的:(typescript,javascript,前端)