AngularJS extend usage details and example code

AngularJS extend usage

Angular.extend: Copy and assign the first-level properties of the second parameter and subsequent parameters (whether they are simple properties or objects) to the first-level properties of the first parameter, that is, if it is an object , it refers to the same object and returns the first parameter object.

                                                            var r = angular.extend(b, a); Copy and assign the first-level properties of object a (whether it is a simple property or an object) to the first-level properties of object b, that is, if it is an object, It refers to the same object and returns the object b

Js code

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));

Running result:

Text code

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"}}

Example 2: var r = angular.extend( b, a, z); successively copy and assign the first-level attributes of objects a and z (whether they are simple attributes or objects) to the first-level attributes of object b, that is, if it is an object, it refers to the same object. , and return the object b

Js code

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));

Run result:

Text code

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":"经营公司"}}

No matter how many examples there are, it is not as simple, direct and simple as the source code Accurate, angular. The extend source code is as follows:

Js code

/**
 * @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;
}