熊掌号怎么做网站跳转链接,app推广平台有哪些,深圳市建筑工程,iis怎么做IP网站缓存函数是一种提高函数性能的技术#xff0c;在函数被调用时#xff0c;会将计算结果缓存起来#xff0c;以便在后续的调用中直接返回缓存的结果#xff0c;从而减少了重复计算的时间。
缓存函数的实现通常包括两个步骤#xff1a; 判断缓存是否存在#xff1a;在函数被…缓存函数是一种提高函数性能的技术在函数被调用时会将计算结果缓存起来以便在后续的调用中直接返回缓存的结果从而减少了重复计算的时间。
缓存函数的实现通常包括两个步骤 判断缓存是否存在在函数被调用时首先判断缓存对象中是否已经存在该参数对应的缓存结果如果有则直接返回缓存结果否则进入下一步。 计算并缓存结果如果缓存不存在则进行函数的计算并将计算结果保存到缓存对象中然后返回计算结果。
使用缓存函数可以大大提高程序的性能特别是对于一些需要耗费大量时间计算的函数例如递归计算、数学公式计算等。但需要注意的是由于缓存函数的缓存对象会占用一定的内存空间因此需要适度使用缓存函数避免出现内存溢出等问题。 首先查看以下的代码当我每次点击的时候都会打印一次5以内的随机数那么每次都要进行一次请求。这时我们就可以将数据进行一个缓存当我们再次打印相同的结果时直接返回缓存中的结果。
!DOCTYPE html
html langenheadmeta charsetUTF-8meta nameviewport contentwidthdevice-width, initial-scale1.0title缓存函数在项目中的性能优化/title
/head
bodyh1缓存函数在项目中的性能优化/h1button idfetchButton获取数据/buttondiv idresultContainerscriptfunction fetchDataFromServer(postId) {console.log(从服务器端获取数据, postId)}const fetchButton document.getElementById(fetchButton)const resultContainer document.getElementById(resultContainer)fetchButton.addEventListener(click,() {const postId Math.floor(Math.random() * 5) 1//调用这个函数传递参数fetchDataFromServer(postId)})/script/div
/body/html 这时我们定义一个缓存函数
function createCachedFunction(originalFunction){const cache {};return function(arg){if(cache[arg]){console.log(从缓存中进行数据获取,arg)return Promise.resolve(cache[arg])}} return originalFunction(arg).then(result {cache[arg] result;console.log(第一次进行数据获取并实现了缓存,arg);return result;})
} 定义之后我们也要去使用这个函数
const cacheFetchData createCachedFunction(fetchDataFromServer)
fetchButton.addEventListener(click,() {const postId Math.floor(Math.random() * 5) 1// fetchDataFromServer(postId)cacheFetchData(postId).then(data {resultContainer.innerHTML pre${JSON.stringify(data,null,2)}/pre})
}) 全部代码为下列
h1缓存函数在项目中的性能优化/h1button idfetchButton获取数据/buttondiv idresultContainerscript// function fetchDataFromServer(postId) {console.log(从服务器端获取数据, postId)return fetch(https://jsonplaceholder.typicode.com/posts/${postId}).then(response response.json());}function createCachedFunction(originalFunction){const cache {};return function(arg){if(cache[arg]){console.log(从缓存中进行数据获取,arg)return Promise.resolve(cache[arg])}} return originalFunction(arg).then(result {cache[arg] result;console.log(第一次进行数据获取并实现了缓存,arg);return result;})}const cacheFetchData createCachedFunction(fetchDataFromServer)const fetchButton document.getElementById(fetchButton)const resultContainer document.getElementById(resultContainer)fetchButton.addEventListener(click,() {const postId Math.floor(Math.random() * 5) 1// fetchDataFromServer(postId)cacheFetchData(postId).then(data {resultContainer.innerHTML pre${JSON.stringify(data,null,2)}/pre})})/script/div
