সহজেই "এই" পরিবর্তনশীল সেট করুন?

Question

জাভাস্ক্রিপ্ট সম্পর্কে আমার বেশ ভাল বোঝাপড়া আছে, "এই" ভেরিয়েবলটি সেট করার জন্য আমি কোনও দুর্দান্ত উপায় বের করতে পারি না। বিবেচনা:

var myFunction = function(){
    alert(this.foo_variable);
}

var someObj = document.body; //using body as example object
someObj.foo_variable = "hi"; //set foo_variable so it alerts

var old_fn = someObj.fn;   //store old value
someObj.fn = myFunction;   //bind to someObj so "this" keyword works
someObj.fn();              
someObj.fn = old_fn;       //restore old value

শেষ 4 লাইন ছাড়া এটি করার কোনও উপায় আছে? এটি বরং বিরক্তিকর ... আমি একটি বেনামি ফাংশনকে আবদ্ধ করার চেষ্টা করেছি, যা আমি মনে করি সুন্দর এবং চতুর, তবে কোনও লাভ হয়নি:

var myFunction = function(){
    alert(this.foo_variable);
}

var someObj = document.body;        //using body as example object
someObj.foo_variable = "hi";        //set foo_variable so it alerts
someObj.(function(){ fn(); })();    //fail.

স্পষ্টতই, MyFunction এ ভেরিয়েবলটি পাস করা একটি বিকল্প ... তবে এটি এই প্রশ্নের মূল বিষয় নয়।

ধন্যবাদ।

Answer 1

জাভাস্ক্রিপ্টে সমস্ত ফাংশনগুলির জন্য দুটি পদ্ধতি নির্ধারণ করা হয়েছে call(), এবং apply()। ফাংশন সিনট্যাক্সের মতো দেখাচ্ছে:

call( /* object */, /* arguments... */ );
apply(/* object */, /* arguments[] */);

এসব ফাংশন কি ফাংশন তারা প্রার্থনা ছিল কল, এর মান বরাদ্দ হয় বস্তুর পরামিতি এই ।

var myFunction = function(){
    alert(this.foo_variable);
}
myFunction.call( document.body );

Comments

এছাড়াও, আপনি যদি jQuery ব্যবহার করছেন তবে আপনি $.proxy(function, element)যাতে ব্যবহার করতে পারেন যখনই এই ফাংশনটি ডাকা হবে তখন এটি উপাদানটির প্রসঙ্গে থাকবে। api.jquery.com/jquery.proxy

— ট্রেভিন অ্যাভেরি

আরেকটি দরকারী পদ্ধতি.bind()

— Soroush Falahati

Answer 2

আমি মনে করি আপনি খুঁজছেন call:

myFunction.call(obj, arg1, arg2, ...);

সেট করার myFunctionসাথে এটি কল thisকরে obj।

কিছুটা আলাদা পদ্ধতিও রয়েছে applyযা ফাংশনটির পরামিতিগুলিকে অ্যারে হিসাবে গ্রহণ করে:

myFunction.apply(obj, [arg1, arg2, ...]);

Comments

ECMAScript ভাষা নির্দিষ্টকরণের বিভাগ 15.3.4.3, 15.3.4.4 এবং 10.1.8 দেখুন: ecma-international.org/publications/files/ECMA-ST/Ecma-262.pdf

— কিছু

Answer 3

আপনি যদি thisকোনও ফাংশনের মানটি 'সঞ্চয়' করতে চান যাতে আপনি পরে এটি নির্বিঘ্নে কল করতে পারেন (উদাহরণস্বরূপ যখন আপনার সেই মানটির আর অ্যাক্সেস নেই) তবে আপনি bindএটি করতে পারেন (যদিও সমস্ত ব্রাউজারে উপলব্ধ নেই):

var bound = func.bind(someThisValue);

// ... later on, where someThisValue is not available anymore

bound(); // will call with someThisValue as 'this'

Comments

এফওয়াইআই bindদৃশ্যত আই 9 +, এফএফ 4 +, সাফারি 5.1.4+ এবং ক্রোম 7+ (উত্স) এ উপলব্ধ । আপনি কোনও বেনামে সরাসরি বাঁধাকেও কল করতে পারেন:var myFunction = function(){ /* this = something */ }.bind(something);

— অ্যাডাম

Answer 4

