js函数式编程确实比很多强语言使用灵活得多,今天抽了点时间玩下类与对象方法调用优先级别,顺便回顾下继承

暂时把原型引用写成继承

先看看简单的两个继承

var Parent = function(){};
var b = new Parent();
Object.defineProperty(b,"Name",{value:"John",writable:true});
var A = function(){};
A.prototype= b;
var a = new Child();
alert(a.Name); //John

给父类原型加上类方法

var Parent = function(){};
var b = new Parent();
Object.defineProperty(b,"Name",{value:"John",writable:true});
Parent.prototype.getName = function(){return "Parent said:" + this.Name;};
Parent.prototype.setName = function(value){this.Name = value;};
var A = function(){};
A.prototype= b;
var a = new A();
alert(a.Name); // John
alert(a.getName()); //Parent said John
a.setName("Keven");
alert(a.getName());//Parent said Keven

子类继承并使用了父类原型的方法和属性, 也能通过父类提供的方法修改继承的属性值

var Parent = function(){this.getName=function(){return "Parent child object said:"+this.Name};};
var b = new Parent();
Object.defineProperty(b,"Name",{value:"John",writable:true});
Parent.prototype.getName = function(){return "Parent sard:" + this.Name;};
Parent.prototype.setName = function(value){this.Name = value;};
var A = function(){};
A.prototype= b;
var a = new A(); alert(a.Name); // John
alert(a.getName()); //Parent child object said John
a.setName("Keven");
alert(a.getName());//Parent child object said Keven

此处可以看出对象方法优先于原型方法调用,当对象方法没有找到时会向上层原型查找

再来看看类方法,Parent类加上getName方法

var Parent = function(){this.getName=function(){return "Parent child object said:"+this.Name};};
var b = new Parent();
Object.defineProperty(b,"Name",{value:"John",writable:true});
Parent.prototype.getName = function(){return "Parent sard:" + this.Name;};
Parent.getName = function(){return this.Name;};
Parent.prototype.setName = function(value){this.Name = value;};
var A = function(){};
A.prototype= b;
var a = new A();
alert(a.Name); // John
alert(a.getName()); //Parent child object said John
a.setName("Keven");
alert(a.getName());//Parent child object said Keven
alert(A.prototype.Name); //John
alert(A.getName()) // type error, undefine is not a function

最后一条报错,A并没有继承Parent的getName方法,此处可以理解Parent.getName为静态方法,不会被子类继承

var Parent = function(){this.getName=function(){return "Parent child object said:"+this.Name};};
var b = new Parent();
Object.defineProperty(b,"Name",{value:"John",writable:true});
Parent.prototype.getName = function(){return "Parent sard:" + this.Name;};
Parent.getName = function(){return this.Name;};
Parent.prototype.setName = function(value){this.Name = value;};
var A = function(){this.getName=function(){return "A object said:"+this.Name};};
A.prototype= b;
var a = new A();
alert(a.Name); // John
a.setName("Keven");
alert(a.getName());//A object said Keven
alert(A.prototype.Name); //John
alert(A.getName()) // type error, undefine is not a function

从第二个alert可以看出,当子类有同名方法时优先调用子类对象上的方法getName,总结下来方法查找的顺序为:子对象方法>父对象方法>父原型方法,一句话为越近越亲,层层往上

以上简单试验了一下js里的原型方法,类方法,和对象方法在继承之后的执行顺序,下节一起探讨下原型链模型

