জাভাস্ক্রিপ্ট ফাংশন স্কোপিং এবং উত্তোলন


90

আমি কেবল জাভাস্ক্রিপ্ট স্কোপিং এবং বেন চেরির উত্তোলন সম্পর্কে একটি দুর্দান্ত নিবন্ধ পড়েছি যেখানে তিনি নিম্নলিখিত উদাহরণটি দিয়েছেন:

var a = 1;

function b() {
    a = 10;
    return;

    function a() {}
}
b();
alert(a);

উপরের কোডটি ব্যবহার করে, ব্রাউজারটি "1" সতর্ক করবে।

এটি "1" কেন ফেরায় তা এখনও আমি নিশ্চিত নই। তিনি যা বলেন তার মধ্যে কিছু জিনিস মনে রাখে যেমন: সমস্ত ফাংশন ঘোষণা শীর্ষে তোলা হয় ho আপনি ফাংশন ব্যবহার করে একটি পরিবর্তনশীল সুযোগ করতে পারেন। এখনও আমার জন্য ক্লিক করে না।

উত্তর:


120

ফাংশন উত্তোলন মানে ফাংশনগুলি তাদের স্কোপের শীর্ষে স্থানান্তরিত হয়। এটাই,

function b() {  
   a = 10;  
   return;  
   function a() {} 
} 

এটির সাথে ইন্টারপেটর দ্বারা পুনরায় লেখা হবে

function b() {
  function a() {}
  a = 10;
  return;
}

অদ্ভুত, আহ?

এছাড়াও, এই উদাহরণে,

function a() {}

হিসাবে একই আচরণ

var a = function () {};

সুতরাং, সংক্ষেপে, কোড এটি করছে:

var a = 1;                 //defines "a" in global scope
function b() {  
   var a = function () {}; //defines "a" in local scope 
   a = 10;                 //overwrites local variable "a"
   return;      
}       
b();       
alert(a);                 //alerts global variable "a"

4
সুতরাং সমস্ত ফাংশন ঘোষণার অবশেষে একটি পরিবর্তনশীল বরাদ্দ করা হয়?
dev.e.loper

15
@ dev.e.loper হ্যাঁ, জাভাস্ক্রিপ্টে, ফাংশনগুলি স্ট্রিং এবং সংখ্যার মতো প্রথম শ্রেণীর অবজেক্ট। এর অর্থ তারা ভেরিয়েবল হিসাবে সংজ্ঞায়িত করা হয় এবং অন্যান্য ফাংশনে স্থানান্তরিত হতে পারে, অ্যারেতে সংরক্ষণ করা যেতে পারে এবং এ জাতীয়।
পিটার ওলসন

4
কোনওভাবেই ফাংশন বডিটি "পুনর্লিখন" হয় না। বিভিন্ন ইসমাস্ক্রিপ্ট স্ট্যান্ডার্ডগুলি স্পষ্টভাবে জানিয়েছে যে কোড কার্যকরকরণ শুরুর আগে ভেরিয়েবল এবং ফাংশন ঘোষণাগুলি প্রক্রিয়া করা হয়। এটি হ'ল কিছুই সরানো হয়নি , এটি মৃত্যুদণ্ডের আদেশ সম্পর্কে (অতএব "উত্তোলন" শব্দটি আমার অপছন্দ, যা আন্দোলন বা পুনর্বিন্যাসকে ক্ষতিগ্রস্থ করে)। আপনার পুনরায় লিখিত কোডে ঘোষণাপত্রটি var aফাংশন ঘোষণার আগে হওয়া উচিত এবং অ্যাসাইনমেন্টটি a = 1পরে হওয়া উচিত। কিন্তু মনে রাখবেন যে এই নির্দিষ্ট করা না থাকে আসলে ঘটতে পার্সার, tokeniser, অনুবাদক, কম্পাইলার, যাই হোক না কেন, এটা ঠিক একটি সমতুল্য এর দ্বারা।
রবজি

4
@ রবজি শিওর, আমি অনুমান করি আপনি বর্ণনাকে একটি ছোট "বাচ্চাদের কাছে মিথ্যা" বলতে পারেন , তবে শেষ পর্যন্ত আচরণটি একই রকম, কোডটি আক্ষরিক অর্থে পুনরায় সাজানো হয়েছে বা ঠিক মৃত্যুদন্ড কার্যকর করার আদেশটি পুনরায় সাজানো হয়েছে কিনা। পর্দার পিছনে আসলে যা ঘটে তা হ'ল একাডেমিক উদ্বেগ এবং এটি বাস্তবায়ন নির্ভরও হতে পারে।
পিটার ওলসন

