深克隆(clone) -- 02

1、数据

let oldData = { name: '西施', age: 26, height: '163.30', score: null, friends: ['李白', '杜牧', '李商隐'], oldObj: { city: '广州', area: '越秀区', street: '明信路', }, }; 

2、克隆函数

function deepClone(data) { // 第一步：判断传进来的数据是否为空 或者 是基本类型的值 if (data === null || typeof data !== 'object') return data; // 第二步：判断数据是否是数组 // 如果是数组创建一个空数组 // 否则创建一个空对象 let cloneData = Array.isArray(data) ? [] : {}; // 第三步：使用 for in 循环遍历数据 for (let key in data) { // 判断结束递归 if (data.hasOwnProperty(key)) { // Object.prototype.hasOwnProperty() 方法会返回一个布尔值， // 指示对象自身属性中是否具有指定的属性（也就是，是否有指定的键）  // deepClone(data[key]); 使用了函数递归 cloneData[key] = deepClone(data[key]); } } return cloneData; }; 

3、验证

// 克隆后的数据 let cloneData = deepClone(oldData); // 如果是 false 说明克隆成功 console.log(oldData === cloneData); // false // 修改克隆后的第一层 age 的值 cloneData.age = 32; // 修改克隆后第二层 数组的值 cloneData.friends[2] = '杜甫'; // 修改克隆后的二层 city 的值 cloneData.oldObj.city = '武汉'; // 深克隆，第一层两个值的地址已经完全不一样了 console.log('oldObject：', oldData.age); // 26 console.log('newObject：', cloneData.age); // 32 // 深克隆，第二层 数组 两个值的地址已经完全不一样了 console.log('oldObject：', oldData.friends[2]); // 李商隐 console.log('newObject：', cloneData.friends[2]); // 杜甫 // 深克隆，第二层 对象 两个值的地址已经完全不一样了 console.log('oldObject：', oldData.oldObj.city); // 广州 console.log('newObject：', cloneData.oldObj.city); // 武汉