JS中实现深度拷贝,复制一个对象

JavaScript041

JS中实现深度拷贝,复制一个对象,第1张

在JS中拷贝、复制一个对象的方式有多种,我常用的一般是 Object.assign({},sourceObj)。

Object.assign()因为 Object.assign()拷贝的是属性值。假如源对象的属性值是一个对象的引用,那么它也只指向那个引用。如果合并的对象是多层嵌套对象那就属于浅拷贝了,修改内层对象的值还是会影响原对象。

要想实现深度复制可以使用JSON方式。

写法如下:

它的原理是把JS对象转换为JSON字符串,再由JSON字符串转换为JS对象,这样新对象的指针就不会指向原对象的指针了。但这种也有副作用的,有一下几点副作用:

1、有属性包含时间对象,拷贝后就是字符串的形式。

2、有函数或undefined,拷贝后会丢失。

3、有RegExp和Error对象,拷贝后变为空对象。

4、存在循环引用的情况,没法正确拷贝。

5、内层对象是构造函数生成的,会丢失constructor。

6、属性值为NaN、Infinity,拷贝后变为null。

虽然有些副作用,但大多情况还是符合要求可以使用。

js实现点击后将文字或图片复制到剪贴板的方法,代码非常简洁实用,具体功能代码如下所示:

<table width="99%" border="0" cellpadding="0" cellspacing="0" class="firtable">

<tr>

<th width="100%" style="color: white"><s:text name="询单明细"></s:text></th>

</tr>

<tr>

<td align="center">

<textarea name="inquiryContact1" id="inquiryContact1" rows="15" cols="60" readonly="readonly"></textarea>

<div id="inquiryInfoDIV" style="display:none">

<s:property value="inquiryContact" escape="false"/>

</div>

<script>dojo.byId("inquiryContact1").innerText=dojo.byId("inquiryInfoDIV").innerText

</script>

</td></tr>

<tr>

<td align="center">

<input type="button" id="button" name="button" value="复制" onclick="copyContact()"/>

</td></tr></table>

<script type="text/javascript">

var i = 0

function copyContact(){

var contat = document.getElementById("inquiryContact1").value

window.clipboardData.setData('text', contat)

if(window.clipboardData.getData('text')==''){

if(i==1){

alert("复制失败,请手动Ctrl+C快捷键复制!")

}else{

alert("复制失败,请重新复制!")

i = 1

}

}else{

alert("内容已经复制到剪贴板!")

}

}

</script>