জাভাস্ক্রিপ্টে বন্ধ করার জন্য ব্যবহারিক ব্যবহার কী?

Question

আমি জাভাস্ক্রিপ্ট বন্ধ হয়ে আমার মাথা জড়ানোর জন্য আমার সর্বোচ্চ চেষ্টা করছি ।

আমি পেয়েছি যে কোনও অভ্যন্তরীণ ফাংশন ফিরিয়ে দিয়ে এর তাত্ক্ষণিক পিতামাতার মধ্যে সংজ্ঞায়িত যেকোন পরিবর্তনীয় অ্যাক্সেস থাকবে।

এটি আমার পক্ষে কোথায় কাজে আসবে? সম্ভবত আমি এখনও এটি প্রায় আমার মাথা পেতে না। আমি অনলাইনে দেখেছি বেশিরভাগ উদাহরণ কোনও বাস্তব ওয়ার্ল্ড কোড সরবরাহ করে না, কেবল অস্পষ্ট উদাহরণ।

কেউ আমাকে বন্ধের আসল বিশ্ব ব্যবহার দেখাতে পারে?

এটি কি উদাহরণস্বরূপ?

var warnUser = function (msg) {
    var calledCount = 0;
    return function() {
       calledCount++;
       alert(msg + '\nYou have been warned ' + calledCount + ' times.');
    };
};

var warnForTamper = warnUser('You can not tamper with our HTML.');
warnForTamper();
warnForTamper();

Comments

আপনার কঠোরতম চেষ্টা করার জন্য +1 :-) বন্ধ হওয়াগুলি শুরু করা সত্যিই ভয়ঙ্কর বলে মনে হতে পারে, আমি জানি তারা আমার পক্ষে ছিল। আপনি যখন তাদের হ্যাং পেয়ে যান, আপনি তত্ক্ষণাত্ আরও অনেক ভাল কোডার হয়ে যাবেন।

— অ্যান্ডি ই

আমি কেবল জাভাস্ক্রিপ্টে ক্লোজারগুলি সম্পর্কে একটি ব্লগ পোস্ট লিখেছি যাতে আপনি হেল্পপুল খুঁজে পেতে পারেন।

— স্কিলড্রিক

@Skilldrick। লিঙ্কটি মারা গেছে ... এবং আমি এই ব্যবহারিক উদাহরণটি খুব সহায়ক বলে মনে করেছি। youtube.com/watch?v=w1s9PgtEoJs ।

— অভি

Answer 1

আমি ক্লোজার ব্যবহার করেছি যেমন কাজ করতে:

a = (function () {
    var privatefunction = function () {
        alert('hello');
    }

    return {
        publicfunction : function () {
            privatefunction();
        }
    }
})();

আপনি সেখানে দেখতে পাচ্ছেন, aএখন একটি অবজেক্ট, একটি পদ্ধতি publicfunction( a.publicfunction()) যা কল করে privatefunction, যা কেবল বন্ধের অভ্যন্তরে বিদ্যমান। আপনি সরাসরি (যেমন ) কল করতে পারবেন না , ঠিক ।privatefunctiona.privatefunction()publicfunction()

এটি একটি ন্যূনতম উদাহরণ কিন্তু সম্ভবত আপনি এটি ব্যবহার করতে পারেন? আমরা এটি সরকারী / ব্যক্তিগত পদ্ধতি প্রয়োগের জন্য ব্যবহার করেছি।

Comments

আহা, যদি এটি বন্ধ হয় তবে আমি এটি না জেনে ক্লোজার ব্যবহার করেছি! আমি প্রায়শই এর মতো অন্যটির ভিতরে ফাংশন রাখি এবং তারপরে আপনার উদাহরণের মতো কোনও অবজেক্টকে আক্ষরিক অর্পণ করে আমার যে কোনও জনসাধারণের প্রয়োজন হবে তা প্রকাশ করে ose

— অ্যালেক্স

হ্যাঁ, আপনি যেমন দেখছেন, আপনি ফাংশনটির প্রসঙ্গটি রেখেছেন কারণ আপনি যে বস্তুটি ফেরৎ দেন তার অভ্যন্তরে রেফারেন্স ভেরিয়েবল (এবং ফাংশন) থাকে। সুতরাং আপনি সেগুলি ব্যবহার করছেন, আপনি এটি কেবল জানেন না।

— ফ্রান্সিসকো সোটো

আপনি ব্রাউজারে জাভাস্ক্রিপ্টে টেকনিক্যালি প্রতিটি ফাংশন বন্ধ করে দেন কারণ উইন্ডো অবজেক্ট এর সাথে আবদ্ধ।

— অ্যাডাম জেন্ট

আমি জানি এটি একটি পুরানো প্রশ্ন, তবে আমার কাছে এটি এখনও পর্যাপ্ত উত্তর দেয় না। কেন সরাসরি ফাংশনটি কল করবেন না? আপনার একটি ব্যক্তিগত ফাংশন কেন দরকার?

— কোডেনিনজা

কারণ উদাহরণটিতে কেবল একটি ফাংশন থাকলেও এতে ভেরিয়েবলগুলিও থাকতে পারে যা বাইরে থেকে অ্যাক্সেসযোগ্য নয় । বলুন: var obj = (ফাংশন () {var মান = 0; রিটার্ন {get: ফাংশন () {রিটার্ন মান;}, সেট: ফাংশন (ভাল) {মান = ভাল;}}}) (); obj.set (20); obj.get (); => 20 ইত্যাদি

— ফ্রান্সিসকো সোটো

Answer 2

মনে করুন, আপনি কোনও ওয়েবপৃষ্ঠায় একটি বোতাম ক্লিক করেছেন তার সংখ্যা গণনা করতে চান ।
এর জন্য, আপনি onclickভেরিয়েবলের গণনা আপডেট করার জন্য বোতামের ইভেন্টে একটি ক্রিয়াকলাপটি ট্রিগার করছেন

<button onclick="updateClickCount()">click me</button>  

এখন এখানে অনেকগুলি পন্থা থাকতে পারে:

1) আপনি কাউন্টার বাড়ানোর জন্য একটি বৈশ্বিক পরিবর্তনশীল এবং একটি ফাংশন ব্যবহার করতে পারেন :

var counter = 0;

function updateClickCount() {
    ++counter;
    // do something with counter
}

তবে, সমস্যাটি হ'ল পৃষ্ঠার কোনও স্ক্রিপ্ট কল না করে কাউন্টার পরিবর্তন করতে পারেupdateClickCount() ।

---

2) এখন, আপনি ফাংশনের অভ্যন্তরে ভেরিয়েবল ঘোষণার কথা ভাবছেন:

function updateClickCount() {
    var counter = 0;
    ++counter;
    // do something with counter
}

তবে, আরে! প্রতিবার updateClickCount()ফাংশন ডাকা হলে, কাউন্টারটি আবার 1 এ সেট করা থাকে।

---

3) নেস্টেড ফাংশন সম্পর্কে ভাবছেন ?

