javascript prototype原型操作笔记


Posted in Javascript onDecember 07, 2009
//var People={name:"xiong",age:15}; 
//var Person=function(user,age){ 
//    this.name=user; 
//    this.age=age; 
//    this.say=function(){alert("I am "+this.name+"\n"+this.age);} 
//} 
//var Chairman=function(name,salary){ 
//    Person.call(this,name); 
//    } 
//var Bill=new Person("Bill",15); 
//var Hu=new Chairman("Hu Jintao"); 
//Person.prototype.eat=function(){ 
//    alert("I'm eating"); 
//    } 
//Bill.eat(); 
function Person(name) //基类构造函数 
{ 
this.name = name; 
}; Person.prototype.SayHello = function() //给基类构造函数的 prototype 添加方法 
{ 
alert("Hello, I'm " + this.name); 
}; 
function Employee(name, salary) //子类构造函数 
{ 
Person.call(this, name); //调用基类构造函数 
this.salary = salary; 
}; 
    function Xiong(name,age){ 
        Employee.call(this,name); 
        } 
Employee.prototype = new Person(); //建一个基类的对象作为子类原型的原型,这里很有意思 
    Xiong.prototype=new Employee(); 
Employee.prototype.ShowMeTheMoney = function() //给子类添构造函数的 prototype 添加方法 
{ 
alert(this.name + " $" + this.salary); 
}; 
var BillGates = new Person("Bill Gates"); //创建基类 Person 的 BillGates 对象 
var SteveJobs = new Employee("Steve Jobs", 1234); //创建子类 Employee 的 SteveJobs对象 
     var hiakuotiankong=new Xiong("海阔天空"); 
     var benbenxiong=new Xiong("笨笨熊"); 
// BillGates.SayHello(); //通过对象直接调用到 prototype 的方法 
// hiakuotiankong.SayHello(); //通过子类对象直接调用基类 prototype 的方法,关注! 
     benbenxiong.SayHello=function(){ //掩盖了原型的 SayHello 方法 
         alert("haha,I'm"+this.name); 
} 
         benbenxiong.SayHello(); 
// SteveJobs.ShowMeTheMoney(); //通过子类对象直接调用子类 prototype 的方法 
// alert(BillGates.SayHello == SteveJobs.SayHello); //显示:true,表明 prototype 的方法是共享的 
    Xiong.prototype.Goodbye=function(){ 
         alert(this.name+"Bye-bye"); 
        } 
    benbenxiong.Goodbye();    

在 JavaScript 中,prototype 不但能让对象共享自己财富,而且 prototype 还有寻根问祖的
天性,从而使得先辈们的遗产可以代代相传。当从一个对象那里读取属性或调用方法时,如果该对象自
身不存在这样的属性或方法,就会去自己关联的 prototype 对象那里寻找;如果 prototype 没有,又会
去 prototype 自己关联的前辈 prototype 那里寻找,直到找到或追溯过程结束为止。

在 JavaScript 内部,对象的属性和方法追溯机制是通过所谓的 prototype 链来实现的。当用 new
操作符构造对象时,也会同时将构造函数的 prototype 对象指派给新创建的对象,成为该对象内置的原
型对象。对象内置的原型对象应该是对外不可见的,尽管有些浏览器(如 Firefox)可以让我们访问这个
内置原型对象,但并不建议这样做。内置的原型对象本身也是对象,也有自己关联的原型对象,这样就
形成了所谓的原型链。

在原型链的最末端,就是 Object 构造函数 prototype 属性指向的那一个原型对象。这个原型对象
是所有对象的最老祖先,这个老祖宗实现了诸如 toString 等所有对象天生就该具有的方法。其他内置
构造函数,如 Function, Boolean, String, Date 和 RegExp 等的 prototype 都是从这个老祖宗传承下
来的,但他们各自又定义了自身的属性和方法,从而他们的子孙就表现出各自宗族的那些特征。

