JavaScript 深拷贝

基本类型和引用类型

基本类型：

• null
• undefined
• string
• number
• boolean
• symbo

引用类型：

• object

区别：

• 基本类型的变量是存放在栈内存（Stack）里的，引用类型的值是保存在堆内存（Heap)
• 基本数据类型的值是按值访问的，引用类型的值是按引用访问的
• 基本类型的比较是它们的值的比较，引用类型的比较是引用的比较

对象引用详解

let a = { x: 1 };
let b = a;
a = a.x = { x: 1 };

console.log(a); // {x:1}
console.log(b); // {x:{x:1}}

分析

let a = { x: 1 };
let b = a;

a.x = { x: 1 };

a = a.x;

手写深拷贝

因为 js 对象类型是引用类型，所以递归的拷贝每一层直到基本类型。

对于 RegExp、Date 内置对象，调用相应构造函数创建。

/**
 * 深拷贝
 * @param {*} obj
 */
function deepClone(obj) {
  const type = Object.prototype.toString.call(obj);
  if (type.includes('Null')) return null;
  if (type.includes('RegExp')) return new RegExp(obj);
  if (type.includes('Date')) return new Date(obj);
  if (typeof obj !== 'object') return obj;

  const cloneObj = new obj.constructor();
  for (let key in obj) {
    if (obj.hasOwnProperty(key)) {
      cloneObj[key] = deepClone(obj[key]);
    }
  }
  return cloneObj;
}

const obj = {
  a: undefined,
  b: null,
  c: /\d+/g,
  d: () => {},
  e: 1,
  f: 'hello world',
  g: { name: '小豪' },
  h: [1, 2, 3],
};
const cloneObj = deepClone(obj);