1 相关知识点
- 浅克隆就是将栈内存中的引用复制一份,赋给一个新的变量,本质上两个指向堆内存中的同一地址,内容也相同,其中一个变化另一个内容也会变化。
- 深克隆就是创建一个新的空对象,开辟一块内存,然后将原对象中的数据全部复制过去,完全切断两个对象间的联系。
- 区别:浅克隆和深克隆最大的区别就是对引用值的处理了,即浅克隆之后你改我也改,深克隆之后你改我不改。(PS:原始值的处理一样)
- 原始值(栈数据stack):Number,Boolean(false/true),String,undefined,null
- 引用值(堆数据heap):Array,Object,function ··· Date,RegExp
2 浅层克隆
在浅层克隆中,原始值的克隆没问题,只是值的拷贝,不会出现你改我改的问题。但是引用值的克隆,就会出现你改我也改的问题,因为浅层克隆的是地址,即指向的是同一空间。
2.1 浅克隆函数
function clone(origin, target) { var target = target || {}; //容错,即防止用户不传递目标参数。若用户传递了参数就用,若没传则拿一个空对象当目标 for (var prop in origin) { target[prop] = origin[prop]; } return target; }
2.2 运用实例
function clone(origin, target) { var target = target || {}; for (var prop in origin) { target[prop] = origin[prop]; } return target; } var obj = { name: 'abc', age: '18', sex: 'male', card: ['a', 'b', 'c'], book: { name: 'ccc', sbook: { name: 'aaa' } } }; var newobj = {}; clone(obj, newobj);
运行代码如下:
3 深度克隆
进行深度克隆之后,对于引用值的克隆的问题就会和原始值一样我改你不改,因为在深度克隆中虽然是相同的东西,但是指向不同的空间。即深度克隆之后,值各自独立,互不影响。
3.1 深克隆步骤分析
需要进行深度克隆的对象如下:
var obj = { name: 'abc', // 原始值 age: '18', // 原始值 sex: 'male',// 原始值 card: ['a', 'b', 'c'], // 引用值 book: { // 引用值 name: 'ccc', // 原始值 sbook: { // 引用值 name: 'aaa'// 原始值 } } }; var obj1 = {};
(1)首先需要遍历要克隆的对象
方法:for (var prop in origin){···}
for (var prop in origin) { ··· }
(2)依次判断是不是原始值
方法:typeof() ,即若为原始值,就直接拷贝;若为引用值(typeof(···)返回的值是object),则进行递归操作。需要注意是的typeof(null) == 'object',所以得排除这一个情况。
if (origin[prop] !== "null" && typeof(origin[prop]) == 'object') { ··· // 递归 } else { target[prop] = origin[prop]; }
(3)判断是数组还是对象
方法:toString(推荐), constructor,instanceof (后两个会涉及到父子域的小问题,虽然遇到的可能不是很大)
var toStr = Object.prototype.toString, arrStr = "[object Array]"; if (toStr.call(origin[prop]) == arrStr) { ··· // 数组 } else { ··· // 对象 }
(4)建立相应的数组或对象
方法:建立一个新的同名空数组 / 对象,并将原始对象中的 数组或对象 当成一个新的原始对象,再次将其中的数据拷贝到目标对象的 同名空数组 / 对象 里面。即递归开始拷贝数组或对象里面的数据,并递归执行第(1)步。递归完成之后,再依次进行下一个数据的克隆。
var toStr = Object.prototype.toString, arrStr = "[object Array]"; if (toStr.call(origin[prop]) == arrStr) { target[prop] = []; } else { target[prop] = {}; }
newobj = { name: 'abc', age: '18', sex: 'male', card: [] // 建立一个新的同名空数组,并把obj的card数据当成一个原始对象,再次拷贝到obj1的card里面 // 即 递归开始拷贝数组或对象里面的数据,递归执行第(1)步 // 执行完数组card拷贝之后,开始同理拷贝下一个对象book··· }
3.2 深克隆函数
function deepClone(origin, target) { var target = target || {}, toStr = Object.prototype.toString, arrStr = "[object Array]"; for (var prop in origin) { if (origin.hasOwnProperty(prop)) { if (origin[prop] !== "null" && typeof(origin[prop]) == 'object') { if (toStr.call(origin[prop]) == arrStr) { target[prop] = []; } else { target[prop] = {}; } deepClone(origin[prop], target[prop]); } else { target[prop] = origin[prop]; } } } return target; }
使用三目运算符简化后的代码如下:
// 使用三目运算符简化后 function deepClone(origin, target) { var target = (target || {}), toStr = Object.prototype.toString, arrStr = "[object Array]"; for (var prop in origin) { if (origin.hasOwnProperty(prop)) { if (origin[prop] !== "null" && typeof (origin[prop]) == 'object') { target[prop] = toStr.call(origin[prop]) == arrStr "htmlcode">// 使用三目运算符简化后 function deepClone(origin, target) { var target = (target || {}), toStr = Object.prototype.toString, arrStr = "[object Array]"; for (var prop in origin) { if (origin.hasOwnProperty(prop)) { if (origin[prop] !== "null" && typeof (origin[prop]) == 'object') { target[prop] = toStr.call(origin[prop]) == arrStr "text-align: center">![]()
3.4 hasOwnProperty
hasOwnProperty() 方法会返回一个布尔值,指示对象自身属性中是否具有指定的属性(即是否有指定的键)。
语法:obj.hasOwnProperty(prop)
参数:要检测的属性的字符串形式表示的名称,或者Symbol。
返回值:用来判断某个对象是否含有指定的属性的布尔值。
描述:所有继承了Object的对象都会继承到hasOwnProperty方法。这个方法可以用来检测一个对象是否含有特定的自身属性;和in运算符不同,该方法会忽略掉那些从原型链上继承到的属性。
用法:
a. 使用hasOwnProperty方法判断属性是否存在
b. 区别自身属性与继承属性
c. 遍历一个对象的所有自身属性
d. 使用hasOwnProperty作为属性名
具体知识点请参考 Object.prototype.hasOwnProperty()若对象里面编写了原型属性,但遍历的时候并不想让其显示出来,就可以使用对象名.hasOwnProperty(属性名) 来判断是否是自身属性,若是自己的则返回值为true,若不是自身原型属性则返回值为false。实例如下:
var obj = { name: 'ABC', age: '18', sex: 'male', __proto__: { heart: 'happy' } } for (var prop in obj) { // 配套使用,起到一个过滤的作用,不把原型链上的数据弄出来 if (obj.hasOwnProperty(prop)) { console.log(obj[prop]);// ABC 18 male } }个人笔记,欢迎大家交流探讨!
总结
《魔兽世界》大逃杀!60人新游玩模式《强袭风暴》3月21日上线
暴雪近日发布了《魔兽世界》10.2.6 更新内容,新游玩模式《强袭风暴》即将于3月21 日在亚服上线,届时玩家将前往阿拉希高地展开一场 60 人大逃杀对战。
艾泽拉斯的冒险者已经征服了艾泽拉斯的大地及遥远的彼岸。他们在对抗世界上最致命的敌人时展现出过人的手腕,并且成功阻止终结宇宙等级的威胁。当他们在为即将于《魔兽世界》资料片《地心之战》中来袭的萨拉塔斯势力做战斗准备时,他们还需要在熟悉的阿拉希高地面对一个全新的敌人──那就是彼此。在《巨龙崛起》10.2.6 更新的《强袭风暴》中,玩家将会进入一个全新的海盗主题大逃杀式限时活动,其中包含极高的风险和史诗级的奖励。
《强袭风暴》不是普通的战场,作为一个独立于主游戏之外的活动,玩家可以用大逃杀的风格来体验《魔兽世界》,不分职业、不分装备(除了你在赛局中捡到的),光是技巧和战略的强弱之分就能决定出谁才是能坚持到最后的赢家。本次活动将会开放单人和双人模式,玩家在加入海盗主题的预赛大厅区域前,可以从强袭风暴角色画面新增好友。游玩游戏将可以累计名望轨迹,《巨龙崛起》和《魔兽世界:巫妖王之怒 经典版》的玩家都可以获得奖励。
更新动态
- 《庄心妍 实力唱将 发烧音乐精选集》[WAV+CUE][380MB]
- [音展纪念碟]2006年《TAA台湾第十六届国际HI-ENDHI-FI音响展》2cd[WAV]
- 中国音乐地图之听见西藏山歌牧歌酒歌2020[WAV分轨]
- 王宏伟2017-永远的红飘带[太平洋影音][WAV+CUE]
- 费翔.1997-NOW现在【第一中国】【WAV+CUE】
- 新格合唱团.1981-我唱你和2辑(滚石新格民歌系列)【新格】【WAV+CUE】
- 陈柏宇.2011-QUINQUENNIUM【SONY】【WAV+CUE】
- 雨果唱片-《金唛系列-蔷薇依韵琼瑶》WAV
- 陈百强《凝望(2012华纳LPCD45限量版)[DMI]》[WAV整轨]
- 模拟之声慢刻CD《徐小凤45周年》[德国母带][低速原抓WAV+CUE]
- 《庄心妍 实力唱将 发烧音乐精选集》[WAV+CUE][380MB]
- 《王菲 单曲合集》[FlAC/分轨][520MB]
- 《费玉清 原味再现 水长流》[WAV+CUE][430MB]
- 群星.1992-畅销榜老歌金曲10CD【风格】【WAV+CUE】
- 孙悦.2024-时光音乐会【金蜂】【WAV+CUE】