7
"এছাড়াও, এই উদাহরণে, function a() {}একইরকম আচরণ করেছে var a = function () {};"  - এটি দুটি উপায়ে ভুল: প্রথমত, যদি কিছু হয় তবে এটি হয়ে যেত var a = function a() {};(ফাংশনটি আসলে নামহীন নয়), দ্বিতীয়ত, এই দুটি রূপগুলি বিনিময়যোগ্য নয়, কারণ var a = function a() {};শুধুমাত্র var a;অংশ উত্তোলন করা হবে। a = function a() {};অংশ এখনো রিটার্ন স্টেটমেন্ট পিছনে হত। কারণ মূল ফর্মটি কোনও ক্রিয়াকলাপের ঘোষণা এবং কোনও ফাংশন প্রকাশ নয়, এটি আসলে সামগ্রিকভাবে উত্তোলিত হয়।
ব্যবহারকারী4642212

6

আপনাকে যা মনে রাখতে হবে তা হ'ল এটি পুরো ফাংশনটিকে বিশ্লেষণ করে এবং কার্যকর করার আগে সমস্ত ভেরিয়েবলের ঘোষণার সমাধান করে। তাই ....

function a() {} 

সত্যিই হয়ে যায়

var a = function () {}

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


5

ফাংশন aভিতরে ফাংশন উত্তোলন করা হয় b:

var a = 1; 
function b() { 
   function a() {} 
   a = 10; 
   return;
} 
b(); 
alert(a);

যা প্রায় ব্যবহারের মতো var:

var a = 1; 
function b() { 
   var a = function () {};
   a = 10; 
   return;
} 
b(); 
alert(a);

ফাংশনটি স্থানীয়ভাবে ঘোষিত aহয় এবং সেটিংস কেবল স্থানীয় স্কোপে হয়, বৈশ্বিক ভারতে ঘটে না।


4
এই লাইন "var a = ফাংশন () {};" প্রতিটি জিনিস পরিষ্কার করে দেয় .. মূলত জাভাস্ক্রিপ্ট ডায়নামিক ভাষা এবং "ফাংশন" এছাড়াও জাভাস্ক্রিপ্টে একটি অবজেক্ট।
রিফ্যাক্টর

3
  1. ফাংশন ঘোষণা function a(){}প্রথমে উত্তোলন করা হয় এবং এটি এর মতো আচরণ করে var a = function () {};, তাই স্থানীয় সুযোগে aতৈরি হয় scope
  2. যদি আপনার একই নামের সাথে দুটি ভেরিয়েবল থাকে (স্থানীয় ক্ষেত্রে এক অন্যরকম), স্থানীয় ভেরিয়েবল সর্বদা গ্লোবাল ভেরিয়েবলের চেয়ে প্রাধান্য পায়।
  3. আপনি যখন সেট করেন a=10, আপনি স্থানীয় পরিবর্তনশীল সেট aকরছেন, বৈশ্বিক এক নয়।

সুতরাং, গ্লোবাল ভেরিয়েবলের মান একই থাকে এবং আপনি পান 1, সতর্কতা 1


1

function a() { }এটি একটি ফাংশন স্টেটমেন্ট, যা ফাংশনে একটি aপরিবর্তনশীল স্থানীয় তৈরি bকরে।
কোনও ফাংশন বিশ্লেষণ করার সময় ভেরিয়েবলগুলি তৈরি করা হয়, varফাংশন বিবৃতি কার্যকর হয় কিনা তা বিবেচনা না করেই ।

a = 10 এই স্থানীয় পরিবর্তনশীল সেট করে।


আপনি যোগ না করা হলে ফাংশনটি কার্যকর করা হয় না হলে আসলে গ্লোবাল স্কোপে a = 10একটি পরিবর্তনশীল সেট করে (যেমন পরিবেশকে সেই নির্দেশকে সমর্থন করে)। b"use strict"
শান ভিইরা

@ শিয়ান: না, কারণ ফাংশন স্টেটমেন্টটি স্থানীয় সনাক্তকারী তৈরি করে।
এসএলএক্স

... এবং .... আপনি ঠিক বলেছেন। ফাংশন উত্তোলনের সেই বিশেষ পরিণতিটি বুঝতে পারেনি। ধন্যবাদ!
শান ভিয়েরা

1

কোডের এই ছোট স্নিপেটে বিতর্কটির হাড়টি কী?

মামলা 1:

