Interface with multiple types

Question

I have a interface property:

LegalReviewDate?: string | Date;

When upload to a SharePoint list, it needs to be a Date object. I know it will be a string until I submit it, so I try this:

contract.LegalReviewDate = new Date(contract.LegalReviewDate);

But that throws an error because it is not a string or number (the function thinks it could be a Date which is invalid).

Is there a way to tell the function new Date that it is a string?

You could use a type guard and make it into a date if it's a string — apokryfos, Oct 08 '19 at 14:33
How do you know that it's a `string` and not a `Date`? Did you assign a `string` to it? If so, can we see that code? — jcalz, Oct 08 '19 at 14:33
@jcalz Through the entire project except for uploadin, the property is a string. I use a Office Fabric UI `DatePicker` which returns a `Date` that I convert to a string. At time of upload, I need it to be a `Date`. — Holden1515, Oct 08 '19 at 14:37
@HereticMonkey That works, thank you. If you want to, submit an answer and I'll accept it. — Holden1515, Oct 08 '19 at 14:39
You should probably use two properties and not one, or two objects, one of which has a `string` property and another that you use to upload that has a `Date` property. Reusing the same property for different types that changes back and forth is hard to make type-safe. If you want to use an assertion like `as string` to make the error go away, that will work, but I'd be inclined to refactor so it isn't necessary. Good luck! — jcalz, Oct 08 '19 at 14:41
I would go with @jcalz' advice. They have much more experience and expertise in TypeScript than I do. I know enough to get me into trouble :). — Heretic Monkey, Oct 08 '19 at 14:45

score 0 · Answer 1 · answered Oct 08 '19 at 14:55

There are a number of ways you can do this.

If you are absolutely sure that at the moment the code runs, the value of contract.LegalReviewDate is a string with a date formatted appropriately (see this answer by CMS to Why does Date.parse give incorrect results? for more information on cross-browser supported formats), you can use the as operator to tell TypeScript you are confident of its validity:

contract.LegalReviewDate = new Date(contract.LegalReviewDate as string);

You can also use type guards to make sure that your assumptions are correct:

if (typeof contract.LegalReviewDate === 'string') {
    contract.LegalReviewDate = new Date(contract.LegalReviewDate as string);
}
if (typeof contract.LegalReviewDate === 'object' && contract.LegalReviewDate instanceof Date) {
    contract.LegalReviewDate = contract.LegalReviewDate as Date;
    // OR contract.LegalReviewDate = new Date(contract.LegalReviewDate.valueOf());
}

Or as @jcalz mentions, use two separate properties or objects. For instance,

interface Contract {
    LegalReviewDate?: string;
}

interface ContractDTO {
    LegalReviewDate?: Date;
}

Then, create a new ContractDTO that you use to pass data to (and from) SharePoint.

Interface with multiple types

1 Answers1