নেস্টেড ফাংশনগুলি তাদের "উপরে" সুযোগগুলিতে অ্যাক্সেস করতে পারে।
এই উদাহরণে, অভ্যন্তরীণ ফাংশনটির updateClickCount()প্যারেন্ট ফাংশনে কাউন্টার ভেরিয়েবলের অ্যাক্সেস রয়েছেcountWrapper()

function countWrapper() {
    var counter = 0;
    function updateClickCount() {
    ++counter;
    // do something with counter
    }
    updateClickCount();    
    return counter; 
}

এটি যদি আপনি updateClickCount()বাইরে থেকে ফাংশনটিতে পৌঁছতে পারতেন এবং counter = 0প্রতিবার নয় কেবল একবার কার্যকর করার উপায় খুঁজে বের করতে পারলে এটি পাল্টা দ্বিধাটির সমাধান করতে পারে ।

---

৪) উদ্ধার বন্ধ! (স্ব-আমন্ত্রণমূলক ফাংশন) :

 var updateClickCount=(function(){
    var counter=0;

    return function(){
     ++counter;
     // do something with counter
    }
})();

স্ব-আহ্বানকারী ফাংশনটি কেবল একবারে চালিত হয়। এটি counterশূন্য (0) এ সেট করে এবং একটি ফাংশন এক্সপ্রেশন প্রদান করে।

এই ভাবে updateClickCountএকটি ফাংশন হয়ে যায়। "দুর্দান্ত" অংশটি হ'ল এটি প্যারেন্ট স্কোপটিতে কাউন্টারটি অ্যাক্সেস করতে পারে।

একে একটি জাভাস্ক্রিপ্ট বন্ধ বলা হয় । কোনও ফাংশনের পক্ষে " ব্যক্তিগত " ভেরিয়েবল থাকা সম্ভব করে তোলে ।

counterবেনামী ফাংশন সুযোগ দ্বারা সুরক্ষিত, এবং শুধুমাত্র অ্যাড ফাংশন ব্যবহার করে পরিবর্তন করা যাবে!

বন্ধের আরও প্রাণবন্ত উদাহরণ:

<script>
        var updateClickCount=(function(){
    	var counter=0;
    
    	return function(){
    	++counter;
    	 document.getElementById("spnCount").innerHTML=counter;
    	}
      })();
    </script>

    <html>
	 <button onclick="updateClickCount()">click me</button>
	  <div> you've clicked 
		<span id="spnCount"> 0 </span> times!
	 </div>
    </html>

---

তথ্যসূত্র: https://www.w3schools.com/js/js_function_closures.asp

Comments

এটিই প্রথম উত্তর যা আমাকে "ওহ, সেই কারণেই আমি ক্লোজার ব্যবহার করব!"

— ডেভিলের অ্যাডভোকেট

আপনি আমার দিনটি তৈরি করেছেন :)

— জেরিওয়েল

আমি কেবল ক্লোজারে ডাব্লু 3 স্কুলগুলি পড়েছি এবং তারপরে আরও তথ্যের জন্য এখানে এসেছি। এটি

— ডাব্লু

@ জেরিগোয়েল আপনি কি এটি 2 টি পৃথক বোতাম দিয়ে কাজ করতে পারবেন? আমি কীভাবে 2 ভেরিয়েবল (ফাংশনের অনুলিপি) অবলম্বন না করে সনাক্ত করতে পারি না, যা প্রধান কিছু সুবিধা / সুবিধাকে সরিয়ে দেয় বলে মনে হয়।

— টাইলার কলিয়ার

ভাল উত্তর. মনে রাখবেন যে কোনও বন্ধের স্ব-আহ্বানমূলক ক্রিয়াকলাপ হওয়ার দরকার নেই , তবে এটি হতে পারে। যখন একটি অবসান হয় স্ব আবাহন (অর্থাত অবিলম্বে () ফাংশন পর যোগ করে বলা হয়), এর মানে হল ফেরত মান অবিলম্বে গণনা করা হয় বদলে ফাংশন ফিরে হচ্ছে এবং ফেরত মান গণনা করা হচ্ছে পরে একবার ফাংশন প্রার্থনা করা হয়। একটি ক্লোজারটি আসলে অন্য কোনও ফাংশনের মধ্যে যে কোনও ক্রিয়াকলাপ হতে পারে এবং এর মূল বৈশিষ্ট্যটি হ'ল এর ভেরিয়েবল এবং পদ্ধতিগুলি সহ এটি প্যারেন্ট ফাংশনের সুযোগগুলিতে অ্যাক্সেস করে।

— ক্রিস হ্যালক্রো

Answer 3

আপনি যে উদাহরণটি দিয়েছেন তা একটি দুর্দান্ত উদাহরণ। বন্ধগুলি একটি বিমূর্তকরণ ব্যবস্থা যা আপনাকে উদ্বেগগুলি খুব পরিষ্কারভাবে আলাদা করতে দেয়। আপনার উদাহরণটি শব্দার্থবিদ্যা (একটি ত্রুটি-প্রতিবেদনকারী API) থেকে ইন্সট্রুমেন্টেশন (গণনা কলগুলি) আলাদা করার ক্ষেত্রে। অন্যান্য ব্যবহারের মধ্যে রয়েছে:

1. একটি অ্যালগরিদমে প্যারামিটারাইজড আচরণ পাস করা (ক্লাসিক উচ্চতর অর্ডার প্রোগ্রামিং):

   function proximity_sort(arr, midpoint) {
       arr.sort(function(a, b) { a -= midpoint; b -= midpoint; return a*a - b*b; });
   }
   

2. সিমুলেটিং অবজেক্ট ওরিয়েন্টেড প্রোগ্রামিং:

   function counter() {
       var a = 0;
       return {
           inc: function() { ++a; },
           dec: function() { --a; },
           get: function() { return a; },
           reset: function() { a = 0; }
       }
   }
   

3. বহিরাগত প্রবাহ নিয়ন্ত্রণ যেমন jQuery এর ইভেন্ট হ্যান্ডলিং এবং AJAX API গুলি বাস্তবায়ন করছে।

Comments

( int?) আমি শেষবার যাচাই করেছিলাম, জাভাস্ক্রিপ্টটি ছিল হাঁস-টাইপের ভাষা। সম্ভবত আপনি জাভা চিন্তা ছিল?

— হ্যালো 71

@ হ্যালো 71: আমি জাভাস্ক্রিপ্টের কথা ভাবছিলাম, তবে পুরানো অভ্যাসগুলি খুব মরে যায়। ভালো বল ধরা.

— মার্সেলো ক্যান্টোস

@ মার্সেলো ক্যান্টোস দেখে মনে হচ্ছে আপনি কাউন্টার প্রয়োগের ক্ষেত্রে কমাটি ভুলে গেছেন। আপনার পোস্টটি সংশোধন করার জন্য আমি এটি সম্পাদনা করেছি। আশা করি ঠিক আছে :)

— নাটান স্ট্রেপেল