নিম্নলিখিত হিসাবে function a(){}শরীরের ভিতরে সংজ্ঞা অন্তর্ভুক্ত করুন function blogs value of a = 1

var a = 1;
function b() {
  a = 10;
  return;

  function a() {}
}
b();
console.log(a); // logs a = 1

মামলা 2

নিম্নলিখিত হিসাবে function a(){}শরীরের ভিতরে সংজ্ঞা বাদ দিন function blogs value of a = 10

var a = 1;
function b() {
  a = 10;  // overwrites the value of global 'var a'
  return;
}
b();
console.log(a); // logs a = 10

পর্যবেক্ষণ আপনাকে বুঝতে সাহায্য করবে যে বিবৃতিটি console.log(a)নীচের মানগুলিতে লগ করে s

মামলা 1: a = 1

কেস 2: এ = 10

পোষ্ট

  1. var a গ্লোবাল স্কোপ এ বর্ণনামূলকভাবে সংজ্ঞায়িত এবং ঘোষণা করা হয়েছে
  2. a=10 এই স্টেটমেন্টটি 10 ​​এ মান পুনরায় বরাদ্দ করছে, এটি নিখুঁতভাবে বি ফাংশনের ভিতরে বসে আছে।

উভয় মামলার ব্যাখ্যা

কারণ function definition with name propertyএকটি হিসাবে একই variable a। অভ্যন্তরের variable aঅভ্যন্তরীণ function body bএকটি স্থানীয় পরিবর্তনশীল হয়ে যায়। পূর্ববর্তী লাইনটি সূচিত করে যে কোনওটির বৈশ্বিক মান অক্ষুণ্ন রয়েছে এবং এর স্থানীয় মানের মান 10 এ আপডেট হয়।

সুতরাং, আমরা যা বলতে চাই তা নীচের কোড

var a = 1;
function b() {
  a = 10;
  return;

  function a() {}
}
b();
console.log(a); // logs a = 1

এটি নীচে জেএস দোভাষী দ্বারা ব্যাখ্যা করা হয়েছে।

var a = 1;
function b() {
  function a() {}
  a = 10;
  return;


}
b();
console.log(a); // logs a = 1

যাইহোক, যখন আমরা অপসারণ function a(){} definition, value of 'a'ঘোষিত ও বাইরে ফাংশন খ সংজ্ঞায়িত যে মান ওভাররাইট পায় এবং এটি কারণ মান ওভাররাইট পায় ক্ষেত্রে 2. 10 পরিবর্তন a=10বিশ্বব্যাপী ঘোষণা বোঝায় এবং আমরা থাকতে হবে যদি এটি স্থানীয়ভাবে ঘোষিত ছিল লিখিত var a = 10;

var a = 1;
function b() {
  var a = 10; // here var a is declared and defined locally because it uses a var keyword. 
  return;
}
b();
console.log(a); // logs a = 1

আমরা পরিবর্তন করে আমাদের সন্দেহ আরও নির্মল করতে name propertyমধ্যে function a(){} definitionচেয়ে অন্য কিছু নাম'a'

var a = 1;
function b() {
  a = 10; // here var a is declared and defined locally because it uses a var keyword. 
  return;

  function foo() {}
}
b();
console.log(a); // logs a = 1

1

উত্তোলন আমাদের বোঝার সহজ করার জন্য তৈরি করা একটি ধারণা। আসলে যা ঘটে তা হ'ল ঘোষণাগুলি প্রথমে তাদের স্কোপের বিষয়ে সম্মতিতে করা হয় এবং তার পরে অ্যাসাইনমেন্টগুলি ঘটে (একই সময়ে নয়)।

যখন ঘোষণাগুলি হয় var a, তখন function bএবং সেই bসুযোগের ভিতরে , function aঘোষিত হয়।

এই ফাংশনটি বৈশ্বিক সুযোগ থেকে আগত পরিবর্তনকে ছায়া দেবে।

ঘোষণাগুলি সম্পন্ন হওয়ার পরে, নির্ধারিত মানগুলি শুরু হবে, বিশ্বব্যাপী aমান পাবে 1এবং একটি অভ্যন্তর function bপাবে 10। আপনি যখন করবেন alert(a), এটি আসল গ্লোবাল স্কোপ ভেরিয়েবল কল করবে। কোডের এই সামান্য পরিবর্তন এটি আরও পরিষ্কার করে দেবে

        var a = 1;

    function b() {
        a = 10;
        return a;

        function a() { }
    }

    alert(b());
    alert(a);

