js 原型的内存分析
使用构造器的弊端:http://www.cnblogs.com/a757956132/p/5258897.html 示例
将行为设置为全局的行为,如果将所有的方法都设计为全局函数的时候,
这个函数就可以被window调用,此时就破坏了对象了封装性,
而且如果某个对象有大量的方法,就会导致整个代码充斥着大量的全局函数 ,这样将不利于开发
为解决构造的方法是通过原型来解决问题i
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title> <script type="text/javascript"> /**
* 原型是js中非常特殊的一个对象,当一个函数创建之后,会随之就随之产生一个原型对象
* 当通过这个函数的构造函数创建了一个具体的对象之后,在这个具体的对象中就会有一个属性指向原型
*/
//第一种状态
/**
* function Person(){},Person函数中有一个prototype的属性指向Person的原型对象,在原型
* 对象中有一个construction的属性指向了Person函数,所以可以通过new Person()创建对象
*/
function Person(){ }
//
//第二种状态
/**
* 通过Person.protype.name为原型设置值之后,这些属性和方法都是设置在Person的原型中的
*/
Person.prototype.name = "Leon";
Person.prototype.age = 23;
Person.prototype.say = function(){
console.info(this.name + " " + this.age);
} //第三种状态,创建了一个对象之后会有一个_prop_的属性指向原型
//在使用时如果在对象内部没有找打属性会去原型中找,_prop_属性是隐藏的
/**
* 当使用Person创建了对象之后,会在对象中有一个_porp-属性(这个属性是不能被访问的)指向了原型,
* 当使用对象调用原型的时候,首先会在对象的内部找是否有这个属性,如果没有会通过_prop_去原型中找属性,
* 所以当调用p1.say(),在自己的空间中不存在这个方法,就会去原型中寻找,找打之后完成say的调用。
*/
var p1 = new Person();
p1.say(); //Leon 23 //以下方法可以检测p1是否有_prop_指向Person的原型
console.info(Person.prototype.isPrototypeOf(p1)); //true //第四种状态
/**当创建了一个新的p2之后,依然会有一个_porp_属性指向Person的原型,此时如果通过p2.name
* 设置了属性之后,会在对象自己的内存空间中存储name的值,当调用say方法的时候在寻找name时,
* 如果在自己的内存中找到之后,就不会去原型中查找了(特别注意:原型中的值不会被替换,仅仅只是在查找时被覆盖)
* 查找时会先在自己的空间内存中查找,如果查找不到才会到原型中查找
*/
var p2 = new Person();
//是在自己的空间中定义了一个属性,不会替换原型中的属性
p2.name = "Ada";
p2.say(); //Ada 23 //检测某个对象是否是某个函数的原型
console.info(Person.prototype.isPrototypeOf(p2));// true //检测某个对象的constructor指向
console.info(p1.constructor == Person);// true //检测某个属性是否是自己的属性
console.info(p1.hasOwnProperty("name")); //false p1自己的空间中没有值
console.info(p2.hasOwnProperty("name")); //true p2在自己空间中设置了name //可以通过delete删除自己空间中的属性
delete p2.name;
p2.say(); //Leon 23
console.info(p2.hasOwnProperty("name"));//false 由于已经删除,就为false //检测某个对象在原型或者自己中是否包含某个属性,通过int检测
console.info("name" in p1); //true
console.info("name" in p2); //true
console.info("address" in p1); //false 在原型和自己的空间中都没有 console.info(hasPrototypeProperty(p1,"name"));
console.info(hasPrototypeProperty(p2,"name"));
/**
* 可以通过如下方法检测摸个属性是否在原型中存在
*/
function hasPrototypeProperty(obj,prop){
return (!obj.hasOwnProperty(prop) && (prop in obj))
} </script> </head>
<body> </body>
</html>