@ স্ট্র্যাপেল: ভাল ধরা! আমার কোডটি আরও ভাল করার জন্য আমি আপনার চেয়ে বেশি খুশি। :-)

— মার্সেলো ক্যান্টোস

# 1 বোঝার চেষ্টা করছেন ... আপনি কীভাবে প্রক্সিমিটি_সোর্টকে কল করবেন?

— ডেভ 2081

Answer 4

আমি জানি আমি এই প্রশ্নের জবাব দিতে দেরি করে ফেলেছি তবে এটি 2018 সালে উত্তর সন্ধানে এখনও যে কেউ সহায়তা করতে পারে।

জাভাস্ক্রিপ্ট ক্লোজারগুলি আপনার অ্যাপ্লিকেশনটিতে থ্রটল প্রয়োগ এবং কার্যকারিতা ডিবন করতে ব্যবহার করা যেতে পারে ।

থ্রোটলিং :

সময়ের সাথে সাথে ফাংশনকে সর্বাধিক সংখ্যক ডাকা যেতে পারে বলে থ্রটলিং সীমাবদ্ধ করে দেয়। যেমন "প্রতি 100 মিলিসেকেন্ডে একবারে এই ফাংশনটি কার্যকর করুন।"

কোড:

const throttle = (func, limit) => {
  let isThrottling
  return function() {
    const args = arguments
    const context = this
    if (!isThrottling) {
      func.apply(context, args)
      isThrottling = true
      setTimeout(() => isThrottling = false, limit)
    }
  }
}

তদন্ত :

কোনও ফাংশনকে সীমাবদ্ধ করার জন্য ডিবিউসিং যখন না ডাকা নির্দিষ্ট সময় অতিবাহিত না করে আবার কল করা হবে না। যেমন "100 মিলিসেকেন্ড কল না করেই কেবল এই ফাংশনটি কার্যকর করুন।"

কোড:

const debounce = (func, delay) => {
  let debouncing
  return function() {
    const context = this
    const args = arguments
    clearTimeout(debouncing)
    debouncing = setTimeout(() => func.apply(context, args), delay)
  }
}

আপনি দেখতে পাচ্ছেন ক্লোজার দুটি সুন্দর বৈশিষ্ট্য প্রয়োগ করতে সহায়তা করেছে যা প্রতিটি ওয়েব অ্যাপ্লিকেশনকে মসৃণ ইউআই অভিজ্ঞতা কার্যকারিতা সরবরাহ করতে হবে।

আমি আশা করি এটি কাউকে সাহায্য করবে।

Answer 5

হ্যাঁ, এটি দরকারী বন্ধের একটি ভাল উদাহরণ। সতর্কতা ব্যবহারকারীকে কল calledCountতার স্কোপটিতে ভেরিয়েবল তৈরি করে এবং একটি বেনাম ফাংশন দেয় যা warnForTamperভেরিয়েবলে সংরক্ষণ করা হয় । কারণ এখনও কল্টকাউন্ট ভেরিয়েবলের ক্লোজারিং মেকিং ব্যবহার রয়েছে, এটি ফাংশনটির প্রস্থানের পরে মুছে ফেলা হয় না, সুতরাং প্রতিটি কলটি স্কোপড ভেরিয়েবলকে warnForTamper()বাড়িয়ে মানকে সতর্ক করবে।

স্ট্যাক ওভারফ্লোতে আমি দেখতে পাওয়া সবচেয়ে সাধারণ সমস্যাটি হ'ল যেখানে কেউ প্রতিটি লুপের উপরে বৃদ্ধি করা একটি ভেরিয়েবলের "বিলম্ব" করতে চায় তবে ভেরিয়েবলটি স্কোপড হওয়ার পরে লুপটি শেষ হওয়ার পরে ভেরিয়েবলের প্রতিটি রেফারেন্স হবে যার ফলস্বরূপ চলকের শেষের অবস্থা:

for (var i = 0; i < someVar.length; i++)
    window.setTimeout(function () { 
        alert("Value of i was "+i+" when this timer was set" )
    }, 10000);

এর ফলে প্রতিটি সতর্কতা একই মানটির মান প্রদর্শন করে i, লুপটি শেষ হওয়ার সাথে সাথে এটির মানটি বাড়ানো হয়। সমাধানটি হল একটি নতুন বন্ধকরণ, ভেরিয়েবলের জন্য পৃথক সুযোগ তৈরি করা। এটি তাত্ক্ষণিকভাবে নির্বাহ করা অনামী ফাংশনটি ব্যবহার করে করা যেতে পারে, যা ভেরিয়েবলটি গ্রহণ করে এবং তার রাষ্ট্রটিকে যুক্তি হিসাবে সংরক্ষণ করে:

for (var i = 0; i < someVar.length; i++)
    (function (i) {
        window.setTimeout(function () { 
            alert("Value of i was "+i+" when this timer was set" )
        }, 10000);
    })(i); 

Comments

আকর্ষণীয় -১, আমার ধারণা এটি "জাভাস্ক্রিপ্টে বন্ধের জন্য ব্যবহারিক ব্যবহার" নয়?

— অ্যান্ডি ই

আমি এটি পড়তে কিছু ব্যবহার পেয়েছি তাই ডাউনভোটের আগে আমি একটি +1 প্রদান করেছি।

— অ্যালেক্স

@ অ্যালেক্স: ধন্যবাদ, আমি উক্তিটি লক্ষ্য করেছি। আমি এখানে প্রায় বেনামে বাসিন্দাদের অভ্যস্ত করে ফেলেছি। এটি কেবল আমাকে বিরক্ত করে কারণ আমি সত্যিই জানতে চাই যে আমি কোনও ভুল বা ভুল বলেছি কিনা, এবং তারা আপনাকে ভাবিয়ে তুলবে যে আপনি কেবলমাত্র অন্য কোনও উত্তরদাতার দ্বারা বঞ্চিত হয়েছেন যারা তাদের নিজের উত্তরের জন্য আরও ভাল দৃশ্যমানতা চান। ভাগ্যক্রমে, আমি প্রতিশোধমূলক ধরণের নই ;-)

— অ্যান্ডি ই

আমি মনে করি এটি জাভাস্ক্রিপ্টগুলির ভাঙ্গা ব্লকের সুযোগের জন্য আরও কাজ। আপনি কেবল var j = i যুক্ত করতে সক্ষম হবেন; প্রথম সেটটাইমআউটের আগে এবং সেই জে ব্যবহার করার জন্য সতর্কতা পান। চারপাশে আর একটি কাজ হ'ল 'এর সাথে' এর মতো ব্যবহার করুন: (var i = 0; i <someVar.length; i++) {সহ ({i: i}) {window.setTimeout (ফাংশন () {সতর্কতা ("এর মান যখন এই টাইমারটি সেট করা হয়েছিল তখন আমি "+ i +" ছিলাম ")}, 100);}}

— ডেভিডবুটার

