AngularJS学习之angular.extend用法实例

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

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

AngularJS学习之angular.extend用法实例相关推荐

angular中copy和extend用法实例
angular.copy() 深拷贝定义: 复制一个对象或者一个数组 1. 如果省略了destination,一个新的对象或数组将会被创建出来: 2. 如果提供了destination,则sourc ...
python模块用法教程_Python学习之asyncore模块用法实例教程
本文以实例分析了Python中asyncore模块的原理及用法,分享给大家供大家参考.具体分析如下: asyncore库是python的一个标准库,它是一个异步socket的包装.我们操作网络的时候可 ...
PHP - 回调函数概念与用法实例分析 - 学习/实践
1.应用场景主要用于理解回调函数的概念, 对比JavaScript中的回调函数, 更加深刻理解回调函数的本质, 以及如何高效使用~~~ 2.学习/操作 1. 文档阅读 https://www.jb5 ...
mysql数据库select语句用法_mysql学习笔记之完整的select语句用法实例详解
本文实例讲述了mysql学习笔记之完整的select语句用法.分享给大家供大家参考,具体如下: 本文内容: 完整语法去重选项字段别名数据源 where group by having order ...
angularjs学习总结（资料收集）
angularjs学习总结(资料收集) 原文地址https://blog.csdn.net/weixin_33178524/article/details/79179597 1 前言前端技术的发展是 ...
开启AngularJS学习之旅
AngularJS 通过新的属性和表达式扩展了 HTML. AngularJS 可以构建一个单一页面应用程序(SPAs:Single Page Applications). AngularJS 学习起 ...
推荐10个很棒的AngularJS学习指南
AngularJS 是非常棒的JS框架,能够创建功能强大,动态功能的Web app.AngularJS自2009发布以来,已经广泛应用于Web 开发中.但是对想要学习Angular JS 的人而言,只 ...
angularjs学习大纲
l什么是angularJs? •基于javascript开发的客户端应用框架,使我们可以更加快捷,简单的开发web应用. •诞生于2009年,后来被google收购,用在了很多项目中. •适用于CRU ...
AngularJS学习之旅—AngularJS 模块(十五)
一.AngularJS 模块模块定义了一个应用程序. 模块是应用程序中不同部分的容器. 模块是应用控制器的容器. 控制器通常属于一个模块. 1.创建模块通过 AngularJS 的 angular ...

AngularJS学习之angular.extend用法实例

AngularJS学习之angular.extend用法实例相关推荐

最新文章

热门文章