js 原型的内存分析的更多相关文章
- js高级-变量内存分析
var a = 9, b, c={age:9}, d; b = a; b = 19; console.log(a) console.log(b) d = c; d.age = 22; console ...
- JS内存泄漏 和Chrome 内存分析工具简介(摘)
原文地址:http://web.jobbole.com/88463/ JavaScript 中 4 种常见的内存泄露陷阱 原文:Sebastián Peyrott 译文:伯乐在线专栏作者 - AR ...
- js原型
1.js基本类型和对象类型 js的简单类型包括数字(其中NaN为数字类型).字符串(类似'A'为字符,js没字符类型).布尔值.null值和undefined值.其他所有的值都是对象.数字.字符串和布 ...
- 简单粗暴地理解js原型链–js面向对象编程
简单粗暴地理解js原型链–js面向对象编程 作者:茄果 链接:http://www.cnblogs.com/qieguo/archive/2016/05/03/5451626.html 原型链理解起来 ...
- Chrome开发者工具之JavaScript内存分析
阅读目录 对象大小(Object sizes) 对象的占用总内存树 支配对象(Dominators) V8介绍 Chrome 任务管理器 通过DevTools Timeline来定位内存问题 内存回收 ...
- [转载]JavaScript内存分析
https://github.com/CN-Chrome-DevTools/CN-Chrome-DevTools/blob/master/md/Performance-Profiling/javasc ...
- js原型解析
我们都知道javascript因为具有了继承以及变量等等一系列的特性之后才被人们认为具有一门编程语言的资格,在后续的不断发展中,js在原生的基础上扩展了基于jquery等等的库,甚至衍生了像node. ...
- 深入理解JS原型链与继承
我 觉得阅读精彩的文章是提升自己最快的方法,而且我发现人在不同阶段看待同样的东西都会有不同的收获,有一天你看到一本好书或者好的文章,请记得收藏起来, 隔断时间再去看看,我想应该会有很大的收获.其实今天 ...
- js 原型链和继承(转)
在理解继承之前,需要知道 js 的三个东西: 什么是 JS 原型链 this 的值到底是什么 JS 的 new 到底是干什么的 1. 什么是 JS 原型链? 我们知道 JS 有对象,比如 var ob ...
随机推荐
- Android下实现win8的按钮点击效果
原理就是自定义一个imageButton,实现动画效果 demo源码下载地址: 请戳这里----------------> 关于回弹张力的效果扩展,可以参考Facebook的开源动画库rebo ...
- mkdir -p命令
如果要创建目录A并创建目录A的子目录B,没有用-p的情况下是mkdir 2次如果用-p 可以直接创建2个目录 mkdir -p 目录A/子目录B就可以
- Eclipse将android项目打包jar文件
Eclipse+android打包jar文件 蔡建良 2016-3-12 以Android-SlideExpandableListView开源框架为例,将源码Library打包成jar文件并包含R.c ...
- WPF的控件Binding的ElementName/RelativeSource具体用法
<TextBlock Name="_txtSickBedNo" FontStyle="Normal" Foreground="Black&quo ...
- ajax url参数中文乱码解决
1.较好的处理办法,对js的url中的中文参数值使用两次encodeURI(),即 encodeURI(encodeURI("url的中文参数值")), java代码中使用URLD ...
- HDU 5127 Dogs' Candies
Dogs' Candies Time Limit: 30000/30000 MS (Java/Others) Memory Limit: 512000/512000 K (Java/Others) T ...
- 17、Wi-Fi Direct
Wi-Fi Direct简介 从Android4.0(API Level=14)开始,允许通过Wi-Fi模块在两个移动设备之间建立直接连接(这种技术称为Wi-Fi Direct),这种连接不需要无线路 ...
- RedHat 5 配置CentOS yum 更新源
YUM是Redhat Linux在线安装更新及软件的工具,但是这是RHEL5的收费功能,如果没有购买Redhat的服务时不能使用RHEL5的更新源的,会提示注册. 由于CentOS是从Redhat演化 ...
- .net/c#连接sqlserver
Webconfig代码 <configuration> <appSettings> <add key="myconnect" value=" ...
- 快速入门linux系统的iptables防火墙 1 本机与外界的基本通信管理
概述 iptables是一种运行在linux下的防火墙组件,下面的介绍可以快速的学习iptables的入门使用. 特点(重要) 它的工作逻辑分为 链.表.规则三层结构. 数据包通过的时候,在对应表中, ...