迹忆客 专注技术分享

TypeScript 有一个内置函数 filter() 从数组中过滤掉元素，创建一个新数组或给定数组的子集。

它接受一个谓词或 callback 函数，该函数贯穿每个数组元素。那些通过测试的元素由 filter() 方法返回到新数组中。

TypeScript 中 Filter 函数的语法

filter 函数的语法因使用箭头函数或 function 关键字而异。但是，一般语法保持不变。

filter(callbackFn, thisObj);

参数是 callbackFn，一个谓词函数，用于根据特定条件测试元素是否存在于结果数组中。thisObj 是执行 callbackFn 时用作 this 的值。

该数组具有 filter 原型以返回结果数组。

var result = array.filter((element) => {...});
var result = array.filter((element, index) => {...});
var result = array.filter((element, index, arr) => {...});

var result = array.filter(function(element){...});
var result = array.filter(function(element, index){...});
var result = array.filter(function(element, index, arr){...});

callbackFn 接受三个参数，element、index 和 arr，其中 index 和 arr 是可选的。

element 表示传递给 callbackFn 的当前元素，index 是数组中元素的当前索引。

同时，如果需要，arr 字段是数组本身，以防任何内联修改。

在 TypeScript 中使用 Filter 函数过滤元素

filter 函数可以过滤掉数组中的某些元素。

var numbers : number[] = [ 23, 44, 56, 2,  78, 21, 90, 3];

var result = numbers.filter( (num) => num % 2 == 0 );
console.log(result);

输出：

[44, 56, 2, 78, 90] 

在 TypeScript 中使用 Filter 函数搜索数组中的元素

filter 函数还可以搜索数组中的元素。借助搜索查询，可以形成谓词。

var strings : string[] = [ "The hen", "A box", "The sun", "The beach"];
var searchQuery = "The"
var startingWithThe = strings.filter( str => str.indexOf(searchQuery) === 0);
console.log(startingWithThe);

输出：

["The hen", "The sun", "The beach"]

因此以 The 开头的语句已被过滤掉。