JavaScript：链式调用中使用函数参数实现可复用逻辑

Got it, let's break this down. Sounds like you've got a function that currently relies on hardcoded param1 and param2 to fetch a target variable from a value chain, and you want to refactor this to be reusable across different parameter pairs. Here are a few practical, JavaScript-native approaches depending on your specific use case:

1. Basic Parameterized Function (Most Straightforward) #

First, let's assume your original hardcoded implementation looks something like this:

// Original hardcoded version
function getTargetVariable() {
  const valueChain = yourExistingValueChain; // Your source value chain
  return valueChain["hardcodedParam1"]["hardcodedParam2"]; // Fixed params
}

The simplest fix is to turn those hardcoded strings into function parameters. This lets you pass any pair of params when you call the function:

// Reusable parameterized version
function getTargetVariable(param1, param2) {
  const valueChain = yourExistingValueChain;
  // Use optional chaining (?.) to avoid errors if a property doesn't exist
  return valueChain[param1]?.[param2];
}

// Usage examples
const userName = getTargetVariable("user", "fullName");
const appTheme = getTargetVariable("settings", "theme");

This is great if your value chain is static (doesn't change between calls) and you just need flexibility for different param pairs.

2. Higher-Order Function (For Dynamic Value Chains) #

If your value chain varies between different use cases (e.g., you have separate value chains for user data vs. app settings), a higher-order function lets you encapsulate the value chain once and reuse the getter with different params:

// Higher-order function: creates a getter tied to a specific value chain
function createValueChainGetter(valueChain) {
  return (param1, param2) => valueChain[param1]?.[param2];
}

// Create getters for different value chains
const userDataGetter = createValueChainGetter(userValueChain);
const appSettingsGetter = createValueChainGetter(settingsValueChain);

// Use the getters with dynamic params
const userEmail = userDataGetter("user", "email");
const defaultLanguage = appSettingsGetter("preferences", "language");

This keeps your code DRY if you're working with multiple value chains and don't want to repeat the lookup logic each time.

3. Curried Function (For Step-by-Step Param Passing) #

If you often need to fix one parameter and fetch multiple sub-values (e.g., get multiple properties under the "user" key), a curried version lets you partially apply the first param and reuse the resulting function:

// Curried lookup function
function getTargetVariableCurried(param1) {
  const valueChain = yourExistingValueChain;
  return (param2) => valueChain[param1]?.[param2];
}

// Fix param1 to "user" and reuse the getter
const userPropertyGetter = getTargetVariableCurried("user");
const userName = userPropertyGetter("fullName");
const userAge = userPropertyGetter("age");

This is handy for workflows where you're working within the same "parent" key across multiple lookups.

Bonus: Support for Longer Paths #

If you ever need to extend beyond two parameters (e.g., valueChain["user"]["profile"]["address"]), you can refactor to accept an array of path segments for maximum flexibility:

// Reusable lookup for any length of path
function getTargetByPath(pathSegments) {
  const valueChain = yourExistingValueChain;
  // Use Array.reduce to traverse the value chain safely
  return pathSegments.reduce((currentValue, key) => currentValue?.[key], valueChain);
}

// Usage with a 3-segment path
const userAddress = getTargetByPath(["user", "profile", "address"]);

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