21-angular.merge

最新推荐文章于 2020-08-28 14:57:17 发布

weixin_34014555

最新推荐文章于 2020-08-28 14:57:17 发布

阅读量111

点赞数

原文链接：http://www.cnblogs.com/ms-grf/p/6979095.html

版权

　　通过从src对象(s)复制自己的可枚举属性到dst，深度扩展了目标对象的dst。您可以指定多个src对象。如果您想保留原始对象，那么可以通过将空对象作为目标来实现:var object = angular.merge({}, object1, object2).

　　不像extend(),merge()递归地进入源对象的对象属性，执行一个深度拷贝

<!DOCTYPE html>
<html ng-app="extendApp">
<head>
    <meta charset="UTF-8">
    <title></title>

    <script src="../js/angular.js"></script>
    <script type="text/javascript">
        angular.module("extendApp", [])
                .controller("extendController", function ($scope) {
                    $scope.src = {
                        a: 'A',
                        b: 'B',
                        c: {
                            d: 'D',
                            e: {
                                f: 'F'
                            }
                        }
                    };
                    $scope.src2 = {
                        c: {
                            src2: 'D',
                            e: {
                                src2: 'src2',
                                f: 'FFFFF'
                            }
                        }
                    };
                    $scope.dest = {
                        A: 'a'
                    };
                    $scope.temp = angular.merge($scope.dest, $scope.src, $scope.src2);
                    $scope.change = function () {
                        $scope.temp.A = 'changed';
                    }
                });
    </script>
</head>
<body>
<div ng-controller="extendController">
    <button ng-click="change()">点击我！</button>
</div>
</body>
</html>

效果：

src: {"a":"A","b":"B","c":{"d":"D","e":{"f":"F"}}}
src2: {"c":{"src2":"D","e":{"src2":"src2","f":"FFFFF"}}}
temp: {"A":"a","a":"A","b":"B","c":{"d":"D","e":{"f":"FFFFF","src2":"src2"},"src2":"D"}}
dest: {"A":"a","a":"A","b":"B","c":{"d":"D","e":{"f":"FFFFF","src2":"src2"},"src2":"D"}}
点击button后

src: {"a":"A","b":"B","c":{"d":"D","e":{"f":"F"}}}
src2: {"c":{"src2":"D","e":{"src2":"src2","f":"FFFFF"}}}
temp: {"A":"changed","a":"A","b":"B","c":{"d":"D","e":{"f":"FFFFF","src2":"src2"},"src2":"D"}}
dest: {"A":"changed","a":"A","b":"B","c":{"d":"D","e":{"f":"FFFFF","src2":"src2"},"src2":"D"}}

　　如下图，在extend中，src中的c对象会被src2中的c对象覆盖；在merge中，会将两个源中的对象都拷贝，如src中c对象中的d，如果两个源中存在相同对象，并且相同对象中存在相同key，key对应的值会被后者覆盖。

转载于:https://www.cnblogs.com/ms-grf/p/6979095.html