詳解jQuery的拷貝對象

更新時間：2021年11月22日 11:40:44 作者：知秋之

這篇文章主要為大家介紹了jQuery的拷貝對象，具有一定的參考價值，感興趣的小伙伴們可以參考一下，希望能夠給你帶來幫助

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <script src="jquery.min.js"></script>
    <script>
        $(function() {
            //1， 普通拷貝，默認為淺拷貝
            var targetObj = {};
            var obj = {
                id: 1,
                name: "andy"
            };
            $.extend(targetObj, obj); //拷貝語法，把obj內的屬性和屬性值拷貝給targetObj一個空對象
            console.log(targetObj); //輸出結果是 obj對象里面的內容
            //2. 拷貝對象里面有屬性和屬性值情況下
            var targett = {
                id: 0,
                gshg: 55
            };
            var objrr = {
                id: 1,
                name: "andy"
            };
            $.extend(targett, objrr);
            console.log(targett); // 如果拷貝對象targett里面屬性和被拷貝對象objrr里面屬性有相同的，則objrr里面屬性值會覆蓋掉targett里面屬性值
            //如果拷貝對象targett里面有屬性與被拷貝對象objrr里面屬性名不相同的不會被覆蓋，被拷貝對象objrr里面屬性只會后來居上
            //3. 拷貝對象里面有對象情況下，淺拷貝
            var taytuj = {
                id: 0,
                msg: {
                    sex: '男'
                }
            };
            var rete = {
                id: 1,
                name: "andy",
                msg: {
                    age: 18
                }
            };
            $.extend(true, taytuj, rete);
            console.log(taytuj);
            // 執(zhí)行過程：
            //1.兩個對象都在內存棧中，其中rete對象里面的 msg: {  age: 18  }對象放在了內存堆中，在淺拷貝中，rete對象里面的 msg: {  age: 18  }會覆蓋掉taytu對象的msg: {sex: '男' }，屬性值會變成一個16進制指向內存堆中的msg: {  age: 18  }對象,此時棧空間中兩個對象的 msg里面都有同一個執(zhí)向內存堆中msg: {  age: 18  }的16進制地址，所以如果淺拷貝完成后，兩個對象里面msg屬性值只要一個發(fā)生了改變，另外一個msg的屬性值也會隨著一起改變
            //淺拷貝：
            //1.屬性名相同的，被拷貝對象會覆蓋掉拷貝對象，排序永遠是后來居上
            //2. 屬性名不相同的則合并
            //深拷貝：
            //1.屬性名相同的，被拷貝對象的屬性和屬性值會覆蓋掉拷貝對象的屬性和屬性值，排序永遠是后來居上
            //2. 屬性名不相同的則合并
            //3.拷貝對象和拷貝對象里面有對象的，如果對象名相同，屬性名不同，則會合并，并不是覆蓋。
        })
    </script>
</head>
<body>
</body>
</html>