javascript中clone对象详解


Posted in Javascript onDecember 03, 2014

  开发中,打断对象间的引用关系,只想下个副本的情况无处不在,clone一个对象就在所难免了。

  JavaScript中,简单的方法就是用JSON函数,将对象stringify成字符串,再parse成一个新对象。要么就是从网上搜个代码,开源社区里面clone的代码还是有不少的。

  代码虽然可以找得到,但,东西永远是别人的,动手学着码永远是个不变的主题。

  自己写了两个克隆的函数:

  cloneOwn:克隆自定义对象的自有属性,不包括继承的属性,属性可以是基本数据类型和数组,自定义的对象,可以制定要克隆的属性名称列表。

  cloneArray: 克隆数组,数组内的元素可以是对象,基本类型。

//第一个参数是被克隆的对象,第二个参数是需要克隆的属性列表

function cloneOwn() {

  var obj = arguments[0];

  if (typeof obj === 'undefined' || obj === null)

      return {};

  if (typeof obj !== 'object')

      return obj;

  //第二个参数是属性名称列表,就采用该列表进行刷选

  //否则就克隆所有属性

  var attrs = arguments[1];

  var enable_spec_attr = true;

  if (!(attrs instanceof Array)) {

      //console.log(attrs);

      attrs = obj;

      enable_spec_attr = false;

  }

  var result = {};

  var i;

  for (i in attrs) {

      attr = enable_spec_attr? attrs[i]: i;

      //console.log(attr);

      if (obj.hasOwnProperty(attr)) {

          if (obj[attr] instanceof Array) {

              result[attr] = cloneArray(obj[attr]);

          }

          else if (typeof obj[attr] === 'object') {

              result[attr] = cloneOwn(obj[attr]);

          } else {

              result[attr] = obj[attr];

          }

      }

  }

  return result;

}
//克隆数组

function cloneArray(array) {

  if (typeof array === 'undefined' || array === null)

    return [];
  if (!(array instanceof Array))

    return [];
  result = [];
  var i;

  for(i in array) {

    if (typeof array[i] !== 'object') {

      result[i] = array[i];

      continue;

    }
    //clone object

    result[i] = cloneOwn(array[i]);

  }
  return result;

}

调用

1.常规克隆自定义对象:

var a = {

    name:'frank',

    age:20

};

var b= cloneOwn(a);

2.指定克隆的属性

var a = {

    name:'frank',

    age:20,

    address:'any where'

};

var b = cloneOwne(a, ['name', 'age']);

3.克隆内含有数组属性的自定义对象

var a = {

    name: 'kxh',

    age: 20,

    books: ['hai','ho','ali'],

    likes: [

        {wname: 'kaili', wage: 81, fav: "aaaaa"},

        {wname: 'seli', wage: 82, fav: "bbb"},

        {wname: 'ailun', wage: 83, fav: "ccc"},]

};

var b = cloneOwne(a);

4.克隆数组,内含有自定义对象

var a = [

   {

      name:'frank',

      age:20

    },

    {

       name:'leon',

       age:30

     }

];

var b = cloneArray(a);

上面的代码还是有很多问题的,比如,内置对象的克隆就存在点问题,例如datatime类型。

问题管问题,这样一个学习过程也是要有的。

Javascript 相关文章推荐
javascript延时重复执行函数 lLoopRun.js
Jun 29 Javascript
IE和FireFox(FF)中js和css的不同
Apr 13 Javascript
在UpdatePanel内jquery easyui效果失效的解决方法
Apr 11 Javascript
Javascript delete 引用类型对象
Nov 01 Javascript
提取字符串中年月日的函数代码
Nov 05 Javascript
JS的框架Polymer中的dom-if和is属性使用说明
Jul 29 Javascript
再谈JavaScript异步编程
Jan 27 Javascript
javascript使用Promise对象实现异步编程
Mar 01 Javascript
JS中with的替代方法与String中的正则方法详解
Dec 23 Javascript
vue 实现小程序或商品秒杀倒计时
Apr 14 Javascript
angula中使用iframe点击后不执行变更检测的问题
May 10 Javascript
vue-cli中实现响应式布局的方法
Mar 02 Vue.js
javascript使用正则表达式检测IP地址
Dec 03 #Javascript
Javascript快速排序算法详解
Dec 03 #Javascript
Javascript冒泡排序算法详解
Dec 03 #Javascript
Javascript堆排序算法详解
Dec 03 #Javascript
node.js下when.js 的异步编程实践
Dec 03 #Javascript
jquery操作 iframe的方法
Dec 03 #Javascript
使用js实现数据格式化
Dec 03 #Javascript
You might like
php 分页原理详解
2009/08/21 PHP
discuz authcode 经典php加密解密函数解析
2020/07/12 PHP
从零开始学YII2框架(五)快速生成代码工具 Gii 的使用
2014/08/20 PHP
PHP扩展框架之Yaf框架的安装与使用
2016/05/18 PHP
Yii2中cookie用法示例分析
2016/07/18 PHP
php计数排序算法的实现代码(附四个实例代码)
2020/03/31 PHP
Javascript 原型和继承(Prototypes and Inheritance)
2009/04/01 Javascript
Jquery之美中不足小结
2011/02/16 Javascript
javascript修改IMG标签的src问题
2014/03/28 Javascript
基于javascript实现根据身份证号码识别性别和年龄
2016/01/22 Javascript
JS使用正则表达式实现关键字替换加粗功能示例
2016/08/03 Javascript
Bootstrap缩略图与警告框学习使用
2017/02/08 Javascript
vue.js+Echarts开发图表放大缩小功能实例
2017/06/09 Javascript
JavaScript用200行代码制作打飞机小游戏实例
2017/06/21 Javascript
vue.js实现单选框、复选框和下拉框示例
2017/07/18 Javascript
javascript 中事件冒泡和事件捕获机制的详解
2017/09/01 Javascript
JavaScript设计模式之模板方法模式原理与用法示例
2018/08/07 Javascript
vue 本地服务不能被外部IP访问的完美解决方法
2018/10/29 Javascript
Javascript实现打鼓效果
2021/01/29 Javascript
[01:32]完美世界DOTA2联赛10月29日精彩集锦
2020/10/30 DOTA
django使用xadmin的全局配置详解
2019/11/15 Python
详解Python在使用JSON时需要注意的编码问题
2019/12/06 Python
Python通过正则库爬取淘宝商品信息代码实例
2020/03/02 Python
vue常用指令代码实例总结
2020/03/16 Python
python实现ftp文件传输系统(案例分析)
2020/03/20 Python
Django设置Postgresql的操作
2020/05/14 Python
Python+logging输出到屏幕将log日志写入文件
2020/11/11 Python
CK巴西官方网站:Calvin Klein巴西
2019/07/19 全球购物
澳大利亚领先的时尚内衣零售商:Bras N Things
2020/07/28 全球购物
美国工业用品采购网站:Zoro.com
2020/10/27 全球购物
市场开发与营销专业求职信
2013/12/31 职场文书
集体备课反思
2014/02/12 职场文书
党员公开承诺书和承诺事项
2014/03/25 职场文书
2015年党员创先争优承诺书
2015/01/22 职场文书
上诉答辩状范文
2015/05/22 职场文书
中秋节祝酒词
2015/08/12 职场文书