能否借助ES6特性实现movePoint函数的两种调用方式兼容？

Great question! Let's tackle this directly: you can't directly keep the two original signatures (one with positional string/x/y, one with destructured object) side-by-side and have them work seamlessly. Here's why: when you define a function with a destructured object as the first parameter like function movePoint({name, x, y, otherRarelyUsedParameter=true}), JavaScript expects the first argument to be an object. If you pass a string instead, it'll try to access name on that string (which doesn't exist) and throw a TypeError—that's a hard stop.

But don't worry, we can use ES6 features to build a clean, readable compatible implementation that still leverages destructuring under the hood. Here's the most straightforward approach:

Recommended Implementation #

We'll first normalize the input into a consistent configuration object, then use destructuring to extract the values we need. This keeps the logic centralized and easy to follow:

function movePoint(arg1, arg2, arg3) {
  // Normalize input to a config object
  const config = typeof arg1 === 'string'
    ? { name: arg1, x: arg2, y: arg3 }
    : { otherRarelyUsedParameter: true, ...arg1 };

  // Use destructuring here to get your values (just like your second signature)
  const { name, x, y, otherRarelyUsedParameter } = config;

  // Your core logic goes here
  console.log(`Moving point "${name}" to coordinates (${x}, ${y})`);
  if (otherRarelyUsedParameter) {
    console.log("Applying rare additional behavior");
  }
}

// Test both call formats
movePoint("pointA", 32, 25);
movePoint({ name: "pointB", x: 10, y: 20, otherRarelyUsedParameter: false });

Why this works: #

• Compatibility: It handles both positional string/x/y calls and object-based calls without breaking.
• Readability: The normalization step is explicit, so anyone reading the code immediately understands the two supported input formats.
• Leverages ES6: We use the spread operator (...) to merge the default otherRarelyUsedParameter with the input object, and destructuring to cleanly extract values for the core logic.
• Default handling: For object calls that omit otherRarelyUsedParameter, the default true is applied automatically.

Alternative: Wrapper Function for Clearer Separation #

If you want to keep the "pure" object-based function separate, you can wrap it in a handler that handles the positional call format:

// The core function with your preferred destructured signature
function _movePoint({ name, x, y, otherRarelyUsedParameter = true }) {
  // Core logic here
  console.log(`Moving point "${name}" to (${x}, ${y})`, otherRarelyUsedParameter);
}

// Public function that handles both call types
function movePoint(...args) {
  if (typeof args[0] === 'string') {
    return _movePoint({ name: args[0], x: args[1], y: args[2] });
  }
  return _movePoint(args[0]);
}

This is nice if you want to isolate the core logic from the input handling, but it adds a tiny bit of extra boilerplate.

Key Takeaway #

You can't have both the positional string/x/y signature and the destructured object signature active at the same time (since JS's parameter matching doesn't support conditional destructuring based on argument type). The most readable solution is to normalize the input into a consistent object first, then use destructuring for the rest of your logic—it's explicit, maintainable, and uses ES6 features effectively.

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