JavaScript 原型学习总结

每个对像都有一个隐慝的属性用于指向到它的父对像(构造对像的函数)的原型(这里称为父原型或隐式原型),并从中继承它的属性和方法 [函数对像除了父原型引用外,还有一个显式的原型引用],在一般情况下,对像的父原型是不可以访问的,而函数对像的显式原型可以通过FunctionName.prototype进行访问 [在FireFox中你可以通过对像的__proto__属性来访问对像的父原型]   

  这个原型属性本身又是一个Object类型的对像,因此可以给这个原型属性添加任意的属性和方法 让实例对像来继承它们

如: 一个String类型的对像的原型为String.prototype,如果我们想要给String类型的对像添加一些自定义的方法,那我们可以这样来实现(这里以添加一个类式VBscript中的trim方法为例)


代码如下:

String.prototype.trim=function(){
return this.replace(/^\s*|\s*$/g,"")
}
// " jiangsk540 ".trim();//return "jiagnsk540"

原型除了提供以上的特性之外,它还提供了一群同类实例对像共享属性和方法的机制 [也就相当于静态属性或静态函数,无论用构造函数创建了多少个实例对像,在原型上定义的属性和方法从头到尾只定义了一次,所有实例对像都共享使用这一个属性或方法 但并非和C++或JAVA的静态属性或静态函数的概念相同]


代码如下:

function Class1(name){
this.name = name;
}
Class1.prototype.show=function(){
alert("name="+this.name);
}
var m1 = new Class1("jiangsk540");
var m2 = new Class1("毛狮子");
alert(m1.show===m2.show);//显示 true

动态给构造函数原型添加的属性或方法即可被先前建立的对像立即调用



代码如下:

function Class1(name){
this.name = name;
}
Class1.prototype.show=function(){
alert("name="+this.name);
}
var m1 = new Class1("jiangsk540");
Class1.prototype.say=function(){
alert("Hi");
}
m1.say()//调用成功
/*
注意:只有为构造函数的原型添加的属性或方法才能被已经创建的对像立即调用
如果是改变构造函数原型的引用那么就不能被已经创建的对像立即调用
*/
Class1.prototype={newP:"jiangsk540"};
alert(m1.newP)//undefined

(0)

