如何在 JavaScript 对象中嵌入私有成员_第1页
如何在 JavaScript 对象中嵌入私有成员_第2页
如何在 JavaScript 对象中嵌入私有成员_第3页
如何在 JavaScript 对象中嵌入私有成员_第4页
如何在 JavaScript 对象中嵌入私有成员_第5页
已阅读5页，还剩9页未读， 继续免费阅读

下载本文档

版权说明：本文档由用户提供并上传，收益归属内容提供方，若内容存在侵权，请进行举报或认领

文档简介

1、最近，我开发一个项目 Angular Cloud Data Connector, 挂念Angular开发者使用云数据，特殊是 Azure移动服务, 使用WEB标准，像索引数据库(indexed DB)。我尝试建立一种方式，使得JavaScript开发者能将私有成员嵌入到一个对象中。我解决这个问题的技术用到了我命名的闭包空间（closure space）。在这篇入门文章中，我要共享的是如何在你的项目中用它，及它对主流扫瞄器的性能和内存的影响。在深化学习前，咱们先说下，你为什么需要用到私有成员（private members）， 还有一种替代方式来模拟私有成员。1. 为何要用私

2、有成员（Private Members）当你用JavaScript 创建一个对象时，可以声明值成员（value members）。 假如你打算把握对它们的读/写访问操作，可以如下声明:var entity = entity._property = "hello world"Object.defineProperty(entity, "property",     get: function ()  

3、;return this._property; ,    set: function (value)         this._property = value;    ,    enumerable: true,    configurable: true);这样实

4、现，你能完全把握读和写操作。问题在于_property 成员仍旧可以直接访问和修改。这也就是为何我们需要更加稳定牢靠的方式，声明私有成员，它智能通过对象的方法来访问。2. 使用闭包空间（Closure Space）解决方法是使用闭包空间。每当内部函数 (inner fanction) 访问来自外部函数作用域的变量时，扫瞄器为你安排一段内存空间。有时很取巧，不过就我们的题目来讲，这算是一个完善的解决方案。我们在上个代码版本中添加这个特性:var createProperty = function (obj, prop, currentV

5、alue)     Object.defineProperty(obj, prop,                 get: function ()  return currentValue; ,         &#

6、160;  set: function (value)             currentValue = value;                    ,    

7、;                enumerable: true,                    configurable: true    );  

8、                   var entity =  var myVar = "hello world"createProperty(entity, "property", myVar);示例中，createProperty 函数有一个 currentVal

9、ue 变量，存在 get 和 set 方法。此变量会保存到 get 和 set 函数的闭包空间中。现在，只有这两个函数能看到和更新 currentValue 变量! 任务完成!唯一需要警惕 caveat，警告，留意）的是源值 (myVar) 仍可访问。下面给出另一个更健壮的版本（爱护 myVar 变量）:var createProperty = function (obj, prop)     var currentValue = objprop;

10、0;   Object.defineProperty(obj, prop,         get: function ()  return currentValue; ,        set: function (value)      

11、0;      currentValue = value;        ,        enumerable: true,        configurable: true    );var entity

12、 =     property: "hello world"createProperty(entity, "property");接受该函数, 即便源值都销毁(destructed，注：意思是不能直接赋值)了。到此大功告成了!3. 性能考虑Performance Considerations现在咱们看看性能。很明显，比起一个简洁的变量，闭包空间，甚或（对象）属性要慢的多，且更消耗资源。这就是本文更多关注一般方式和闭包空间机制差异的缘由。为证明闭包空间机制并

13、不比标准方式更消耗资源， 我写了下面代码做个基准测试：<!DOCTYPE html><html xmlns="/1999/xhtml"><head>    <title></title></head><style>    html         font-fam

14、ily: "Helvetica Neue", Helvetica;    </style><body>    <div id="results">Computing.</div>    <script>        var results 

15、;= document.getElementById("results");        var sampleSize = 1000000;        var opCounts = 1000000;        var entities =&

16、#160;        setTimeout(function ()             / Creating entities            for (var index = 0;&#

17、160;index < sampleSize; index+)                 entities.push(                    property: 

18、"hello world (" + index + ")"                );                    

19、60;   / Random reads            var start = new Date().getTime();            for (index = 0; index < o

20、pCounts; index+)                 var position = Math.floor(Math.random() * entities.length);               

