美文网首页
原型链模式--基础

原型链模式--基础

作者: gaoqizhuhui | 来源:发表于2017-07-24 00:27 被阅读0次

构造函数模式解决了实例识别问题(实例和实例间是相互独立的
基于构造函数模式的原型模式解决了方法或属性公有的问题:把实例之间相同的属性和方法提取成公有的属性和方法(想让谁公有就把它放在“类 . prototype”上即可)

基础知识:

1、每一个函数数据类型(普通函数、类)都有一个天生自带的属性:prototype(原型),并且这个属性是一个对象数据类型的值

2、并在prototype上,浏览器天生给它加了一个属性constructor(构造函数),属性值是当前函数(类)本身

3、每一个对象数据类型(普通对象、实例、prototype......)也天生自带一个属性: __proto __,属性值是当前实例所属类的原型(prototype)
eg:

function Fn(){
      this.x=100;
      this.sum=function(){
      };
}
Fn.prototype.getX=function(){
      console.log(this.x);
};
Fn.prototype.sum=function(){
};
var f1=new Fn;
var f2=new Fn;
console.log(Fn.prototype.constructor===Fn);  //--->true

Object是JS中所有对象数据类型的基类(最顶层的类):

(1).f1 instanceof Object---->true 因为f1通过 __proto __可以向上级查找,不管有多少级,最后总能找到Object

(2).在Object.prototype上没有 __proto __这个属性

原型链模式:

f1.hasOwnProperty("x“);//--->hasOwnProperty是f1的一个属性

若f1的私有属性上没有这个方法,应如何处理:

(1).通过 对象名 . 属性名 的方式获取属性值的时候,首先在对象的私有的属性上进行查找,若私有中存在这个属性,则获取的是私有属性值;

(2).若私有的没有,则通过 __proto __找到所属类的原型(类的原型上定义的属性和方法都是当前实例公有的属性和方法),原型上存在的话,获取的是公有的属性值;

(3).若原型上也没有,则继续通过原型上的 __proto __继续向上查找,一直找到Object.prototype为止。。。

这种查找的机制成为”原型链模式“

image.png

判断练习:

1、f1.getX===f2.getX   //----->true;
2、f1. __proto__.getX===f2.getX  //----->true;
3、f1.getX===Fn.prototype.getX //----->true;
4、f1.sum===f2. __proto__.sum  //--->false;
5、f1.sum===Fn.prototype.sum  //----->false;

注:(自我小总结)

1、函数或类带prototype的代表公有

2、对象数据类型(实例)带 __proto __的代表公有

3、在IE浏览器中,原型模式也如此,但IE浏览器禁止使用 __proto __(怕通过 __proto __把公有修改)可以用Fn.prototype.sum=function(){}修改公有的sum。(其他可以直接f1. __proto__.sum=function(){}修改所属类原型上的sum)

4、链式写法:执行完成某一个方法,不仅得到了想要的结果,而且返回值还需要是当前这个类的实例,只有这样才能一直链下去。eg:

ary.sort(function(a,b){
        return a-b;
}).reverse().slice(0,5).pop().push();

//.push is not a function;因为pop执行完成的返回结果是删除的那个元素,而不是数组了(不是Array的实例了)

相关文章

  • 原型链模式--基础

    构造函数模式解决了实例识别问题(实例和实例间是相互独立的基于构造函数模式的原型模式解决了方法或属性公有的问题:把实...

  • 原型链模式-基础

    首先看基于原型链的构造函数形式: 构造函数模式中拥有了类和实例的概念,并且实例和实例之间是相互独立开来的 -> 实...

  • js集成

    原始继承模式--原型链 2:借用构造函数 3:共享构造原型 4:圣杯模式原型链; 构造函数; 共享原型; 圣杯模式...

  • js 集成模式 07-24

    **原始继承模式--原型链 2:借用构造函数 3:共享构造原型 4:圣杯模式**一:原型链; 二:构造函数; 三:...

  • 继承大法好

    原型链方法(仿传统) 所属模式: 基于构造器工作模式 使用原型链模式(ECMA标准中的默认继承机制) 提示:我们可...

  • js原型、原型链、继承的理解

    一、原型、原型链 原型是Javascript中的继承的基础,JavaScript的继承主要依靠原型链来实现的。 原...

  • 原型和原型链篇

    原型和原型链 1.理解原型设计模式以及JavaScript中的原型规则 原型设计模式JavaScript是一种基于...

  • 2-6 原型和原型链 - 5个原型规则

    2-6 原型和原型链 - 5个原型规则 5条原型规则,原型规则是学习原型链的基础。 第一、所有引用类型(数组、函数...

  • 前端JS基础二(原型与原型链)

    原型与原型链 原型规则(是学习原型链的基础) 所有的引用类型(数组,对象,函数),都具有对像特性,即可自由扩展属性...

  • js面向对象的几种写法

    一、工厂模式 二、构造函数模式 三、原型模式 四、组合使用构造函数和原型模式 五、原型链继承 六、借用构造函数继承...

网友评论

      本文标题:原型链模式--基础

      本文链接:https://www.haomeiwen.com/subject/ghfvkxtx.html