What is the logic behind the TypeScript error "The operand of a 'delete' operator must be optional"?

user_2761641 0
Viewed 117111

This is the new error that is coming in typescript code.

I am not able to realize the logic behind it
Documentation

/*When using the delete operator in strictNullChecks, 
the operand must now be any, unknown, never, or be optional 
(in that it contains undefined in the type). Otherwise, use of the delete operator is an error.*/

interface Thing {
  prop: string;
}

function f(x: Thing) {
  delete x.prop; // throws error = The operand of a 'delete' operator must be optional.
}
typescript javascript
6 Answers

I am not able to realize the logic behind it

The logic as I understand is the following:

Interface Thing is a contract asking to have a (non-null, non-undefined) prop as a string.

If one removes the property, then the contract is not implemented anymore.

If you want it still valid when removed, just declare it as optional with a ?: prop?: string

I'm actually surprised that this was not causing error in earlier versions of TypeScript.

user_4792510

The logic behind of this, is that you need to implement your interface with an optional property like this:

interface Thing {
  prop?: string;
}
// OR
interface Thing {
  prop: string | undefined;
}

function f(x: Thing) {
  delete x.prop; 
}

So the interface's contract won't be broken.

user_98105480

Quick fix

You could change the type of x to a partial:

function f(x: Partial<Thing>) {
  delete x.prop;
}

But I don't usually like to mutate (modify) objects which have been passed to me from possibly unknown code. So I would usually make a new object instead:

function f(x: Thing) {
  const y = { ...x } as Partial<Thing>;
  delete y.prop;
}

Since Partial makes all the properties optional, this will allow you to delete anything from y.

Recommended

To be more specific, you could use PartialBy (one liner) or SetOptional (from type-fest):

  const y = { ...x } as PartialBy<Thing, 'prop1' | 'prop2'>;

That would make prop1 and prop2 optional but keep all other properties as they were originally.

Note

Above, I wrote const y = value as Type; because I find it easier to read. But you should probably use const y: Type = value; instead, because that does better type checking.

user_997770

Another implementation if you want it to exist:

interface Thing {
  prop: string;
}
interface PropoptionalThing {
  prop?: string;
}

function f(x: Thing): PropoptionalThing {
  let tmp: PropoptionalThing = x;
  delete tmp.prop;
  return tmp;
}
user_141332300

Maybe this can helpful

const { propToDelete, ...otherProps} = youObject
return otherProps

with that you can use otherProps object without break out

user_117053010

The prop property in Thing interface must be mark as optional using ? mark.

then your Thing interface must be like this.

interface Thing {
  prop?: string;
}
user_145261250
Related