javascript prototype原型操作笔记

 更新时间:2009年12月07日 19:22:55   作者:  
在 JavaScript 中,prototype 不但能让对象共享自己财富,而且 prototype 还有寻根问祖的天性,从而使得先辈们的遗产可以代代相传。
复制代码 代码如下:

//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 都是从这个老祖宗传承下
来的,但他们各自又定义了自身的属性和方法,从而他们的子孙就表现出各自宗族的那些特征。

相关文章

  • npm install报错无法创建packge.json文件的解决办法

    npm install报错无法创建packge.json文件的解决办法

    当你在运行 npm install 时遇到错误,提示无法找到 package.json 文件,也没有创建一个 package.json 文件,只创建了一个package-lock.json文件,本文给大家介绍详细的解决办法,需要的朋友可以参考下
    2024-02-02
  • 用Javascript评估用户输入密码的强度(Knockout版)

    用Javascript评估用户输入密码的强度(Knockout版)

    早上看到博友6点多发的一篇关于密码强度的文章(连接),甚是感动(周末大早上还来发文)
    2011-11-11
  • javascript ready和load事件的区别示例介绍

    javascript ready和load事件的区别示例介绍

    ready是在DOM加载完成就触发;load是在加载完所有页面内容才会触发,下为大家简要介绍下,不知道的朋友可以参考下
    2013-08-08
  • JS中for循环的四种写法示例(入门级)

    JS中for循环的四种写法示例(入门级)

    对于for循环相信大家再常用不过了,下面这篇文章主要给大家介绍了关于JS中for循环的四种写法,文中通过示例代码介绍的非常详细,需要的朋友可以参考下
    2022-04-04
  • 前端生成word文件的两种方式总结

    前端生成word文件的两种方式总结

    这篇文章主要介绍了前端生成word文件的两种方式,两种方法分别是html-docx-js和pizzip+docxtemplater,html-docx-js简单易用,但支持的HTML和CSS有限,且不支持图片,pizzip+docxtemplater需要预先设置Word文件样式,但支持更复杂的样式和图片插入,需要的朋友可以参考下
    2025-03-03
  • web项目开发之JS函数防抖与节流示例代码

    web项目开发之JS函数防抖与节流示例代码

    这篇文章主要介绍了web项目开发之JS函数防抖与节流实现的示例代码及原理解析,有需要的朋友可以借鉴参考下,希望能够有所帮助
    2021-09-09
  • js代码实现轮播图

    js代码实现轮播图

    这篇文章主要为大家详细介绍了js代码实现轮播图,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2020-05-05
  • 详解Javascript 基于长连接的服务框架问题

    详解Javascript 基于长连接的服务框架问题

    本文针对经常使用长连接进行消息收发的应答场景,采用 Websocket 长连接作为服务监听的对象,模拟了一套类 http 服务框架,通过实例代码介绍了Javascript 基于长连接的服务框架,需要的朋友可以参考下
    2022-07-07
  • JS判断两个时间大小的示例代码

    JS判断两个时间大小的示例代码

    本篇文章只要是对JS判断两个时间大小的示例代码进行了介绍,需要的朋友可以过来参考下,希望对大家有所帮助
    2014-01-01
  • Javascript iframe交互并兼容各种浏览器的解决方法

    Javascript iframe交互并兼容各种浏览器的解决方法

    这篇文章主要介绍了Javascript iframe交互并兼容各种浏览器的解决方法的相关资料,非常不错,具有参考借鉴价值,需要的朋友可以参考下
    2016-07-07

最新评论