React+TypeScript是否支持.NET式Null coalescing operator写法？

Great question! Let’s clear this up for you: Yes, React + TypeScript absolutely supports the optional chaining operator (?.)—the exact syntax you want to use (address?.postal_code) is fully valid. The error you’re seeing is almost certainly a configuration or version issue, not a limitation of the tech stack.

Let’s break this down: #

• First, a quick terminology note: The ?. operator is called the Optional Chaining Operator, while the null coalescing operator (which you mentioned from .NET) is ?? in TypeScript/JavaScript. Both are useful, but ?. is what you’re asking about for safe nested property access.
• Your current workaround with address && address.postal_code works, but it has subtle downsides: if address is a falsy value that’s not null/undefined (like 0 or an empty string ''), the && will return that falsy value instead of undefined. The ?. operator only short-circuits when the left-hand side is null or undefined, which is usually what you want for property access.

Fixing the error you’re seeing #

To use ?. without issues, check these things:

1. Update your TypeScript version: Optional chaining was introduced in TypeScript 3.7. Make sure your project is using at least this version (run npm list typescript or yarn list typescript to check, and update with npm install typescript@latest if needed).
2. Check your tsconfig.json: Ensure your compilerOptions have:
   • target set to at least ES2020 (or ESNext for cutting-edge features)
   • Or, if you need to target an older JS version, make sure lib includes ES2020 (example: "lib": ["ES2020", "DOM"])
3. Verify your IDE’s TypeScript version: Sometimes editors like VS Code use a global TypeScript version instead of your project’s local one. To fix this, open the command palette (Ctrl+Shift+P or Cmd+Shift+P) and run "TypeScript: Select TypeScript Version" to pick the one in your project’s node_modules.

Example of working code #

Once your setup is correct, this will work perfectly:

// Safe nested access with optional chaining
const postal_code: string | undefined = address?.postal_code;

// Combine with null coalescing (??) to set a default value
const postal_codeWithDefault: string = address?.postal_code ?? 'N/A';

内容的提问来源于stack exchange，提问作者Praveen Kumar