js 中有哪些拷贝的方式

1. json转换，深拷贝

var newObj = JSON.parse(JSON.stringify(obj))
复制代码

注意：function 会被转变成 undefined

2. 循环递归将基础类型进行赋值，深拷贝

如果是 function，很少考虑在n内，且不考虑箭头函数

// 这里不考虑箭头函数的情况
function cloneDeep (obj) {
  var _types = ['number', 'string', 'boolean', 'undefined', 'function']
  if (_isBaseTypeAndFn(obj)) return obj
  var newObj
  if (Array.isArray(obj)) {
    newObj = []
    if (obj.length === 0) return newObj
    obj.forEach(function (item, index) {
      newObj[index] = cloneDeep(item)
    })
    return newObj
  }
  newObj = {}
  if (Object.keys(obj) === 0) return newObj
  for (key in obj) {
    var value = obj[key]
    newObj[key] = cloneDeep(value)
  }
  function _isBaseTypeAndFn (value) {
    return _types.indexOf(typeof value) > -1 || value === null
  }
  return newObj
}
复制代码

精简版本(推荐版)

function deepCopy (obj){
    if(typeof obj === "object" && obj !== null){
        var result = obj.constructor == Array ? [] : {};
        for(let i in obj){
            result[i] = typeof obj[i] == "object" ? deepCopy(obj[i]) : obj[i];
        }
    } else {
        var result = obj;
    }
    return result;
}
复制代码

测试代码地址

3. 原型链

var person = {
	name: 'liangcheng'
}
function cloneDeep (obj) {
	var F = function () {}
	F.prototype = obj
	return new F()
}
var newPerson = cloneDeep(person)
Object.keys(newPerson)
复制代码

person 里面再包含一层引用，那么该引用是共享的，类似原型属性共享。

4. Object.create()

var person =  {
	name: 'liangcheng'
}

var newPerson = Object.create(person)
复制代码

和第 3 种一样，person 里面再包含一层引用，那么该引用是共享的，类似原型属性共享一样。

5. Array.prototype.concat() 和 Array.prototype.map

这两种都是一种浅拷贝。

var ary = [{
  name: 'liangecheng'
}]
// concat 也是一种浅拷贝
var ary1 = [].concat(ary)

ary1[0].name = 'wy'
console.log(ary[0].name) // wy
复制代码

var ary = [
  {
    name: 'liangecheng'
  }
]
// map 也是一种浅拷贝
var ary1 = ary.map(function (item) {
  return item
})

ary1[0].name = 'wy'
console.log(ary[0].name) // wy
复制代码

6. 通过new

class Person {
	name = ''
	age = 0
	contructor (argsObj: Person) {
		Object.assign(this, argsObj)
	}
}

const person = {
	name: 'liangcheng'
	arg: 16
}

const newPerson = new Person(person)
复制代码

和原型链方式一样，属性是引用，就共享了。

7. Object.assign()

const person = {
	name: 'liangcheng'
	arg: 16
}

const newPerson = Object.assign({}, person)
复制代码

转载于:https://juejin.im/post/5cb226a06fb9a0688e066d6c