Table of Contents
Introduction
हेलो दोस्तों आज हम इस post में javascript में memoization technique के बारे जानेगे की memoization क्या है? और उसका इस्तेमाल किन scenario में किया जाता है और उसके फायदे क्या है?
What is memoization in JavaScript in Hindi?
Memoization JavaScript में एक optimization technique है जो किसी function के result को cache में store करती है,
ताकि future में अगर वही input values दोबारा मिले तोह function को वह calculation करने की ज़रुरत ना पड़े, और result सीधा cache से मिल जाये!. यह technique तब काफी helpful होती है जब function में complex या time-consuming calculations किया गया हों!.
Memoization का मैं idea यह है की अगर कोई function same input पे call हो रहा है तोह हमे result दोबारा calculate करने की बजाये पहले से store result को return करना चाहिए!.
Program में memoization technique का use कब किया जा सकता है?
Memoization तब useful होता है जब किसी function को बार-बार call किया जाता है तो उस case में उस function के result को cache में store कर लिया जाता है!. जिसे बार-बार function call होने पर function first time execution करा जाये फिर cache में result store होने बाद उसे cache से result return या use किया जाता है!.
Memoization technique का इस्तेमाल खास उन case में किया जाता है जिस function को exection होने में ज्याद time लगता है और ज्यादा memory लेते है!. जैसे की Function time-consuming calculations करे, जैसे factorial, Fibonacci, या recursive कॅल्क्युलेशन्स। APIs या database requests optimize करनी हो!.
Program में memoization technique के इस्तेमाल के फायदे क्या है?
Performance Improvement : Program में memoization technique के इस्तेमाल से application और website का performance improvement होता है क्यूंकि complex calculations या API calls बार-बार नहीं किये जाते, क्योकि वह cache से data का इस्तेमाल करता है जिससे code faster run होता है!.
Reduced Computation: Sirf पहली बार calculation function execute होता है, बाद में वही result cache से मिलता है!.
The memoization technique example
<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8'>
<meta http-equiv='X-UA-Compatible' content='IE=edge'>
<title>The Memoization technique</title>
<meta name='viewport' content='width=device-width, initial-scale=1'>
<script>
document.addEventListener("DOMContentLoaded", function(){
const cache={};
const calculation = document.querySelector(".calculation");
calculation.addEventListener("click", function(){
cacheMemory(10,15);
});
function sumCalculation(a,b){
return a+b;
}
function cacheMemory(x,y){
const key = x+":"+y;
if(!cache[key]){
let result= sumCalculation(x,y);
console.log("Calculation without cache:"+ result );
cache[key]=result;
return result;
}else{
console.log("Calculation with cache: "+ cache[key]);
return cache[key];
}
}
})
</script>
</head>
<body>
<h1>Memoization</h1>
<button class="calculation">Calculation</button>
</body>
</html>
ऊपर के example में देख सकते है की हमने document.addEventListener(“DOMContentLoaded”, function() {…}) में DOMContentLoaded event के अंदर memoization technique code को wrap किया गया है ताकि पूरा HTML content load होने के बाद JavaScript code execute हो!.
const cache={}:
यह एक empty object cache create करता है जो memoization के लिए store या cache का काम करेगा!. यहां, हम results को store करेंगे जिससे future calls में repeated calculations avoid की जा सके!.
const calculation = document.querySelector(“.calculation”):
यह लाइन HTML button element को select करती है जिसका class “calculation” है!. यह button हमारे calculation को trigger करेगा!.
calculation.addEventListener(“click”, function() {…}):
यह code event listener add करता है जो button click होने पर cacheMemory(10, 15) function call करेगा!.
इसका मतलब है जब भी user button को click करेगा, cacheMemory function execute होगा और arguments 10 और 15 के साथ calculation perform करेगा!.
function sumCalculation(a, b) {…}:
यह function simple addition operation perform करता है और a और b को add करके return करता है!.
यह actual calculation function है जो addition करता है!.
function cacheMemory(x, y) {…}:
यह main memoization function है जो cache का use करता है ताकि pehle से calculated results को store और reuse किया जा सके!.
const key = x + “:” + y;:
यह line एक unique key बनती है जो x और y की values को string के रूप में add करके बनायीं गयी है!. अगर x = 10 और y = 15 हो तोह key “10:15” होगी!. इस unique key का use cache object में result store करने और check करने के लिए किया जाता है!.
if(!cache[key]) {…}:
यह condition checks करती है की क्या cache में दी गई key पहले से available है या नहीं!. अगर यह key cache में नहीं है तोह इसका मतलब है की calculation पहली बार हो रही है या उस input के लिए पहले से कोई result cache में नहीं है!.
let result = sumCalculation(x, y);:
यह line sumCalculation(x, y) को call करती है और result calculate करती है. Result को result variable में store किया जाता है!.
console.log(“Calculation without cache:” + result);:
यह line output में show करती है की calculation cache के बिना हुई है!.
cache[key] = result;:
यह result को cache object में unique key के साथ store कर देता है ताकि अगर same inputs (10, 15) future में दोबारा आये तोह cache से result directly मिल जाये और calculation avoid किया जा सके!.
return result;:
यह line calculate किया गया result return करती है!.
else { … }:
अगर cache[key] पहले से available है, तोह इसका मतलब है की calculation पहले हो चुकी है और result cache में store है!.
console.log(“Calculation with cache: ” + cache[key]);:
यह line message print करती है की calculation cache के through मिल रही है!.
return cache[key];:
यह line directly cache में stored result return करती है और दोबारा calculation की ज़रुरत नहीं होती.
यह example cacheMemory function के साथ memoization technique को demonstrate करता है जिसमे result को cache में store करके repeated calculations avoid की जाती हैं. इसका फायदा यह है की अगर same inputs दोबारा आये तोह code faster execute होगा क्यूंकि calculation को cache में store किया गया है और वही result दुबारा use किया जा रहा है!.
