prototype 原型的学习

2017年4月18日09:01:32

原型:prototype (面向对象)

prototype:在js中,任何一个函数,都有一个prototype属性,指向一个对象,输出这个函数的prototype属性,你会发现一个空对象,输出这个prototype的类型是一个object。

1:原型作用:一个函数的原型,对于普通函数,没有作用,但是如果函数是一个构造函数,name函数的原型,有非常大的作用,具体如下

//当一个函数被new出来的时候,不仅仅执行了构造函数里面的语句,也会把这个函数的proto——(原型对象)指向构造函数的proto。

var xiaoming = new People();

console.log(xiaoming.__proto__);

console.log(xiaoming.__proto__==People.prototype);

// 当我们访问那么,age的时候,构造函数返回的对象本身没有,那么就去查找原型,原型如果有就拿来当做自己的属性。

console.log(xiaoming);

prototype一定使函数的属性。只能使用函数名调用赋值,当这个函数是一个构造函数的时候,那么new出来的对象将以他的原型那个对象为new出来的实例的原型对象。

任何一个对象都有__proto__属性,这个只是chrome的属性,别的不兼容,别的浏览器不能通过__proto__进行访问.

原型查找:是js里面很重要的一个机制。当我们要访问一个对象本身的属性的时候,如果这个对象身上有这个属性,直接返回值,如果没有这个属性,将访问它的原型对象。

prottype:原型,构造函数的属性,只有函数有原型。

__proto__原型对象,任何对象都有原型对象。:

那么__proto__是什么?我们在这里简单地说下。每个对象都会在其内部初始化一个属性,就是__proto__,当我们访问一个对象的属性时,如果这个对象内部不存在这个属性,那么他就会去__proto__里找这个属性,这个__proto__又会有自己的__proto__,于是就这样一直找下去,也就是我们平时所说的原型链的概念。

按照标准,__proto__是不对外公开的,也就是说是个私有属性,但是Firefox的引擎将他暴露了出来成为了一个共有的属性,我们可以对外访问和设置。

http://www.cnblogs.com/zzcflying/archive/2012/07/20/2601112.html (详情参考)

2:原型的用途:

原型优点

如果不用原型,那么new的时候每一个对象都会复制一份构造函数里面的属性,多个对象会占用很大的内存。如果使用原型设置属性,所有对象都只调用一个函数,可以节省空间。

3:原型链查找

1)constructor:函数的原型有constructor属性,是原型的属性,这个属性值是原型的构造函数,

原型是实例的原型对象,构造函数是构造函数的原型构造器,通过构造函数才创造出一个构造函数的原型,构造函数的原型是一个对象,通过new函数制造出来的实例化对象的原型都是构造函数的原型

构造函数《==》原型

object用于创造对象,它是系统内置的构造函数,object。prototype是所有对象的原型链终点,所以当使用对象点语法调用某个函数的时候,系统会沿着原型链寻找定义,一直到Object。prototype

数组的原型链:

JS在创建对象(不论是普通对象还是函数对象)的时候,都有一个叫做__proto__的内置属性,用于指向创建它的函数对象的原型对象prototype。

在js中,面向对象技术,已经变成了组织代码的方式,这种方式叫做组件开发。

继承:

//函数不调用不会自己执行

// 把人类的所有属性给了学生类

this.constructor.apply(this,arguments);

this.xuehao = xuehao;

this.flowernum = flowernum;

}

//继承的核心语句

// 把人类的方法给了学生类

Student.prototype = new People();

// 下面这种情况会改变父类原型中的相同方法

// Student.prototype = People.prototype;(不建议使用)。

for,,in 循环可以将原型链上所有可以枚举的东西列举出来。for(var k in obj)

in运算返回的是一个布尔值,系统默认例如constructor等属性是不可枚举的。for   in可以把自己添加的属性罗列起来,也可以将原型链上所有的属性罗列。

hasOwnProperty用来验证这个属性在不在当前obj里面,不会顺着原型链爬。只能输出当前在这个obj里面的。

直接使用点语法判断属性是不是在obj里面如果是underfined说明不在。 否则返回属性值。点语法会遍历原型链

instanceof运算符

类:class

实例:instance   A instanse B 验证A是不是B的实例

//数组的构造函数自带的方法 (ie9之后开始兼容)ECMAScript5标准中新增的一个API验证数组。

var arr = [];

console.log(arr instanceof Array);//true

console.log(typeof arr);//object

console.log(arr instanceof Object);//true

console.log(Array.isArray(arr));//true

运算机理:

遍历HelloKit这个对象原型链上的每个原型对象,如果遍历到这个原型对象是某个构造函数的Prototype,那么hellokit也是这个构造函数的实例。

在典型的面向对象的语言中,如java,都存在类(class)的概念,类就是对象的模板,对象就是类的实例。但是在Javascript语言体系中,

是不存在类(Class)的概念的,javascript中不是基于‘类的’,而是通过构造函数(constructor)和原型链(prototype chains)实现的。

 所谓属性,就是对象的一种状态;所谓方法,就是对象的一种行为。

Cat.prototype = new Dog();cat继承了dog的属性。

时间: 2024-07-30 14:24:31

prototype 原型的学习的相关文章

JavaScript学习--Item15 prototype原型和原型链详解

