JavaScript 深拷贝和浅拷贝的实现、使用场景和存在的问题
浅拷贝
实现
方式 1（ES 5 语法）：
const params = Object.assign({}, state.dataForm)
方式 2（ES 6 语法）：
const params = { ...state.dataForm }
使用场景
copy 入参和出参
深拷贝
方式 1（手动实现）：
/*** 深拷贝* @param obj*/
export const deepCopy = <T>(obj: T): T => {if (obj === null || typeof obj !== "object") {return obj;}if (Array.isArray(obj)) {const arrCopy = [] as any[];obj.forEach((item, index) => {arrCopy[index] = deepCopy(item);});return arrCopy as any;}const objCopy = {} as { [key: string]: any };Object.keys(obj).forEach((key) => {objCopy[key] = deepCopy((obj as { [key: string]: any })[key]);});return objCopy as T;
};
方式 2（第三方）：
yarn add lodashimport cloneDeep from 'lodash/cloneDeep';
const params = cloneDeep(state.dataForm);
使用场景
需要保留变量状态
存在的问题
浅拷贝只会复制对象的第一层属性，对于嵌套的对象或数组，拷贝的仍然是引用而不是值。这样会导致修改浅拷贝对象的嵌套属性时，原对象的相应属性也会被修改。