angularjs 常用方法
一 angular的copy和extend
1.angular.extend()
angular.extend():依次将第二个参数及后续的参数的第一层属性(不管是简单的属性还是对象)拷贝,赋给第一个参数的第一层属性。也就是说,如果是对象,那么引用的是同一个对象,并返回第一个参数对象。
用法1:angular.extend(b,a); 将a拷贝给b
将a拷贝给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"}}
用法2:angular.extend(b, a, z); 相继将对象a,z拷贝赋给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":"经营公司"}}
2.angular.copy()
angular.extend()是浅拷贝,而angular.copy()是深拷贝。这两个有什么区别呢,看同样的例子。
用法1:angular.copy(a,b); 将对象a中的属性深度拷贝给b
这里a和b不会相互依赖,a和b是完全脱离关联的
var a = { name : 'bijian', address : 'shenzhen', family : { num : 6, amount : '80W' } }; var b = {}; var r = angular.copy(a, b); 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":"80W"}} b:{"name":"bijian","address":"hanzhou","family":{"num":6,"amount":"180W"}} r:{"name":"bijian","address":"hanzhou","family":{"num":6,"amount":"180W"}}
用法2:var r=angular.copy(a); 将对象a对象的属性深度拷贝给对象r
var a = { name : 'bijian', address : 'shenzhen', family : { num : 6, amount : '80W' } }; var r = angular.copy(a); console.log('a:' + JSON.stringify(a)); console.log('r:' + JSON.stringify(r)); a.address = 'hanzhou'; a.family.amount = '180W'; console.log('a:' + JSON.stringify(a)); console.log('r:' + JSON.stringify(r));
结果:
a:{"name":"bijian","address":"shenzhen","family":{"num":6,"amount":"80W"}} r:{"name":"bijian","address":"shenzhen","family":{"num":6,"amount":"80W"}} a:{"name":"bijian","address":"hanzhou","family":{"num":6,"amount":"180W"}} r:{"name":"bijian","address":"shenzhen","family":{"num":6,"amount":"80W"}}
二 angular判断数据类型
方法 | 说明 |
---|---|
angular.isString() | 判断是否是字符串 |
angular.isObject() | 判断是否是对象,注意,它不把null视为对象,数组是对象 |
angular.isArray() | 判断是否为数组 |
angular.isDtae | 判断是否是时间 |
angular.isNumber | 判断是否是数字 |
angular.isDefined() | 判断是否存在 |
angular.isUndefined() | 判断是否是undefined |
angular.isFunction() | 判断是否为函数 |
angular.isElement() | 判断是否是一个DOM元素或者包装的jQuery元素 |
var div = angular.element("#findMe"); var str = "1"; var num = 1; var obj = { value: 1 }; var arr = [obj, str]; var date = new Date(); var fn = function(){// your code }; var divIsElement = angular.isElement(div); //divIsElement = true var strIsString = angular.isString(str); //strIsString = true var numIsNumber = angular.isNumber(num); //numIsNumber = true var objIsObject = angular.isObject(obj); //objIsObject = true var arrIsArray = angular.isArray(arr); //arrIsArray = true var dateIsDate = angular.isDate(date); //dataIsDate = true var fnIsFunction = angular.isFunction(fn); //fnIsFunction = true var nullIsDefined = angular.isDefined(null); //nullIsDefined = true var undefinedIsUndefined = angular.isUndefined(undefined); //undefinedIsUndefined = true
三 angular.forEach()
var array = ['a','b','c']; angular.forEach(array,function(value,i){console.log(value,i);console.log(this); });
遍历数组,对象也可以。value表示值,i表示索引,而this表示window对象。
四 angular的json和字符串转换
angular为我们提供了原生的JSON.parse()和JSON.stringigy()方法。
angular.fromJson():字符串转json对象
angular.toJson():json对象转字符串
var json = '{"name":"liSi", "password":"321"}'; var obj = angular.fromJson(json);var obj ={name:"liSi", password:"321" } var str = angular.toJson(obj, true);
五 大小写转换
angular.uppercase('hello'); angular.lowercase('HELLO');
转载于:https://www.cnblogs.com/lyy-2016/p/8916415.html
angularjs 常用方法相关推荐
- 关于Angularjs中自定义指令一些有价值的细节和技巧
作者:心叶 时间:2018-04-22 10:58 一:自定义指令常用模板 下面是大致的说明,不是全面的,后面来具体说明一些没有提及的细节和重要的相关知识: angular.module('yello ...
- AngularJs创建自己的Grid–分页组件
我把这个组件命名为tm.pagination,原因是因为起名真的太难起了.而且我网名也叫天名, TM就这样了吧.github地址https://github.com/miaoyaoyao/Angula ...
- AngularJS之禅
AngularJS是客户端MVC框架,它运行在web浏览器中,有助于我们写单页面.AJAX风格的web应用,是一个通用的框架. AngularJS速成 实例:Hello World 首先引用Ang ...
- Web应用程序体系结构– Spring MVC – AngularJs堆栈
Spring MVC和AngularJs共同为构建表单密集型Web应用程序提供了一个真正高效且吸引人的前端开发堆栈.在这篇博客文章中,我们将看到如何使用这些技术构建表单密集型Web应用程序,并将这种方 ...
- AngularJS和DataModel
通常,在AngularJS中使用JSON作为存储数据的模型.我们可能这样在controller中写model: app.controller('BookController',['$scope',fu ...
- AngularJS 杂项知识点
1.要用ngChange要同时使用ngModel,下拉选择获取当前选中值. 2.打包代替动态加载(js文件) requirejs真正的价值在于模块化,不是动态加载,angularjs本身有模块化机制, ...
- angularjs post 跨域
web api搞好了:用Ajax妥妥的:但是前端用的AngulagJS,也懒得再换为Ajax了: 但是问题来了:提示: 已拦截跨源请求:同源策略禁止读取位于 http://x.x.x.x:port/a ...
- AngularJS 指令
1. AngularJS指令的特点: AngularJS通过被称为指令的新属性来扩展HTML,指令的前缀为ng-. AngularJS通过内置的指令来为应用添加功能. AngularJS允许你自定义指 ...
- AngularJS中的按需加载ocLazyLoad
欢迎大家讨论与指导 : ) 初学者,有不足的地方希望各位指出 一.前言 ocLoayLoad是AngularJS的模块按需加载器.一般在小型项目里,首次加载页面就下载好所有的资源没有什么大问题.但是当 ...
最新文章
- python界面设置-PYTHON图形化操作界面的编程七__创建菜单
- 计算机网络-基本概念(4)【网络层】-IPv4向IPv6过渡
- StringBuilder字符串缓冲区
- python网络爬虫系列(十)——chrome在爬虫中的使用
- 水平布局的HTML表单
- tesseract 使用说明
- Ping记录时间的方法
- word2vec 细节解析1
- 替换PanDown神器 更新Pdown 3.4.6 清爽版
- C语言程序设计孙家啸第一版,广东(年4月自考各专业课程使用教材.doc
- Windows11快捷键大全 win11常用快捷键介绍
- 服务器 磁盘阵列数据恢复案例之:RAID6三块磁盘离线数据恢复过程
- 博士申请 | 北京大学MILab招收人工智能/医学影像方向2022级博士生
- 2023湖南师范大学计算机考研信息汇总
- ICML 2020 | SCAFFOLD:联邦学习的随机控制平均
- Linux 不间断后台执行进程
- 男生心疼女生的12种方式
- 请问php中 $_data是啥变量呢
- 201771010101 白玛次仁 《2018面向对象程序设计(Java)》第八周学习总结
- 争议不断的AI绘画,靠什么成为了顶流?