TypeScript,——strictNullChecks模式。
假设我有一个可空字符串数组(string | null)[]。什么是单表达式的方式,以这样的方式删除所有的空值,结果有类型字符串[]?
const array: (string | null)[] = ["foo", "bar", null, "zoo", null];
const filterdArray: string[] = ???;
数组中。过滤器在这里不起作用:
// Type '(string | null)[]' is not assignable to type 'string[]'
array.filter(x => x != null);
数组推导式可以工作,但TypeScript不支持。
实际上,这个问题可以推广为通过从联合中删除具有特定类型的项来过滤任何联合类型的数组的问题。但是让我们关注带有null和可能未定义的联合,因为这些是最常见的用例。
如果您已经使用了Lodash,您可以使用compact。
或者,如果你喜欢Ramda, Ramda的附属品也有紧凑的功能。
两者都有类型,所以您的tsc会很高兴,并得到正确的类型。
从Lodash d.ts文件:
/**
* Creates an array with all falsey values removed. The values false, null, 0, "", undefined, and NaN are
* falsey.
*
* @param array The array to compact.
* @return Returns the new array of filtered values.
*/
compact<T>(array: List<T | null | undefined | false | "" | 0> | null | undefined): T[];
为了避免每个人都不得不一遍又一遍地编写相同类型的保护helper函数,我将称为isPresent, isDefined和isfill的函数绑定到一个helper库:https://www.npmjs.com/package/ts-is-present
当前类型定义为:
export declare function isPresent<T>(t: T | undefined | null): t is T;
export declare function isDefined<T>(t: T | undefined): t is T;
export declare function isFilled<T>(t: T | null): t is T;
你可以这样使用:
import { isDefined } from 'ts-is-present';
type TestData = {
data: string;
};
const results: Array<TestData | undefined> = [
{ data: 'hello' },
undefined,
{ data: 'world' }
];
const definedResults: Array<TestData> = results.filter(isDefined);
console.log(definedResults);
当Typescript捆绑这个功能时,我将删除这个包。但是,现在,享受吧。
或者您可以尝试包:@p4ck93/ts-is
https://www.npmjs.com/package/@p4ck493/ts-is
示例使用CDN方法,但是包也支持typescript。
<script>var exports = {};</script>
<script src="//unpkg.com/@p4ck493/ts-is@3.0.1/dist/index.js"></script>
<script>
const {is} = exports;
console.log('is.string: ', is.string('')); // true
console.log('is.string.empty: ', is.string.empty('')); // true
console.log('is.string.not.empty: ', is.string.not.empty('')); // false
const array = ["foo", "bar", null, "zoo", null];
const filterdArray = array.filter(is.string.not.empty);
console.log('array:', array);
console.log('filterdArray:', filterdArray);
</script>
UPD
或打字稿:
Import {is} from '@p4ck493/ts-is';
Const array = ["foo", "bar", null, "zoo", null];
const filterdArray = array.filter(is.string.not.empty);
/**
选择:
array.filter (is.not.null);
array.filter (is.not.empty);
array.filter (is.string);
* * /