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 相关文章推荐
javascript函数作用域学习示例(js作用域)
Jan 13 Javascript
解决Jquery鼠标经过不停滑动的问题
Mar 03 Javascript
在JavaScript中处理字符串之link()方法的使用
Jun 08 Javascript
Bootstrap实现input控件失去焦点时验证
Aug 04 Javascript
原生JS控制多个滚动条同步跟随滚动效果
Dec 22 Javascript
webpack 单独打包指定JS文件的方法
Feb 22 Javascript
vue使用中的内存泄漏【推荐】
Jul 10 Javascript
vue 弹框产生的滚动穿透问题的解决
Sep 21 Javascript
vue实现可视化可拖放的自定义表单的示例代码
Mar 20 Javascript
vue elementUI 表单校验功能之数组多层嵌套
Jun 04 Javascript
关于AngularJS中几种Providers的区别总结
May 17 Javascript
JavaScript实现简易计算器小功能
Oct 22 Javascript
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
Codeigniter操作数据库表的优化写法总结
2014/06/12 PHP
php自定义截取中文字符串-utf8版
2017/02/27 PHP
tp5(thinkPHP5)操作mongoDB数据库的方法
2018/01/20 PHP
php中的explode()函数实例介绍
2019/01/18 PHP
关于使用runtimeStyle属性问题讨论文章
2007/03/08 Javascript
JavaScript XML操作 封装类
2009/07/01 Javascript
JQuery通过Ajax提交表单并返回结果
2011/07/31 Javascript
详解JS函数重载
2014/12/04 Javascript
js实现点击链接后延迟3秒再跳转的方法
2015/06/05 Javascript
jQuery实现首页图片淡入淡出效果的方法
2015/06/10 Javascript
浅析如何利用JavaScript进行语音识别
2016/10/27 Javascript
原生js实现图片放大缩小计时器效果
2017/01/20 Javascript
BootStrap fileinput.js文件上传组件实例代码
2017/02/20 Javascript
layui使用数据表格实现购物车功能
2019/07/26 Javascript
操作按钮悬浮固定在微信小程序底部的实现代码
2019/08/02 Javascript
vue项目引入ts步骤(小结)
2019/10/31 Javascript
node.JS二进制操作模块buffer对象使用方法详解
2020/02/06 Javascript
[09:23]国际邀请赛采访专栏:iG战队VK,Tongfu战队Cu
2013/08/05 DOTA
Jupyter notebook远程访问服务器的方法
2018/05/24 Python
python opencv调用笔记本摄像头
2019/08/28 Python
windows、linux下打包Python3程序详细方法
2020/03/17 Python
python新手学习使用库
2020/06/11 Python
python实现人工蜂群算法
2020/09/18 Python
python实现移动木板小游戏
2020/10/09 Python
澳大利亚儿童鞋在线:The Trybe
2019/07/16 全球购物
Alexandre Birman美国官网:亚历山大·伯曼
2019/10/30 全球购物
会计专业自荐信范文
2013/12/02 职场文书
党建工作经验交流材料
2014/05/25 职场文书
小学国庆节活动方案策划书
2014/09/16 职场文书
小学运动会报道稿
2014/10/04 职场文书
优秀少先队员事迹材料
2014/12/24 职场文书
高中开学感言
2015/08/01 职场文书
详解overflow:hidden的作用(溢出隐藏、清除浮动、解决外边距塌陷)
2021/07/01 HTML / CSS
Python+腾讯云服务器实现每日自动健康打卡
2021/12/06 Python
win10以太网连接不上怎么办?Win10连接以太网详细教程
2022/04/08 数码科技
css3 选择器
2022/05/11 HTML / CSS