是否有一种方法来检查' null '和' undefined ' ?

由于TypeScript是强类型的,简单地使用if () {}来检查nullundefined听起来是不对的。

TypeScript有专门的函数或语法吗?

955358 次浏览

TypeScript有专门的函数或语法糖吗

TypeScript完全理解JavaScript版本something == null

TypeScript会通过这样的检查正确地排除nullundefined

更多的

< a href = " https://basarat.gitbook。io /打印稿/回顾/ null-undefined noreferrer“rel = > https://basarat.gitbook.io/typescript/recap/null-undefined < / >

我总是这样写:

var foo:string;


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

这将会很好,我认为它是非常可读的。

使用杂耍检查,你可以同时测试nullundefined:

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 == null"

"a未定义"

"b == null"

"b === null"

我在typescript操场上做了不同的测试:

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是否为空或未定义
  • 检查(a != null)是否正确,以知道是否定义了a
  • 检查(a)是否错误,以知道a是否被定义
if(data){}

这是卑鄙的数据

  • 未定义的
  • ....
if( value ) {
}

如果value不是,则计算为true:

  • # EYZ0
  • # EYZ0
  • # EYZ0
  • 空字符串''
  • # EYZ0
  • # EYZ0

Typescript包含javascript规则。

你可以使用

if(x === undefined)

如果你正在使用TypeScript,让编译器检查空值和未定义值(或可能存在的)是一个更好的方法,而不是在运行时检查它们。(如果您确实希望在运行时进行检查,那么正如许多答案所示,只需使用value == null)。

使用编译选项strictNullChecks告诉编译器阻塞可能的空值或未定义的值。如果您设置了这个选项,然后在希望允许null和未定义的情况下,您可以将类型定义为Type | null | undefined

所有人,

得票最多的答案,如果你在研究一个对象,就不适用了。在这种情况下,如果属性不存在,检查将不起作用。这就是我们案例中的问题:请看这个例子:

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

如果你想传递tslint而不设置strict-boolean-expressionsallow-null-unionallow-undefined-union,你需要使用nodeutil模块中的isNullOrUndefined或滚动你自己的:

// 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规则很严格时很有用。

你可能想试试

if(!!someValue)

# EYZ0。

解释

第一个!将把表达式转换为boolean值。

如果someValuefalsy,那么!someValue就是true;如果someValue真相,那么false就是false。这可能会让人困惑。

通过添加另一个!,表达式现在是true(如果someValue真相), false(如果someValuefalsy),这更容易管理。

讨论

现在,当像if (someValue)这样的东西会给我相同的结果时,为什么我要用if (!!someValue)来麻烦自己呢?

因为!!someValue是一个布尔表达式,而someValue可以是任何表达式。这种表达式现在可以编写如下函数(上帝,我们需要这样的函数):

isSomeValueDefined(): boolean {
return !!someValue
}

而不是:

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

我希望这能有所帮助。

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

基本上,您有三种不同的情况- null、undefined和未声明,请参阅下面的代码片段。

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

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

// evil-file.ts
// @ts-gnore
console.log(message)
编译器将很高兴只编译上面的代码。 所以,如果你确定所有变量都声明了,你可以简单地这样做

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

上面的代码将检查nullundefined,但是如果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。

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

使用lodash检查value是否为null或未定义可以使用_.isNil()完成。

_.isNil(value)

参数

价值(*):要检查的值。

返回

(布尔):如果值为空则返回true,否则返回false。

例子

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


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


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

链接

Lodash Docs

对于Typescript 2.x.x,你应该用以下方式(使用保护类型):

博士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
}
}

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

value == null ? "UNDEFINED" : value

这一行相当于:

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

特别是当你有很多null检查时,它是一个很好的简短符号。

我有这个问题,一些答案工作只是为了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);
}

在TS中,如果变量没有使用null定义,当您尝试检查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'.

晚加入这个线程,但我发现这个JavaScript黑客在检查一个值是否未定义非常方便

 if(typeof(something) === 'undefined'){
// Yes this is undefined
}
通常我做杂耍检查,芬顿已经讨论了。 为了使它更具可读性,你可以使用ramda中的isNil .

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


totalAmount = isNil(totalAmount ) ? 0 : totalAmount ;

如果你使用本地存储,小心,你可能会以字符串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);
});
});

打字稿3.7中,我们现在有可选的链接Nullish合并同时检查未定义的,示例:

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

这段代码将检查foo是否有定义,否则它将返回undefined

# EYZ0:

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合并,例如:

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

老方法:

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

< >强奖金 # EYZ0 < / p >

更新(2020年9月4日)

您现在可以使用??操作符来验证nullundefined的“值”;并设置默认值。例如:

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

作为一种详细的方式,如果你想比较未定义的的值只有,使用下面的示例代码作为参考:

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()将返回“传入值为:undefined”。注意,我们没有使用严格的等于运算符。

“correct"方法(检查其他答案的细节),如果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"
}

最简单的方法是使用:

# EYZ0

比:

# EYZ0

我们使用帮助器hasValue来检查null /undefined,并通过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;
}




可能太晚了!但是你可以在打印稿中使用??操作符。 看到# EYZ0 < / p >

简单的答案

计算是否值为nullundefined0false""NaN:

if ( value )
or
if ( !!value )

对于否定条件句:

if ( !value )

只测试nullundefined:

if ( value == null )

更详细的回答

如果值不是: nullundefinedNaNempty string ''0false
,它将计算为真正的 如果值为nullundefinedNaNempty string0,或false,将转到其他的条件
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');
}

如果你想要一个消极的条件,那么你需要使用:

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');
}

它将计算value是否为nullundefined

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

4 -使用布尔条件行不通。
如果值为nullundefined0empty stringNaN
,则将计算为真正的 这两个条件都会转到其他的条件。

. if value是一个布尔变量
if ( value==true ) {
} else {
}
if ( value==false ) {
} else {
}

您可以使用三元运算符和新的空合并运算符轻松做到这一点。

首先:使用三元来检查它是否为真。如果是,则返回false,因此If语句不会运行。

第二:因为现在知道值是假的,所以如果值为空,可以使用空合并运算符返回true。由于它将为任何其他值返回自身,如果它不为null,则将使if语句正确失败。

let x = true;
console.log("starting tests")


if (x?false:x ?? true){
console.log(x,"is nullish")
}


x = false
if (x?false:x ?? true){
console.log(x,"is nullish")
}


x = 0;
if (x?false:x ?? true){
console.log(x,"is nullish")
}


x=1;
if (x?false:x ?? true){
console.log(x,"is nullish")
}


x="";
if (x?false:x ?? true){
console.log(x,"is nullish")
}


x="hello world";
if (x?false:x ?? true){
console.log(x,"is nullish")
}


x=null;
if (x?false:x ?? true){
console.log(x,"is nullish")
}


x=undefined;
if (x?false:x ?? true){
console.log(x,"is nullish")
}

试试这个,使用!!操作符和变量。

let check;
if (!!check) {
console.log('check is not null or not undefined');
} else {
console.log('check is  null or  undefined');
}
这在Angular中非常有用。
检查任意变量undefinednull

你可以用:

if (!!variable) {}

它等于写作

it (variable != null && variable != undefined) {}