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开发.所以借用 ...
随机推荐
- MySQL与EXCEL sum sumif sumifs 函数结合_品牌汇总_20161101
计算一些数不难,整体来说还是要培养自我的逻辑意识,逻辑清楚,代码自然而然就知道,总体上训练自己的逻辑,一个是从用户角度,一个是从产品角度. 用户角度需要考虑的是用户的活跃度,具体又可以细分为用户的注册 ...
- ACM学习历程—HDU 5326 Work(树形递推)
Problem Description It’s an interesting experience to move from ICPC to work, end my college life an ...
- sqlServer对内存的管理
简介 理解SQL Server对于内存的管理是对于SQL Server问题处理和性能调优的基本,本篇文章讲述SQL Server对于内存管理的内存原理. 二级存储(secondary storage) ...
- Collection与Map总结
顺序表和链表统称为线性表:顺序表一般表现为数组,如:ArrayList的实现;链表有单链表.双链表.循环链表的区分,如:LinkedArrayList由双链表+哈希表实现
- Hibernate Session的delete()方法
本文介绍Hibernate Session的delete()方法.delete()方法用于从数据库中删除与Java对象对应的记录.对应游离对象和持久化对象,delete语句会做出不同的反应. AD: ...
- 3.7-3.9 HBase表属性
一.表压缩 1.HBase Sanppy HBase Sanppy 1)配置Haodop压缩 [beifeng@hadoop-senior hadoop-2.5.0]$ bin/hadoop chec ...
- Swoole 协程 MySQL 客户端与异步回调 MySQL 客户端的对比
Swoole 协程 MySql 客户端与 异步回调 MySql 客户端的对比 为什么要对比这两种不同模式的客户端? 异步 MySQL 回调客户端是虽然在 Swoole 1.8.6 版本就已经发布了, ...
- Redis使用的相关问题
Redis用那些数据结构? 字符串类型String 字典Hash 列表List 集合Set 有序集合SortedSet HyperLogLog.Geo.Pub/Sub Redis Module.Blo ...
- php查询内存信息
php查询内存信息,是为了更好的查看内存使用情况,更好的优化代码. 查看当前内存使用情况使用:memory_get_usage()函数. 查看内存使用峰值:memory_get_peak_usage( ...
- php array数组(第一部分)
创建一个数组 <?php $arr = array("My","name","is","zhangsan"); e ...