কীভাবে বাঁধতে হয় সে সম্পর্কে আমার অনুসন্ধান thisআমাকে এখানে এনেছে তাই আমি আমার অনুসন্ধানগুলি পোস্ট করছি: 'ECMAScript 2015'-এ আমরা তীর ফাংশনগুলি ব্যবহার করেও এই বর্ণিকভাবে সেট করতে পারি।

দেখুন: https://developer.mozilla.org/en/docs/Web/JavaScript/ উল্লেখ / ফাংশন / অ্যারো_ফিউশনস

পরিবর্তে:

function Person() {
  setInterval(function growUp() {
    // The callback refers to the `self` variable of which
    // the value is the expected object.
    this.age++;
  }.bind(this), 1000);
}

আমরা এখন করতে পারি:

function Person(){
  this.age = 0;

  setInterval(() => {
    this.age++; // |this| properly refers to the person object
  }, 1000);
}

var p = new Person();

Answer 5

thisজাভাস্ক্রিপ্টে কীওয়ার্ডটি সেট করা হচ্ছে ।

জাভাস্ক্রিপ্টটিতে thisকীওয়ার্ডটি সুবিধামত সেট করার জন্য পদ্ধতিগুলিতে 3 টি বিল্ট রয়েছে । এগুলি সমস্ত Function.prototypeবস্তুর উপরে অবস্থিত তাই প্রতিটি ফাংশন এগুলি ব্যবহার করতে পারে (যেহেতু প্রতিটি ফাংশন প্রোটোটাইপাল উত্তরাধিকারের মাধ্যমে এই প্রোটোটাইপ থেকে উত্তরাধিকার সূত্রে প্রাপ্ত হয়)। এই ফাংশনগুলি নিম্নলিখিত:

1. Function.prototype.call(): এই ফাংশনটি আপনাকে thisপ্রথম আর্গুমেন্ট হিসাবে ব্যবহার করতে চাইলে অবজেক্টটি নিয়ে যায় । তারপরে আর্গুমেন্টের বাকী অংশটি বলা হয় যে ফাংশনটির সংশ্লিষ্ট আর্গুমেন্ট।
2. Function.prototype.apply(): এই ফাংশনটি আপনাকে thisপ্রথম আর্গুমেন্ট হিসাবে ব্যবহার করতে চাইলে অবজেক্টটি নিয়ে যায় । তারপরে দ্বিতীয় আর্গুমেন্টটি একটি অ্যারে যা ফাংশনটির আর্গুমেন্টগুলির মান রয়েছে যা বলা হয় (অ্যারের প্রথম উপাদানটি ফাংশনের প্রথম আর্গুমেন্ট, অ্যারের দ্বিতীয় যুক্তি হ'ল ফাংশনের দ্বিতীয় আর্গুমেন্ট ইত্যাদি) etc.
3. Function.prototype.bind(): এই ফাংশনটি একটি নতুন ফাংশন প্রদান করে যার মান আলাদা হয় this। আপনি thisপ্রথম আর্গুমেন্ট হিসাবে মান হিসাবে সেট করতে চান যা অবজেক্ট নেয় এবং তারপরে একটি নতুন ফাংশন অবজেক্ট প্রদান করে।

কল / প্রয়োগ এবং বাইন্ডের মধ্যে পার্থক্য:

• callএবং applyএগুলি একই রকম যে তারা তত্ক্ষণাত ফাংশনটি কল করে (এর পূর্বনির্ধারিত মান সহ this)
• bindথেকে ভিন্ন callএবং applyআসলে এই ফাংশন যে একটি নতুন ফাংশনটি একটি ভিন্ন বন্ধনের সঙ্গে thisমান।

উদাহরণ:

const thisObj = {
  prop1: 1,
  prop2: 2,
};

function myFunc(arg1, arg2) {
  console.log(this.prop1, this.prop2);
  console.log(arg1, arg2);
}

// first arg this obj, other arguments are the  
// respective arguments of the function
myFunc.call(thisObj, 'Call_arg1', 'Call_arg2');

// first arg this obj, other argument is an array which  
// are the respective arguments of the function
myFunc.apply(thisObj, ['Apply_arg1', 'Apply_arg2']);


// the bind method returns a new function with a different
// this context which is stored in the newMyFunc variable
const newMyFunc = myFunc.bind(thisObj);

// now we can call the function like a normal function 
newMyFunc('first', 'second');