如何将所有子节点值、User info分别复制到独立节点值、引用值中？

嘿，针对你的两个问题，我来给你详细拆解一下可行的实现方式，都是日常开发里常用的方案：

这个需求得看你是处理DOM节点还是JSON/JS对象节点，两种场景的实现略有不同，我都给你举例子：

场景1：处理DOM子节点 #

假设你有一个包含多个子元素的父DOM节点，想要把所有子节点的文本内容提取出来，放到另一个目标节点里：

HTML结构示例 #

<div id="parent-container">
  <p>First item</p>
  <p>Second item</p>
  <p>Third item</p>
</div>
<div id="target-node"></div>

JavaScript实现 #

// 获取父节点和目标节点
const parent = document.getElementById('parent-container');
const target = document.getElementById('target-node');

// 提取所有子节点的文本值，转成数组（可以根据需求调整格式）
const childValues = Array.from(parent.children).map(child => child.textContent.trim());

// 将提取的值存储到目标节点，这里用逗号分隔成字符串
target.textContent = childValues.join(', ');

// 如果需要存储为数组格式，也可以转成JSON字符串
// target.textContent = JSON.stringify(childValues);

场景2：处理JSON/JS对象的子节点 #

如果是处理数据对象里的子节点，比如从一个父对象的子属性中提取值，存入另一个独立的对象属性：

示例代码 #

const data = {
  parent: {
    item1: 'Apple',
    item2: 'Banana',
    item3: 'Cherry'
  },
  target: {}
};

// 提取父节点下所有子属性的值
const childValues = Object.values(data.parent);

// 存储到目标节点属性中
data.target.extractedValues = childValues;

console.log(data.target.extractedValues); // 输出: ["Apple", "Banana", "Cherry"]

当然有可行的方案！核心是要做对象拷贝，因为直接赋值的话只是复制引用，修改新对象会影响原对象。具体要选浅拷贝还是深拷贝，取决于你的User info是否有嵌套结构：

情况1：浅拷贝（适合扁平的User info，无嵌套对象/数组） #

如果你的User info是简单的扁平对象，没有嵌套的子对象或数组，用浅拷贝就足够保证两个对象独立：

示例代码 #

const originalUserInfo = {
  name: 'Prasath',
  age: 30,
  email: 'prasath@example.com'
};

// 方法1：使用Object.assign
const copiedUserInfo = Object.assign({}, originalUserInfo);

// 方法2：使用ES6扩展运算符（更简洁）
const copiedUserInfo = {...originalUserInfo};

// 验证独立性：修改拷贝后的对象，原对象不受影响
copiedUserInfo.age = 31;
console.log(originalUserInfo.age); // 输出: 30

情况2：深拷贝（适合有嵌套结构的User info） #

如果User info里包含嵌套对象（比如联系方式、地址）或者数组，浅拷贝只能复制外层引用，嵌套部分还是会和原对象共享，这时候需要用深拷贝：

示例代码 #

const originalUserInfo = {
  name: 'Prasath',
  age: 30,
  contact: {
    email: 'prasath@example.com',
    phone: '1234567890'
  },
  hobbies: ['reading', 'coding']
};

// 方法1：JSON.parse + JSON.stringify（简单但有局限：不能处理函数、Symbol等特殊类型）
const copiedUserInfo = JSON.parse(JSON.stringify(originalUserInfo));

// 方法2：手写递归深拷贝函数（支持所有数据类型）
function deepCopy(obj) {
  if (obj === null || typeof obj !== 'object') return obj;
  // 处理数组
  if (obj instanceof Array) {
    return obj.map(item => deepCopy(item));
  }
  // 处理对象
  const copiedObj = {};
  for (const key in obj) {
    if (obj.hasOwnProperty(key)) {
      copiedObj[key] = deepCopy(obj[key]);
    }
  }
  return copiedObj;
}
const copiedUserInfo = deepCopy(originalUserInfo);

// 验证独立性：修改拷贝后的嵌套属性，原对象不受影响
copiedUserInfo.contact.phone = '0987654321';
console.log(originalUserInfo.contact.phone); // 输出: 1234567890

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