4
এটি কৌতূহলজনক যে এমনকি কোডস্কুল ডট কমের একটি কোর্সেও এতগুলি বিশেষজ্ঞরা উত্তোলনকে বোঝায় যা যা ঘটে তার সরল দৃষ্টিভঙ্গি ছাড়া আর কিছুই নয়, আসলে উত্তোলন মোটেই ঘটে না। রেফ: 1) বিকাশকারী.মোজিলা.আর.ইন- ইউএস / ডকস / গ্লোসারি / হোস্টিং ২) জাভাস্ক্রিপ্ট নিনজা 2 / ই এর গোপনীয়তার অধ্যায় 5 জন রেজিগ, বিয়ার বেবিলেট, জোসিপ মারস
আদনান

1

চমকপ্রদভাবে, এখানে উত্তরগুলির কোনওটিতেই স্কোপ চেইনে এক্সিকিউশন কনটেক্সটটির প্রাসঙ্গিকতার উল্লেখ নেই।

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

আমি নীচের উদাহরণটি একটি প্রদর্শন হিসাবে ব্যবহার করব।

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

2) দ্বিতীয়, এটি এক্সিকিউশন কনটেক্সট এর এক্সিকিউশন ফেজ। মাইভার এখন আর একটি অপরিবর্তিত মান। এটি 1 এর মান দিয়ে শুরু করা হয় যা বৈশ্বিক পরিবর্তনশীল পরিবেশে সঞ্চিত থাকে। একটি ফাংশনটি চাওয়া হয় এবং একটি নতুন এক্সিকিউশন কনটেক্সট তৈরি হয়।

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

4) ফাংশন বি ফাংশন ডাকা হয়। একটি নতুন এক্সিকিউশন কনটেক্সট তৈরি করা হয়েছে। যেহেতু এটি ফাংশন এ বর্ণিতভাবে বসেছে, এর বহিরাগত পরিবেশ ক। সুতরাং যখন এটি মাইভারকে উল্লেখ করে, যেহেতু মাইভার ফাংশন বি এর পরিবর্তনশীল পরিবেশে নেই, এটি ফাংশনটির এর ভেরিয়েবল পরিবেশে প্রদর্শিত হবে। এটি এটি সেখানে খুঁজে পেয়েছে এবং কনসোল.লগ ২ টি প্রিন্ট করে But

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

function a(){
  function b(){
    console.log(myVar);
  }

  var myVar = 2;
  b();
}

var myVar = 1;
a();
b();
> 2
> Uncaught ReferenceError: b is not defined

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

function a(){
  function b(){
    console.log(myVar);
  }

  b();
}

var myVar = 1;
a();
> 1

এক্সিকিউশন কনটেক্সট এবং লেটারিকাল এনভায়রনমেন্ট এর সাথে সম্পর্কিত আউটার এনভায়রনমেন্ট এবং ভেরিয়েবল এনভায়রনমেন্ট সহ জাভাস্ক্রিপ্টে ভেরিয়েবলের স্কোপিং সক্ষম করে। এমনকি আপনি যদি প্রতিটি অনুরোধের জন্য একই ফাংশনটি একাধিকবার আবেদন করেন তবে এটি তার নিজস্ব এক্সিকিউশন কনটেক্সট তৈরি করবে। সুতরাং প্রতিটি কার্যকরকরণ প্রসঙ্গে তার পরিবর্তনশীল পরিবেশে ভেরিয়েবলগুলির নিজস্ব কপি থাকবে। ভেরিয়েবলের ভাগ নেই is


0

পরিবর্তনশীল নামটির কারণে এটি হ'ল ফাংশনের নামের অর্থ "এ"। সুতরাং জাভাস্ক্রিপ্ট উত্তোলনের কারণে এটি নামকরণ বিরোধকে সমাধান করার চেষ্টা করে এবং এটি = 1 ফিরে আসবে।

যতক্ষণ না আমি এ "জাভাস্ক্রিপ্ট উত্তোলন" এই পোস্ট পড়তে আমি এই সম্পর্কে বিভ্রান্ত হয় http://www.ufthelp.com/2014/11/JavaScript-Hoisting.html

আশা করি এটা সাহায্য করবে.


0

এখানে আরও টিকা সহ আমার উত্তরের পুনরাবৃত্তি এবং এর সাথে চারপাশে খেলা করার জন্য একটি আকৃতির বাড়া iddle

// hoisting_example.js

// top of scope ie. global var a = 1
var a = 1;

// new scope due to js' functional (not block) level scope
function b() {
    a = 10; // if the function 'a' didn't exist in this scope, global a = 10
  return; // the return illustrates that function 'a' is hoisted to top
  function a(){}; // 'a' will be hoisted to top as var a = function(){};
}

