Angular2中实现基于TypeScript的对象合并方法:extend()
TypeScript里面没有现成的合并对象的方法,这里借鉴jQuery里的$.extend()方法。写了一个TypeScript的对象合并方法,使用方法和jQuery一样。
部分代码和jQuery代码略有不同,主要是判断元素是否为 数组 和 纯对象 的部分。jQuery中有方法可直接判断元素是否为数组($.isArray())和对象($.isPlainObject()),但是TpyeScript里面没有,这里按照jQuery的实现写了一下判断,大部分情况应该没问题,但不保证适用所有情况。感兴趣的话可以体会一下,遇到什么问题一起讨论一下。
public class2type = {};
ngOnInit() {
this.getClass2type();
} /**
* 对象拷贝,参考$.extend()实现。首个参数为true时为深度拷贝,默认为false。
*
* @param {any} args
* @returns
* @memberof SharedService
*/
extend(...args) {
let options, name, src, srcType, copy, copyType, copyIsArray, clone,
target = args[0] || {},
i = 1,
length = args.length,
deep = false; if ( typeof target === 'boolean') {
deep = target;
target = args[i] || {};
i++;
}
if ( typeof target !== 'object' && typeof target !== 'function') {
target = {};
}
if ( i === length) {
target = this;
i--;
}
for ( ; i < length; i++ ) {
if ( (options = args[i]) !== null ) {
for ( name in options ) {
src = target[name];
copy = options[name];
// 若参数中字段的值就是目标参数,停止赋值,进行下一个字段的赋值
// 这是为了防止无限的循环嵌套
if ( target === copy ) {
continue;
}
srcType = this.isArray(src) ? 'array': typeof src;
// 不能用typeof判断一个数组是否为数组格式,例:typeof [] -> object。如需判断的话可用'[] instanceof Array'方法。
// copyType = typeof copy;
if ( deep && copy && ((copyIsArray = this.isArray(copy)) || typeof copy === 'object')) {
if ( copyIsArray ) {
copyIsArray = false;
clone = src && srcType === 'array' ? src : [];
} else {
clone = src && srcType === 'object' ? src: {};
}
target[name] = this.extend(deep, clone, copy);
} else if ( copy !== undefined ) {
target[name] = copy;
}
}
}
}
return target;
} public isArray = Array.isArray || function(obj) {
return this.type(obj) === 'array';
} private type(obj: object) {
if (obj === null) {
return obj + "";
}
return typeof obj === 'object' || typeof obj === 'function' ?
this.class2type[this.toString.call(obj)] || 'object' :
typeof obj;
} private getClass2type() {
'Boolean Number String Function Array Data RegExp Object Error'.split(' ').forEach(name => {
this.class2type['[object' + name + ']'] = name.toLowerCase();
});
} // 深度遍历,使用方法:
let newObj = this.extend(true, {}, objA, objB);
Angular2中实现基于TypeScript的对象合并方法:extend()的更多相关文章
- SpringMvc4中获取request、response对象的方法
springMVC4中获取request和response对象有以下两种简单易用的方法: 1.在control层获取 在control层中获取HttpServletRequest和HttpServle ...
- jQuery对象扩展方法(Extend)深度解析
1.这几天在写自己的Js工具类库,所以在编写对象扩展方法,参考了jQuery的对象扩展方法,在编写该方法前,需要掌握js深拷贝和浅拷贝的相关知识,下面是jQuery3.2.1版本对象扩展方法的源码: ...
- js中常用的获得日期对象的方法
// 默认是当前时区的日期和时间 var date = new Date(); // 获取特定日期和时间的日期对象,需要传递毫秒数,不过可以传递规范日期格式字符串来代替 // 一些常见的日期格式 // ...
- 实现一种快速查找Richedit中可见区域内OLE对象的方法
Richedit是一个OLE容器,使用Richedit来显示IM聊天内容时,通常使用OLE对象来实现在Richedit中播放表情动画. 触发表情的绘制有两种途径: 1.来自Richedit的刷新消息. ...
- Java中四种遍历Map对象的方法
方法一:在for-each循环中使用entry来遍历,通过Map.entrySet遍历key和value,这是最常见的并且在大多数情况下也是最可取的遍历方式.在键值都需要时使用. Map<Int ...
- java中获取request与response对象的方法
Java 获取Request,Response对象方法 第一种.参数 @RequestMapping("/test") @ResponseBody public void sa ...
- jquery中onclick="fn"中$(this)所代表的对象
jquery中onclick="fn"中$(this)所代表的对象 js方法 function qiehuan(){ var src = $(this).attr("da ...
- VBA学习笔记(1)----VBA对象属性方法
'VBA对象 'VBA中的对象其实就是我们操作的具有方法.属性的excel中支持的对象 'Excel中的几个常用对象表示方法 '1.工作簿 ' Workbooks 代表工作簿集合,所有的工作簿,Wor ...
- 如何在ASP.NET 5上搭建基于TypeScript的Angular2项目
一.前言 就在上月,公司的一个同事建议当前的前端全面改用AngularJs进行开发,而我们采用的就是ASP.NET 5项目,原本我的计划是采用TypeScript直接进行Angular2开发.所以借用 ...
随机推荐
- CodeForces - 697F:Legen... (AC自动机+矩阵)
Barney was hanging out with Nora for a while and now he thinks he may have feelings for her. Barney ...
- java-01
二,八,十六进制到十进制的转换方法: 十进制到二,八,十六进制的转换方法: 2:标识符(掌握) (1)就是给类,接口,方法,变量等起名字的字符序列 (2)组成规则: A:英文大小写字母 B:数字 C: ...
- mysql数据库表分区详解(数量过大的数据库表通过分区提高查询速度)
这篇文章主要介绍了MySQL的表分区,例如什么是表分区.为什么要对表进行分区.表分区的4种类型详解等,需要的朋友可以参考下 一.什么是表分区通俗地讲表分区是将一大表,根据条件分割成若干个小表.mysq ...
- javacpp-FFmpeg系列之3: 像素图像数据转换(BGR与BufferdImage互转,RGB与BufferdImage互转,BufferdImage转Base64编码)
javacpp-ffmpeg系列: javacpp-FFmpeg系列之1:视频拉流解码成YUVJ420P,并保存为jpg图片 javacpp-FFmpeg系列之2:通用拉流解码器,支持视频拉流解码并转 ...
- 把myeclipse中的web项目导入eclipse中不能编程web项目的解决办法
title: 把myeclipse中的web项目导入eclipse中不能编程web项目的解决办法 tags: grammar_cjkRuby: true --- 右键单击项目,properties-- ...
- linux 命令2
who who am i ssh scott@192.168.1.105 ps aux | grep pts/8 pwd // where are you? Page 205 mkdir -p dir ...
- linux cpu内存利用率获取
有了这么好的工具,我们还需要自己造轮子么? 两种情况,如果有复杂的监控需求,而且愿意花时间学习,我们可以使用nmon:但如果监控需求特殊比如说还要监控单个进程的情况,这时候就需要自己动手实现了.自己动 ...
- [Forward]Improving Web App Performance With the Chrome DevTools Timeline and Profiles
Improving Web App Performance With the Chrome DevTools Timeline and Profiles We all want to create h ...
- JavaScript高级程序设计学习笔记第十一章--DOM扩展
1.对 DOM 的两个主要的扩展是 Selectors API(选择符 API)和 HTML5 2.Selectors API Level 1 的核心是两个方法: querySelector()和 q ...
- 世界虽大,但没有破不了的wifi
附加知识: 无线网卡的几种常见工作模式(mode)有: master managed monitor ad-hoc ... 1. [master] 这种模式是常见的AP模式,无线模块本身作为wifi ...