AngularJS学习之angular.extend用法实例

angular.extend:依次将第二个参数及后续的参数的第一层属性（不管是简单属性还是对象）拷贝赋给第一个参数的第一层属性，即如果是对象，则是引用的是同一个对象，并返回第一个参数对象。

实例一：var r = angular.extend(b, a);将对象a的第一层属性（不管是简单属性还是对象）拷贝赋给对象b的第一层属性，即如果是对象，则是引用的是同一个对象，并返回对象b

var a = {
    name : 'bijian',
    address : 'shenzhen',
    family : {
        num : 6,
        amount : '80W'
    }
};
var b = {};

var r = angular.extend(b, a);
console.log('a:' + JSON.stringify(a));
console.log('b:' + JSON.stringify(b));
console.log('r:' + JSON.stringify(r));

b.address = 'hanzhou';
b.family.amount = '180W';
console.log('a:' + JSON.stringify(a));
console.log('b:' + JSON.stringify(b));
console.log('r:' + JSON.stringify(r));

运行结果：

a:{"name":"bijian","address":"shenzhen","family":{"num":6,"amount":"80W"}}
b:{"name":"bijian","address":"shenzhen","family":{"num":6,"amount":"80W"}}
r:{"name":"bijian","address":"shenzhen","family":{"num":6,"amount":"80W"}}

a:{"name":"bijian","address":"shenzhen","family":{"num":6,"amount":"180W"}}
b:{"name":"bijian","address":"hanzhou","family":{"num":6,"amount":"180W"}}
r:{"name":"bijian","address":"hanzhou","family":{"num":6,"amount":"180W"}}


实例二：var r = angular.extend(b, a, z);相继将对象a、z的第一层属性（不管是简单属性还是对象）拷贝赋给对象b的第一层属性，即如果是对象，则是引用的是同一个对象，并返回对象b

var a = { name : 'bijian',
    address : 'shenzhen',
    family : {
        num : 6,
        amount : '80W'
    }
};
var z = {
    family : {
        amount : '150W',
        mainSource : '经营公司'
    }
};
var b = {};

var r = angular.extend(b, a, z);
console.log('a:' + JSON.stringify(a));
console.log('b:' + JSON.stringify(b));
console.log('r:' + JSON.stringify(r));
b.address = 'hanzhou';
b.family.amount = '180W';
console.log('a:' + JSON.stringify(a));
console.log('b:' + JSON.stringify(b));
console.log('r:' + JSON.stringify(r));
运行结果：

a:{"name":"bijian","address":"shenzhen","family":{"num":6,"amount":"80W"}}
b:{"name":"bijian","address":"shenzhen","family":{"amount":"150W","mainSource":"经营公司"}} 
r:{"name":"bijian","address":"shenzhen","family":{"amount":"150W","mainSource":"经营公司"}} 

a:{"name":"bijian","address":"shenzhen","family":{"num":6,"amount":"80W"}} 
b:{"name":"bijian","address":"hanzhou","family":{"amount":"180W","mainSource":"经营公司"}}
r:{"name":"bijian","address":"hanzhou","family":{"amount":"180W","mainSource":"经营公司"}}


再多的实例也不如源代码来的简单、直接和准确，angular.extend源码如下：
​
/**
 * @ngdoc function 
 * @name angular.extend 
 * @function * * @description 
 * Extends the destination object `dst` by copying all of the properties from the `src` object(s) 
 * to `dst`. You can specify multiple `src` objects. 
 * @param {Object} dst Destination object. 
 * @param {...Object} src Source object(s). 
 * @returns {Object} Reference to `dst`. 
 */ 
function extend(dst) { 
    var h = dst.$$hashKey; 
    forEach(arguments, function(obj){
        if (obj !== dst) {
            forEach(obj, function(value, key){
                dst[key] = value; }); 
        } 
    });  
    setHashKey(dst,h);
    return dst; 
}