关于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上的方法 函数内的方法: 使用函数内的方法我们可以访问到函数内部的私有变量,如果我们 ...
随机推荐
- Java 常见问题思考
Java中的成员变量是选择在声明时赋值还是在构造函数中赋值? // 通过构造函数赋值 public class UserRequestImpl extends ModuleImplBase { pri ...
- CSS3学习(CSS3过渡、CSS3动画)
CSS3过渡:transition属性--专门应对颜色.长度.宽度.位置等变化的过渡 通过CSS3,我们可以在不使用Flash和JavaScript的情况下,为当前某元素从某样式改变为某样式的时候添加 ...
- hibernate manytoone中的lazy EAGER
Hibernate中的字段映射中的Fetch有两种方式:EAGER和LAZY Eager:全部抓取 Lazy:延迟抓取 如果在字段中声明为Eager,那么在取得当前Bean时,同时会抓取Bean中的关 ...
- Debug BLE application with nRF Sniffer+wireshark
1. Introduction The nRF Bluetooth® Smart Sniffer is a tool for debugging Bluetooth low energy (BLE) ...
- Linux的常用基本命令
Linux的常用基本命令. 首先启动Linux.启动完毕后需要进行用户的登录,选择登陆的用户不同自然权限也不一样,其中“系统管理员”拥有最高权限. 在启动Linux后屏幕出现如下界面显示: …… Re ...
- Subset---poj3977(折半枚举+二分查找)
题目链接:http://poj.org/problem?id=3977 给你n个数,找到一个子集,使得这个子集的和的绝对值是最小的,如果有多种情况,输出子集个数最少的: n<=35,|a[i]| ...
- Selenium2学习-024-WebUI自动化实战实例-022-网站不同分辨率下页面样式展示兼容性问题解决方案 -- 设置浏览器显示区域大小(无人值守,节约测试成本的福音,BOSS 最爱)
在 Web UI 自动化测试的过程中,通常会测试页面在不同分辨率下的显示效果,即在不同大小的显示器上全屏浏览器后的页面展示,此种测试方法需要购置不同大小的显示器,或者频繁的设置屏幕分辨率,不仅浪费了大 ...
- 如何去掉word的背影图片?
从网上下载下来的word资料总有背影图片,看的人很烦,网上有一些去除背景图片的方法,我找到一个不用去背景图片也行的方法:先选View,再选Draft,背景图片就正在最上面显示了,这时候你也可以选中图片 ...
- .NET基础加强,找工作之前可以看看这些............
.NET基础知识加强: 1 变量命名规则:骆驼命名法:第一个字母小写之后的首字母大写,[对于方法名和类名首字母大写]→培养良好的命名规范. 2 构造函数:没有返回值,方法名和类名相同,每个类中都有 ...
- 浅谈 man 命令的日常使用
Linux系统提供了相对比较丰富的帮助手册(man),man是manual的缩写,在日常linux系统管理中经常用到,今天就简单聊聊man.man 本身也提供自己的帮助手册,通过man就可以查看. ( ...