Javascript 相关文章推荐
Exitjs获取DataView中图片文件名
Nov 26 Javascript
实现checkbox全选、反选、取消JavaScript小脚本异常
Apr 10 Javascript
JavaScript中Cookie操作实例
Jan 09 Javascript
window.onerror()的用法与实例分析
Jan 27 Javascript
利用jQuery插件imgAreaSelect实现图片上传裁剪(同步显示图像位置信息)
Dec 02 Javascript
Mongoose学习全面理解(推荐)
Jan 21 Javascript
Node.js如何使用Diffie-Hellman密钥交换算法详解
Sep 05 Javascript
基于ajax和jsonp的原生封装(实例)
Oct 16 Javascript
JS中的BOM应用
Feb 02 Javascript
vue 点击按钮实现动态挂载子组件的方法
Sep 07 Javascript
谈谈IntersectionObserver懒加载的具体使用
Oct 15 Javascript
JQuery中DOM节点的操作与访问方法实例分析
Dec 23 jQuery
javascript Array.sort() 跨浏览器下需要考虑的问题
Dec 07 #Javascript
IE7中javascript操作CheckBox的checked=true不打勾的解决方法
Dec 07 #Javascript
js event事件的传递与冒泡处理
Dec 06 #Javascript
IE和firefox浏览器的event事件兼容性汇总
Dec 06 #Javascript
js 操作select相关方法函数
Dec 06 #Javascript
JavaScript 对象模型 执行模型
Dec 06 #Javascript
ASP Json Parser修正版
Dec 06 #Javascript
You might like
php mysql_real_escape_string函数用法与实例教程
2013/09/30 PHP
PHP 7安装调试工具Xdebug扩展的方法教程
2017/06/17 PHP
Laravel学习教程之View模块详解
2017/09/18 PHP
php微信分享到朋友圈、QQ、朋友、微博
2019/02/18 PHP
List Information About the Binary Files Used by an Application
2007/06/11 Javascript
JQuery验证工具类搜集整理
2013/01/16 Javascript
使用JavaScript 编写简单计算器
2014/11/24 Javascript
JS动态添加Table的TR,TD实现方法
2015/01/28 Javascript
React.js入门学习第一篇
2016/03/30 Javascript
BOM系列第一篇之定时器setTimeout和setInterval
2016/08/17 Javascript
AngularJs directive详解及示例代码
2016/09/01 Javascript
基于javascript的异步编程实例详解
2017/04/10 Javascript
JS作用域链详解
2017/06/26 Javascript
JS简单实现点击跳转登陆邮箱功能的方法
2017/10/31 Javascript
vue.js数据绑定操作详解
2018/04/23 Javascript
layer弹出的iframe层在执行完毕后关闭当前弹出层的方法
2018/08/17 Javascript
CentOS 8.2服务器上安装最新版Node.js的方法
2020/12/16 Javascript
Vue实现多页签组件
2021/01/14 Vue.js
[08:02]DOTA2牵红线 zhou神抱得美人归
2014/03/22 DOTA
[07:57]2018DOTA2国际邀请赛寻真——PSG.LGD凤凰浴火
2018/08/12 DOTA
[02:28]PWL开团时刻DAY3——Ink Ice与DeMonsTer之间的勾心斗角
2020/11/03 DOTA
Python中条件判断语句的简单使用方法
2015/08/21 Python
python实现用户登录系统
2016/05/21 Python
virtualenv实现多个版本Python共存
2017/08/21 Python
pandas的qcut()方法详解
2019/07/06 Python
Python对列表的操作知识点详解
2019/08/20 Python
PyCharm更改字体和界面样式的方法步骤
2019/09/27 Python
django admin后管定制-显示字段的实例
2020/03/11 Python
JetBrains PyCharm(Community版本)的下载、安装和初步使用图文教程详解
2020/03/19 Python
Python实现初始化不同的变量类型为空值
2020/06/02 Python
电脑售后服务承诺书
2014/03/27 职场文书
学期个人自我总结
2015/02/13 职场文书
新闻稿怎么写
2015/07/18 职场文书
干部理论学习心得体会
2016/01/21 职场文书
python常见的占位符总结及用法
2021/07/02 Python
Python Numpy库的超详细教程
2022/04/06 Python