论js里 面向对象的原型

作者: LiLi原上草 | 来源:发表于2017-04-20 22:13 被阅读47次

一、原型的概念:

1、原型的概念:执行构造函数代码时,js系统会给这个构造函数创建一个原型对象,构造函数中也包含一个prototype属性,指向这个原型对象。

2、原型有什么作用:

     a、通过原型给系统构造函数添加一些特殊的方法(如:数组元素的求和)这样通过Array创建出来的对象都具有了这个方法。

     b、通过原型给自定义的构造函数添加属性、方法,创建出来的对象所对应的属性、方法就是原型中的属性、方法,不需要再开辟新的空间,节约了内存。

这个案例中使用了(prototype属性,后面有具体介绍)

二、原型相关的属性、函数:

    原型属性:通过原型添加在构造函数中的属性;

    原型方法:通过原型添加在构造函数中凡人函数;

    实例属性:通过原型添加在构造函数中的函数;

    实例方法:直接写在构造函数中的方法;

需要注意的是  构造函数 原型对象以及实例之间的关系:

prototype:构造函数中的一个属性,指向他所对应的原型对象;

constructor:构造函数所对应的原型对象中的一个属性,用来指向这个对象所对应的构造函数;

__proto__或者[[prototype]]:实例对象中的原型属性,指向创造他的构建函数对应的原型对象(但我们无法通过此方法访问这个属性,在规定中是不允许的);

三、构造函数创建对象里所运用到的运算符的使用说明:

in运算符可以用来判断某个对象是否含有某个属性,不管是实例的还是他本身的;

eg:alert(‘name’ in cat);//trun

hasOwnProperty:每个实y例对象都有一个hasOwnProperty()方法,用来判断某一个属性到底是实例属性还是继承至prototype对象的属性;

function Cat( ){

this.name = name;

}

var cat = new Cat();

var cat1 = new Cat()

Cat.prototype.type = "age"

eg:alert(cat.hasOwnProperty('name')); //true

         alert(cat1.hasOwnProperty('type')); //false

最后需要注意的是:使用构造函数创建的对象的constructor属性指向他的构造函数,使用字面量创建的对象的constructor属性指向object。

相关文章

  • 论js里 面向对象的原型

    一、原型的概念: 1、原型的概念:执行构造函数代码时,js系统会给这个构造函数创建一个原型对象,构造函数中也包含一...

  • 1.web前端基础储备之—js的面向对象风格以及原型和原型链

    javascript是面向对象风格,基于原型的语言。 目标:了解js面向对象和原型原型链的关系 面向对象(OOP)...

  • JS汇总---面向对象&数组

    面向对象 js原型链的继承 静态属性怎么继承 js原型链以及特点 面向对象有哪几个特点 封装,继承,多态 对象的继...

  • 在nodejs中面向对象:Bearcat

    JS中的面向对象 最最最开始,我们先来说说JS中的面向对象。 原型链 参考文章:图解Javascript原型链 J...

  • Js面向对象

    一、Js面向对象 二、Js原型及原型链 1、原型 JavaScript 的每个对象都继承另一个父级对象,父级对象称...

  • web2

    js是面向对象的语言 是因为js的高度动态性的对象系统 面对对象变成:基于类 和 基于原型 js属于基于原型 性能...

  • Javascript面向对象之组件

    高级面向对象 包装对象(13) js基于原型的程序 String Number Boolean 原型链(14) 实...

  • js中的prototype

    prototype翻译过来是原型的意思,在js中特指对象的原型prototype对象是js实现面向对象的一个重要机...

  • JavaScript原型链

    js原型链 原型链是JS面向对象的基础非常重要 所有对象只有__proto__属性,而函数具有prototype属...

  • JQuery 插件的封装 js原型 面向对象 模拟消息提示框

    依赖jquery 如何使用它 原型 面向对象 layUI.js

网友评论

    本文标题:论js里 面向对象的原型

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