数据结构
网络
关系数据库管理系统
操作系统
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 编程
C++
C#
MongoDB
MySQL
Javascript
PHP
物理学
化学
生物学
数学
英语
经济学
心理学
社会学
时尚研究
法律研究JavaScript 中的智能/自覆盖/惰性 getter？
在本教程中，让我们讨论 JavaScript 中的智能、自覆盖或惰性 getter。
getter 将对象的属性绑定到一个函数，但 getter 不会计算属性值，直到我们访问它。
当我们需要获取一些动态值而无需显式调用时，getter 会很有帮助。
用户可以按照以下语法使用 getter。
语法
{ get prop() {} }
{ get [exp]() {} }
prop 和 exp 是绑定到函数的对象的属性。'prop' 是一个简单的对象属性，而 'exp' 是一个表达式。
规则
getter 可以是字符串或数字。
不要声明任何参数。
重复的 getter 无效。
不应将 getter 分配给对象的键。
惰性 getter 延迟了对象属性的计算时间。它们访问属性，计算它，然后将其存储在缓存中以供后续使用。因为它们不会在以后重新计算属性，所以我们称它们为智能 getter。
惰性 getter 的记忆方法充分利用了时间和空间。它提供了更快的代码。
用途
优化 CPU 或 RAM 时间、远程文件访问、加密哈希解码等情况。
仅在稍后使用该值。
避免重新计算过程。
现在让我们讨论惰性 getter 访问值的方法。
使用通用对象访问
用户可以按照以下语法使用通用对象访问方法使用惰性 getter。
语法
const objLazy ={
get lazyfunction(){
delete this.lazyfunction;
return this.lazyfunction = value;
},
}
objLazy.lazyfunction;
语法中的对象包含一个返回某个值的 getter 函数。
示例
该程序定义了一个具有惰性 getter 的对象，即使在删除它之后也能记住它。将 delete 关键字应用于 getter 以将其删除，然后使用相同的 getter 获取 DOM 值。
<html> <body> <h2> Illustrating the lazy-getter memorization</h2> <p id="lazyGtrDomInp"> </p> <div id="lazyGtrDomBtnWrap"> <button id="lazyGtrDomBtn"> Go Lazy </button> </div> <br> <br> <p id="lazyGtrDomOut"></p> <script> var lazyGtrDomBtn = document.getElementById("lazyGtrDomBtn"); var lazyGtrDomBtnWrap = document.getElementById("lazyGtrDomBtnWrap"); var lazyGtrDomInp = document.getElementById("lazyGtrDomInp"); var lazyGtrDomOut = document.getElementById("lazyGtrDomOut"); lazyGtrDomInp.innerHTML = "<b>Input = </b>" + new Date(); lazyGtrDomBtn.onclick = function() { const objLazy = { get lazyfunction() { delete this.lazyfunction; return this.lazyfunction = lazyGtrDomInp.innerHTML; }, } lazyGtrDomOut.innerHTML = "<b>The deleted lazy getter function access DOM content </b><br><br>" + objLazy.lazyfunction; }; </script> </body> </html>
使用类使用惰性 getter
用户可以按照以下语法使用此方法使用惰性 getter。
语法
class lazyClass{
get lazyClassGetter(){
delete this.constructor.prototype.lazyClassGetter;
return this.constructor.prototype.lazyClassGetter = value;
}
}
var lazyClsObj = new lazyClass();
lazyClsObj.lazyClassGetter
语法中的类包含一个返回某个值并使用类对象访问此惰性 getter 的 getter 函数。
示例
该程序定义了一个具有惰性 getter 函数的类。使用构造函数语法删除此 getter，然后分配一个值。通过创建类对象访问惰性 getter。
<html> <body> <h2> Illustrating the lazy-getter using a class </h2> <p id="lazyGtrClsInp"></p> <div id="lazyGtrClsBtnWrap"> <button id="lazyGtrClsBtn"> Lazy Assign </button> </div> <br> <br> <p id="lazyGtrClsOut"></p> <script> var lazyGtrClsBtn = document.getElementById("lazyGtrClsBtn"); var lazyGtrClsBtnWrap = document.getElementById("lazyGtrClsBtnWrap"); var lazyGtrClsInp = document.getElementById("lazyGtrClsInp"); var lazyGtrClsOut = document.getElementById("lazyGtrClsOut"); lazyGtrClsInp.innerHTML = "<b>Lazy getter input = 10</b>"; lazyGtrClsBtn.onclick = function() { class lazyClass { get lazyClassGetter() { delete this.constructor.prototype.lazyClassGetter; return this.constructor.prototype.lazyClassGetter = 10; } } var lazyClsObj = new lazyClass(); lazyClsObj.lazyClassGetter lazyGtrClsOut.innerHTML = "<b>The deleted lazy getter function assigns a value </b><br><br>" + lazyClsObj.lazyClassGetter; }; </script> </body> </html>
本教程教我们如何使用惰性 getter。用户可以在需要时间和内存效率的情况下使用惰性 getter。
511 次浏览
