最近研究了一下js中的prototype,发现网上很多对prototype的误解,下面是我的一些心得。
1. prototype原型是基于类型的,而不是基于实例的。
var newLine = "</br>"
function App(){
this.appName = "应用";
}
App.prototype.type = "软件";
var a1 = new App();
var a2 = new App();
document.write(a1.type+newLine);//软件
document.write(a2.type+newLine);//软件
App.prototype.type = "电焊";
document.write(newLine);
document.write(a1.type+newLine);//电焊
document.write(a2.type+newLine);//电焊
//此时两个对象的type属性是指向同一内存地址的。
//在访问type属性时,解释器先在a1 a2中寻找,未找到后,向类型的原型中寻找,最终找到原型的type属性,所以两个对象的type在同一内存地址
不过如果你这样写的话,就会出现奇怪的一幕
var newLine = "</br>"
function App(){
this.appName = "应用";
}
App.prototype.type = "软件";
var a1 = new App();
a1.type = "软件1";
var a2 = new App();
a1.type = "软件2";
document.write(a1.type+newLine);//软件1
document.write(a2.type+newLine);//软件2
//这样可能会给你造成,每个对象拥有一个prototype属性,随创建时隐式创建,并且每一个实例有一个type属性的误解。
//其实是这样的,在你读type属性的时候,在实例中找不到,沿原型链向上,在类型原型里找到,故type是同一内存地址
//但是在写入的时候,在实例中找不到,不会沿原型链向上,而是在本地创建了一个同名变量,所以出现了上面的效果
所以说prototype是针对与类型的,所有实例的原型属性都是同一个对象的,至不过让你修改的时候,实例在自己内部重新创建了一个新变量,给你了每一个实例都有一个原型的错觉。
所以
var newLine = "</br>"
function App(){
this.appName = "应用";
}
App.prototype.type = "软件";
var a1 = new App();
a1.type = "软件1";
var a2 = new App();
a1.type = "软件2";
document.write(a1.type+newLine);//软件1
document.write(a2.type+newLine);//软件2
delete a1.type ;//删除的是实例中的type属性 原型的并没有被改变
document.write(a1.type+newLine);//软件 故输出的原型中的变量
2. 对象的构造函数不是由constructor指定的
<script language="javascript" type="text/javascript">
newLine = "</br>"
function App(){
this.appName = "应用";
alert("调用App");
}
function FApp(){
}
var a = new App(); //调用App
alert(a.hasOwnProperty("constructor")); //false 首先App的实例中是没有constructor属性的
alert(a.constructor);//是从原型中得到的属性constructor,在定义类型时,原型的constructor属性被自动指向类型的构造函数
//故 如果我们这样做
App.prototype = new FApp();
alert(App.prototype.constructor);//输出的是FApp(),因为类型的原型变成了 FApp实例,而FApp实例的constructor是FApp()
//但是我们在创建App实例的时候仍然调用App()
var a2 = new App(); //调用App()
</script>
那么constructor到底有什么用呢,是为了维持了正常的原型链,并且在你想知道构造函数的时候可以查的到。(这个是我在网上搜到的一些理解)
初步接触js,有错误望指正!!
分享到:
相关推荐
prototype的JS文件prototype的JS文件prototype的JS文件prototype的JS文件
prototype js脚本库prototype js脚本库prototype js脚本库prototype js脚本库
prototype.js的系列文章——$H()函数 百度的Ajax.js文件 常用JS prototype.js的系列文章——$R()函数 prototype.js的系列文章——Ajax.Request类 prototype.js的系列文章——Ajax.Updater类 prototype.js的系列文章...
prototype-1.6.0.3.js prototype1.4中文手册(chm) prototype1.5中文手册(chm) prototype1.6英文手册(chm)
找了好久,才找到下载资源 prototype_1.7.3.js 最新版本
JS:prototype用法
开源JS包Prototype使用指南开源JS包Prototype使用指南开源JS包Prototype使用指南开源JS包Prototype使用指南开源JS包Prototype使用指南
万一你没有使用过大名鼎鼎的prototype.js,那么让我来告诉你,prototype.js是由Sam Stephenson写的一个javascript类库。这个构思奇妙,而且兼容标准的类库,能帮助你轻松建立有高度互动的web2.0特性的富客户端...
轻松建立有高度互动的web2.0特性的富客户端页面
prototype.js 是Sam Stephenson写的一个非常优雅的java script基础类库,对java script做了大量的扩展,而且很好的支持Ajax,兼容标准的类库,能帮助你轻松建立有高度互动的web2.0特性的丰富的客户端页面。...
js脚本重要插件,有助于你写脚本的时候有非常有好的提示信息哦
prototype.js 1.6 中英文手册 和 prototype.js 1.6
prototype-1.7.js
prototype.js是一个非常优雅的javascript基础类库,对javascript做了大量的扩展,而且很好的支持Ajax,国外有多个基于此类库实现的效果库,也做得很棒。 prototype.js不仅是一个有很大实用价值的js库,而且有很...
压缩包内包含的文件如下: 1.手册与教程: ...CSS 2.0样式表中文手册(推荐); ... javascript_Refer_CN.CHM:javascript中文参考手册(推荐); JavaScript_Refer_CN.rar:javascript中文参考手册(HTML版,...Prototype 1.4.0源码.js.
网上找的一些prototype.js学习资料
prototype1.6.1 .js 时下流行的前端开发javascript类库
javascript prototype文档
prototype.js 1.6中文手册、prototype.js 1.6英文手册、
prototype1.6.0prototype1.6.0prototype1.6.0prototype1.6.0