// exec 'b' and you would expect to see a = 10 in subsequent alert
// but the interpreter acutally 'hoisted' the function 'a' within 'b' 
// and in doing so, created a new named variable 'a' 
// which is a function within b's scope
b();

// a will alert 1, see comment above
alert(a);

https://jsfiddle.net/adjavaherian/fffpxjx7/


0

স্কেপোপ এবং ক্লোজার এবং উত্তোলন (ভেরি / ফাংশন)

  1. স্কেপোপ: গ্লোবাল ভারে যে কোনও জায়গায় অ্যাক্সেস হতে পারে (পুরো ফাইল স্কোপ), স্থানীয় বিভিন্ন কেবল স্থানীয় স্কোপ (ফাংশন / ব্লক স্কোপ) দ্বারা অ্যাক্সেস করা যায়!
    দ্রষ্টব্য: কোনও স্থানীয় ভেরিয়েবল যদি কোনও ফাংশনে var কীওয়ার্ড ব্যবহার না করে তবে এটি বিশ্বব্যাপী পরিবর্তনশীল হয়ে উঠবে!
  2. সমাপ্তি: অন্য ক্রিয়াকলাপের অভ্যন্তরীণ একটি ফাংশন, যা স্থানীয় সুযোগ (প্যারেন্ট ফাংশন) এবং গ্লোবাল স্কোপগুলিতে অ্যাক্সেস করতে পারে, যত তাড়াতাড়ি এটির ওয়ার্স অন্যরা অ্যাক্সেস করতে পারে না! যদি না, আপনার ফেরত মান হিসাবে এটি!
  3. উত্তোলন: মান নির্ধারণ বা শূন্যতার চেয়ে সমস্ত ঘোষিত / অঘোষিত vars / ফাংশন স্কোপ শীর্ষে সরিয়ে দিন!
    দ্রষ্টব্য: এটি কেবল ঘোষণাকে সরিয়ে দেয়, মানটি সরায় না!

var a = 1;                
//"a" is global scope
function b() {  
   var a = function () {}; 
   //"a" is local scope 
   var x = 12; 
   //"x" is local scope 
   a = 10;
   //global variable "a" was overwrited by the local variable "a"  
   console.log("local a =" + a);
   return console.log("local x = " + x);
}       
b();
// local a =10
// local x = 12
console.log("global a = " + a);
// global a = 1
console.log("can't access local x = \n");
// can't access local x = 
console.log(x);
// ReferenceError: x is not defined



0

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


0

এটি সমস্ত পরিবর্তনশীল 'ক' এর স্কোপের উপর নির্ভর করে। আমাকে চিত্র হিসাবে স্কোপ তৈরি করে ব্যাখ্যা করি।

এখানে জাভাস্ক্রিপ্ট 3 টি স্কোপ তৈরি করবে।

i) বৈশ্বিক সুযোগ। ii) ফাংশন খ () সুযোগ। iii) কার্য (ক) সুযোগ।

এখানে চিত্র বর্ণনা লিখুন

আপনি যখন 'সতর্কতা' পদ্ধতির সুযোগটি কল করবেন তখন এটি স্পষ্ট হবে সেই সময়ের গ্লোবালের অন্তর্গত, সুতরাং এটি কেবল গ্লোবাল স্কোপ থেকে 'এ' ভেরিয়েবলের মান বেছে নেবে।


0

দীর্ঘ পোস্ট!

তবে তা বাতাস পরিষ্কার করবে!

জাভা স্ক্রিপ্ট যেভাবে কাজ করে তা হ'ল এটিতে দুটি পদক্ষেপ প্রক্রিয়া জড়িত:

  1. সংকলন (তাই কথা বলতে) - এই পদক্ষেপটি ভেরিয়েবল এবং ফাংশন ঘোষণা এবং তাদের নিজ নিজ ক্ষেত্র নিবন্ধভুক্ত করে। এটা তোলে মূল্যায়নের ফাংশন অভিব্যক্তি সঙ্গে যুক্ত নয়: var a = function(){}(বরাদ্দ মত বা পরিবর্তনশীল অভিব্যক্তি 3থেকে xক্ষেত্রে এর var x =3;। যা কিছুই কিন্তু RHS অংশ মূল্যায়ন হয়)

  2. দোভাষী: এটি কার্যকর করা / মূল্যায়নের অংশ।

বোঝার জন্য নীচের কোডটির আউটপুট পরীক্ষা করুন:

