关于prototype
之前听过课,可是这一块没怎么听懂,最近练了两个例子,又问了问小石同学,朦朦胧胧,感觉还是不太懂,记录点心得
最基本的例子
function Box(name,age){
this.name=name;
this.age=age;
this.run=function(){
return this.age+this.name;
}
}
var box=new Box('lee',);
console.log(box.run());
这个是传了两个参数,如果不传参的话,当然也行
function Box(){
this.name='age';
this.age='';
this.run=function(){
return this.age+this.name;
}
}
var box=new Box();
console.log(box.run());
如果用prototype的话,应该这样写
function Box(){
this.name='age';
this.age='';
}
Box.prototype.run=function(){
return this.age+this.name;
}
var box=new Box();
console.log(box.run());
也可以写成这样
function Box(){
this.name='age';
this.age='';
}
Box.prototype={
run:function(){
return this.age+this.name;}
}
var box=new Box();
console.log(box.run());
然后解决了我一个问题,以前我是这样写的,报错了
function box1(){
var sum=;
this.box2();
}
box1.prototype.box2=function(){
var count=this.sum+;
console.log(count);
}
new box1()
其实,应该写成这样,不能用var,用var就变成了私有变量了
function box1(){
this.sum=;
this.box2();
}
box1.prototype.box2=function(){
var count=this.sum+;
console.log(count);
}
new box1()
还有就是new出来是一个对象,必须用对象.XXXX才行
function box1(){
this.sum=;
}
box1.prototype.box2=function(){
var count=this.sum+;
return count;
}
console.log(new box1().box2())
如果是实例化方法和属性的话,他们的引用地址是不一样的
function box(name,age){
this.name=name; //实例化属性
this.age=age;
this.run=function(){ //实例化方法
return this.name+this.age+'运行中';
}
}
var box1=new box("lee",100); //实例化后地址为1
var box2=new box("lee",100); //实例化后地址为2
alert(box1.name==box2.name) //true
alert(box1.run()==box2.run()); //true
alert(box1.run==box2.run); //false 比较的是引用地址,方法的引用地址

如果是原型的属性和方法的话,他们的引用地址是一样的
function box(name,age){
this.name=name;
this.age=age;
}
box.prototype.run=function(){ //原型方法
return this.name+this.age+'运行中';
}
var box1=new box("lee",100); //原型方法,他们的地址是共享的
var box2=new box("lee",100); //原型方法,他们的地址是共享的
alert(box1.run==box2.run); //true 比较的是引用地址

