js对象拷贝的方法
对象拷贝的方法是一个难点,尤其是深拷贝。建议把代码都运行下,帮助理解拷贝。
一. json方法
1. 适合情况:
JSON对象的深度克隆。方法是先JSON.stringify() 转为json字符串, 再JSON.parse() 转为json数组
2. 缺点:
a. 如果你的对象里有函数, 函数无法被拷贝下来
b. 无法拷贝copyObj对象原型链上的属性和方法
var obj = {
x: 1,
y: {
a: 1,
b: 0,
c: [1, 2, 3]
}
};
// 相同的引用
var obj2 = obj;
console.log(obj2 == obj); //true 直接复制只是复制对象的指针,还指向同一个对象
//不同的引用
var obj3 = JSON.parse(JSON.stringify(obj));
console.log(obj3 == obj) //false 通过json方法复制后的地址不一样
console.log(obj3);
二. jQuery extend方法
jQuery.extend(object)
概述:
扩展jQuery对象本身,用来在jQuery命名空间上增加新函数。
var obj = {
x: 1,
y: {
a: 1,
b: 0,
c: [1, 2, 3]
}
};
var obj2 = $.extend({}, obj);
console.log(obj2 == obj) //false 复制后的地址不一样
console.log(obj2);
三. Object.create()方法
复制对象存在于Object原型prototype中
var obj = {
x: 1,
y: {
a: 1,
b: 0,
c: [1, 2, 3]
}
};
var obj2 = Object.create(obj);
console.log(obj2 == obj); //false
console.log(obj2);
四. for循环遍历方法
1. 浅拷贝:
只是拷贝了基本类型的数据;然而引用类型数据, 只是复制了指针,复制后也是会发生引用。
除了这个是浅拷贝,本文章介绍的其他方法都是深拷贝。
var obj = {
x: 1,
y: {
a: 1,
b: 0,
c: [1, 2, 3]
}
};
var obj2 = {};
for (var i in obj) { //for in 会遍历对象的属性,包括实例中和原型中的属性。(需要可访问,可枚举属性)
obj2[i] = obj[i];
}
console.log(obj2);
obj2.y.c.push(4); //给新数组添加一个元素4,会同步反映在新旧数组中
console.log(obj2.y.c); // [1,2,3,4]
console.log(obj.y.c); // [1,2,3,4] 浅拷贝只是复制了地址,修改是内存中的数据
2. 深拷贝
深拷贝, 就是遍历那个被拷贝的对象。判断对象里每一项的数据类型。如果不是对象类型, 就直接赋值, 如果是对象类型, 就再次调用递归的方法去赋值。
var obj = {
x: 1,
y: {
a: 1,
b: 0,
c: [1, 2, 3]
}
};
function getClass(o) { //判断数据类型
return Object.prototype.toString.call(o).slice(8, -1);
}
function deepCopy(obj) {
var result, oClass = getClass(obj);
if (oClass == "Object") result = {}; //判断传入的如果是对象,继续遍历
else if (oClass == "Array") result = []; //判断传入的如果是数组,继续遍历
else return obj; //如果是基本数据类型就直接返回
for (var i in obj) {
var copy = obj[i];
if (getClass(copy) == "Object") result[i] = deepCopy(copy); //递归方法 ,如果对象继续变量obj[i],下一级还是对象,就obj[i][i]
else if (getClass(copy) == "Array") result[i] = deepCopy(copy); //递归方法 ,如果对象继续数组obj[i],下一级还是数组,就obj[i][i]
else result[i] = copy; //基本数据类型则赋值给属性
}
return result;
}
var obj2 = deepCopy(obj);
console.log(obj2);
五. 原型链继承方法
function Father() {
this.say = "hi";
this.fn = function () {
return this.say;
}
}
Father.prototype.eat = function () {
console.log('吃');
}
function Son() {
this.play = function () {
console.log('play game');
}
}
//通过原型来继承父类的公共属性
Son.prototype = new Father();
var s = new Son();
console.log(s);
console.log(s.say); //hi
console.log(s.fn()); //hi
js对象拷贝的方法的更多相关文章
- json转js对象方法,JS对象转JSON方法
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...
- js对象3--工厂方法加深引出原型--杂志
继续上一章的案例讲解: <script type="text/javascript"> function createPreason(name,sex){ //他的怪癖 ...
- js 对象拷贝
在JavaScript中,数据类型分为两大类:基本数据类型和复杂数据类型.基本数据类型包括Number.Boolean.String.Null.String),而复杂数据类型包括Object.Func ...
- js对象拷贝遇到的坑
问题:通过拷贝赋值后,所有的对象的name居然都是C test(){ let person = [{'name':'danny'}] let names = ['A','B','C'] let tem ...
- js对象的所有方法
Object构造方法 Object.assign() 将所有可枚举的自身属性的值从一个或多个源对象复制到目标对象. Object.create() 用指定的原型对象和属性创建一个新对象. Object ...
- JS对象 返回星期方法 getDay() 返回星期,返回的是0-6的数字,0 表示星期天。如果要返回相对应“星期”,通过数组完成
返回星期方法 getDay() 返回星期,返回的是0-6的数字,0 表示星期天.如果要返回相对应"星期",通过数组完成,代码如下: <script type="te ...
- JS对象随机数 random() 方法可返回介于 0 ~ 1(大于或等于 0 但小于 1 )之间的一个随机数。 注意:返回一个大于或等于 0但小于1的符号为正的数值
随机数 random() random() 方法可返回介于 0 ~ 1(大于或等于 0 但小于 1 )之间的一个随机数. 语法: Math.random(); 注意:返回一个大于或等于 0 但小于 1 ...
- JavaScript 对象拷贝研究
介绍一下JavaScript里面的一些对象拷贝的方法 浅拷贝 深拷贝 利用序列化进行对象拷贝
- js 对象的创建方式和对象的区别
js一个有三种方法创建对象,这里做一个总结. 1.对象直接量 所谓对象直接量,可以看做是一副映射表,这个方法也是最直接的一个方法,个人比较建议, 1 2 3 4 5 6 7 8 9 10 11 12 ...
随机推荐
- hive parquet table 配置使用压缩
创建parquet table : create table mytable(a int,b int) STORED AS PARQUET; 创建带压缩的parquet table: create t ...
- Ubuntu18.06 Mate桌面环境下VirtuslBox打开虚拟机“全局菜单”异常退出解决办法
在安装完Ubuntu18.06 Mate桌面环境后在VirtuslBox里打开虚拟机会出现“全局菜单”异常退出问题. 产生上面问题的原因是你的虚拟机可能在 显示= >屏幕= >硬件加速里勾 ...
- NodeJS学习笔记 进阶 (13)Nodejs进阶:5分钟入门非对称加密用法
个人总结:读完这篇文章需要5分钟,这篇文章讲解了Node.js非对称加密算法的实现. 摘录自网络 地址: https://github.com/chyingp/nodejs-learning-guid ...
- [Codeforces 816A]Karen and Morning
题目大意:给你一个时间(hh:mm),求最少经过多少分钟才能使这个时间变成回文. 解题思路:模拟,先判断0的情况,然后每过1分钟判断一次即可. C++ Code: #include<cstdio ...
- cmder-替代cmd
之所以选择cmder,说来话长,在学习python的过程中,由于经常通过pip命令安装包,并且在学习一些包的使用例如virtualenv,教程贴都是在终端下的命令,这使我对cmd的使用频率慢慢变多了起 ...
- etTimeout来实现setInterval
etTimeout来实现setInterval <script type="text/javascript"> function interval(func, w, t ...
- [Angular] *ngIf syntx
<div class="profile"> <img [src]="user.img" width="50px"> ...
- CCNP路由实验之九 路由策略
CCNP路由实验之九 路由策略 路由器在公布与接收路由信息时,可能须要实施一些策略.以便对路由信息进行过滤,比如仅仅接收或公布满足一定条件的路由信息. 一种路由协议可能须要引入其它的路由协议发现 ...
- BZOJ1045: [HAOI2008]糖果传递&BZOJ1465: 糖果传递&BZOJ3293: [Cqoi2011]分金币
[传送门:BZOJ1045&BZOJ1465&BZOJ3293] 简要题意: 给出n个数,每个数每次可以-1使得左边或者右边的数+1,代价为1,求出使得这n个数相等的最小代价 题解: ...
- oracle job有定时执行功能
oracle job有定时执行的功能,可以在指定的时间点或每天的某个时间点自行执行任务. oracle job有定时执行的功能,可以在指定的时间点或每天的某个时间点自行执行任务. 一.查询系统中的 ...