普通对象如何继承?

普通对象的继承方法

今天有个朋友给问我 var obj1 = {},var obj2 = obj1,如何能做到改变obj2的属性值而obj1里面的值。

大家都知道,这方法涉及到了对象的引用,使用的是同一块内存,所以呢就会你变我也变。说到这里很明显,我们需要重新申请一块地方来放obj2的东西,我就说继承和new,那么下面我来说说 普通对象是如何做到继承

方法一:单一属性继承 , 普通对象赋值实现继承  

 1 var obj1 = {
 2     name :‘a‘,
 3 };
 4 var obj2 = {
 5     name : obj1.name,
 6 };
 7
 8 console.log(obj2.name); //a
 9 obj2.name = ‘b‘;
10
11 console.log(obj1.name); //a
12 console.log(obj2.name); //b

方法二:利用构造函数原型继承

 1 var obj1 = {
 2     ‘name‘ :‘a‘
 3 }
 4 //继承函数
 5 function extend(obj){
 6     function Fn(){};//创建构造函数
 7     Fn.prototype = obj; //把被继承的对象赋值给Fn的prototype
 8     return new Fn();//返回值是 实例化Fn
 9 }
10 var obj2 = extend(obj1); //相当于var obj2 = new Fn();
11
12 console.log(obj2.name);// a
13
14 obj2.name = ‘b‘; //改变属性
15 obj2.age = 18 ;  //给obj2添加一个属性
16
17 console.log(obj1.name+‘ ‘+obj1.age); //a undefined
18 console.log(obj2.name+‘ ‘+ obj2.age); //b  18

方法三:浅拷贝 --核心for in ,在之前的 “jq的extend” 方法中提到这个概念,只说到了使用方法,现在来说模拟一下实现原理

 很明显,之前一样,如果obj1的name 属性是一个对象或者数组那么,此时继承仅仅是一个地址,比如有个属性 person:{name:‘aa‘,age:18},那么当obj2或者obj1去改变

 里面的name 或者是 age的时候 ,则obj1和obj2都会发生改变。详细请看:http://www.cnblogs.com/NTWang/p/6175773.html

 1 var obj1 = {
 2     ‘name‘ :‘a‘,
 3 }
 4 function extend(obj){
 5     var obj2 = {}; //声明一个空对象
 6     for(var i in obj){
 7         obj2[i] = obj[i]; //循环赋值
 8     }
 9     return obj2;
10 }
11 var obj2 = extend(obj1);//函数执行并赋值给变量
12
13 console.log(obj2.name)// a
14 obj2.name = ‘b‘;
15
16 console.log(obj1.name);//a
17 console.log(obj2.name);//b

方法四:深拷贝,完善浅拷贝,两种方法适用不同的需求,它的实现原理是:递归调用浅拷贝方法

 1 var obj1 = {
 2     person:{name:‘xiaoming‘,age:18}
 3 }
 4
 5 function deepCopy(obj){
 6     //判断obj 是是否是对象,不是则直接return
 7     if (typeof obj != ‘object‘) {
 8         return obj;
 9     }
10     var obj2 = {};//声明一个对象
11
12     for(var i in obj){
13         obj2[i] = deepCopy(obj[i]);//调用自己
14     }
15     return obj2;
16 }
17
18 var obj2 = deepCopy(obj1);
19
20 obj2.person.name = ‘xiaohong‘;
21
22 console.log(obj1.person.name); //xiaoming
23 console.log(obj2.person.name);//xiaohong
时间: 2024-12-18 17:16:00

普通对象如何继承?的相关文章

关于js的对象原型继承