用过JavaScript的同学们肯定都对prototype如雷贯耳,但是这究竟是个什么东西却让初学者莫衷一是,只知道函数都会有一个prototype属性,可以为其添加函数供实例访问,其它的就不清楚了,最近看了一些 JavaScript高级程序设计,终于揭开了其神秘面纱. 每个函数都有一个prototype属性,这个属性是指向一个对象的引用,这个对象称为原型对象,原型对象包含函数实例共享的方法和属性,也就是说将函数用作构造函数调用(使用new操作符调用)的时候,新创建的对象会从原型对象上继承属性和

javascript学习:闭包和prototype原型使用基础

闭包 function Person(name) { this.Username = name; var Userage = 18; //通过这种方法可以模拟私有成员 //类似于private成员 this.setAge = function (age) { Userage = age; } //类似于public成员 this.getAge = function () { return Userage; } } var p1 = new Person("huahuah"); p1.s

JS原型,Prototype,原型

对于javascript这样一种前端语言,个人觉得,要真正的理解其oop, 就必须要彻底搞清楚javascript的对象,原型链,作用域,闭包,以及this所引用的对象等概念.这些对弄明白了,应该就可以比较自信的驾驭这种语言了. 大家都知道,javascript中的继承不是使用的类继承的机制,而是使用的另一种方式 – 原型继承.在原型继承方式中,本质上是javascript语言加入原型链这种机制,从而实现了面向对象的重要特性之一 – 继承.在这篇博文中,基于个人的理解,来说说javascript

Javascript讲解系列之一 Prototype原型链

以前没有写博客的习惯,许多的技术积累都是自己稍微总结一下,很少共享,并非自私,而是工作比较忙,前几天接到一个电话面试不理想,才发现公司所用的DOJO并不被外面广泛接受,故而决定把自己所学分享出来,为夯实基础,也为与外界交流思想,形成一种渠道,如需联系,请发送至邮箱:[email protected]. 今天写Javascript系列之第一篇:Prototype原型链.在软件园里随便拉一个码农估计都会写JS,大部分也知道JS是基于原型的语言,但是如果问及JS原生对象(Object,Function

原型原型链学习记录

这是一篇学习笔记. 个人心得: 关于原型和原型链这一块,很难,但是,一旦理解,就通了. 对于这一块,我之前不懂的时候,非要去弄明白,特别痛苦,之后,看到了王福朋老师的闭包原型系列,真的是茅塞顿开!看完之后,我就拿起JavaScript高程3,高程3第6章节,耐心跟着看也就明白了.之后,再去做一些图解,如果能够根据继承画出所有的关系,没有矛盾的点,那就基本没问题了.再到网上找差不多的文章看,如果没有冲突点,那这一块就没问题了. 参考的内容: http://www.cnblogs.com/wangf

JS 原型链学习总结

废话篇: 在js的学习过程中有一大难点就是原型链.学习的时候一直对这一内容不是十分的明白.纠结的我简直难受.,型号总算给他弄通了,哇咔咔,总算可以不用在睡梦中还想着他了. 正文篇: 要了解原型链我们首先要记住的一点是JS中所有的东西都可以用对象来理解.函数在JS中实际上也是一个对象.然后再去看原型链的东西. 上图是首要的: 实际上我们可以吧JS中的对象看成两种,一种是我们所熟知的一般的对象,还有一种就是JS中所有的方法对象. 一般对象: 对于一般的对象而言,其实际上就是一个方法与属性的集合,而在

你不知道的JavaScript--Item15 prototype原型和原型链详解

用过JavaScript的同学们肯定都对prototype如雷贯耳,但是这究竟是个什么东西却让初学者莫衷一是,只知道函数都会有一个prototype属性,可以为其添加函数供实例访问,其它的就不清楚了,最近看了一些 JavaScript高级程序设计,终于揭开了其神秘面纱. 每个函数都有一个prototype属性,这个属性是指向一个对象的引用,这个对象称为原型对象,原型对象包含函数实例共享的方法和属性,也就是说将函数用作构造函数调用(使用new操作符调用)的时候,新创建的对象会从原型对象上继承属性和

【PHP 模板引擎】Prototype 原型版发布!

在文章的开头,首先要向一直关注我的人说声抱歉!因为原本是打算在前端框架5.0发布之后,就立马完成 PHP 模板引擎的初版.但我没能做到,而且一直拖到了15年元旦才完成,有很严重的拖延症我很惭愧,再次抱歉! 之前有说过以后的作品发布文章都会同步发表相应的 API 使用说明,但我觉得这还不够好而且博客平台对表格的处理和显示不是很友好,导致 API 不能完美的呈现,因此打算只提供 API 链接,大家可以通过链接直接访问到我的官网去查阅手册,那样的阅读体验是最好的.而发布的文章以后则更新一些和 API

【Javascript 拾遗之二】prototype 原型

在开发中, 使用到一些Javascript框架, 如Jquery, Ext-js, Jquery-UI, EasyUI等,通常会看到一些开源代码中有prototype的身影.那么prototype究竟是什么呢?在oo前端开发中到底哪些应用呢?从软件工程的角度而言,能解决什么问题?接下来我们就一起来讨论一下prototype关键字在Javascript语言中的神奇之处.   prototype 原型 1.定义 Javascript中有两种容易混淆的类型, function 和 object, 有很