根据上图,创建的每一个函数都有prototype属性,__proto__是一个指针,指向prototype原型对象,new出来的对象都有这个属性,他的作用是指向构造函数的原型属性constructor,通过这两个属性,就可以访问到原型里的属性和方法了。
function box(name,age){
this.name=name;
this.age=age;
}
box.prototype.run=function(){
return this.name+this.age+'运行中';
}
var box1=new box("lee",100);
box.prototype //box {}
box.prototype.constructor //function box(name,age){....} 指向本身
box1.constructor //function box(name,age){....} 指向本身
box1.constructor==box.prototype.constructor //true
box1.__proto__ //box {}
box1.__proto__==box.prototype //true
三、prototype字面量方法
function box(name,age){
this.name=name;
this.age=age;
}
box.prototype={
constructor:box, //强制指回box,如果不重新定义此属性,contructor指向了object,认为{}定义了一个数组
run:function(){
return this.name+this.age+'运行中';
}
}
var box1=new box("lee",100);
alert(box1.constructor)
@
关于prototype的更多相关文章
- js闭包 和 prototype
function test(){ var p=200; function q(){ return p++; } return q; } var s = test(); alert(s()); aler ...
- PHP设计模式(六)原型模式(Prototype For PHP)
原型设计模式: 用原型实例指定创建对象的种类,并且通过拷贝这些原型创建新的对象. 原型设计模式简单的来说,顾名思义, 不去创建新的对象进而保留原型的一种设计模式. 缺点:原型设计模式是的最主要的缺点就 ...
- Function.prototype.toString 的使用技巧
Function.prototype.toString这个原型方法可以帮助你获得函数的源代码, 比如: function hello ( msg ){ console.log("hello& ...
- 分析js中的constructor 和prototype
在javascript的使用过程中,constructor 和prototype这两个概念是相当重要的,深入的理解这两个概念对理解js的一些核心概念非常的重要. 我们在定义函数的时候,函数定义的时候函 ...
- C#设计模式:原型模式(Prototype)及深拷贝、浅拷贝
原型模式(Prototype) 定义: 原型模式:用原型实例指定创建对象的种类,并且通过复制这些原型创建新的对象.被复制的实例被称为原型,这个原型是可定制的. Prototype Pattern也是一 ...
- 关于JS的prototype
在接触JS的过程中,随着理解的深入会逐渐的理解一些比较深奥的理论或者知识,那么今天我们来介绍一下比较难理解的prototype和constructor. 初步理解: 在说prototype和const ...
- js中的原型prototype
var arr1 = new Array(12,34,98,43,38,79,56,1); arr1.sum=function (){ var result = 0; for(var i=0; i&l ...
- [基础] Array.prototype.indexOf()查询方式
背景 最近在看Redux源码,createStore用于注册一个全局store,其内部维护一个Listeren数组,存放state变化时所有的响应函数. 其中store.subscribe(liste ...
- prototype,__proto__,constructor
proto属性: 所有对象都有此属性.但它不是规范里定义的属性,并不是所有JavaScript运行环境都支持.它指向对象的原型,也就是你说的继承链里的原型.通过Object.getPrototypeO ...
- js构造函数的方法与原型prototype
把方法写在构造函数内的情况我们简称为函数内方法,把方法写在prototype属性上的情况我们简称为prototype上的方法 函数内的方法: 使用函数内的方法我们可以访问到函数内部的私有变量,如果我们 ...
随机推荐
- 前端框架Bootstrap的Modal使用Ajax数据源,如何避免数据被缓存
1.绑定事件,在关闭的时候,直接将数据清除: $("#model").on("hidden.bs.model",function(e){$(this).remo ...
- Connection Management and Security
High Performance My SQL THIRD EDITION Each client connection gets its own thread within the server ...
- Excel VBA
=COUNTIF(Y3:Y212,"=11") =SUMIF(Y3:Y212,"=11",AA3:AA212) =SUMPRODUCT((Y3:Y212=&qu ...
- Cocos2d-JS目录说明
frameworks---- 引擎所在,包含两个文件夹cocos2d-html5 和js-bindings.前者是html5引擎,后者是-x的引擎,外部接口是js写,但基础模块却是cpp来实现. sa ...
- Magento PHP Extension "curl" must be loaded解决方法
我记得我第一次在xampp装magento的时候,进入后台时提示PHP Extension "curl" must be loaded 在网页上查了下原因和解决方法,发现是mage ...
- Fiddler-001-抓包工具初识
Fiddler 是一个非常简单的网络调试器,也是目前最常用的http抓包工具之一 .通过 Fiddler,我们能够能够记录客户端和服务器之间的所有 HTTP请求,即记录并检查所有你的电脑和互联网之间的 ...
- java时间戳转date(转)
1.时间戳的定义 时间戳(timestamp),通常是一个数字序列,唯一地标识某一刻的时间,指格林威治时间1970年01月01日00时00分00秒(北京时间1970年01月01日08时00分00秒)起 ...
- 你应该知道的2016年有关App开发的技术创新
上一篇简述了2016年有关App产品的年中总结,这篇开始历数有关App开发的技术创新!无论你是创业者,还是程序员,无论你是否懂编程.写代码,利用APICloud平台数据撰写的年中总结,集合了移动应用创 ...
- H3C交换机配置
h3c 交换机的配置命令 通过 console 连接到交换机 交换机所使用的 console 接口看上去像是一个普通的 RJ45 网卡接口,但是并不能使用普通的网线与 PC 连接 ^_^ .它要通过 ...
- 重新拷贝 新项目 发现不显示 原来是 paramiko 没有装
proxy pass 端口换成 另一个 跟原来的不冲突 [root@ayibang-server soft_ware]# cp s10day11/demo.* s10ops/[root@ayibang ...