js 继承 对象方法与原型方法的更多相关文章

  1. JS中的phototype JS的三种方法(类方法、对象方法、原型方法)

    JS中的phototype是JS中比较难理解的一个部分 本文基于下面几个知识点: 1 原型法设计模式 在.Net中可以使用clone()来实现原型法 原型法的主要思想是,现在有1个类A,我想要创建一个 ...

  2. js遍历对象的属性和方法

    js遍历对象的属性和方法 一.总结 二.实例 练习1:具有默认值的构造函数 实例描述: 有时候在创建对象时候,我们希望某些属性具有默认值 案例思路: 在构造函数中判断参数值是否为undefined,如 ...

  3. JavaScript中的类方法、对象方法、原型方法

    类方法:也叫函数方法,在JavaScript中函数也是一个对象,所以可以为函数添加属性以及方法: 对象方法:包括构造函数中的方法以及其原型上面的方法: 原型方法:一般用于对象实例共享,在原型上面添加该 ...

  4. 【JavaScript】类继承(对象冒充)和原型继承__深入理解原型和原型链

    JavaScript里的继承方式在很多书上分了很多类型和实现方式,大体上就是两种:类继承(对象冒充)和原型继承. 类继承(对象冒充):在函数内部定义自身的属性的方法,子类继承时,用call或apply ...

  5. js继承的几种实现方法

    一.用function实现: function Person(name) { this.name = name; } Person.prototype.getName = function() { r ...

  6. JS遍历对象的几种方法

    几天前一个小伙伴问我 Object.getOwnPropertyNames() 是干什么用的 平时还真没有使用到这个方法,一时不知如何回答 从方法名称来分析,应该是返回的是对象自身属性名组成的数组 那 ...

  7. JS判断对象是否存在的方法

    Javascript语言的设计不够严谨,很多地方一不小心就会出错. 举例来说,请考虑以下情况. 现在,我们要判断一个全局对象myObj是否存在,如果不存在,就对它进行声明.用自然语言描述的算法如下: ...

  8. 【转】js获取对象的所有属性和方法

    //有时候需要知道一个js对像的所有属性和方法来帮助调试,下面是再网上找到的一个比较给力的方法 function displayProp(obj){ var names=""; f ...

  9. js继承的实现(原型/链、函数伪装)

    一.原型继承父类的实例 //父类及其原型属性/方法 function SuperType () { this.name = ['zc','ls','ww']; } SuperType.prototyp ...

随机推荐

  1. tengine/nginx-tomcat动静分离遇到的问题

    小站安装好tengine后,接下来的工作就是要配置好tengine让其和后端的tomcat正常的连接工作起来,tengine的配置文件本身比较简单,网上有大量的相关介绍说明文档,我这里只是摘出我配置过 ...

  2. js算数优先级

    .fullwidth-table { background: white } .fullwidth-table>th { background: #f50 } 优先级 运算类型 关联性 运算符 ...

  3. 3D 素材路径

    https://3dwarehouse.sketchup.com/user.html?id=1058361951245355501624136&nav=likedcollections

  4. sz rz SecureCRT

    yum install lszrz apt-get install lszrz wget http://down1.chinaunix.net/distfiles/lrzsz-0.12.20.tar. ...

  5. java--连接SQL数据库获取验证码

    1.导入SQL相关的包: 可以下载:mysql-connector-java-5.1.39-bin.jar 将包导入到工程的方法:project(在工程名上点鼠标右键) -> Build Pat ...

  6. Android搜索功能的案例,本地保存搜索历史记录......

    开发的APP有一个搜索功能,并且需要显示搜索的历史记录,我闲暇之余帮她开发了这个功能,现把该页面抽取成一个demo分享给大家. 实现效果如图所示:  本案例实现起来很简单,所以可以直接拿来嵌入项目中使 ...

  7. JqueryEasyUI之DataGrid扩展

    DataGrid通用合并扩展方法: $.extend($.fn.datagrid.methods, { autoMergeCells: function (jq, fields) { return j ...

  8. hibernate映射文件

    Hibernate的持久化类和关系数据库之间的映射通常是用一个XML文档来定义的.该文档通过一系列XML元素的配置,来将持久化类与数据库表之间建立起一一映射.这意味着映射文档是按照持久化类的定义来创建 ...

  9. squid 2.7 通过域名反向代理多个服务器的配置方法

    详细配置及注释如下,供大家学习参考. visible_hostname squid1.abc.com #设定squid的主机名,如无此项squid将无法启动 http_port 80 accel vh ...

  10. 如何安装ipa文件

    ipa文件就相当于安卓手机的apkWindows的exe,就是一个程序,只不过ipa是苹果手机的安装包而已,一般苹果的应用程序都是从AppStore下载的,ipa一般用于测试App才会这样安装程序. ...