TypeScript는 강력하게 형식화되어 있으므로 간단히 if () {}확인 null하고 undefined소리가 나지 않습니다.

TypeScript에 전용 함수 또는 구문 설탕이 있습니까?

저글링 검사를 사용하면 모두를 테스트 할 수 null및 undefined1 안타에 :

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"

if( value ) {
}

true그렇지 value않은 경우 다음과 같이 평가됩니다 .

• null
• undefined
• NaN
• 빈 문자열 ''
• 0
• false

typescript에는 자바 스크립트 규칙이 포함됩니다.

TypeScript에 전용 함수 또는 구문 설탕이 있습니까?

TypeScript는 JavaScript 버전 인을 완전히 이해합니다 something == null.

TypeScript는 이러한 검사 null와 undefined함께 모두 올바르게 배제 합니다.

더

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

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가 null인지 정의되지 않았는지 확인
• (a! = null)이 a인지 정의되어 있는지 확인
• (a)가 a인지 정의되어 있지 않은지 확인

이 답변에 업데이트가 필요하다고 생각합니다. 이전 답변의 편집 기록을 확인하십시오.

기본적으로 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
}

위의 코드는 null및 을 확인 undefined하지만 message변수가 선언되지 않은 경우 (안전을 위해) 다음 코드를 고려할 수 있습니다

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

참고 : 여기의 순서 typeof(message) !== 'undefined' && message !== null는 undefined@Jaider 덕분에 상태를 먼저 확인 해야하는 것이 매우 중요합니다 message != null.

에서 타이프 3.7 우리가 지금 가지고있는 옵션 체인 및 Nullish 합체 확인 널 (null)을 하고 정의되지 않은 같은 시간을, 예를 들면 :

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();

시도하고 싶을 수도 있습니다

if(!!someValue)

로 !!.

설명

첫 번째 !는 표현을 boolean가치 로 바꿉니다.

그런 다음 !someValue인 true경우 someValue입니다 falsy 하고 false있는 경우 someValue입니다 truthy . 혼란 스러울 수 있습니다.

또 다른를 추가함으로써 !, 표현 지금 true경우 someValue입니다 truthy가 하고 false있는 경우 someValue입니다 falsy 관리하기가 훨씬 용이하다.

토론

자, 왜 같은 결과가 나에게 같은 결과를 주었을 if (!!someValue)때 스스로 고민하지 if (someValue)않습니까?

때문에 !!someValue부울 식을 정확하게 반면, someValue절대적으로 아무것도 될 수 있습니다. 이런 종류의 표현은 이제 다음과 같은 함수 (그리고 우리가 필요로하는 신)를 작성하는데 낮을 것입니다.

isSomeValueDefined(): boolean {
  return !!someValue
}

대신에:

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

도움이 되길 바랍니다.

들어 Typescript 2.x.x당신은 다음과 같은 방법으로 그것을해야 (사용 유형 가드 ) :

tl; dr

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

if(data){}

의미합니다! 데이터

• 없는
• 찾으시는 주소가 없습니다
• 그릇된
• ....

TypeScript를 사용하는 경우 런타임에 검사하지 않고 컴파일러에서 null 및 undefined (또는 그 가능성)를 검사하도록하는 것이 더 나은 방법입니다. (런타임에 확인하려면 많은 답변이 나타내는 것처럼을 사용하십시오 value == null).

컴파일 옵션 strictNullChecks을 사용하여 가능한 널 또는 정의되지 않은 값을 숨길 수 있도록 컴파일러에 지시하십시오. 이 옵션을 설정 한 다음 상황이 있으면 않는 널 (null)을 허용하고 정의되지 않은하려면, 당신은 유형을 정의 할 수 있습니다 Type | null | undefined.

당신이 전달하려는 경우 tslint설정하지 않고 strict-boolean-expressions로 allow-null-union또는 allow-undefined-union, 당신은 사용해야 isNullOrUndefined에서 node의 ' 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 규칙이 엄격한 경우 유용합니다.

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해당 검사 할 때 | 컴파일러가 불평합니다.nulltslint

//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
 }

일반적으로 Fenton이 이미 설명한 것처럼 저글링 검사를 수행합니다 . 더 읽기 쉽도록 ramda에서 isNil 을 사용할 수 있습니다 .

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

totalAmount = isNil(totalAmount ) ? 0 : totalAmount ;

비교하려는 경우 자세한 방법으로, 널 (null) 과 정의되지 않은 값 만 , 참조를 위해 다음 예제 코드를 사용 :

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() "들어오는 값 : 정의되지 않음"을 반환합니다. 우리는 strict equals 연산자를 사용하지 않습니다.

"올바른"방법 (자세한 내용은 다른 답변을 확인하십시오) incomingValue이 boolean유형 이 아닌 경우 해당 값이 true인지 평가하면 상수 / 변수 유형에 따라 평가됩니다. 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"
}

당신이 사용할 수있는

if(x === 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

TypeScript는 ES6 JavaScript의 형식화 된 슈퍼 세트이므로 lodash는 자바 스크립트 라이브러리입니다.

lodash를 사용하여 value가 null인지 또는 undefined인지 확인하면를 사용하여 수행 할 수 있습니다 _.isNil().

_.isNil(value)

인수

값 (*) : 확인할 값입니다.

보고

(boolean) : 값이 null이면 true를 반환하고, 그렇지 않으면 false를 반환합니다.

예

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

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

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

링크

Lodash Docs

로컬 저장소를 사용하는 경우 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);
  });
});

나는 항상 다음과 같이 씁니다.

var foo:string;

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

이것은 잘 작동하며 읽을 수 있다고 생각합니다.