前言

在项目中，一些对象数据我们不能直接拿来赋值的使用，否则可能引起原对象的变化，不符合开发的规范。

例如vuex中存储的一些对象

这时候我们需要进行深度克隆

关于深度克隆和浅层克隆的知识点，可以看我之前的博客

以下是我所些的深度克隆函数，可以直接copy使用

deepCopy.js

// deepCopy
function typeOf(obj) {
  const { toString } = Object.prototype;
  const map = {
    '[object Boolean]': 'boolean',
    '[object Number]': 'number',
    '[object String]': 'string',
    '[object Function]': 'function',
    '[object Array]': 'array',
    '[object Date]': 'date',
    '[object RegExp]': 'regExp',
    '[object Undefined]': 'undefined',
    '[object Null]': 'null',
    '[object Object]': 'object',
  };
  return map[toString.call(obj)];
}

function deepCopy(data) {
  const temp = typeOf(data);
  let obj;

  if (temp === 'array') {
    obj = [];
  } else if (temp === 'object') {
    obj = {};
  } else {
    return data;
  }

  if (temp === 'array') {
    for (let i = 0; i < data.length; i += 1) {
      obj.push(deepCopy(data[i]));
    }
  } else if (temp === 'object') {
    Object.keys(data)
      .forEach((key) => {
        obj[key] = deepCopy(data[key]);
      });
  }
  return obj;
}

export default function (obj) {
  return deepCopy(obj);
}

JavaScript常用工具——深度克隆

前言

deepCopy.js