@ অ্যান্ডি ফানি সঠিক শব্দ নাও হতে পারে। আমি কেবল লক্ষ্য করেছি যে প্রায়শই লোকেরা এই পৃষ্ঠার অনেক উত্তরগুলির মতো ক্লোজারগুলি ব্যাখ্যা করতে স্ব-আমন্ত্রণমূলক ফাংশন ব্যবহার করে। কিন্তু সেটটাইমআউটে কলব্যাক ফাংশনটিও একটি বন্ধ; আপনি কলব্যাক থেকে কিছু স্থানীয় ভেরিয়েবল অ্যাক্সেস করতে পারার কারণে এটি "ব্যবহারিক ব্যবহার" হিসাবে বিবেচিত হতে পারে। আমি যখন ক্লোজারগুলি সম্পর্কে শিখছিলাম তখন বুঝতে পেরে এটি আমার পক্ষে দরকারী ছিল - যে ক্লোজারগুলি কেবল আরকেড জাভাস্ক্রিপ্টের নিদানে নয়, সর্বত্র রয়েছে।

— এন্টোইন

Answer 6

জাভা স্ক্রিপ্ট (বা যে কোনও ECMAScript) ভাষায়, বিশেষত, ক্লোজারগুলি ইন্টারফেসটি প্রকাশ করার সময় কার্যকারিতা বাস্তবায়ন আড়াল করতে কার্যকর।

উদাহরণস্বরূপ, কল্পনা করুন যে আপনি তারিখের ইউটিলিটি পদ্ধতিগুলির একটি শ্রেণি লিখছেন এবং আপনি ব্যবহারকারীদের সূচক অনুসারে সপ্তাহের দিনের নামগুলি অনুসন্ধান করার অনুমতি দিতে চান তবে আপনি চান না যে তারা হুডের নীচে আপনি যে নামগুলি ব্যবহার করেন সেগুলি সংশোধন করতে সক্ষম হন।

var dateUtil = {
  weekdayShort: (function() {
    var days = ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'];
    return function(x) {
      if ((x != parseInt(x)) || (x < 1) || (x > 7)) {
        throw new Error("invalid weekday number");
      }
      return days[x - 1];
    };
  }())
};

দ্রষ্টব্য যে daysঅ্যারে কেবলমাত্র dateUtilবস্তুর সম্পত্তি হিসাবে সংরক্ষণ করা যেতে পারে তবে এটি স্ক্রিপ্টের ব্যবহারকারীদের কাছে দৃশ্যমান হবে এবং এমনকি আপনার উত্স কোডের প্রয়োজন ছাড়াই তারা এটি চাইলে এটি পরিবর্তন করতে পারে। যাইহোক, এটি বেনামে ফাংশন দ্বারা আবদ্ধ রয়েছে যা তারিখ দেখার ফাংশনটি দেয় এটি কেবল অনুসন্ধান ফাংশন দ্বারা অ্যাক্সেসযোগ্য তাই এটি এখন টেম্পার-প্রুফ।

Comments

এটি বোবা লাগছে, তবে তারা কী জাভাস্ক্রিপ্ট ফাইল নিজেই খুলতে পারে এবং আপনার বাস্তবায়ন দেখতে পাবে না?

— ইটমাইকেলওয়াং

@ জপুরডিড: হ্যাঁ, তারা অবশ্যই বাস্তবায়নটি দেখতে পেলেন তবে সরাসরি আপনার উত্স কোডটি পরিবর্তন না করেই তারা বাস্তবায়নটি (দুর্ঘটনাক্রমে বা ইচ্ছাকৃতভাবে) পরিবর্তন করতে পারেন নি। আমি মনে করি আপনি এটি জাভায় সুরক্ষিত সদস্যদের সাথে তুলনা করতে পারেন।

— maerics

Answer 7

সেখানে একটি অধ্যায় প্রাকটিক্যাল বন্ধ এ মজিলা ডেভেলপার নেটওয়ার্ক ।

Comments

এটি সন্ধান করে, আমি দেখতে পাচ্ছি না যে এটি "ব্যবহারিক" কেমন যেন আমি পুরো return function ()...কোডটি সরিয়ে দিই ঠিক আছে fine বন্ধটি নেসেকারি নয়

— একটি

@ জেমস_পারসন আপনি তারপরে উদাহরণের মতো ইভেন্ট হ্যান্ডলারের মতো এগুলি নিযুক্ত করতে পারেন নি।

— অ্যালেক্স

Answer 8

ক্লোজারগুলির জন্য আর একটি সাধারণ ব্যবহার হ'ল thisকোনও পদ্ধতিতে একটি নির্দিষ্ট অবজেক্টের সাথে আবদ্ধ করা, এটি অন্য কোথাও কল করার অনুমতি দেয় (যেমন ইভেন্ট হ্যান্ডলার হিসাবে)।

function bind(obj, method) {
    if (typeof method == 'string') {
        method = obj[method];
    }
    return function () {
        method.apply(obj, arguments);
    }
}
...
document.body.addEventListener('mousemove', bind(watcher, 'follow'), true);

যখনই একটি মাউসমেভ ইভেন্টে আগুন লাগে, watcher.follow(evt)তাকে ডাকা হয়।

বন্ধ হ'ল উচ্চ-অর্ডার ফাংশনের একটি অপরিহার্য অঙ্গ, ভিন্ন ভিন্ন অংশগুলি প্যারামিটারাইজ করে একক উচ্চতর ক্রম ফাংশন হিসাবে একাধিক অনুরূপ ফাংশনগুলি পুনরায় লেখার খুব সাধারণ প্যাটার্নকে মঞ্জুরি দেয়। বিমূর্ত উদাহরণ হিসাবে,

foo_a = function (...) {A a B}
foo_b = function (...) {A b B}
foo_c = function (...) {A c B}

হয়ে

fooer = function (x) {
    return function (...) {A x B}
}

যেখানে A এবং B সিনথেটিকাল ইউনিট নয় তবে উত্স কোডের স্ট্রিং (স্ট্রিং লিটারেল নয়)।

কংক্রিটের উদাহরণের জন্য " একটি ফাংশন দিয়ে আমার জাভাস্ক্রিপ্ট স্ট্রিমলাইনিং " দেখুন ।

Answer 9

এখানে, আমি একটি অভিবাদন যা আমি কয়েকবার বলতে চাই। যদি আমি কোনও বন্ধন তৈরি করি তবে আমি শুভেচ্ছা রেকর্ড করার জন্য কেবল সেই ফাংশনটিতে কল করতে পারি। আমি যদি ক্লোজারটি তৈরি না করি তবে প্রতিবারেই আমার নামটি আমাকে পাস করতে হবে।

