__proto__与prototype
值得一说的是对象没有prototype属性,只有函数有prototype属性。
var a = function(){};
a.prototype.d = function(){
console.log();
}
prototype相当于给函数a添加了一个属性。
var a = function(){};
a.prototype.d = function(){
console.log();
}
var b = new a();
b.d(); //
用prototype添加的属性,实例化后这个函数的对象也可以继承这个属性。
那为什么要用prototype添加属性呢?来看看
var a = function(){
var f = function(){
console.log();
}
};
var b = new a();
b.f(); //报错
为什么报错?先看一下call方法和new对象的关系这篇文章,看完你就明白b可以继承函数a的prototype属性了。
注意我那篇文章只说的了new可以继承prototype属性,但是没有说它可以继承函数里面的内容。所以为什么解决这个为什么我们就会用到prototype了,当然有时为了一些优化的原因也会这样用。
其实不只是prototype可以解决这个问题,还有this也是可以解决这个问题的,就像我们使用构造函数一样,我们都是用的this对吧,因为new以后就会改变这个this的指向,然后这个属性就会变成你创建出来的那个对象的属性。 对于this的指向问题可以看彻底理解js中this的指向,不必硬背。
function Fn(){
this.num = ;
}
var a = new Fn();
console.log(a.num); //
那么__proto__是什么?为了更好的理解__proto__建议你先看什么是作用域链这篇文章。
__proto__和作用域的行为类似,只不过__proto__是对于对象的属性来说的,而作用域链是对于变量来说的,什么意思?就是说一个对象如果要打印这个对象的某个属性,那么它会先在自己的对象中查找,如果没有找到那么它就会__proto__中找,看看有没有这个属性。那么__proto__中到底有哪些属性?
你一开始创建的对象__proto__指向了obj.__proto__,也就说明我们创建的任何对象都可以调用obj.__proto__里面的属性和方法,而obj的__proto__为null,也就是说到obj的__proto__就到头了。这也就是说如果我们没有做任何的操作,这个对象只能继承obj.__proto__的属性,这里没有算上obj的__proto__是因为,obj的__proto__为null。
但是如果我们用了new操作符实例化了一个函数,那么这个new出来的对象就又多了一个继承对象,那就是那个构造函数。而这个构造函数如果用prototype添加属性同样的,这个实例化的对象也可以继承它的属性。
还有一点就是如果这个对象本身就有这个属性就不会去继承,继承只有在这个对象没有找到的时候才会继承,就和我们学css的继承样式一样。
function Fn(){
}
Fn.prototype.num = ;
var a = new Fn();
a.num = ;
console.log(a.num); //
如果这个对象没有这个属性才会继承,并且这个对象有多个__proto__那么它也只是继承最近的那个属性。
function Fn(){
}
Fn.prototype.num = ;
var a = new Fn();
console.log(a.num);
在这段代码中Fn的__proto__离对象a最近所以继承它的,而不是obj的。
补充一点:
function Foo() {};
var foo = new Foo();
Foo.prototype.num = ;
console.log(foo.num); //52
console.log(Foo.num); //undefined
再看
function Foo() {};
var foo = new Foo();
Foo.prototype.num = ;
console.log(foo.num); //
console.log(Foo.prototype.num); //
对,你没有猜错,num只是prototype的属性,而prototype是Foo的属性,自然只能通过Foo.prototype.num来访问这个属性,那么为什么new出来的对象可以不用加prototype就可以访问num呢?
实际上new出来的对象是这样的。
var fn = function(a){
this.a = a;
}
var obj = {};
继承
obj.__proto__ = fn.prototype;
改变this指向
fn.call(obj);
看到没有,已经写了fn.prototype,自然就可以在后面点那个属性了。ok了吧?
__proto__与prototype的更多相关文章
- 谈谈__proto__和prototype的区别
我想javascript中的原型链一直想很多初学javascript的同学感到非常的困惑,今天看了一些文章,结合自己的理解,把原型链这个东西从新来整理一下,如有不对之处,望大家帮忙指出. 首先,我们应 ...
- JavaScript中__proto__与prototype的关系
一.所有构造器/函数的__proto__都指向Function.prototype,它是一个空函数(Empty function) 1 2 3 4 5 6 7 8 9 Number.__proto__ ...
- intanceof以及引出的__proto__和prototype
instanceof运算代码 function instance_of(L, R) { //L 表示左表达式,R 表示右表达式 var O = R.prototype; // 取 R 的显示原型 L ...
- 15条规则解析JavaScript对象布局(__proto__、prototype、constructor)
大家都说JavaScript的属性多,记不过来,各种结构复杂不易了解.确实JS是一门入门快提高难的语言,但是也有其他办法可以辅助记忆.下面就来讨论一下JS的一大难点-对象布局,究竟设计JS这门语言的人 ...
- javascript--15条规则解析JavaScript对象布局(__proto__、prototype、constructor)
大家都说JavaScript的属性多,记不过来,各种结构复杂不易了解.确实JS是一门入门快提高难的语言,但是也有其他办法可以辅助记忆.下面就来讨论一下JS的一大难点-对象布局,究竟设计JS这门语言的人 ...
- Javascript中的__proto__、prototype、constructor
今天重温了下Javacript,给大家带来一篇Javascript博文,相信对于Javacript有一定了解的人都听过prototype原型这个概念,今天我们深度的分析下prototype与__pro ...
- js中Object.__proto__===Function.prototype
参考:http://stackoverflow.com/questions/650764/how-does-proto-differ-from-constructor-prototype http:/ ...
- javascript中的__proto__和prototype
一.2个参考网址: http://icekiller110.iteye.com/blog/1566768 http://www.cnblogs.com/snandy/archive/2012/09/0 ...
- 关于 __proto__和prototype的一些理解
var Person = function(name) {}; Person.prototype.say = function() { console.log("Person say&quo ...
随机推荐
- iOS开发——高级技术&PassBook服务
PassBook服务 Passbook是苹果推出的一个管理登机牌.会员卡.电影票.优惠券等信息的 工具.Passbook就像一个卡包,用于存放你的购物卡.积分卡.电影票.礼品卡等,而这些票据就是一个“ ...
- 使用tornado的gen模块改善程序性能
之前在公司的一个模块,需要从另一处url取得数据,我使用了Python的一个很著名的lib,叫做requests.但是这样做极大的降低了程序的性能,因为tornado是单线程的,它使用了所谓的reac ...
- Spring对象绑定与类型转换
Spring对象绑定与类型转换 Spring的框架体系中,到处充斥着对象绑定从bean的初始化autowired属性,SpringMvc 中对对象的绑定等.Spring对象绑定和类型转换在Spring ...
- Inno setup 安装*.inf文件_示例
nno setup 调用*.Inf文件的条目区段名称_示例 首先自己编写一个INF文件来供 Inno setup 进行测试: ;复制以下代码到记事本然后另存为123.inf .然后把123.inf文件 ...
- 如何查看Linux的系统是64位的还是32位的
可以用命令“getconf LONG_BIT”查看,如果返回的结果是32则说明是32位,返回的结果是64则说明是64位. 此外还可以使用命令“uname -a”查看,输出的结果中,如果有x86_64就 ...
- nginx 重写 rewrite 基础及实例
nginx rewrite 正则表达式匹配 大小写匹配 ~ 为区分大小写匹配 ~* 为不区分大小写匹配 !~和!~*分别为区分大小写不匹配及不区分大小写不匹配 文件及目录匹配 -f和!-f用来判断是否 ...
- 如何开发Domino中的WebService
在domino中写webservice可以使用LotusScript,也可以使用java,由于LotusScript API提供的功能多数都是操作domino数据库中文档的,在web service中 ...
- ARM中C和汇编混合编程及示例(转)
在嵌入式系统开发中,目前使用的主要编程语言是C和汇编,C++已经有相应的编译器,但是现在使用还是比较少的.在稍大规模的嵌入式软件中,例如含有OS,大部分的代码都是用C编写的,主要是因为C语言的结构比较 ...
- 【译】在 Chrome 开发者工具中调试 node.js
原文链接 : Debugging Node.js in Chrome DevTools 原文作者 : MATT DESLAURIERS 译文出自 : 掘金翻译计划 译文链接 : https://git ...
- 【转】APP被苹果App Store拒绝的N个原因(持续补充)
作为iOS开发者,估计有很多都遇到过APP提交到App Store被拒,然后这些被拒的原因多种多样,今天dApps收集了常见的被拒的原因,以便更多开发者了解. 1.程序有重大bug,程序不能启动,或者 ...