js采用原型继承来实现类的派生,但是原型链再深入点,我们又知道多少呢,现在不妨往下看:

先来一个原型继承:

var M1 = function() {
this.param = "m1's param";
this.showParam = function() {
alert(this.param);}
this.insideObj = {
"name" : "stefan",
"age" : 15
};
  this.arr = ["arr1", "arr2"];
}; var M2= function() {
this.clone = function() {
return this;
}
}; var m1 =new M1();
M2.prototype = m1;

  好吧,现在M2的原型是m1,也就是说m2继承了m1对象所有共有属性,这样一来,我们的探索开始,第一个测试

1.先尝试改变m2.param属性,输出m2.param,再删除m2.param,再输出m2.param,

m2.param = "m2's param";  //改变m2.param
m2.showParam(); //输出 m2's param
delete m2.param; //删除m2.param
m2.showParam(); //输出 m1's param

一般人会认为因为原型的机制,在子作用域中对原型(即m1)的属性param进行修改,是不可能实现修改的作用的。一旦对m2.param赋值,m2会在它的作用域内(子作用域内)创建一个param属性,并赋值“m2's param”,其中对m2.param作的任何改动都不会影响到原型中的param属性,这就是原型的安全机制体现。 将m2.param删除后,因为m2作用域不含param属性,此时将进入m2的原型链中查找param属性,若原型链中有多个子作用域,并且在该作用域中含有param属性,则将返回最近的子作用域的param属性值,若都没有,将返回m1作用域的param值。比如,

 function M3(){
this.param = "m3's param";
} M3.prototype = m1;
var m3 = new M3();
M2.prototype = m3;
delete m2.param; //删除m2作用域的独立属性param
m2.showParam(); //输出 "m3's param"
delete m3.param; //删除m3作用域的独立属性param
m2.showParam(); //输出 'm1's param'

2.以上的都是对一个基本类型的属性,比如"int ,float,string,boolean"讨论,如果是 “数组(其实数组本身就是对象,只不过特殊一点),一般对象 ”类型的属性呢?会是怎么样的一个结果,现在我们修改以下insideObj这个“对象类型”的属性,重新赋予一个新的对象或者数组,

m2.arr = ["m2 arr1", "m2 arr2"];
delete m2.arr;
alert(m2.arr); //毫无疑问是 ["m2 arr1", "m2 arr2"];
m2.insideObj = {
name : "john",
age : 153
}; delete m2.insideObj;
alert(m2.insideObj.name) //输出是 "stefan"

以上的结果毫无争议可言是吧,原因跟上面所阐述的一样,看看接下来再改动一下arr或者insideObj里面的变量,看下会发生什么事,  

m2.arr[0] = "m2's arr1";
alert(m1.arr[0]); //此时“居然”输出是, “m2's arr1"
delete m2.arr[0]; //数组arr的第一个数组元素
alert(m1.arr); //输出是 ["arr2"],第一个元素不见了
m2.insideObj["name"] = "m2";
alert(m1.insideObj["name"]); //输出是 "m2"

  这个是怎么一回事呢?我们居然直接对原型中的数组arr和内部对象进行了修改,这也说明了一个现象:m2没有在它的独立作用域中创建arr和insideObj这两个属性

现在来理清以下,大家请注意,以上我们并没有对属性的引用进行任何改动    也就是说,我们一直持有的是原型m1的arr和insideObj这两个对象的引用,所谓的“牵一发而动全身”,就是这样啦。而我们之前为什么没有对原型m1的属性造成任何改动,是因为我们都是赋值上了新的引用,再仔细回顾以下:

m2.arr = ["m2 arr1", "m2 arr2"];              

m2.insideObj = {
name : "john",
age : 153
};

 没错,就是这样。非常浅显易懂,这个就不多解释了。

3.在这里,也顺便介绍以下一些对象的原型相关的特性,

(1)hasOwnProperty(propertyname)

它是用于判断某个属性是否原型继承而来,比如

for (var field in m2)
document.write(field);
//当然输出是param,insideObj,arr,showParam,clone //使用hasOwnProperty判断以下
for (var field in m2)
if(m2.hasOwnProperty(field))
document.write(field);
//只会输出clone,因为这是在m2内部定义的,而其他的属性都是从m1继承来的

(2)isPrototypeOf(obj)

它是用于判断该对象是否是obj对象的原型,像

if(m1.isPrototype(m2))
alert("true");
//m1是m2的原型,当时是true啦

  

ok,小弟不才,对原型就只研究到这地步,再深入点就要花时间去慢慢琢磨探究啦。有什么错误,欢迎指出

