如何拼接数组的数组中字符串属性并为每个数组新增属性

Got it, let's work through this. First, a quick note: your initial UserList uses square brackets for each entry, but those should be curly braces since they're key-value pairs (JavaScript objects), not arrays. I'll start with the corrected object array structure since that's the standard way to store this kind of data.

Method 1: Modify the Original Array with forEach #

This is great if you don't need to keep the original array intact and want to update it directly:

// Corrected initial user list (array of objects)
const UserList = [
  {name:"user1", type:"admin", location:"NY", expired:"NO"},
  {name:"user2", type:"poweruser", location:"CO", expired:"NO"},
  {name:"user3", type:"admin", location:"SF", expired:"NO"}
];

// Loop through each user and add the AllProps property
UserList.forEach(user => {
  user.AllProps = `${user.name}${user.type}${user.location}`;
});

// Check the result
console.log(UserList);

The forEach method iterates over every user object in the array, and we directly append the AllProps property by concatenating the name, type, and location values using template literals (cleaner than string addition!).

Method 2: Create a New Array with map #

If you need to preserve the original array (best practice for immutable data), use map to return a new array with the added property:

const UserList = [
  {name:"user1", type:"admin", location:"NY", expired:"NO"},
  {name:"user2", type:"poweruser", location:"CO", expired:"NO"},
  {name:"user3", type:"admin", location:"SF", expired:"NO"}
];

// Generate a new array without modifying the original
const updatedUserList = UserList.map(user => ({
  ...user, // Copy all existing properties from the user object
  AllProps: `${user.name}${user.type}${user.location}`
}));

console.log(updatedUserList);

Here, we use the spread operator (...user) to copy all existing properties into a new object, then add the AllProps property to that new object. The original UserList stays untouched.

Method 3: Traditional for Loop (Max Compatibility) #

If you need support for older JavaScript environments (or just prefer a more explicit loop), use a standard for loop:

const UserList = [
  {name:"user1", type:"admin", location:"NY", expired:"NO"},
  {name:"user2", type:"poweruser", location:"CO", expired:"NO"},
  {name:"user3", type:"admin", location:"SF", expired:"NO"}
];

for (let i = 0; i < UserList.length; i++) {
  const currentUser = UserList[i];
  currentUser.AllProps = currentUser.name + currentUser.type + currentUser.location;
}

console.log(UserList);

This method works in all JS environments and gives you full control over the loop flow.

If You Really Need to Work with Array-Based Key-Value Pairs #

If your original data is actually structured as arrays (not objects, though this is non-standard), here's how to handle it:

// Original array-based structure (not recommended, but included per your initial code)
const UserList = [
  ["name","user1", "type","admin", "location","NY", "expired","NO"],
  ["name","user2", "type","poweruser", "location","CO", "expired","NO"],
  ["name","user3", "type","admin", "location","SF", "expired","NO"]
];

UserList.forEach(userArr => {
  // Convert the array to an object to easily access values
  const userObj = Object.fromEntries(
    userArr.reduce((acc, val, index) => {
      if (index % 2 === 0) acc.push([val, userArr[index + 1]]);
      return acc;
    }, [])
  );
  // Add the AllProps key-value pair to the original array
  userArr.push("AllProps", `${userObj.name}${userObj.type}${userObj.location}`);
});

console.log(UserList);

That said, I strongly recommend using object arrays instead—they're far more readable and easier to work with in JavaScript.

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