万物皆对象
首先来看几个浅复制
浅度复制
var obj = {a:1,b:2,c:3}
var obj1 = {}
for(var prop in obj){
obj1[prop] = obj[prop]
}
obj["a"] = 100
console.log(obj)
console.log(obj1)
打印出来 复制出来的值就不会因为obj的属性改变而改变、完成浅复制
接下来看一下Object带的一种复制方法 Object.assign()
var obj = {a:1,b:2,c:3}
var obj1 = Object.assign({},obj)
obj["a"] = 100
console.log(obj)
console.log(obj1)
假如说
var obj = {a:1,b:2,c:{
a:1,b:2,c:{
a:1,b:2
},d:{
a:1,c:2,c:3
}
}}
这个对象做一个复制、上述的方法是不行的、所以我们可以使用下面这种方法进行深复制
var obj1 = cloneObject (obj,{})
function cloneObject(source,target){
for(var prop in source){
if(typeof(source[prop]) === "object" && source[prop] !== null){
var obj = {}
cloneObject(source[prop],obj)
target[prop] = obj
}else{
target[prop] = source[prop]
}
}
return target
}
console.log(obj1)
这样、当我改变值obj的值时、obj1也不会改变、完成深复制
当然深复制不止这一种方法
接下来看一种比较难的
当我们需要复制一个Dom元素时、也可以选择这种（如果你了解原型和对象描述会更好理解）
<body>
<div class="div1"></div>
<div class="div1"></div>
<div class="div1"></div>
<script>
var obj1={};
Object.defineProperties(obj1,{
a:{
value:1
},
b:{
writable:true,
enumerable:true,
value:2
},
c:{
configurable:true,
writable:true,
value:3
},
d:{
enumerable:true,
set:function(value){
this._d=value;
},
get:function(){
if(!this._d) this._d=0;
return this._d;
}
}
});
var obj={
a:1,
b:[1,2,3],
c:{
a:"a",
b:true,
c:{
a:new Date(),
b:/^[a-z](!=[0-9])$/i,
c:{
a:new XMLHttpRequest(),
b:[
[1,2,3,4,5],
[2,3,4,5,6],
[3,4,5,6,7]
],
c:{
a:[
{a:1,b:2},
{a:2,b:3},
{a:3,b:4}
],
b:function(){
console.log("aaa");
},
c:obj1,
d:document.querySelector(".div1")
}
}
}
}
}
var obj2=cloneObject({},obj);
var names = Object.getOwnPropertyNames(source)
for(var i =0;i<names.length;i++){
var desc = Object.getOwnPropertyDescriptor(source,names[i])
if(typeof desc.value ==="object" && desc.value!==0){
var objs
if(desc.value.constructor === Date){
objs = new desc.value.constructor(desc.value)
}else if(desc.value.constructor === RegExp){
objs = new desc.value.constructor(desc.value.source,desc.value.flags)
}else if(desc.value.__proto__.__proto__&&desc.value.__proto__.__proto__.constructor === HTMLElement){
objs = document.createElement(desc.value.nodeName)
}else{
objs = new desc.value.constructor()
}
Object.defineProperty(source,names[i],{
writable: desc.writable,
enumerable: desc.enumerable,
configurable: desc.configurable,
value: objs
})
cloneObject(objs,desc.value)
}else{
Object.defineProperty(source,names[i],desc)
}
}
return target
}
</script>
</body>
对于前端
我远没有达到精通
只是一直在路上