//b() can be called here!
//c() cannot be called.
console.log("a is " + a);
console.log("b is " + b);
console.log("c is " + c);
var a = 1;
console.log("Now, a is " + a);
var c = function() {};
console.log("Now c is " + c);

function b() {
  //cannot write the below line:
  //console.log(e); 
  //since e is not declared.
  e = 10; //Java script interpreter after traversing from this function scope chain to global scope, is unable to find this variable and eventually initialises it with value 10 in global scope.
  console.log("e is " + e) //  works!
  console.log("f is " + f);
  var f = 7;
  console.log("Now f is " + f);
  console.log("d is " + d);
  return;

  function d() {}
}
b();
console.log(a);

এটি বিরতিতে দেয়:

  1. সংকলন পর্যায়ে, 'ক' মান সহ বিশ্বব্যাপী আওতায় নিবন্ধিত হবে undefined'। একই ' c' এর জন্য যায় , এই মুহুর্তে এর মান ' undefined' হবে এবং ' function()' নয়। ' b' বিশ্বব্যাপী একটি কার্য হিসাবে নিবন্ধিত হবে। bএর স্কোপের ভিতরে , ' f' একটি ভেরিয়েবল হিসাবে নিবন্ধিত হবে যা এই মুহূর্তে অপরিজ্ঞাত হবে এবং ফাংশন ' d' নিবন্ধিত হবে।

  2. যখন দোভাষী চালিত হন, ঘোষিত ভেরিয়েবলগুলি function()(এবং এক্সপ্রেশন নয়) তখন দোভাষী দের আসল এক্সপ্রেশন লাইনে পৌঁছানোর আগে অ্যাক্সেস করা যায়। সুতরাং, ভেরিয়েবলগুলি মুদ্রিত হবে ' undefined' এবং ঘোষিত বেনামে ফাংশন আগে বলা যেতে পারে। তবে এর এক্সপ্রেশন ইনিশিয়ালেশনের আগে অঘোষিত ভেরিয়েবল অ্যাক্সেস করার চেষ্টা করার ফলে একটি ত্রুটি হতে পারে:

console.log(e)
e = 3;

এখন, যখন আপনার একই নামের সাথে ভেরিয়েবল এবং ফাংশন ঘোষণা হয় তখন কী হয়।

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

var a = 1;
console.log("a is " + a);

function b() {
  console.log("a inside the function b is " + a); //interpreter finds                                'a' as function() in current scope. No need to go outside the scope to find 'a'.
  a = 3; //a changed
  console.log("Now a is " + a);
  return;

  function a() {}
}
var a; //treated as duplicate and ignored.
b();
console.log("a is still " + a + " in global scope"); //This is global scope a.


0

উত্তোলন জাভাস্ক্রিপ্ট এর আচরণগত ধারণা। উত্তোলন (বল মুভিং) এমন ধারণা যা ভেরিয়েবলগুলি কীভাবে ঘোষণা করা উচিত তা ব্যাখ্যা করে explains

জাভাস্ক্রিপ্টে, কোনও ভেরিয়েবল এটি ব্যবহারের পরে ঘোষণা করা যেতে পারে কারণ ফাংশন ঘোষণা এবং পরিবর্তনশীল ঘোষণা সর্বদা অদৃশ্যভাবে জাভাস্ক্রিপ্ট অনুবাদকারী দ্বারা তাদের ধারণাগুলির শীর্ষে স্থানান্তরিত হয় ("উত্তোলিত") are

বেশিরভাগ ক্ষেত্রে আমাদের দুটি ধরণের উত্তোলন মুখোমুখি হয়।

1. পরিবর্তনশীল ঘোষণা উত্তোলন

কোডের এই টুকরা দ্বারা এটি বুঝতে দিন।

 a = 5; // Assign 5 to a
 elem = document.getElementById("demo"); // Find an element 
 elem.innerHTML = a;                     // Display a in the element
 var a; // Declare a
  //output-> 5

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

 var a = 5; // Assign and declare 5 to a
 elem = document.getElementById("demo"); // Find an element 
 elem.innerHTML = a;                     // Display a in the element
  // output -> 5

আরেকটি উদাহরণ বিবেচনা করুন।

  function foo() {
     console.log(x)
     var x = 1;
 }

আসলে এর অর্থ ব্যাখ্যা করা হয়:

  function foo() {
     var x;
     console.log(x)
     x = 1;
  }

এই ক্ষেত্রে এক্স অপরিশোধিত করা হবে

