JavaScript 如何将多个对象键的名称替换为提供的值

以下方法介绍了如何使用JavaScript将多个对象键的名称替换为用户提供的值。

问题描述： 给定一个包含不同键值对的对象，其中键表示属性，而值本身称为属性值，您需要使用JavaScript将一个或多个键的原始名称更改为用户提供的名称。

举一个例子，以上面示例的对象为例。该对象包含了Name：“Hello”等键值对。我们假设我们要将Name键更改为FirstName键名，使用以下方法：

在直接讨论解决上述问题的方法之前，让我们首先声明我们将用于解决查询的对象。

示例： 通过以下语法，我们首先创建一个对象：

Javascript

<script> 
  let object = { 
    name: "Hello", 
    age: 20, 
    gender: "Male", 
  }; 
  
  console.log(object); 
</script> 

输出：

{ name: 'Hello', age: 20, gender: 'Male' }

现在让我们来看一下解决上述问题的方法。

方法1

• 这是一种本地方法，也相当简单。
• 在这种方法中，我们将直接选择对象键，并将选定键的名称更改为用户提供的名称。
• 在提供键名后，我们将删除先前声明的键并替换为新键。
• 我们将把逻辑部分写在一个方法（或函数）中，并进一步调用该方法来执行我们的结果。

示例 1：

Javascript

<script> 
  let object = { 
    name: "Hello", 
    age: 20, 
    gender: "Male", 
  }; 
  
  let renmeObjectKey = (object) => { 
    object.FirstName = object.name; 
    delete object.name; 
  }; 
  renmeObjectKey(object); 
  console.log(object); 
</script> 

输出:

{ age: 20, gender: 'Male', FirstName: 'Hello' }

现在假设您想要针对名称由您提供的对象中的年龄键进行目标定位。

示例2：

Javascript

<script> 
  let object = { 
    name: "Hello", 
    age: 20, 
    gender: "Male", 
  }; 
  
  let renmeObjectKey = (object) => { 
    object.FirstName = object.name; 
    object.currentAge = object.age; 
    delete object.name; 
    delete object.age; 
  }; 
  renmeObjectKey(object); 
  console.log(object); 
</script> 

现在除了姓名键，年龄键也被用户提供的新姓名取代。

输出:

{ gender: 'Male', FirstName: 'Hello', currentAge: 20 }

注意： 这里唯一可以注意到的是对象的位置变了，但其值仍然保持不变。

方法2

• 在这个方法中，我们将声明一个完全负责执行结果的方法。
• 在这个方法的参数中，我们将传入两个参数，第一个是keysMap对象，我们将从用户那里接受它，它实际上包含了要用新的键名替换的旧键名，第二个是我们要引用的对象。
• 现在在这个方法内部，我们将使用Object.keys()来接受我们的对象，并针对所有对象键进行操作，然后我们将对其使用reduce()，它将接受两个参数：第一个是作为结果变量的累加器值，第二个是我们当前正在定位的键。
• 然后我们将编写逻辑部分，为此，我们首先要考虑到spread操作符，它将我们的对象展开为一个数组，然后我们将渲染出对象的键，并用我们自己传入的键名进行替换。
• 然后我们将把我们的方法传递给一个新变量，这个变量将被声明为我们的结果变量，然后将console.log()我们的结果。

示例：

<script> 
  let object = { 
    name: "Hello", 
    age: 20, 
    gender: "Male", 
  }; 
  
  let renameKeys = (keysMap, object) => 
    Object.keys(object).reduce( 
      (acc, key) => ({ 
        ...acc, 
        ...{ [keysMap[key] || key]: object[key] }, 
      }), 
      {} 
    ); 
  
  let result = renameKeys({ name: "FirstName" }, object); 
  console.log(result); 
</script> 

输出：

{ FirstName: 'Hello', age: 20, gender: 'Male' }

注意： 这种方法会保留键和值的位置。