typescript - 有没有办法同时检查“null”和“undefined”？

Question

由于 TypeScript 是强类型的，因此仅if () {}用于检查null并undefined听起来不正确。

TypeScript 是否有专门的函数或语法糖呢？

score 524 · Accepted Answer

使用杂耍检查，您可以一键测试null两者undefined：

if (x == null) {

如果您使用严格检查，它只会对设置为的值为null真，对于未定义的变量不会评估为真：

if (x === null) {

您可以使用以下示例尝试使用各种值：

var a: number;
var b: number = null;

function check(x, name) {
    if (x == null) {
        console.log(name + ' == null');
    }

    if (x === null) {
        console.log(name + ' === null');
    }

    if (typeof x === 'undefined') {
        console.log(name + ' is undefined');
    }
}

check(a, 'a');
check(b, 'b');

输出

“一个 == 空”

“a 未定义”

“b == 空”

“b === 空”

score 372 · Accepted Answer

if( value ) {
}

将评估true是否value不是：

null
undefined
NaN
空字符串''
0
false

打字稿包括 javascript 规则。

score 128 · Accepted Answer

在TypeScript 3.7中，我们现在有可选链接 和Nullish Coalescing来同时检查null和undefined，例如：

let x = foo?.bar.baz();

此代码将检查 foo 是否已定义，否则将返回 undefined

旧方式：

if(foo != null && foo != undefined) {
   x = foo.bar.baz();
}

这个：

let x = (foo === null || foo === undefined) ? undefined : foo.bar();

if (foo && foo.bar && foo.bar.baz) { // ... }

使用可选链接将是：

let x = foo?.bar();

if (foo?.bar?.baz) { // ... }

另一个新功能是Nullish Coalescing，例如：

let x = foo ?? bar(); // return foo if it's not null or undefined otherwise calculate bar

老办法：

let x = (foo !== null && foo !== undefined) ?
foo :
bar();

奖金

score 76 · Accepted Answer

TypeScript 是否为此提供了专用的函数或语法糖

TypeScript 完全理解 JavaScript 版本，即something == null.

TypeScript 将通过此类检查正确排除null两者undefined。

更多的

https://basarat.gitbook.io/typescript/recap/null-undefined

score 44 · Accepted Answer

我在打字稿操场上做了不同的测试：

http://www.typescriptlang.org/play/

let a;
let b = null;
let c = "";
var output = "";

if (a == null) output += "a is null or undefined\n";
if (b == null) output += "b is null or undefined\n";
if (c == null) output += "c is null or undefined\n";
if (a != null) output += "a is defined\n";
if (b != null) output += "b is defined\n";
if (c != null) output += "c is defined\n";
if (a) output += "a is defined (2nd method)\n";
if (b) output += "b is defined (2nd method)\n";
if (c) output += "c is defined (2nd method)\n";

console.log(output);

给出：

a is null or undefined
b is null or undefined
c is defined

所以：

检查 (a == null) 是否正确知道 a 是 null 还是 undefined
检查 (a != null) 是否正确知道是否定义了 a
检查 (a) 是否错误以了解是否定义了 a

score 31 · Accepted Answer

你可能想试试

if(!!someValue)

与!!.

解释

第一个!会将您的表达式转换为一个boolean值。

然后!someValue是trueifsomeValue是假的，false如果someValue是真的。这可能会令人困惑。

通过添加另一个!，表达式现在是trueif someValueis truthy和falseif someValueis falsy，这更容易管理。

讨论

if (!!someValue)现在，当类似的东西if (someValue)会给我同样的结果时，我为什么还要打扰自己呢？

因为!!someValue恰好是一个布尔表达式，而someValue绝对可以是任何东西。这种表达式现在可以编写函数（我们需要这些函数），例如：

isSomeValueDefined(): boolean {
  return !!someValue
}

代替：

isSomeValueDefined(): boolean {
  if(someValue) {
    return true
  }
  return false
}

我希望它有所帮助。

score 31 · Accepted Answer

我认为这个答案需要更新，检查旧答案的编辑历史。

基本上，您有三种不同的情况，即 null、undefined 和 undeclared，请参见下面的代码片段。

// bad-file.ts
console.log(message)

你会得到一个错误，说变量message是未定义的（也就是未声明的），当然，Typescript 编译器不应该让你这样做，但真的没有什么能阻止你。

// evil-file.ts
// @ts-gnore
console.log(message)

编译器很乐意只编译上面的代码。因此，如果您确定所有变量都已声明，您可以简单地这样做

if ( message != null ) {
    // do something with the message
}

上面的代码将检查nulland undefined，但如果message变量可能未声明（为了安全），您可以考虑以下代码

if ( typeof(message) !== 'undefined' && message !== null ) {
    // message variable is more than safe to be used.
}

注意：这里的顺序typeof(message) !== 'undefined' && message !== null非常重要，您必须先检查undefined状态，否则它将与相同message != null，谢谢@Jaider。

score 27 · Accepted Answer

因为Typescript 2.x.x您应该通过以下方式进行操作（使用type guard）：

tl;博士

function isDefined<T>(value: T | undefined | null): value is T {
  return <T>value !== undefined && <T>value !== null;
}

为什么？

这样isDefined()会尊重变量的类型，下面的代码会知道考虑到这个检查。

示例 1 - 基本检查：

function getFoo(foo: string): void { 
  //
}

function getBar(bar: string| undefined) {   
  getFoo(bar); //ERROR: "bar" can be undefined
  if (isDefined(bar)) {
    getFoo(bar); // Ok now, typescript knows that "bar' is defined
  }
}

示例 2 - 类型方面：

function getFoo(foo: string): void { 
  //
}

function getBar(bar: number | undefined) {
  getFoo(bar); // ERROR: "number | undefined" is not assignable to "string"
  if (isDefined(bar)) {
    getFoo(bar); // ERROR: "number" is not assignable to "string", but it's ok - we know it's number
  }
}

score 15 · Accepted Answer

15

if(data){}

意思是！数据

无效的
不明确的
错误的
……

于 2017-01-20T12:18:39.820 回答

score 7 · Accepted Answer

更新（2020 年 9 月 4 日）

您现在可以使用??运算符来验证null和undefined“值”并设置默认值。例如：

const foo = null;
const bar = foo ?? 'exampleValue';
console.log(bar); // This will print 'exampleValue' due to the value condition of the foo constant, in this case, a null value

作为一种详细的方式，如果您只想比较null和undefined值，请使用以下示例代码作为参考：

const incomingValue : string = undefined;
const somethingToCompare : string = incomingValue; // If the line above is not declared, TypeScript will return an excepion

if (somethingToCompare == (undefined || null)) {
  console.log(`Incoming value is: ${somethingToCompare}`);
}

如果incomingValue没有声明，TypeScript 应该返回一个异常。如果已声明但未定义，console.log()则将返回“传入值是：未定义”。请注意，我们没有使用严格的等于运算符。

“正确”的方式（查看其他答案以获取详细信息），如果incomingValue不是boolean类型，只需评估其值是否为真，这将根据常量/变量类型进行评估。必须使用分配将true字符串显式定义为字符串= ''。如果不是，它将被评估为false。让我们使用相同的上下文检查这种情况：

const incomingValue : string = undefined;
const somethingToCompare0 : string = 'Trumpet';
const somethingToCompare1 : string = incomingValue;

if (somethingToCompare0) {
  console.log(`somethingToCompare0 is: ${somethingToCompare0}`); // Will return "somethingToCompare0 is: Trumpet"
}

// Now, we will evaluate the second constant
if (somethingToCompare1) {
  console.log(`somethingToCompare1 is: ${somethingToCompare1}`); // Launched if incomingValue is defined
} else {
  console.log(`somethingToCompare1 is: ${somethingToCompare1}`); // Launched if incomingValue is undefined. Will return "somethingToCompare1 is: undefined"
}

score 5 · Accepted Answer

如果您使用的是 TypeScript，那么让编译器检查空值和未定义（或其可能性）是一种更好的方法，而不是在运行时检查它们。（如果您确实想在运行时检查，那么正如许多答案所示，只需使用value == null）。

使用 compile 选项strictNullChecks告诉编译器阻塞可能的 null 或 undefined 值。如果您设置了此选项，然后确实希望允许 null 和 undefined，则可以将类型定义为Type | null | undefined.

score 5 · Accepted Answer

如果您想在tslint不设置strict-boolean-expressionsto allow-null-unionor的情况下通过allow-undefined-union，则需要使用isNullOrUndefinedfromnode的util模块或自己滚动：

// tslint:disable:no-null-keyword
export const isNullOrUndefined =
  <T>(obj: T | null | undefined): obj is null | undefined => {
    return typeof obj === "undefined" || obj === null;
  };
// tslint:enable:no-null-keyword

不完全是语法糖，但当您的 tslint 规则严格时很有用。

score 4 · Accepted Answer

简单的答案

评估值是否为null, undefined, 0, false, "", NaN:

if ( value )
or
if ( !!value )

对于否定条件：

if ( !value )

仅测试null或undefined：

if ( value == null )

更简洁的答案

1-如果 value不是: , , , , ,它将评估为true如果 value 是, , , , , or , 将转到else条件。nullundefinedNaNempty string ''0false
nullundefinedNaNempty string0false

if ( value ) {
  console.log('value is something different from 0, "", false, NaN, null, undefined');
} else {
  console.log('value is 0, "", false, NaN, null or undefined');
}
if ( !!value ) {
  console.log('value is something different from 0, "", false, NaN, null, undefined');
} else {
  console.log('value is 0, "", false, NaN, null or undefined');
}

2-如果你想要一个否定条件，那么你需要使用：

if ( !value ) {
  console.log('value is 0, "", false, NaN, null or undefined');
} else {
  console.log('value is something different from 0, "", false, NaN, null, undefined');
}

3-它将评估价值是null或undefined

if ( value == null ) {
  console.log('is null or undefined');
} else {
  console.log('it isnt null neither undefined');
}

4-使用布尔条件不起作用。如果 value 为, , , , 则
它不会评估为true也不会评估为false , 两个条件都将始终转到else条件。如果 value 是布尔变量，则例外。nullundefined0empty stringNaN

if ( value==true ) {
} else { 
}
if ( value==false ) {
} else { 
}

score 2 · Accepted Answer

最简单的方法是使用：

import { isNullOrUndefined } from 'util';

然后：

if (!isNullOrUndefined(foo))

score 1 · Accepted Answer

可能来晚了！但您可以??在typescript中使用运算符。见https://mariusschulz.com/blog/nullish-coalescing-the-operator-in-typescript

score 1 · Accepted Answer

加入这个线程很晚，但我发现这个 JavaScript hack 在检查值是否未定义时非常方便

 if(typeof(something) === 'undefined'){
   // Yes this is undefined
 }

score 0 · Accepted Answer

检查的更快和更短的符号null可以是：

value == null ? "UNDEFINED" : value

此行等效于：

if(value == null) {
       console.log("UNDEFINED")
} else {
    console.log(value)
}

特别是当你有很多null支票时，这是一个很好的简短符号。

score 0 · Accepted Answer

我们使用一个助手hasValue来检查空值/未定义，并通过 TypeScript 确保不执行不必要的检查。（后者类似于 TS 抱怨的方式if ("a" === undefined)，因为它总是错误的）。

始终使用它总是安全的，不像!val匹配空字符串、零等。它还避免了使用模糊==匹配，这几乎总是一种不好的做法——不需要引入异常。



type NullPart<T> = T & (null | undefined);

// Ensures unnecessary checks aren't performed - only a valid call if 
// value could be nullable *and* could be non-nullable
type MustBeAmbiguouslyNullable<T> = NullPart<T> extends never
  ? never
  : NonNullable<T> extends never
  ? never
  : T;

export function hasValue<T>(
  value: MustBeAmbiguouslyNullable<T>,
): value is NonNullable<MustBeAmbiguouslyNullable<T>> {
  return (value as unknown) !== undefined && (value as unknown) !== null;
}

export function hasValueFn<T, A>(
  value: MustBeAmbiguouslyNullable<T>,
  thenFn: (value: NonNullable<T>) => A,
): A | undefined {
  // Undefined matches .? syntax result
  return hasValue(value) ? thenFn(value) : undefined;
}

score 0 · Accepted Answer

0

您可以使用

if(x === undefined)

于 2017-05-23T07:23:51.197 回答

score 0 · Accepted Answer

如果您使用的是本地存储，请小心，您最终可能会得到字符串 undefined 而不是 undefined 值：

localStorage.setItem('mykey',JSON.stringify(undefined));
localStorage.getItem('mykey') === "undefined"
true

人们可能会发现这很有用：https ://github.com/angular/components/blob/master/src/cdk/coercion/boolean-property.spec.ts

/**
 * @license
 * Copyright Google LLC All Rights Reserved.
 *
 * Use of this source code is governed by an MIT-style license that can be
 * found in the LICENSE file at https://angular.io/license
 */

/** Coerces a data-bound value (typically a string) to a boolean. */
export function coerceBooleanProperty(value: any): boolean {
  return value != null && `${value}` !== 'false';
}

import {coerceBooleanProperty} from './boolean-property';

describe('coerceBooleanProperty', () => {

  it('should coerce undefined to false', () => {
    expect(coerceBooleanProperty(undefined)).toBe(false);
  });

  it('should coerce null to false', () => {
    expect(coerceBooleanProperty(null)).toBe(false);
  });

  it('should coerce the empty string to true', () => {
    expect(coerceBooleanProperty('')).toBe(true);
  });

  it('should coerce zero to true', () => {
    expect(coerceBooleanProperty(0)).toBe(true);
  });

  it('should coerce the string "false" to false', () => {
    expect(coerceBooleanProperty('false')).toBe(false);
  });

  it('should coerce the boolean false to false', () => {
    expect(coerceBooleanProperty(false)).toBe(false);
  });

  it('should coerce the boolean true to true', () => {
    expect(coerceBooleanProperty(true)).toBe(true);
  });

  it('should coerce the string "true" to true', () => {
    expect(coerceBooleanProperty('true')).toBe(true);
  });

  it('should coerce an arbitrary string to true', () => {
    expect(coerceBooleanProperty('pink')).toBe(true);
  });

  it('should coerce an object to true', () => {
    expect(coerceBooleanProperty({})).toBe(true);
  });

  it('should coerce an array to true', () => {
    expect(coerceBooleanProperty([])).toBe(true);
  });
});

score 0 · Accepted Answer

全部，

如果您正在处理一个对象，那么得票最多的答案实际上并不适用。在这种情况下，如果属性不存在，则检查将不起作用。这就是我们案例中的问题：请参阅此示例：

var x =
{ name: "Homer", LastName: "Simpson" };

var y =
{ name: "Marge"} ;

var z =
{ name: "Bart" , LastName: undefined} ;

var a =
{ name: "Lisa" , LastName: ""} ;

var hasLastNameX = x.LastName != null;
var hasLastNameY = y.LastName != null;
var hasLastNameZ = z.LastName != null;
var hasLastNameA = a.LastName != null;



alert (hasLastNameX + ' ' + hasLastNameY + ' ' + hasLastNameZ + ' ' + hasLastNameA);

var hasLastNameXX = x.LastName !== null;
var hasLastNameYY = y.LastName !== null;
var hasLastNameZZ = z.LastName !== null;
var hasLastNameAA = a.LastName !== null;

alert (hasLastNameXX + ' ' + hasLastNameYY + ' ' + hasLastNameZZ + ' ' + hasLastNameAA);

结果：

true , false, false , true (in case of !=)
true , true, true, true (in case of !==) => so in this sample not the correct answer

plunkr 链接：https ://plnkr.co/edit/BJpVHD95FhKlpHp1skUE

score 0 · Accepted Answer

通常我会像芬顿已经讨论过的那样做杂耍检查。为了使其更具可读性，您可以使用ramda中的 isNil。

import * as isNil from 'ramda/src/isNil';

totalAmount = isNil(totalAmount ) ? 0 : totalAmount ;

score 0 · Accepted Answer

我遇到了这个问题，其中一些答案工作得很好，JS但不是因为TS这就是原因。

//JS
let couldBeNullOrUndefined;
if(couldBeNullOrUndefined == null) {
  console.log('null OR undefined', couldBeNullOrUndefined);
} else {
  console.log('Has some value', couldBeNullOrUndefined);
}

这一切都很好，因为 JS 没有类型

//TS
let couldBeNullOrUndefined?: string | null; // THIS NEEDS TO BE TYPED AS undefined || null || Type(string)

if(couldBeNullOrUndefined === null) { // TS should always use strict-check
  console.log('null OR undefined', couldBeNullOrUndefined);
} else {
  console.log('Has some value', couldBeNullOrUndefined);
}

null在 TS 中，如果当您尝试检查null该变量时未定义变量tslint| 编译器会抱怨。

//tslint.json
...
"triple-equals":[true],
...

 let couldBeNullOrUndefined?: string; // to fix it add | null

 Types of property 'couldBeNullOrUndefined' are incompatible.
      Type 'string | null' is not assignable to type 'string | undefined'.
        Type 'null' is not assignable to type 'string | undefined'.

score -1 · Accepted Answer

因为 TypeScript 是 ES6 JavaScript 的类型化超集。lodash 是一个 javascript 库。

使用 lodash 检查 value 是 null 还是 undefined 可以使用_.isNil().

_.isNil(value)

论据

值(*)：要检查的值。

退货

(boolean) : 如果值为 null，则返回 true，否则返回 false。

例子

_.isNil(null);
// => true

_.isNil(void 0);
// => true

_.isNil(NaN);
// => false

关联

Lodash 文档

score -6 · Accepted Answer

我总是这样写：

var foo:string;

if(!foo){
   foo="something";    
}

这会很好，我认为它非常易读。

typescript - 有没有办法同时检查“null”和“undefined”？

25 回答 25

更多的

简单的答案

更简洁的答案

论据

退货

例子

关联

Related

Reference