কোডটি কার্যকর হয়েছে যা ভেরিয়েবলের ঘোষণাপত্রের সাথে কার্যকর হয় তা বিবেচ্য নয়। এই উদাহরণ বিবেচনা করুন।

  function foo() {
     if (false) {
         var a = 1;
     }
     return;
     var b = 1;
  }

এই ফাংশনটি এর মতো হতে পারে।

  function foo() {
      var a, b;
      if (false) {
        a = 1;
     }
     return;
     b = 1;
  }

ভেরিয়েবল ঘোষণায় কেবল পরিবর্তনশীল সংজ্ঞা তোলা হয় না, নিয়োগও নয়।

  1. অনুষ্ঠানের ঘোষণা উত্তোলন

ভেরিয়েবলের পরিবর্তে ফাংশন বডি বা নির্ধারিত মানটিও উত্তোলন করা হবে। এই কোড বিবেচনা করুন

 function demo() {
     foo(); // this will give error because it is variable hoisting
     bar(); // "this will run!" as it is function hoisting
     var foo = function () {
         alert("this would not run!!");
     }
     function bar() { 
         alert("this will run!!");
     }
 }
 demo();

এখন আমরা যেমন ভেরিয়েবল এবং ফাংশন উত্তোলন উভয়ই বুঝতে পেরেছি, এখন এই কোডটি বুঝতে পারি।

var a = 1;
function b() {
  a = 10;
  return;
   function a() {}
}
b();
alert(a);

এই কোডটি এর মতো হয়ে উঠবে।

var a = 1;                 //defines "a" in global scope
 function b() {  
   var a = function () {}; //defines "a" in local scope 
    a = 10;                 //overwrites local variable "a"
    return;      
 }       
 b();       
 alert(a); 

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


0

আমার জ্ঞানের অংশ থেকে, উত্তোলনটি ভেরিয়েবলের ঘোষণা এবং ফাংশন ঘোষণার সাথে ঘটে, উদাহরণস্বরূপ:

a = 7;
var a;
console.log(a) 

জাভাস্ক্রিপ্ট এর ইঞ্জিনের মধ্যে কী ঘটে:

var a;
a = 7;
console.log(a);
// 7

বা:

console.log(square(7)); // Output: 49
function square(n) { return n * n; }

এটা পরিনত হবে:

function square(n) { return n * n; }
console.log(square(7)); // 49

তবে ভেরিয়েবল অ্যাসিগমেন্ট, ফাংশন এক্সপ্রেশন অ্যাসাইনমেন্টের মতো অ্যাসাইনমেন্টগুলি উত্তোলন করা হবে না: উদাহরণস্বরূপ:

console.log(x);
var x = 7; // undefined

এটি এর মতো হয়ে উঠতে পারে:

var x;
console.log(x); // undefined
x = 7;

0

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

এখানে চিত্র বর্ণনা লিখুন

আমি ধরে নিচ্ছি যে আপনি একজন শিক্ষানবিস, সঠিকভাবে উত্তোলন বুঝতে প্রথমে আমরা অপরিজ্ঞাত এবং রেফারেন্স এররের মধ্যে পার্থক্য বুঝতে পেরেছি

 var v;
 console.log(v);
 console.log(abc);
/*
The output of the above codes are:
undefined
ReferenceError: abc is not defined*/

বেলো কোডে এখন আমরা কী দেখছি? একটি ভেরিয়েবল এবং একটি ফাংশন এক্সপ্রেশন হ'ল ডিক্লেয়ার্ড।

<script>
var totalAmo = 8;
var getSum = function(a, b){
      return a+b;
}
</script>

তবে প্রমাণ সহ আসল চিত্র যে ভেরিয়েবল এবং ফাংশন উভয়ই সেখানে সুযোগের শীর্ষে উঠানো হয়েছে:

console.log(totalAmo);
console.log(getSum(8,9));
var totalAmo = 8;
var getSum = function(a, b){
      return a+b;
}
console.log(totalAmo);
console.log(getSum(9,7));

প্রথম দুই লগ আউটপুট হয় অনির্দিষ্ট এবং TypeError: getSum কোন ফাংশন নয় কারণ তাদের উভয়ই Var totalAmo এবং getSum নিচে মত তাদের সুযোগ উপরে উত্তোলন করা হয়

 <script>
        var totalAmo;
        var getSum;

        console.log(totalAmo);
        console.log(getSum(8,9));
        var totalAmo = 8;
        var getSum = function(a, b){
            return a+b;
        }
        console.log(totalAmo);
        console.log(getSum(9,7));
    </script>