js原型继承深入的更多相关文章

  1. 【09-23】js原型继承学习笔记

    js原型继承学习笔记 function funcA(){ this.a="prototype a"; } var b=new funcA(); b.a="object a ...

  2. JS原型继承与类的继承

    我们先看JS类的继承 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> &l ...

  3. js原型继承四步曲及原型继承图

    一:js原型继承四步曲 //js模拟类的创建以及继承 //动物(Animal),有头这个属性,eat方法 //名字这个属性 //猫有名字属性,继承Animal,抓老鼠方法 //第一步:创建父类 fun ...

  4. JS原型继承和类式继承

    前言 一个多月前,卤煮读了一篇翻译过来的外国人写的技术博客.此君在博客中将js中的类(构造)继承和原型继承做了一些比较,并且得出了结论:建议诸位在开发是用原型继承.文中提到了各种原型继承的优点,详细的 ...

  5. 关于js原型继承

    js的每个类都有一个prototype对象 访问对象的属性时,会先访问到对象自身是否有定义这个属性 如果没有定义,就会去访问对象所属类型的prototype对象是否有此属性 原型继承就是把类型的pro ...

  6. js原型继承

    原型链: Object(构造函数) object(类型(对象)) var o = {}; alert(typeof o); //结果是object alert(typeof Object); //结果 ...

  7. 前端面试题总结二(js原型继承)

    今天这篇文章整理了JS原型和继承的一些知识点,面试的时候  基!本!都!会!问!还不快认真阅读下文,看看你还有哪些知识点需要掌握吧~ 1.原型链 基本思想:利用原型让一个引用类型继承另外一个引用类型的 ...

  8. JS 原型继承的几种方法

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  9. JS 原型 & 继承

    理解原型链 先看看http://www.ituring.com.cn/article/56184和http://www.cavabiao.com/prototype-and-inherit-of-ja ...

随机推荐

  1. 持久化API(JPA)系列(三)实体Bean的开发技术-建立与数据库的连接

    在EJB 2.x中.EJB有3种类型的Bean.各自是会话Bean(Session Bean).消息驱动Bean(Message-Driven Bean)和实体Bean(Entity Bean). 随 ...

  2. android listview综合使用演示样例_结合数据库操作和listitem单击长按等事件处理

    本演示样例说明: 1.自己定义listview条目样式,自己定义listview显示列数的多少,灵活与数据库中字段绑定. 2.实现对DB的增删改查,而且操作后listview自己主动刷新. 3.响应用 ...

  3. 从sockaddr中取得Ip地址和端口号

    在socket编程中,服务器端accept()等待一个客户端的连接,当连接成功后,accept拷贝客户端的地址信息到sin_addr里面,我们如何从sin_addr取得此客户端的Ip地址和端口号呢? ...

  4. sql 处理以字符隔开的字符串(类似split)

    sql 处理以字符隔开的字符串(类似split)的处理方法. CREATE PROCEDURE dbo.Vip_SendMails @userids varchar(MAX), ), ), @c va ...

  5. mac下的home键、end键以及insert键的替代

    最近用android模拟器模拟东西,发现模拟器的home快捷键是键盘上的home键,这让我在windows下很好找,换到mac下找了老半天也没找到,后来才查到是有替代键的,放到这里做备份 home键f ...

  6. openvpn server部署笔记

    openvpn server 部署 1.准备 安装依赖 yum -y install gcc gcc-c++ openssl-devel openssl pam-devel 2.安装 lzo cd / ...

  7. ImageView的学习

    学习安卓时我还是习惯看懂手册,虽然是英文但是可以获得的东西必然也是更多的,否则自己只能停留在拾人牙缝的水平,虽然我是初学,但是还是分享一些自己的学习过程及方法. 从手册中我们看以知道,ImageVie ...

  8. iOS8中添加的extensions总结(三)——图片编辑扩展

    图片编辑扩展 注:此教程来源于http://www.raywenderlich.com的<iOS8 by Tutorials> 1.准备 与(二)类似的使用Imgur作为图片来源   2. ...

  9. python记录

    1. 序列的分片操作:需要提供两个索引作为边界,第1个索引的元素包含在分片内,第2个索引的元素不包含在分片内. 为了能让分片部分能够包含列表的最后一个元素,必需提供最后一个元素的下一个元素所对应的索引 ...

  10. 跟我学android-搭建Android开发环境(一)

    Android官网地址:http://developer.android.com/,下载和安装 AndroidSDK请按如下步骤进行: 下载ADT 和SDK:http://developer.andr ...