Maison > Article > interface Web > Raisons et solutions de l'échec de la copie approfondie des objets dans js (code)
Raisons et solutions de l'échec de la copie approfondie des objets dans js (code)
- 不言original
- 2018-08-21 15:44:321281parcourir
Le contenu de cet article concerne les raisons de l'échec de la copie profonde des objets dans js et les solutions (code). Il a une certaine valeur de référence. J'espère que cela sera utile. toi.
J'ai expérimenté js avant de savoir que c'est en fait un peu délicat
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>测试</title>
<script type="text/javascript">
// 排序算法
function bubbleSort(arr) {
var len = arr.length;
for (var i = 0; i < len; i++) {
for (var j = 0; j < len - 1 - i; j++) {
if (arr[j] > arr[j+1]) { //相邻元素两两对比
var temp = arr[j+1]; //元素交换
arr[j+1] = arr[j];
arr[j] = temp;
}
}
}
return arr;
}
// 定义一个json ab
var ab = {a:[2,1,3,9,4],b:[8,5,3]}
// 定义一个json bc
var bc = {};
// 将json ab 深拷贝给json bc
for(var i in ab){
bc[i]=ab[i];
}
// 对json bc 排序
bubbleSort(bc['a'])
bubbleSort(bc['b'])
// 分别打印 json ab ,json bc ,发现经过排序之后 对 json bc排序之后，
// json ab也被排序，此时意味着深层拷贝失败
document.write('-----------------------'+'<br/>');
document.write(JSON.stringify(ab));
document.write('<br/>'+'-----------------------'+'<br/>');
document.write(JSON.stringify(bc));
</script>
</head>
<body>
</body>
</html>Mon résultat à cette époque était le suivant :
L'objet original est : {a :[2,1,3,9,4],b:[8,5,3]}
Après toutes sortes de cerveaux -burning, j'ai finalement découvert La raison est :
Cette copie profonde, si les objets copiés sont triés, invalidera la copie . Les modifications après le tri seront toujours copiées dans l'objet initial précédent
, il suffit donc de changer la méthode de copie d'objet (copie). L'exemple est le suivant :
<.><!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>测试</title>
<script type="text/javascript">
// 排序算法
function bubbleSort(arr) {
var len = arr.length;
for (var i = 0; i < len; i++) {
for (var j = 0; j < len - 1 - i; j++) {
if (arr[j] > arr[j+1]) { //相邻元素两两对比
var temp = arr[j+1]; //元素交换
arr[j+1] = arr[j];
arr[j] = temp;
}
}
}
return arr;
}
// 定义一个json ab
var ab = {a:[2,1,3,9,4],b:[8,5,3]}
// 定义一个json bc
var bc = {};
// 将json ab 深拷贝给json bc
/*for(var i in ab){
bc[i]=ab[i];
}*/
function clone(obj) {
// Handle the 3 simple types, and null or undefined or function
if (null == obj || "object" != typeof obj) return obj;
// Handle Date
if (obj instanceof Date) {
var copy = new Date();
copy.setTime(obj.getTime());
return copy;
}
// Handle Array or Object
if (obj instanceof Array | obj instanceof Object) {
var copy = (obj instanceof Array)?[]:{};
for (var attr in obj) {
if (obj.hasOwnProperty(attr))
copy[attr] = clone(obj[attr]);
}
return copy;
}
throw new Error("Unable to clone obj! Its type isn't supported.");
}
bc = clone(ab);
// 对json bc 排序
bubbleSort(bc['a'])
bubbleSort(bc['b'])
// 分别打印 json ab ,json bc ,发现经过排序之后 对 json bc排序之后， json ab也被排序，此时意味着深层拷贝失败
document.write('-----------------------'+'<br/>');
document.write(JSON.stringify(ab));
document.write('<br/>'+'-----------------------'+'<br/>');
document.write(JSON.stringify(bc));
</script>
</head>
<body>
</body>
</html>
Les raisons et solutions de l'échec du chargement des fichiers css et js dans le framework php ci,
JavaScript Explication détaillée des exemples de copie profonde et superficielle d'objets
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!