JavaScript之对象拷贝与赋值

今天在做公司面试题的时候,遇到了一道关于JavaScript之对象拷贝与赋值的问题,突然觉得很有意义,想和大家一起来分享一下!
首先,先摆出代码,如下:

/**
 * Created by Administrator on 2016/12/7.
 */
 var obj={
 name:"dahuang",
 age:10
 }

 var newObj=obj;
 newObj.name="xiaohuang";
 console.log(obj.name);
 console.log(newObj.name);

这个程序的结果是两个都输出了被修改后的名字:xiaohuang。

那么,大家是不是感觉到很奇怪呢,明明只修改了newObj这个对象的name值,为什么obj对象的name值也被篡改了呢?

其实原因很简单,这是因为实际上newObj对象获得的只是一个内存地址,而不是真正的拷贝,所以obj对象被篡改。

但是当我们用Object.create这个函数创建一个对象时,obj对象就不会被篡改,话不多说,先上代码:

var obj2 = {
    name: "dahuang",
    age: 10
}

var newObj2 = Object.create(obj2);
newObj2.name = "xiaohuang";
console.log(obj2.name);
console.log(newObj2.name);

这个程序的结果是newobj2.name的值为xiaohuang,而obj2.name的值为dahuang,仍然保持不变。

使用Object.create()方法进行对象的拷贝,Object.create()方法可以创建一个具有指定原型对象和属性的新对象。



Object.create()方法简介:

Object.create() 方法创建一个拥有指定原型和若干个指定属性的对象。

语法

Object.create(proto, [ propertiesObject ])

参数

proto 一个对象,作为新创建对象的原型。 propertiesObject可选。该参数对象是一组属性与值,该对象的属性名称将是新创建的对象的属性名称,值是属性描述符(这些属性描述符的结构与Object.defineProperties()的第二个参数一样)。注意:该参数对象不能是 undefined,另外只有该对象中自身拥有的可枚举的属性才有效,也就是说该对象的原型链上属性是无效的。

抛出异常

如果 proto 参数不是 null 或一个对象值,则抛出一个 TypeError 异常。

eg:

//Shape - superclass
function Shape() {
  this.x = 0;
  this.y = 0;
}

Shape.prototype.move = function(x, y) {
    this.x += x;
    this.y += y;
    console.info("Shape moved.");
};

// Rectangle - subclass
function Rectangle() {
  Shape.call(this); //call super constructor.
}

Rectangle.prototype = Object.create(Shape.prototype);

var rect = new Rectangle();

rect instanceof Rectangle //true.
rect instanceof Shape //true.

rect.move(1, 1); //Outputs, "Shape moved."
时间: 2024-10-24 11:03:33

JavaScript之对象拷贝与赋值的相关文章

JavaScript数组对象赋值用法实例_javascript技巧

本文实例讲述了JavaScript数组对象赋值用法.分享给大家供大家参考.具体如下: 这里JavaScript数组对象的使用会使你的JS程序变得简洁而有效率,但是好像不少新手都不喜欢用数组,因为觉得它们抽象,不好理解,其实只要你认真领悟,它就像捅破窗户纸一样,令你豁然开朗.希望通过本实例,你对数组会有更多的理解. 运行效果图如下: 具体代码如下: <html> <head> <meta http-equiv="content-type" content=&

javascript如何解析json对javascript如何解析json对象并动态赋值到select列表象并动态赋值到select列表

原文 javascript如何解析json对象并动态赋值到select列表 JSON(JavaScriptObject Notation)一种简单的数据格式,比xml更轻巧.JSON是JavaScript原生格式,这意味着在JavaScript中处理JSON数据不需要任何特殊的API或工具包. JSON的规则很简单:对象是一个无序的"'名称/值'对"集合.一个对象以"{"(左括号)开始,"}"(右括号)结束.每个"名称"后跟一

关于Javascript对象拷贝实现及疑问实例

在实际编程过程,有时候我们会遇到一种情况:当你有一个对象A,在某一个时刻,A已经保存了对应的属性值,而且这些值本身是有效的,这个时候可能需要一个和A完全相同的对象B,并且当B里面的属性值发生变化的时候,A中的属性值不受影响,可以理解为A和B独立,但是B的初始化不是按照我们平时创建该对象的时候的初始化操作,B的初始化数据完全来自A. 一.浅拷贝 当我们需要将一个对象拷贝至另一个对象时,我们一般会这么实现 function shadowCopy(source,target){     var tar

详解JavaScript函数对象_javascript技巧

函数 函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块. function One(leve , leve){ //code return leve+leve } 注释: 形参不需要加上类型: return语句为可选,没有return语句的函数返回undefined: 局部变量与全局变量 在函数内声明:局部变量 在函数外声明:全局变量 向一个新变量名赋值时并没有使用var:这个变量会变为新的全局变量 函数可以作为值 形式1: function init(){ alert("One&qu

如何获得javascript各种对象(可当参考用)

javascript|参考|对象 将下面代码拷贝到一个HTM页面即可,代码如下: <html><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312"><title>JAVASCRIPT对象</title><style><!--body       { font-family: Verdana; fo

Javascript设置对象的ReadOnly属性

 本篇文章主要介绍了Javascript设置对象的ReadOnly属性(示例代码) 需要的朋友可以过来参考下,希望对大家有所帮助 在JS中ReadOnly属性比较奇怪,直接创建一个对象,给该对象赋值readonly属性不能够向HTML中一样使用下面的方式:   代码如下: var x=document.createElement("input"); x.type="text"; x.value="ttttt"; x.id="xy&quo

JavaScript Array对象

原文:JavaScript Array对象 Array 数组 1. 介绍       数组是值的有序集合.每个值叫做一个元素,而每个元素在数组中有一个位置,以数字表示,称为索引.JavaScript数组是无类型:数组元素可以是任意类型,并且同一个数组中的不同元素也可能有不同的类型. --<JavaScript权威指南(第六版)> 2. 定义 var names = new Array("张三", "李四", "王五"); //或者 v

c-如何判断一个类能否安全地依赖于拷贝和赋值操作的默认版本?为什么?

问题描述 如何判断一个类能否安全地依赖于拷贝和赋值操作的默认版本?为什么? 初学C++,在书上看到的习题.如果有什么好的建议也请不吝赐教 解决方案 如果你的类成员都是基本数据类型,比如int,byte,char等,那么就可以依赖默认版本 比如一般定义结构体,我们一般没有提供自己额外的拷贝构造函数等 但是对于类,一般还是自己实现,因为你不知道将来是不是会增加新的数据类型 解决方案二: 如果一个类所有的成员都是能够调用默认构造函数,那么他就可以安全的依赖于拷贝和赋值的默认版本. 还有需要注意的是,如

JavaScript原生对象常用方法总结(推荐)_javascript技巧

下面都是我学习W3C School教程中有关JavaScript写的学习笔记,每个方法我都亲身测试过,每个方法的用途和参数列表,我都是在经过我亲身实践后加上了我自己的一点理解,解释的还算比较详细.现记录下来,以便查阅: javascript之Array类: 创建js数组两种方式: var arr = [];  或 var arr = new Array(); ()里可以指定长度,也可以不指定,指不指定都无所谓, 因为js里的数组长度是可变的 concat(arr1,arr2,arr3......