相关推荐

  • JavaScript 原型学习总结

    每个对像都有一个隐慝的属性用于指向到它的父对像(构造对像的函数)的原型(这里称为父原型或隐式原型),并从中继承它的属性和方法 [函数对像除了父原型引用外,还有一个显式的原型引用],在一般情况下,对像的父原型是不可以访问的,而函数对像的显式原型可以通过FunctionName.prototype进行访问 [在FireFox中你可以通过对像的__proto__属性来访问对像的父原型] 这个原型属性本身又是一个Object类型的对像,因此可以给这个原型属性添加任意的属性和方法 让实例对像来继承它们 如

  • javascript原型链学习记录之继承实现方式分析

    本文实例讲述了javascript原型链学习记录之继承实现方式.分享给大家供大家参考,具体如下: 在慕课网学习继承的笔记: 继承的几种方式: ① 使用构造函数实现继承 function Parent(){ this.name = 'parent'; } function Child(){ Parent.call(this); //在子类函数体里面执行父类的构造函数 this.type = 'child';//子类自己的属性 } Parent.call(this),this即实例,使用this执行

  • javascript原型继承工作原理和实例详解

    先为大家分享JS原型继承实例,供大家参考,具体内容如下 一.JS原型继承 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>JS原型继承</title> </head> <body> <!--原型继承--> <script type="text/javascript"> //cl

  • JavaScript继承学习笔记【新手必看】

    JavaScript作为一个面向对象语言(JS是基于对象的),可以实现继承是必不可少的,但是由于本身并没有类的概念,所以不会像真正的面向对象编程语言通过类实现继承,但可以通过其他方法实现继承.实现继承的方法很多,下面就只是其中的几种. 一. 原型链继承 function Person() { //被继承的函数叫做超类型(父类,基类) this.name='mumu'; this.age='18'; } Person.prototype.name='susu';//当属性名相同时需就近原则,先在实

  • javascript 继承学习心得总结

    看了不少js继承的东西也该总结总结了. 先说一下大概的理解,有不对的还望指正,也好更正一下三观.另外说明下,下面的例子并非原创基本就是改了个变量名啥的,有的甚至直接拿过来用的. js继承是用来干啥的: 首先说js没有真正的跟其他面向对象的语言一样概念的继承,js里边所说的继承是指模拟继承. 具体js继承是干啥呢,刚开始做前端的时候我是用来面试的(最早写些小效果的时候基本用不到,为啥要看呢,因为面试官很爱问这个问题啊),所以就看看大概的,面试时候能说个大概,在这个问题上算是面试党了.后来跟着慢慢的

  • JavaScript原型继承和原型链原理详解

    这篇文章主要介绍了JavaScript原型继承和原型链原理详解,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下 在讨论原型继承之前,先回顾一下关于创建自定义类型的方式,这里推荐将构造函数和原型模式组合使用,通过构造函数来定义实例自己的属性,再通过原型来定义公共的方法和属性. 这样一来,每个实例都有自己的实例属性副本,又能共享同一个方法,这样的好处就是可以极大的节省内存空间.同时还可以向构造函数传递参数,十分的方便. 这里还要再讲一下两种特色的构造

  • 一篇文章让你搞懂JavaScript 原型和原型链

    本文由葡萄城技术团队原创并首发 转载请注明出处:葡萄城官网 与多数面向对象的开发语言有所不同,虽然JavaScript没有引入类似类的概念(ES6已经引入了class语法糖),但它仍然能够大量的使用对象,那么如何将所有对象联系起来就成了问题.于是就有了本文中我们要讲到的原型和原型链的概念. 原型和原型链作为深入学习JavaScript最重要的概念之一,如果掌握它了后,弄清楚例如:JavaScript的继承,new关键字的原来.封装及优化等概念将变得不在话下,那么下面我们开始关于原型和原型链的介绍

  • 探究JavaScript原型数据共享与方法共享实现

    数据共享 什么样子的数据是需要写在原型中? 需要共享的数据就可以写原型中 原型的作用之一:数据共享 属性需要共享,方法也需要共享: 不需要共享的数据写在构造函数中 需要共享的数据写在原型中 下面我们看一个案例 数据共享案例 每个学生的名字,年龄,性别都是独特的,我们要设置 所有学生的身高都是188,所有人的体重都是55 所有学生都要每天写500行代码 所有学生每天都要吃一个10斤的西瓜 就可以把共有数据写到原型中 <!DOCTYPE html> <html lang="en&q

  • JavaScript 反射学习技巧

    目录 1.前言 2.接口 3.简单的例子 4.结语 1.前言 根据 MDN 官网解释: Reflect 是一个内置的对象,它提供拦截 JavaScript 操作的方法.这些方法与 proxy handlers (en-US)的方法相同. Reflect 不是一个函数对象,因此它是不可构造的. 那么它到底是什么?根据上面文件介绍会发现它和 Proxy 极像,都是获取执行函数本身信息.主要是区别在于所有的函数对象属性过于复杂,而且额外增加可能会导致程序行为不合理,所以扩展 Reflect 函数来专门

  • JavaScript原型Prototype详情

    目录 1.概述 1.1原型是什么 1.2获取原型 2.原型属性 2.1利用原型添加属性与方法. 2.2访问原型属性原型方法 3.自有属性与原型属性 3.1检测自有属性或者原型属性 4.isPrototypeOf()方法 5.扩展内置对象 6.结语 1.概述 1.1原型是什么 在JavaScript中,函数是一个包含属性和方法的Function类型的对象.而原型(Prototype )就是Function类型对象的一个属性. 在函数定义是包含了prototype属性,它的初始值是一个空对象 .在J

随机推荐