Javascript基础——详解prototype

基础prototype.js常用函数及其用法 立即下载
1.6. 关于prototype

prototype即原型。JavaScript中所有的函数都有一个prototype属性。这个prototype属性本身又是一个object类型的对象。因此我们可以对这个prototype对象添加任意属性和方法。prototype的特点是:在prototype上定义的属性和方法,可以通过其构造出来的实例对象直接访问和调用。也就是说,prototype提供了一组同类对象共享属性和方法的机制。下面给出两个例子进行对比说明prototype的作用。

例子1:

function Person(name){

this.name = name;

}

Person.say = function(){

alert('hello,'+this.name);

}

Person.say();//输出“hello,undefined”

var zhangsan = new Person('zhangsan');

var lisi = new Person('lisi');

zhangsan.say();//此处会抛出“对象不支持此属性和方法”的错误

lisi.say();//此处会抛出“对象不支持此属性和方法”的错误

通过例子1可以看出,虽然我们为Person函数定义了名称为say方法,但是只有Person函数自己可以调用该方法,通过Person函数构造出来的zhangsan和lisi两个对象都不能调用该方法,也就是说Person构造出来的对象是不能共享Person函数的属性和方法的。

例子2:

function Person(name){

this.name = name;

}

Person.prototype.say = function(){

alert('hello,'+this.name);

}

Person.say();//此处会抛出“对象不支持此属性和方法”的错误

Person. prototype .say();//输出“hello,undefined”

var zhangsan = new Person('zhangsan');

var lisi = new Person('lisi');

zhangsan.say();//输出“hello,zhangsan”

lisi.say();//输出“hello,lisi”

通过例子2可以看出,我们在Person函数的prototype属性上定义的say方法,通过Person函数构造出来的zhangsan和lisi两个对象都可以调用该方法,也就是说Person构造出来的对象是可以共享Person函数在prototype属性上定义的属性和方法的。但是,Person函数自身却不能直接调用该方法,因此在调用Person.say()时会报错,只能通过Person. prototype .say()进行调用。

简单理解js的prototype属性及使用 在进入正文之前,我得先说说我认识js的prototype这个东西的曲折过程。 百度js的prototype的文章,先看看,W3School关于prototype的介绍: 你觉得这概念适合定义js的prototype这个东西吗?你是否也认为prototype是一个object对象的属性呢?是的话,请认真认真看我这篇文章,因为这篇文章会毁灭你的人生三观,呵呵,就是有这么严重,因为本人就是被这个定义给害惨的。 不得不说,看了网上的一些介绍prototype的文章,基本上都说prototype是对象的一个属性,于是,我也坚定的认为prototype是一个对象的属性,所以,我被了坑好久好久,由此,引 立即下载

相关推荐

高级js学习7 prototype 继承 微任务宏任务以及promsie

prototype重定向 function Fn(){} Fn.prototype.say = () => {} Fn.prototype = new Fn() 重定向有几个问题 1 重定向后prototype指向的对象可能不具备constructor对象,必须自己手动配置。 2 可能导致浏览器默认开启的原型对象上的方法丢失。解决:重定向的对象最好和之前的原型对象做一个合并处理。 如 Fn.prototype = Object.assing({}, Fn.prototype, new Fn())

lin_fightin的博客 686

轻松理解 JS 中的面向对象,顺便搞懂 prototype 和 __proto__

点击上方“前端开发博客”,选择“设为星标”回复“2”加入前端群作者:蒋鹏飞https://juejin.im/post/5e50e5b16fb9a07c9a1959af这篇文章主要一下J...

前端开发博客 1万+

prototype (原型) 属性

转自:https://www.jianshu.com/p/4f87d28923ce 这篇文章是基于 <<JavaScript 高级程序设计>>第六章面向对象的程序设计 6.2.3原型模式 我们每创建一个函数, 都有一个 prototype (原型)属性, 这个属性是一个指针, 指向一个对象,这个对象的 用途: 包含可以由指定类型的所有实例共享的属性和方法 所以 prot...

wiscourper的博客 1137

浅析JavaScript的原型(prototype)(一)

