How can I solve the error 'TS2532: Object is possibly 'undefined'?
Solution 1
With the release of TypeScript 3.7, optional chaining (the ?
operator) is now officially available.
As such, you can simplify your expression to the following:
const data = change?.after?.data();
You may read more about it from that version's release notes, which cover other interesting features released on that version.
Run the following to install the latest stable release of TypeScript.
npm install typescript
That being said, Optional Chaining can be used alongside Nullish Coalescing to provide a fallback value when dealing with null
or undefined
values
const data = change?.after?.data() ?? someOtherData();
Additional points:
If you are using optional chaining in the conditional if
statements, you will still need to ensure that you are doing proper value/type equality checking.
The following will fail in strict TypeScript, as you are possibly comparing an undefined value with a number.
if (_?.childs?.length > 0)
Instead, this is what you should be doing:
if (_?.childs && _.childs.length > 0)
Solution 2
Edit / Update:
If you are using Typescript 3.7 or newer you can now also do:
const data = change?.after?.data();
if(!data) {
console.error('No data here!');
return null
}
const maxLen = 100;
const msgLen = data.messages.length;
const charLen = JSON.stringify(data).length;
const batch = db.batch();
if (charLen >= 10000 || msgLen >= maxLen) {
// Always delete at least 1 message
const deleteCount = msgLen - maxLen <= 0 ? 1 : msgLen - maxLen
data.messages.splice(0, deleteCount);
const ref = db.collection("chats").doc(change.after.id);
batch.set(ref, data, { merge: true });
return batch.commit();
} else {
return null;
}
Original Response
Typescript is saying that change
or data
is possibly undefined
(depending on what onUpdate
returns).
So you should wrap it in a null/undefined check:
if(change && change.after && change.after.data){
const data = change.after.data();
const maxLen = 100;
const msgLen = data.messages.length;
const charLen = JSON.stringify(data).length;
const batch = db.batch();
if (charLen >= 10000 || msgLen >= maxLen) {
// Always delete at least 1 message
const deleteCount = msgLen - maxLen <= 0 ? 1 : msgLen - maxLen
data.messages.splice(0, deleteCount);
const ref = db.collection("chats").doc(change.after.id);
batch.set(ref, data, { merge: true });
return batch.commit();
} else {
return null;
}
}
If you are 100% sure that your object
is always defined then you can put this:
const data = change.after!.data();
Solution 3
For others facing a similar problem to mine, where you know a particular object property cannot be null, you can use the non-null assertion operator (!) after the item in question. This was my code:
const naciStatus = dataToSend.naci?.statusNACI;
if (typeof naciStatus != "undefined") {
switch (naciStatus) {
case "AP":
dataToSend.naci.certificateStatus = "FALSE";
break;
case "AS":
case "WR":
dataToSend.naci.certificateStatus = "TRUE";
break;
default:
dataToSend.naci.certificateStatus = "";
}
}
And because dataToSend.naci
cannot be undefined in the switch statement, the code can be updated to include exclamation marks as follows:
const naciStatus = dataToSend.naci?.statusNACI;
if (typeof naciStatus != "undefined") {
switch (naciStatus) {
case "AP":
dataToSend.naci!.certificateStatus = "FALSE";
break;
case "AS":
case "WR":
dataToSend.naci!.certificateStatus = "TRUE";
break;
default:
dataToSend.naci!.certificateStatus = "";
}
}
Related videos on Youtube
Comments
-
Constantin Beer about 3 years
I'm trying to rebuild a web app example that uses Firebase Cloud Functions and Firestore. When deploying a function I get the following error:
src/index.ts:45:18 - error TS2532: Object is possibly 'undefined'. 45 const data = change.after.data();
This is the function:
export const archiveChat = functions.firestore .document("chats/{chatId}") .onUpdate(change => { const data = change.after.data(); const maxLen = 100; const msgLen = data.messages.length; const charLen = JSON.stringify(data).length; const batch = db.batch(); if (charLen >= 10000 || msgLen >= maxLen) { // Always delete at least 1 message const deleteCount = msgLen - maxLen <= 0 ? 1 : msgLen - maxLen data.messages.splice(0, deleteCount); const ref = db.collection("chats").doc(change.after.id); batch.set(ref, data, { merge: true }); return batch.commit(); } else { return null; } });
I'm just trying to deploy the function to test it. And already searched the web for similar problems, but couldn't find any other posts that match my problem.
-
Constantin Beer about 5 yearsIf I do that I'll get following error:
error TS7030: Not all code paths return a value. 44 .onUpdate((change, context) =>
-
Doug Stevenson about 5 yearsYou'll now need to return something when that first
if
statement returns false. -
Constantin Beer about 5 yearsOh, for some reason I thought that the error related to the change and context objects. #ashamed Now it works, but my code looks very bad, because I had to add an if query for the
data
object as well and just addedreturn null;
in the else branches. Is there a cleaner way to implement it? #HugeDougFan -
Constantin Beer about 5 yearsWith
const data = change!.after!.data()
I get an error, but withconst data = change.after!.data()
it works. Thank you a lot. :) -
distante about 5 yearsOk, I will fix it on the answer too.
-
TimewiseGamgee about 4 yearsHad the issue for an array on an object even with optional chaining.
-
TimewiseGamgee about 4 yearsUnfortunately it's difficult to format code in comments but here it goes... I had to supply the undefined check because it would throw "Object is possibly Undefined": if (listingData && listingData.images) { image = listingData?.images[0]?.imageUrl; }
-
wentjun about 4 yearsI'm thinking, is
images
optional field here? Thats why it could beundefined
? In that case, do you wanna try this?if (listingData?.images) { image = listingData?.images?.[0].imageUrl; }
-
TheEhsanSarshar almost 4 yearseven with optional chaining I still have the error if (_?.childs?.length > 0)
-
ADM-IT about 3 yearsIs there any way to disable that check? I don't think it's useful in typescript at all. Update: Just add
"strictNullChecks": false,
to the tsconfig.json file. -
wentjun about 3 years@Ehsansarshar apologies for the late response, but I have addressed your issue on my post in a recent update
-
wentjun about 3 years@ADM-IT you might disable it, but it is still beneficial to do strict null/type checks.
-
ADM-IT almost 3 years@wentjuin In many cases it is not predictable, so you just have to put many question marks everywhere to remove those warnings even if it's never going to be null.
-
Dentrax about 2 yearsTried
?
but I got:Property 'baz' does not exist on type 'never'.
for the statement:const foo = bar?.baz