javascript中,对象的继承是通过原型去继承. 可以这样理解:js中的对象,包含的除了属性和方法,还有一个最基本的原型__proto__对象.这个原型__proto__指向谁,这个对象就继承谁.这是最容易理解对象原型继承的一种方式. 如下面的代码: var student={ name:'zhangsan', age:21, run:function(){ return this.name+' is running!'; } }; var xiaoming={ name:'xiaoming

Chapter 17. Objects and Inheritance(对象与继承)

SELECT DISTINCT fa.application_short_name 模块,                 b.responsibility_name 职责名称, fa.application_name 应用产品,                 b.responsibility_key 责任关键字, b.description 说明,                 DECODE (b.data_group_id, 0, '标准', '') 数据组,              

js对象的继承

<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>无标题文档</title> <script> //继承 : 子类不影响父类,子类可以继承父类的一些功能 ( 代码复用 ) //属性的继承 : 调用父类的构造函数 call //

JS 对象之继承

<!-- ————————JS对象之继承 ———————— --> //父类 function Sup(name){ this.name=name; } //父类的原型 Sup.prototype={ constructor:Sup, sayName:function(){ alert(this.name); } }; //子类构造函数 function Sub(age){ this.age=age; } //让子类的原型等于父类的实例 Sub.prototype=new Sup("

JavaScript对象 创建对象 继承

创建对象  --以下内容来自JavaScript高级程序设计 工厂模式 用函数来封装以特定接口创建对象的细节. function createPerson(name, age, job){ var o = new Object(); o.name = name; o.age = age; o.job = job; o.sayName = function(){ alert(this.name); }; return o; } var person1 = createPerson("Nichola

对象的继承、访问控制

对象的继承(拥有部分相同的属性和方法) 继承的好处: 1.父类里面定义的类成员可以不用在子类中重复定义,节约了编程的时间 人是一个父类 男人类 女人类 2.同一个父类的子类拥有相同的父类定义的类成员,因此外部代码调用他们的时候一视同仁 3.子类可以修改和调整父类定义的类成员(称之为重写),一单子类修改了,就按照子类修改后的功能执行 用extends关键字来表示类的继承,后面跟父类的类名,后面只能跟一个类,这叫php单继承原则 在子类的对象上可以直接访问父类中定义的方法和属性,父类中的属性可以通过

Javascript对象的继承

对象的继承 Javascript主要通过原型链实现继承,原型链的构建是通过将一个类型的实例赋值给另一个构造函数的原型实现的. 由于所有的实例对象共享同一个prototype对象,那么从外界看起来,prototype对象就好像是实例对象的原型,而实例对象则好像"继承"了prototype对象一样.这就是Javascript继承机制的设计思想. 继承方法: (1)原型链继承方法:基本思想是利用原型让一个引用类型继承另一个引用类型的属性和方法.继承是通过创建超类型的实例,并将该实例赋给子类型

js最好的继承机制:用对象冒充继承构造函数的属性,用原型链继承 prototype 对象的方法。

js最好的继承机制:用对象冒充继承构造函数的属性,用原型prototype继承对象的方法. function ClassA(sColor) { this.color = sColor; } ClassA.prototype.sayColor = function () { alert(this.color); }; function ClassB(sColor, sName) {//在 ClassB 构造函数中,用对象冒充继承 ClassA 类的 sColor 属性 ClassA.call(th

关于对象+原型+继承(二)

每个Javascript对象都包含着对一个原型对象的内部引用.原型对象的任何属性,都表现为每个以它为原型的方法的属性.也就是说,javascript对象可以从它的原型那里继承属性. prototype实现原理 所有的对象都可以有prototype, prototype自己也是对象,那么他也可以有prototype,这样循环下去就形成了一个prototype链, 这个链当他遇到链中队形的prototype是null时中止.(Object的默认的prototype是null) . 1 var obj

JavaScript 学习笔记 - 对象和继承

本文是JavaScript The Good Part 有关对象和继承的学习笔记. 1. Object.create 本函数是ECMAScript 5中的标准函数,其作用是用一个对象作为原型来生成另一个对象,可以用以下的code 模拟实现. if(typeof Object.create !== 'function') { Object.create = function(proto){ var F = function(){}; if(typeof proto !== 'object'){ /