一. 得到javaScript对象的四种方式的比较 第一种方式:通过new Object得到:没有类的约束,无法实现对象的重复使用,过于繁琐 var person=new Object(); person.name="花花"; person.age=17; person.say=function(){ alert("姓名:"+this.name+",年龄:"+this.age);

github_36664003的博客 487

prototype的详细

prototype源自法语,软件界的标准翻译为“原型”,代表事物的初始形态,也含有模型和样板的意义。JavaScript中的prototype概念恰如其分地反映了这个词的内含,我们不能将其理解为C++的prototype那种预先声明的概念。    JavaScript的所有fun

captain 1404

javascriptprototype详解

摘要 本系列博文主要谈一些在 javascript 使用中经常会混淆的高级应用,包括: prototype, closure, scope, this关键字. 对于一个需要提高自己javascript水平的程序员,这些都是必须要掌握的. 本节主要介绍prototype. Contents 摘要起由prototype结论参考资料本文的rst源码 起由 最近在做

Skyline 565

JavaScript prototype详解

用过JavaScript的同学们肯定都对prototype如雷贯耳,但是这究竟是个什么东西却让初学者莫衷一是,只知道函数都会有一个prototype属性,可以为其添加函数供实例访问,其它的就不清楚了,最近看了一些 JavaScript高级程序设计,终于揭开了其神秘面纱。 每个函数都有一个prototype属性,这个属性是指向一个对象的引用,这个对象称为原型对象,原型对象包含函数实例共享的方法

小平果的欢乐谷 2882

JavaScript》重学JS-细聊一下prototype、__proto__与constructor(超详解版)

我们知道不管是TypeScript还是JavaScript的class,归根结底都是基于prototype实现的,因此才将class称作语法糖,本文以我之重学视角,结合图解、示例、ECMAScript原文以及prototype、__proto__与constructor的历史,换个角度学习一下三者并记录分享;

Oliver尹的博客 2518

JavaScript原型链prototype详解

JavaScript中,每个对象都有一个原型(prototype)属性,它指向另一个对象。这个被指向的对象也有自己的原型,以此类推,最终形成了一个原型链。原型链的顶端是Object.prototype,它是所有对象的根原型。当我们访问一个对象的属性时,如果该对象自身没有这个属性,JavaScript会沿着原型链向上查找,直到找到匹配的属性或者到达原型链的末端。通过深入了解JavaScript原型链的概念、工作原理和应用,我们可以更好地理解JavaScript面向对象编程的机制。

zhaochen1127的博客 1174

js的面试与笔试--JavaScript prototype原型和原型链详解

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

evior 6456

javascript prototype 详解

声明本文转载来自:http://blog.csdn.net/chaojie2009/article/details/6719353  JavaScript是基于对象的,任何元素都可以看成对象。然而,类型和对象是不同的。本文中,我们除了讨论类型和对象的一些特点之外,更重要的是研究如何写出好的并且利于重用的类型。毕竟,JavaScript这种流行的脚本语言如果能够进行良好的封装,并形成一个庞大的类型

wo1aijava的专栏 717

js中prototype详解

先看下面一段代码: function Machine(ecode, horsepower) { this.ecode = ecode; this.horsepower = horsepower; } function showme() { alert(this.name + " " + this.ecode + " ...

ding0702的专栏 231

JS中prototype详解

JS中的prototype是JS中比较难理解的一个部分   本文基于下面几个知识点:   1 原型法设计模式 在.Net中可以使用clone()来实现原型法 原型法的主要思想是,现在有1个类A,我想要创建一个类B,这个类是以A为原型的,并且能进行扩展。我们称B的原型为A。   2 javascript的方法可以分为三类: a 类方法 b 对象方法 c 原型方法 例子: f

kobetmacone的专栏 521

详解Javascriptprototype属性

详解Javascriptprototype属性(推荐) 在典型的面向对象的语言中,如java,都存在类(class)的概念,类就是对象的模板,对象就是类的实例。但是在Javascript语言体系中,是不存在类(Class)的概念的,javascript中不是基于‘类的',而是通过构造函数(constructor)和原型链(prototype chains)实现的。但是在ES6中提供了更接近传统...

qq30211478的博客 392

JavaScript Prototype 详解

本文里述的是关于JavaScriptprototype问题,至于具体的JavaScript面向对象的编程教程,请各位看客到其他网站搜索一下,或者到这里看看。 首先开始一个例子,如下: function A() { this.t1 = "ffffff

Day And Night 683

prototype.js详解

prototype.js是什么? 万一你没有使用过大名鼎鼎的prototype.js,那么让我来告诉你,prototype.js是由Sam Stephenson写的一个javascript类库。这个构思奇妙,而且兼容标准的类库,能帮助你轻松建立有高度互动的web2.0特性的富客户端页面。 如果你最近尝试使用它,你大概了解到文档并不是作者的一个强项。和在我以前使用这个类库...

叶落啼莺 1062
上一篇: Javascript基础——关于JavaScript代码的执行顺序
下一篇: Javascript基础——不常用但很有用的js函数
weoln
博客等级 码龄21年 43粉丝 123原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值