21、60;var temp = perty;                        var end = new Date().getTime();        &#

22、160;   results.innerHTML = "<strong>Results:</strong><br>Using member access: <strong>" + (end - start) + "</strong> ms"        , 

23、0);        setTimeout(function ()             / Closure space =            var createProperty = func

24、tion (obj, prop, currentValue)                 Object.defineProperty(obj, prop,                   &#

25、160; get: function ()  return currentValue; ,                    set: function (value)           

26、60;             currentValue = value;                    ,           &

27、#160;        enumerable: true,                    configurable: true             

28、0;  );                        / Adding property and using closure space to save private value    

29、60;       for (var index = 0; index < sampleSize; index+)                 var entity = entitiesindex;   

30、60;            var currentValue = perty;                createProperty(entity, "property", currentValue); 

31、0;                      / Random reads            var start = new Date().getTime();   

32、;         for (index = 0; index < opCounts; index+)                 var position = Math.floor(Math.random() *

33、60;entities.length);                var temp = perty;                      

34、  var end = new Date().getTime();            results.innerHTML += "<br>Using closure space: <strong>" + (end - start) + "</st

35、rong> ms"        , 0);        setTimeout(function ()             / Using local member =    &

36、#160;       / Adding property and using local member to save private value            for (var index = 0; index < sam

37、pleSize; index+)                 var entity = entitiesindex;                entity._property = 

38、perty;                Object.defineProperty(entity, "property",                     get: functi

39、on ()  return this._property; ,                    set: function (value)               

40、60;         this._property = value;                    ,               

41、;     enumerable: true,                    configurable: true                ); 

42、                       / Random reads            var start = new Date().getTime();  &

43、#160;         for (index = 0; index < opCounts; index+)                 var position = Math.floor(Math.random() 

44、* entities.length);                var temp = perty;                     &#

45、160;  var end = new Date().getTime();            results.innerHTML += "<br>Using local member: <strong>" + (end - start) + "<

46、/strong> ms"        , 0);    </script></body></html>我创建了一百万个对象，都有属性成员。要完成下面三个测试：· 执行 1百万次随机访问属性。· 执行1百万次随机访问闭包空间实现版本。· 执行1百万次随机访问常规get/set实现版本。测试结果参见下面表格和图表:我们发觉，闭包空间实现总是快于常规实现，依据扫瞄器的不同，还可以

47、做进一步的性能优化。Chrome 上的性能表现低于预期。或许存在 bug，因此，为确认(存在 bug），我联系了 Google 项目组，描述发生的症状。还有，假如你打算测试在 Microsoft Edge 微软新发布的扫瞄器，在windows10 中默认安装中的性能表现，你可以点击下载 。然而，假如认真争辩，你会发觉，使用闭包空间或属性比直接访问变量成员要10倍左右。 因此，使用要恰当且谨慎。4. 内存占用（Memory Footprint）我们也得验证该技术不会消耗过多内存。为测试内存占用基准状况，我写了下面代码段：直接属性引用版本（Refe

48、rence Code）var sampleSize = 1000000; var entities =  / Creating entitiesfor (var index = 0; index < sampleSize; index+)     entities.push(       &#

49、160;    property: "hello world (" + index + ")");常规方式版本（Regular Way，get/set）var sampleSize = 1000000;var entities = / Adding property and using local member to&

50、#160;save private valuefor (var index = 0; index < sampleSize; index+)     var entity =     entity._property = "hello world (" + index + 

51、")"    Object.defineProperty(entity, "property",         get: function ()  return this._property; ,        set: function (value)&#

52、160;            this._property = value;        ,        enumerable: true,        configurable: true    );    entities.push(entity);闭包空间版本（Closure Space Version）var sampleSize = 1000000;var entities = var createProperty = function (obj, prop, currentValue)     Object.

人人文库> 全部分类> 应用文书 > 研究报告

温馨提示

  • 1. 本站所有资源如无特殊说明，都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等，如果需要附件，请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸，网页内容里面会有图纸预览，若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间，仅对用户上传内容的表现方式做保护处理，对用户上传分享的文档内容本身不做任何修改或编辑，并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容，请与我们联系，我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

最新文档

评论

0/150

提交评论