Say Goodbye to Try/Catch Blocks with the ECMAScript ?= Operator

The ECMAScript proposal for the safe assignment operator (?=) introduces a revolutionary way to handle errors in JavaScript. It borrows ideas from Rust, Go, and Swift—languages known for their clean error-handling patterns—and brings those benefits to JS developers.

Instead of wrapping every async call in try/catch blocks or nesting error-prone logic, ?= offers a clean, tuple-based alternative that promotes readability, consistency, and safety.

Why Traditional try/catch Gets Messy

JavaScript’s try/catch can clutter your logic, especially when multiple async operations are involved.

❌ Without ?=: Deep Nesting

async function fetchData() {
  try {
    const res = await fetch("https://api.example.com/data");
    try {
      const json = await res.json();
      return json;
    } catch (parseError) {
      console.error("Failed to parse JSON:", parseError);
    }
  } catch (networkError) {
    console.error("Network error:", networkError);
  }
}

✅ With ?=: Simpler Error Handling

The safe assignment operator turns any async result into a destructurable tuple: [error, value]. This makes code linear and easy to follow.

async function fetchData() {
  const [networkError, response] ?= await fetch("https://api.example.com/data");
  if (networkError) return console.error("Network error:", networkError);

  const [parseError, data] ?= await response.json();
  if (parseError) return console.error("Failed to parse JSON:", parseError);

  return data;
}

🔍 How It Works: The Power of Symbol.result

The magic behind ?= lies in a special method: Symbol.result. If an object implements it, that object can define how to unpack into [error, result].

function simulateFailure() {
  return {
    [Symbol.result]() {
      return [new Error("Oops! Something went wrong."), null];
    },
  };
}

const [err, value] ?= simulateFailure();
if (err) console.error(err.message); // "Oops! Something went wrong."

This provides the flexibility to adapt your own APIs or error-handling mechanisms.

📦 Real-World Examples

Example 1: Async File Read with Error Handling

import { readFile } from "fs/promises";

async function readJson(path) {
  const [readErr, data] ?= await readFile(path, "utf-8");
  if (readErr) return console.error("Failed to read file:", readErr);

  const [parseErr, json] ?= JSON.parse(data);
  if (parseErr) return console.error("Invalid JSON:", parseErr);

  return json;
}

Example 2: Custom Result Wrapper for APIs

function safeFetch(url) {
  return {
    async [Symbol.result]() {
      try {
        const res = await fetch(url);
        const json = await res.json();
        return [null, json];
      } catch (e) {
        return [e, null];
      }
    },
  };
}

const [error, result] ?= await safeFetch("https://dev.to/api/data");

Example 3: Using with Resource Cleanup (using)

await using [err, connection] ?= await openDatabaseConnection();
if (err) throw err;

const [qErr, results] ?= await connection.query("SELECT * FROM users");
if (qErr) throw qErr;

return results;

The using statement ensures connection is disposed of properly, regardless of errors.

🎯 Benefits of the ?= Operator

• ✅ Improves readability: Keeps logic flat and linear.
• ✅ Encourages consistency: Same error pattern across your codebase.
• ✅ Safer execution: Catches every error without missed edge cases.
• ✅ Adaptable to any API: Works with Symbol.result for full control.
• ✅ Better DX: Cleaner logs, simpler testing, easier debugging.

🚫 Current Limitations

The proposal is still experimental and not available in all JavaScript runtimes. Other considerations:

-🔸 Polyfills not possible: Since it’s syntax, it can’t be polyfilled directly.
-🔸 Tooling required: You’ll need a custom Babel/TypeScript transform or postprocessor.
-🔸 No finally support: You’ll still need try/finally for cleanup logic.

🚀 Bonus: Emulating ?= in Today’s JavaScript

If you want to try it today, you can emulate the behavior like this:

async function safe(fn) {
  try {
    const res = await fn();
    return [null, res];
  } catch (err) {
    return [err, null];
  }
}

const [err, data] = await safe(() => fetch("/api/data"));

🔮 Future Directions

The ?= operator has the potential to reshape our understanding of control flow in JavaScript. Inspired by Go’s err, val := fn() and Rust’s Result, it bridges the gap between expressive syntax and safe semantics.

As the proposal matures, expect:

• Better integration with async resource handling (using)
• Enhanced developer tooling
• Wider runtime support in Node.js and browsers

🔗 Relevant Links

Here are some helpful resources to deepen your understanding of the ?= operator and related error-handling improvements in JavaScript:

• 🔍 The Safe Assignment Operator (?=) Explained – A deep dive into the proposal, use cases, and current status
• 🧪 The Official TC39 Proposal for ?= – Follow the formal evolution of the feature
• 🛠️ ECMAScript Proposal Stages – Learn about the process every feature goes through

📘 Summary

The safe assignment operator ?= helps you write cleaner, more reliable JavaScript. With it, you can eliminate deeply nested try/catch blocks, unify your error-handling approach, and write code that’s both safer and more readable.

It’s still early days, but this is a feature worth watching—and experimenting with—today.