তবে ফাংশন ঘোষণার জন্য পুরো ফাংশনগুলি তাদের স্কোপের শীর্ষে উত্তোলিত হয়।

console.log(getId());
function getId(){
   return 739373;
}
/* output: 739373, because the whole function hoisted on the top of the scope.*/

এখন একই যুক্তি those ভেরিবেল, ফাংশন এক্সপ্রেসশন এবং ফাংশন ডিক্লারটোইনগুলি কার্যকরী সুযোগের মধ্যে ঘোষিত হয়েছে। মূল বিষয়: এগুলি ফাইলের শীর্ষে তোলা হবে না ;

function functionScope(){
            var totalAmo;
            var getSum;

            console.log(totalAmo);
            console.log(getSum(8,9));
            var totalAmo = 8;
            var getSum = function(a, b){
                return a+b;
            }
        }

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

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

 function getTotal(){
            let total=0;
            for(var i = 0; i<10; i++){
                let valueToAdd = i;
                var multiplier = 2;
                total += valueToAdd*multiplier;
            }
            return total;
        }

অ্যাবোব উদাহরণে চলকগুলি বেলোয়ের মতো উত্তোলন করা হবে

 function getTotal(){
            let total;
            var multiplier;
            total = 0;
            for(var i = 0; i<10; i++){
                let valueToAdd;
                valueToAdd = i;
                multiplier = 2;
                total += valueToAdd*multiplier;
            }
            return total;
        }

0

ES5: ফাংশন উত্তোলন এবং পরিবর্তনশীল উত্তোলন

function hoistingঅগ্রাধিকার greaterচেয়ে হয়variable hoisting

"use strict";

/**
 *
 * @author xgqfrms
 * @license MIT
 * @copyright xgqfrms
 * @created 2016-06-01
 * @modified
 *
 * @description function-hoisting.js
 * @augments
 * @example
 * @link
 *
 */

(function() {
  const log = console.log;

  var a = 1;
  function b() {
    a = 10;
    log(`local a`, a)
    return;
    // function hoisting priority is greater than variable hoisting
    function a() {}
  }
  b();
  log(`global a`, a);
  // local a 10
  // global a 1
})();



যা সমান

(function() {
  const log = console.log;

  // define "a" in global scope
  var a = 1;
  function b() {
    // define "a" in local scope
    var a ;
    // assign function to a
    a = function () {};
    // overwrites local variable "a"
    a = 10;
    log(`local a`, a);
    return;
  }

  b();
  // log global variable "a"
  log(`global a`, a);

  // local a 10
  // global a 1
})();

উত্তোলন পিছনে কারণ

var a = 1;                
//"a" is global scope
function b() {  
   var a = function () {}; 
   //"a" is local scope 
   var x = 12; 
   //"x" is local scope 
   a = 10;
   //global variable "a" was overwrited by the local variable "a"  
   console.log("local a =" + a);
   return console.log("local x = " + x);
}       
b();
// local a =10
// local x = 12
console.log("global a = " + a);
// global a = 1
console.log("can't access local x = \n");
// can't access local x = 
console.log(x);
// ReferenceError: x is not defined

/**
 *  scpope & closure & hoisting (var/function)
 *  
 * 1. scpope : the global var can be access in any place(the whole file scope), local var only can be accessed by the local scope(function/block scope)!
 * Note: if a local variable not using var keywords in a function, it will become a global variable!
 * 
 * 2. closure : a function inner the other function, which can access local scope(parent function) & global scope, howerver it's vars can't be accessed by others! unless, your return it as return value!
 * 
 * 3. hoisting : move all declare/undeclare vars/function to the scope top, than assign the value or null!
 * Note: it just move the declare, not move the value!
 * 
 */

ES6 let, constউত্তোলনের কোনও অস্তিত্ব নেই

(() => {
  const log = console.log;
  log(a)
  // Error: Uncaught ReferenceError: Cannot access 'a' before initialization
  let a = 1;
})();



(() => {
  const log = console.log;
  log(b)
  // Error: Uncaught ReferenceError: Cannot access 'b' before initialization
  const b = 1;
})();

রেফারেন্স

https://developer.mozilla.org/en-US/docs/Web/ জাভা স্ক্রিপ্ট / রেফারেন্স / স্টেটমেন্টস /var

https://developer.mozilla.org/en-US/docs/Web/JavaScript/References/Statesments/let

https://developer.mozilla.org/en-US/docs/Web/JavaScript/ উল্লেখ / স্ট্যাটমেন্টস / কনস্ট্যান্ট

আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.