All fields in JavaScript (and in TypeScript) can have the value null or undefined.
You can make the field optional which is different from nullable.
interface Employee1 {
name: string;
salary: number;
}
var a: Employee1 = { name: 'Bob', salary: 40000 }; // OK
var b: Employee1 = { name: 'Bob' }; // Not OK, you must have 'salary'
var c: Employee1 = { name: 'Bob', salary: undefined }; // OK
var d: Employee1 = { name: null, salary: undefined }; // OK
// OK
class SomeEmployeeA implements Employee1 {
public name = 'Bob';
public salary = 40000;
}
// Not OK: Must have 'salary'
class SomeEmployeeB implements Employee1 {
public name: string;
}
Compare with:
interface Employee2 {
name: string;
salary?: number;
}
var a: Employee2 = { name: 'Bob', salary: 40000 }; // OK
var b: Employee2 = { name: 'Bob' }; // OK
var c: Employee2 = { name: 'Bob', salary: undefined }; // OK
var d: Employee2 = { name: null, salary: 'bob' }; // Not OK, salary must be a number
// OK, but doesn't make too much sense
class SomeEmployeeA implements Employee2 {
public name = 'Bob';
}
Answer from Ryan Cavanaugh on Stack OverflowAll fields in JavaScript (and in TypeScript) can have the value null or undefined.
You can make the field optional which is different from nullable.
interface Employee1 {
name: string;
salary: number;
}
var a: Employee1 = { name: 'Bob', salary: 40000 }; // OK
var b: Employee1 = { name: 'Bob' }; // Not OK, you must have 'salary'
var c: Employee1 = { name: 'Bob', salary: undefined }; // OK
var d: Employee1 = { name: null, salary: undefined }; // OK
// OK
class SomeEmployeeA implements Employee1 {
public name = 'Bob';
public salary = 40000;
}
// Not OK: Must have 'salary'
class SomeEmployeeB implements Employee1 {
public name: string;
}
Compare with:
interface Employee2 {
name: string;
salary?: number;
}
var a: Employee2 = { name: 'Bob', salary: 40000 }; // OK
var b: Employee2 = { name: 'Bob' }; // OK
var c: Employee2 = { name: 'Bob', salary: undefined }; // OK
var d: Employee2 = { name: null, salary: 'bob' }; // Not OK, salary must be a number
// OK, but doesn't make too much sense
class SomeEmployeeA implements Employee2 {
public name = 'Bob';
}
To be more C# like, define the Nullable type like this:
type Nullable<T> = T | null;
interface Employee{
id: number;
name: string;
salary: Nullable<number>;
}
Bonus:
To make Nullable behave like a built in Typescript type, define it in a global.d.ts definition file in the root source folder. This path worked for me: /src/global.d.ts
I have had this dilemma for some time now while making an app using Create-React-App with Typescript. My colleague came up with this idea and i have no idea which is better to use. I don't think one is better for performance but i would like to know which is more used in general.
Both variations work flawlessly but i would like to know which one you prefer more.
Typescript resolved that the newPerson.name has type of "null" since you put null there. The best way to get arround it is to be as specific as possible. If you want to allow null value and string, create an interface that says so:
interace Person {
name: string | null;
birthdate: Date | null;
}
let newPerson: Person = { ... }
This is most explicit. Probably better way is to use undefined instead of null. Then you can use just optional parameter:
interace Person {
name?: string;
birthdate?: Date;
}
It's worth noting that if you enable all of the strict checks in your tsconfig, you cannot pass null to a property defined as string. And that is a good thing, you don't want to see any "Cannot read property 'length' of null" erro message.
You can tell typescript that name should be a string.
let newPerson = {
name: <string>null,
birthdate: null
}
It would be even better to have a Person interface.
interace Person {
name: string;
birthdate: Date;
}
let newPerson: Person = {
name: null,
birthdate: null
};