বন্ধ না করে ( https://jsfiddle.net/lukeschlangen/pw61qrow/3/ ):

function greeting(firstName, lastName) {
  var message = "Hello " + firstName + " " + lastName + "!";
  console.log(message);
}

greeting("Billy", "Bob");
greeting("Billy", "Bob");
greeting("Billy", "Bob");
greeting("Luke", "Schlangen");
greeting("Luke", "Schlangen");
greeting("Luke", "Schlangen");

বন্ধ হওয়ার সাথে ( https://jsfiddle.net/lukeschlangen/Lb5cfve9/3/ ):

function greeting(firstName, lastName) {
  var message = "Hello " + firstName + " " + lastName + "!";

  return function() {
    console.log(message);
  }
}

var greetingBilly = greeting("Billy", "Bob");
var greetingLuke = greeting("Luke", "Schlangen");

greetingBilly();
greetingBilly();
greetingBilly();
greetingLuke();
greetingLuke();
greetingLuke();

Comments

আমি নিশ্চিত নই তবে তবুও বন্ধ না করে আপনি ভার গ্রেটবিলি = অভিবাদন ("বিলি", "বব") হিসাবে কল করতে পারেন; এবং গ্রেটবিলি () কল করুন; এটা এখনও একই কাজ করবে ?? যদিও আপনি ক্লোজার তৈরি করেন বা অন্য কোনও সমস্যা তৈরি করেন না তবে প্রতিবার নাম পাস করা এখানে কোনও সমস্যা নয়।

— ব্যবহারকারী2906608

Answer 10

যদি আপনি অবজেক্ট-ভিত্তিক অর্থে কোনও শ্রেণি ইনস্ট্যান্ট করার ধারণার সাথে স্বাচ্ছন্দ্য বোধ করেন (অর্থাত্ class শ্রেণীর কোনও বস্তু তৈরি করা) তবে আপনি ক্লোজারগুলি বুঝতে পারছেন।

এটিকে এভাবে ভাবুন: যখন আপনি দুটি ব্যক্তি অবজেক্ট ইনস্ট্যান্ট করবেন তখন আপনি জানেন যে শ্রেণীর সদস্যের পরিবর্তনশীল "নাম" উদাহরণের মধ্যে ভাগ হয় না; প্রতিটি বস্তুর নিজস্ব 'অনুলিপি' রয়েছে। একইভাবে, আপনি কোনও ক্লোজার তৈরি করার সময়, ফ্রি ভেরিয়েবল (উপরে আপনার উদাহরণে 'নামকৃত অ্যাকাউন্ট') ফাংশনের 'উদাহরণ' দিয়ে আবদ্ধ।

আমি মনে করি যে আপনার ধারণাগত লিপ কিছুটা বাধাগ্রস্ত হয়েছে যে সতর্ককারী ব্যবহারকারী দ্বারা ফিরিয়ে দেওয়া প্রতিটি ফাংশন / সমাপ্তি (একদিকে: এটি একটি উচ্চতর ক্রম ফাংশন ) ক্লোজারকে একই প্রাথমিক মান (0) দিয়ে 'কমান্ডকাউন্ট' বেঁধে রাখে, যখন প্রায়শই ক্লোজার তৈরি করার সময় শ্রেণীর নির্মাতাকে বিভিন্ন মান পাস করার মতো উচ্চতর অর্ডার ফাংশনে বিভিন্ন প্রারম্ভিককে পাস করা আরও দরকারী।

সুতরাং, ধরুন যখন 'ডাকাডাউন্ট' একটি নির্দিষ্ট মান পর্যন্ত পৌঁছায় আপনি ব্যবহারকারীর সেশনটি শেষ করতে চান; স্থানীয় নেটওয়ার্ক থেকে বা বড় খারাপ ইন্টারনেট থেকে অনুরোধ আসে কিনা তার উপর নির্ভর করে আপনি এর জন্য বিভিন্ন মান পেতে পারেন (হ্যাঁ, এটি একটি স্বীকৃত উদাহরণ)। এটি অর্জনের জন্য, আপনি কলকাউন্টের জন্য সতর্কতা ব্যবহারকারী হিসাবে (যেমন -3, বা 0?) আলাদা আলাদা প্রাথমিক মানগুলি পাস করতে পারেন।

সাহিত্যের সমস্যার একটি অংশ হ'ল নাম বর্ণনাকারী যা তাদের বর্ণনা করতে ব্যবহৃত হয় ("লেক্সিকাল স্কোপ", "ফ্রি ভেরিয়েবল")। এটি আপনাকে বোকা বানাবেন না, বন্ধগুলি প্রদর্শিত হওয়ার চেয়ে আরও সহজ ... প্রাইম ফ্যাসি ;-)

Answer 11

এখানে আমার কাছে ক্লোজার কনসেপ্টের একটি সাধারণ উদাহরণ রয়েছে যা আমরা আমাদের ই-কমার্স সাইট বা আরও অনেকের জন্য ব্যবহার করতে পারি। আমি উদাহরণ সহ আমার jsfiddle লিঙ্ক যোগ করছি। এতে 3 টি আইটেম এবং একটি কার্টের কাউন্টারের একটি ছোট পণ্য তালিকা রয়েছে।

Jsfiddle

//Counter clouser implemented function;
var CartCouter = function(){
	var counter = 0;
  function changeCounter(val){
  	counter += val
  }
  return {
  	increment: function(){
    	changeCounter(1);
    },
    decrement: function(){
    changeCounter(-1);
    },
    value: function(){
    return counter;
    }
  }
}

var cartCount = CartCouter();
function updateCart(){
	document.getElementById('cartcount').innerHTML = cartCount.value();
  }

var productlist = document.getElementsByClassName('item');
for(var i = 0; i< productlist.length; i++){
	productlist[i].addEventListener('click',function(){
  	if(this.className.indexOf('selected')<0){
    		this.className += " selected";
        cartCount.increment();
        updateCart();
    } else{
    	this.className = this.className.replace("selected", "");
      cartCount.decrement();
      updateCart();
    }
  })
}

.productslist{
  padding:10px;
}
ul li{
  display: inline-block;
  padding: 5px;
  border: 1px solid #ddd;
  text-align: center;
  width: 25%;
  cursor: pointer;
}
.selected{
  background-color: #7CFEF0;
  color: #333;
}
.cartdiv{
  position: relative;
  float:right;
  padding: 5px;
  box-sizing: border-box;
  border: 1px solid #f1f1f1;
}

<div>
<h3>
Practical Use of JavaScript Closure consept/private variable.
</h3>
<div class="cartdiv">
    <span id="cartcount">0</span>
</div>
<div class="productslist">
    <ul >
    <li class="item">Product 1</li>
     <li class="item">Product 2</li>
     <li class="item">Product 3</li>
    </ul>

</div>
</div>

Answer 12

বন্ধের ব্যবহার:

বন্ধগুলি জাভাস্ক্রিপ্টের অন্যতম শক্তিশালী বৈশিষ্ট্য। জাভাস্ক্রিপ্ট ফাংশনগুলির বাসা বাঁধার জন্য অনুমতি দেয় এবং বাইরের ফাংশনের অভ্যন্তরে সংজ্ঞায়িত সমস্ত ভেরিয়েবল এবং ফাংশনগুলিতে (এবং অন্যান্য সমস্ত ভেরিয়েবল এবং ফাংশনগুলিতে যা বহিরাগত ফাংশনটিতে অ্যাক্সেস রয়েছে) সম্পূর্ণ প্রবেশাধিকার দেয়। তবে বাইরের ফাংশনের অভ্যন্তরীণ ফাংশনের ভিতরে সংজ্ঞায়িত ভেরিয়েবল এবং ফাংশনগুলির অ্যাক্সেস নেই। এটি অভ্যন্তরীণ ফাংশনের ভেরিয়েবলগুলির জন্য এক ধরণের সুরক্ষা সরবরাহ করে। এছাড়াও, যেহেতু অভ্যন্তরীণ ফাংশনটি বাহ্যিক ফাংশনের সুযোগগুলিতে অ্যাক্সেস করে, বহিরাগত ফাংশনে সংজ্ঞায়িত ভেরিয়েবল এবং ফাংশনগুলি বাহ্যিক ক্রিয়াটির চেয়ে বেশি সময় বেঁচে থাকে, যদি অভ্যন্তরীণ ফাংশন বাইরের ফাংশনের জীবনের বাইরেও বাঁচতে পরিচালিত করে।

উদাহরণ:

<script>
var createPet = function(name) {
  var sex;

  return {
    setName: function(newName) {
      name = newName;
    },

    getName: function() {
      return name;
    },

    getSex: function() {
      return sex;
    },

    setSex: function(newSex) {
      if(typeof newSex == "string" && (newSex.toLowerCase() == "male" || newSex.toLowerCase() == "female")) {
        sex = newSex;
      }
    }
  }
}

var pet = createPet("Vivie");
console.log(pet.getName());                  // Vivie

console.log(pet.setName("Oliver"));   
console.log(pet.setSex("male"));
console.log(pet.getSex());                   // male
console.log(pet.getName());                  // Oliver
</script>

উপরের কোডে বাইরের ফাংশনের নাম ভেরিয়েবলটি অভ্যন্তরীণ ফাংশনগুলিতে অ্যাক্সেসযোগ্য এবং অভ্যন্তরীণ ফাংশনগুলি বাদ দিয়ে অভ্যন্তরীণ ভেরিয়েবলগুলি অ্যাক্সেস করার কোনও উপায় নেই। অভ্যন্তরীণ ফাংশনের অভ্যন্তরীণ ভেরিয়েবলগুলি অভ্যন্তরীণ ফাংশনগুলির জন্য নিরাপদ স্টোর হিসাবে কাজ করে। অভ্যন্তরীণ ফাংশনগুলির সাথে কাজ করার জন্য তারা "অবিচলিত", তবুও সুরক্ষিত। ফাংশনগুলি এমনকি কোনও ভেরিয়েবলের জন্য বরাদ্দ করতে হয় না বা একটি নামও রাখে না। বিশদ জন্য এখানে পড়ুন

Answer 13

আমি মজিলার ফাংশন কারখানার উদাহরণটি পছন্দ করি ।

function makeAdder(x) {

    return function(y) {
        return x + y;
    };
}

var addFive = makeAdder(5);

console.assert(addFive(2) === 7); 
console.assert(addFive(-5) === 0);

Comments

এটি এমন এক উদাহরণ যা আমার মতে ক্লোজারগুলি বা তাদের পক্ষে ভাল কি তা বুঝতে সহায়তা করে না। উদাহরণ হিসাবে ব্যতীত সংখ্যা যোগ করতে কোনও ফাংশন ফিরে আসতে আপনি কতবার বন্ধ লিখেছেন?

— মোহামাদ

Answer 14

জাভাস্ক্রিপ্ট মডিউল প্যাটার্ন ক্লোজার ব্যবহার করে। এটির দুর্দান্ত প্যাটার্নটি আপনাকে "পাবলিক" এবং "প্রাইভেট" ওয়ারগুলির মতো কিছু থাকতে দেয়।

var myNamespace = (function () {

  var myPrivateVar, myPrivateMethod;

  // A private counter variable
  myPrivateVar = 0;

  // A private function which logs any arguments
  myPrivateMethod = function( foo ) {
      console.log( foo );
  };

  return {

    // A public variable
    myPublicVar: "foo",

    // A public function utilizing privates
    myPublicFunction: function( bar ) {

      // Increment our private counter
      myPrivateVar++;

      // Call our private method using bar
      myPrivateMethod( bar );

    }
  };

})();

Answer 15

ইভেন্ট-হ্যান্ডলিং কোডটি সহজ করার জন্য ক্লোজারগুলি কীভাবে ব্যবহার করা যেতে পারে সে সম্পর্কে কিছুক্ষণ আগে আমি একটি নিবন্ধ লিখেছিলাম। এটি ASP.NET ইভেন্ট হ্যান্ডলিংটিকে ক্লায়েন্ট-সাইড jQuery এর সাথে তুলনা করে।

http://www.hackification.com/2009/02/20/closures-simplify-event-handling-code/

Answer 16

এই থ্রেডটি ক্লোজারগুলি কীভাবে কাজ করে সে সম্পর্কে আরও ভাল ধারণা অর্জনে আমাকে প্রচুর পরিমাণে সহায়তা করেছে। আমি তখন থেকে আমার নিজস্ব কিছু পরীক্ষা-নিরীক্ষা করেছি এবং এই মোটামুটি সহজ কোডটি নিয়ে এসেছি যা কিছু অন্যান্য লোককে দেখতে পারে যে কীভাবে বন্ধের ব্যবহারিক উপায়ে ব্যবহার করা যেতে পারে এবং স্থির এবং একইরূপে চলকগুলি বজায় রাখার জন্য বিভিন্ন স্তরে ক্লোজারটি কীভাবে ব্যবহার করা যায় help / অথবা গ্লোবাল ভেরিয়েবলগুলি ঝুঁকি ছাড়াই তাদের ওভাররাইট করা বা বৈশ্বিক ভেরিয়েবলগুলির সাথে বিভ্রান্ত হওয়ার ঝুঁকি ছাড়াই। এটি যা করে তা হ'ল প্রতিটি স্তরের বাটন এবং স্থানীয় স্তরের জন্য প্রতিটি স্থানীয় স্তরে বাটন ক্লিকগুলিতে নজর রাখা, প্রতিটি বোতামের ক্লিকগুলি গণনা করা, একক চিত্রের প্রতি অবদান রাখার। দ্রষ্টব্য আমি এটি করার জন্য কোনও গ্লোবাল ভেরিয়েবল ব্যবহার করি নি, যা অনুশীলনের মূল বিষয় - এমন একটি হ্যান্ডলার রয়েছে যা কোনও বোতামে প্রয়োগ করা যেতে পারে যা বিশ্বব্যাপী কোনও কিছুতে অবদান রাখে।

দয়া করে বিশেষজ্ঞরা, আমি যদি এখানে কোনও খারাপ অভ্যাস করেছি তবে আমাকে জানান! আমি এখনও এই জিনিস নিজেই শিখছি।

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Closures on button presses</title>
<script type="text/javascript">

window.addEventListener("load" , function () {
    /*
    grab the function from the first closure,
    and assign to a temporary variable 
    this will set the totalButtonCount variable
    that is used to count the total of all button clicks

    */
    var buttonHandler = buttonsCount(); 

    /*
    using the result from the first closure (a function is returned) 
    assign and run the sub closure that carries the 
    individual variable for button count and assign to the click handlers 
    */
    document.getElementById("button1").addEventListener("click" , buttonHandler() );
    document.getElementById("button2").addEventListener("click" , buttonHandler() );
    document.getElementById("button3").addEventListener("click" , buttonHandler() );

    // Now that buttonHandler has served its purpose it can be deleted if needs be
    buttonHandler = null;
});



function buttonsCount() {
    /* 
        First closure level 
        - totalButtonCount acts as a sort of global counter to count any button presses
    */
    var totalButtonCount = 0;

    return  function () {
        //second closure level
        var myButtonCount = 0;

        return function (event) {
            //actual function that is called on the button click
            event.preventDefault();
            /*  
               increment the button counts.
               myButtonCount only exists in the scope that is 
               applied to each event handler, therefore acts 
               to count each button individually whereas because 
               of the first closure totalButtonCount exists at 
               the scope just outside, so maintains a sort 
               of static or global variable state 
            */

            totalButtonCount++;
            myButtonCount++;

            /* 
                do something with the values ... fairly pointless 
                but it shows that each button contributes to both 
                it's own variable and the outer variable in the 
                first closure 
            */
            console.log("Total button clicks: "+totalButtonCount);
            console.log("This button count: "+myButtonCount);
        }
    }
}

</script>
</head>

<body>
    <a href="#" id="button1">Button 1</a>
    <a href="#" id="button2">Button 2</a>
    <a href="#" id="button3">Button 3</a>
</body>
</html>

Answer 17

তথ্যসূত্র: বন্ধের ব্যবহারিক ব্যবহার

অনুশীলনে ক্লোজারগুলি মার্জিত ডিজাইন তৈরি করতে পারে, বিভিন্ন গণনা, মুলতুবি কল, কলব্যাকস, এনক্যাপসুলেটেড স্কোপ তৈরি ইত্যাদির স্বনির্ধারণের অনুমতি দেয় may

অ্যারেগুলির সাজানোর পদ্ধতি উদাহরণ যা আর্গুমেন্ট হিসাবে বাছাই-শর্ত ফাংশন হিসাবে গ্রহণ করে:

[1, 2, 3].sort(function (a, b) {
    ... // sort conditions
});

ক্রিয়াকলাপগুলি ম্যাপিং অ্যারেগুলির মানচিত্র হিসাবে যা কার্যকরী যুক্তির শর্তে একটি নতুন অ্যারে ম্যাপ করে:

[1, 2, 3].map(function (element) {
   return element * 2;
}); // [2, 4, 6]

প্রায়শই সন্ধানের জন্য প্রায় সীমাহীন শর্তাবলী সংজ্ঞায়িত ফাংশনাল আর্গুমেন্ট ব্যবহার করে অনুসন্ধান ফাংশনগুলি কার্যকর করা সুবিধাজনক:

 someCollection.find(function (element) {
        return element.someProperty == 'searchCondition';
    });

এছাড়াও, আমরা উদাহরণস্বরূপ, ফাংশনগুলি প্রয়োগ করে নোট করতে পারি, উদাহরণস্বরূপ, একটি forEach পদ্ধতি যা উপাদানগুলির অ্যারেতে কোনও ফাংশন প্রয়োগ করে:

[1, 2, 3].forEach(function (element) {
    if (element % 2 != 0) {
        alert(element);
    }
}); // 1, 3

একটি ফাংশন আর্গুমেন্টগুলিতে প্রয়োগ করা হয় (আর্গুমেন্টের তালিকায় - প্রয়োগে এবং অবস্থানযুক্ত আর্গুমেন্টগুলিতে - ডাকে):

(function () {
  alert([].join.call(arguments, ';')); // 1;2;3
}).apply(this, [1, 2, 3]);

মুলতুবি কল:

var a = 10;
    setTimeout(function () {
      alert(a); // 10, after one second
    }, 1000);

কলব্যাক ফাংশন:

var x = 10;
// only for example
xmlHttpRequestObject.onreadystatechange = function () {
  // callback, which will be called deferral ,
  // when data will be ready;
  // variable "x" here is available,
  // regardless that context in which,
  // it was created already finished
  alert(x); // 10
};

সহায়ক বস্তুগুলি আড়াল করার উদ্দেশ্যে একটি এনক্যাপসুলেটেড স্কোপ তৈরি করা:

var foo = {};
(function (object) {
  var x = 10;
  object.getX = function _getX() {
    return x;
  };
})(foo);
alert(foo.getX());// get closured "x" – 10

Answer 18

আমরা ফ্রন্ট-এন্ড জাভাস্ক্রিপ্টে যে কোডটি লিখি তার বেশিরভাগই ইভেন্ট-ভিত্তিক - আমরা কিছু আচরণ সংজ্ঞায়িত করি, তারপরে এটি কোনও ইভেন্টের সাথে সংযুক্ত করে যা ব্যবহারকারীর দ্বারা ট্রিগার করা হয় (যেমন একটি ক্লিক বা কীপ্রেস হিসাবে)। আমাদের কোডটি সাধারণত কলব্যাক হিসাবে সংযুক্ত থাকে: ইভেন্টটির প্রতিক্রিয়াতে কার্যকর করা হয় এমন একক ফাংশন। সাইজ 12, সাইজ 14, এবং সাইজ 16 এখন ফাংশন যা শরীরের পাঠ্যকে যথাক্রমে 12, 14 এবং 16 পিক্সেলে আকার দেবে। আমরা এগুলি বাটনগুলিতে সংযুক্ত করতে পারি (এই ক্ষেত্রে লিঙ্কগুলি):

function makeSizer(size) {
    return function() {
    document.body.style.fontSize = size + 'px';
    };
}

var size12 = makeSizer(12);
var size14 = makeSizer(14);
var size16 = makeSizer(16);

document.getElementById('size-12').onclick = size12;
document.getElementById('size-14').onclick = size14;
document.getElementById('size-16').onclick = size16;

বেহালা

Comments

যদিও এই কোডটি প্রশ্নের উত্তর দিতে পারে, কীভাবে এবং / বা কেন এটি সমস্যার সমাধান করে তা সম্পর্কিত অতিরিক্ত প্রসঙ্গ সরবরাহ করলে উত্তরের দীর্ঘমেয়াদী মান উন্নত হবে।

— ডোনাল্ড হাঁস

এই উদাহরণটি, আমার কাছে মনে হয়, এটি কোনও স্ট্যান্ডার্ড ফাংশনের মাধ্যমে বন্ধ না করেই প্রয়োগ করা যেতে পারে। আমি এমন কোনও উদাহরণের সন্ধান করার চেষ্টা করছি যা বন্ধ না করেই কার্যকর করা উচিত

— জ্যাচ স্মিথ

Answer 19

বন্ধগুলি তৈরির একটি কার্যকর উপায় জেনারেটর, চাহিদা অনুযায়ী ক্রম বাড়ানো হয়েছে:

    var foobar = function(i){var count = count || i; return function(){return ++count;}}

    baz = foobar(1);
    console.log("first call: " + baz()); //2
    console.log("second call: " + baz()); //3

পার্থক্যগুলি নিম্নলিখিত হিসাবে সংক্ষিপ্ত করা হয়:

নামবিহীন ফাংশন সংজ্ঞায়িত ফাংশন

কোনও পদ্ধতি হিসাবে ব্যবহার করা যায় না কোনও বস্তুর পদ্ধতি হিসাবে ব্যবহার করা যেতে পারে

এটি যে স্কোপটিতে সংজ্ঞায়িত করা হয়েছে কেবল সেখানেই এটি বিদ্যমান যার মধ্যে এটি সংজ্ঞায়িত হয়েছে within

এটি যে স্কোপটিতে সংজ্ঞায়িত হয়েছে কেবল তাকেই বলা যেতে পারে কোডের যে কোনও বিন্দুতে কল করা যেতে পারে

একটি নতুন মান পুনরায় নিয়োগ দেওয়া যেতে পারে বা মুছে ফেলা যায় মুছে ফেলা বা পরিবর্তন করা যায় না

তথ্যসূত্র

• এএস 3 মূলসূত্র: কার্যাদি

Answer 20

প্রদত্ত নমুনায় বদ্ধ ভেরিয়েবলের 'কাউন্টার' এর মান সুরক্ষিত আছে এবং কেবলমাত্র প্রদত্ত ফাংশন (ইনক্রিমেন্ট, হ্রাস) ব্যবহার করে পরিবর্তন করা যেতে পারে। কারণ এটি বন্ধ রয়েছে,

var MyCounter= function (){
    var counter=0;
    return {
    	increment:function () {return counter += 1;},
        decrement:function () {return counter -= 1;},
        get:function () {return counter;}
    };
};

var x = MyCounter();
//or
var y = MyCounter();

alert(x.get());//0
alert(x.increment());//1
alert(x.increment());//2

alert(y.increment());//1
alert(x.get());// x is still 2

Answer 21

জাভাস্ক্রিপ্টে বন্ধের জন্য ব্যবহারিক ব্যবহারের ব্যাখ্যা ---

যখন আমরা অন্য ফাংশনের ভিতরে একটি ফাংশন তৈরি করি, আমরা একটি ক্লোজার তৈরি করি। বন্ধগুলি শক্তিশালী কারণ তারা এর বাহ্যিক ক্রিয়াকলাপগুলির ডেটা পড়তে এবং পরিচালনা করতে সক্ষম। যখনই কোনও ফাংশন ডাকা হয় তখনই সেই কলটির জন্য একটি নতুন সুযোগ তৈরি হয়। ফাংশনের অভ্যন্তরে ঘোষিত স্থানীয় ভেরিয়েবলগুলি সেই সুযোগের অন্তর্ভুক্ত এবং সেগুলি কেবল সেই ফাংশন থেকে অ্যাক্সেস করা যায়। ফাংশনটি কার্যকর করা শেষ হলে, স্কোপটি সাধারণত নষ্ট হয়ে যায়।

এই জাতীয় ফাংশনের একটি সাধারণ উদাহরণ হ'ল:

function buildName(name) { 
    const greeting = "Hello, " + name; 
    return greeting;
}

উপরের উদাহরণে, বিল্ডনেম () ফাংশনটি স্থানীয় ভেরিয়েবল গ্রিটিংস ঘোষণা করে এবং এটি প্রদান করে। প্রতিটি ফাংশন কল একটি নতুন স্থানীয় ভেরিয়েবল সহ একটি নতুন সুযোগ তৈরি করে। ফাংশনটি সম্পাদন শেষ হওয়ার পরে, আমাদের আবার সেই সুযোগটি উল্লেখ করার উপায় নেই, সুতরাং এটি আবর্জনা সংগ্রহ করা হয়েছে।

কিন্তু কীভাবে যখন আমাদের সেই সুযোগের সাথে একটি লিঙ্ক থাকবে?

আসুন পরবর্তী ফাংশনটি দেখুন:

function buildName(name) { 
    const greeting = "Hello, " + name + " Welcome "; 
    const sayName = function() {
        console.log(greeting); 
    };
    return sayName; 
}

const sayMyName = buildName("Mandeep");
sayMyName();  // Hello, Mandeep Welcome

এই উদাহরণ থেকে sayName () ফাংশনটি একটি বন্ধ is SayName () ফাংশনটির নিজস্ব লোকাল স্কোপ রয়েছে (ভেরিয়েবল ওয়েলকাম সহ) এবং বাইরের (এনকোলেসিং) ফাংশনের স্কোপে অ্যাক্সেসও রয়েছে। এই ক্ষেত্রে, বিল্ডনেম () থেকে পরিবর্তনশীল শুভেচ্ছা।

বিল্ডনেম কার্যকর হওয়ার পরে, এই ক্ষেত্রে সুযোগটি ধ্বংস হয় না। মাইনেম () ফাংশনটিতে এখনও এটির অ্যাক্সেস রয়েছে, তাই এটি আবর্জনা সংগ্রহ করা হবে না। তবে বন্ধ হওয়া ব্যতীত বাইরের সুযোগ থেকে ডেটা অ্যাক্সেসের অন্য কোনও উপায় নেই। বন্ধটি বিশ্বব্যাপী প্রসঙ্গ এবং বাইরের সুযোগের মধ্যে প্রবেশদ্বার হিসাবে কাজ করে।

Answer 22

আমি ক্লোজারগুলি শেখার চেষ্টা করছি এবং আমি মনে করি যে আমি যে উদাহরণ তৈরি করেছি তা ব্যবহারিক ব্যবহারের ক্ষেত্রে। আপনি স্নিপেট চালাতে এবং কনসোলে ফলাফল দেখতে পারেন। আমাদের পৃথক পৃথক ডেটা রয়েছে এমন দুটি পৃথক ব্যবহারকারী রয়েছে। তাদের প্রত্যেকটি প্রকৃত অবস্থা দেখতে এবং এটি আপডেট করতে পারে।

function createUserWarningData(user) {
  const data = {
    name: user,
    numberOfWarnings: 0,
  };

  function addWarning() {
    data.numberOfWarnings = data.numberOfWarnings + 1;
  }

  function getUserData() {
    console.log(data);
    return data;
  }

  return {
    getUserData: getUserData,
    addWarning: addWarning,
  };
}

const user1 = createUserWarningData("Thomas");
const user2 = createUserWarningData("Alex");

//USER 1
user1.getUserData(); // returning data user object
user1.addWarning(); // add one warning to specific user
user1.getUserData(); // returning data user object

//USER2
user2.getUserData(); // returning data user object
user2.addWarning(); // add one warning to specific user
user2.addWarning(); // add one warning to specific user
user2.getUserData(); // returning data user object