অন্যান্য উত্তর নিয়ে অসন্তুষ্ট। 2019/3/13 হিসাবে শীর্ষে ভোট দেওয়া উত্তর সত্যই ভুল।
এর =>অর্থ সংক্ষিপ্ত সংস্করণটি হ'ল এটি একটি ফাংশন এবং বর্তমানকে আবদ্ধ করার জন্য একটি শর্টকাটthis
const foo = a => a * 2;
কার্যকরভাবে জন্য একটি শর্টকাট
const foo = function(a) { return a * 2; }.bind(this);
সংক্ষিপ্ত হয়ে যাওয়া সমস্ত জিনিস আপনি দেখতে পাবেন। আমরা না হলেই ভাল হত function, কিংবা returnকিংবা .bind(this)এমনকি ধনুর্বন্ধনী বা প্রথম বন্ধনী
তীর ফাংশনটির সামান্য দীর্ঘ উদাহরণ হতে পারে
const foo = (width, height) => {
const area = width * height;
return area;
};
দেখানো হচ্ছে যে আমরা যদি ফাংশনে একাধিক যুক্তি চাই তবে আমাদের প্রথম বন্ধনী প্রয়োজন এবং আমরা যদি একটি একক অভিব্যক্তি চেয়ে বেশি লিখতে চাই তবে আমাদের ধনুর্বন্ধনী এবং একটি সুস্পষ্ট প্রয়োজন return।
.bindঅংশটি বোঝা গুরুত্বপূর্ণ এবং এটি একটি বড় বিষয়। এটি thisজাভাস্ক্রিপ্ট মানে কি সঙ্গে করতে হবে ।
সমস্ত ফাংশনের একটি অন্তর্ভুক্ত প্যারামিটার বলা হয় this। thisকোনও ফাংশন কল করার সময় কীভাবে সেট করা হয় সেই ফাংশনটি কীভাবে ডাকা হয় তার উপর নির্ভর করে।
গ্রহণ করা
function foo() { console.log(this); }
যদি আপনি সাধারণত এটি কল
function foo() { console.log(this); }
foo();
this গ্লোবাল অবজেক্ট হবে।
আপনি যদি কড়া মোডে থাকেন
`use strict`;
function foo() { console.log(this); }
foo();
// or
function foo() {
`use strict`;
console.log(this);
}
foo();
এটা হবে undefined
আপনি thisসরাসরি ব্যবহার করে callবা সেট করতে পারেনapply
function foo(msg) { console.log(msg, this); }
const obj1 = {abc: 123}
const obj2 = {def: 456}
foo.call(obj1, 'hello'); // prints Hello {abc: 123}
foo.apply(obj2, ['hi']); // prints Hi {def: 456}
আপনি thisডট অপারেটর ব্যবহার করেও স্পষ্টভাবে সেট করতে পারেন.
function foo(msg) { console.log(msg, this); }
const obj = {
abc: 123,
bar: foo,
}
obj.bar('Hola'); // prints Hola {abc:123, bar: f}
আপনি যখন কোনও ফাংশন কলব্যাক বা শ্রোতা হিসাবে ব্যবহার করতে চান তখন একটি সমস্যা উপস্থিত হয়। আপনি ক্লাস করেন এবং কলব্যাক হিসাবে কোনও ফাংশন বরাদ্দ করতে চান যা শ্রেণীর কোনও উদাহরণ অ্যাক্সেস করে।
class ShowName {
constructor(name, elem) {
this.name = name;
elem.addEventListener('click', function() {
console.log(this.name); // won't work
});
}
}
উপরের কোডটি কাজ করবে না কারণ যখন উপাদান ইভেন্টটি ফায়ার করে এবং ফাংশনটি কল করে তখন thisমানটি শ্রেণীর উদাহরণ হতে পারে না।
এই সমস্যা সমাধানের একটি সাধারণ উপায় হ'ল ব্যবহার করা .bind
class ShowName {
constructor(name, elem) {
this.name = name;
elem.addEventListener('click', function() {
console.log(this.name);
}.bind(this); // <=========== ADDED! ===========
}
}
কারণ তীর সিনট্যাক্স একইভাবে আমরা লিখতে পারি
class ShowName {
constructor(name, elem) {
this.name = name;
elem.addEventListener('click',() => {
console.log(this.name);
});
}
}
bindকার্যকরভাবে একটি নতুন ফাংশন তোলে । যদি bindঅস্তিত্ব না থাকে তবে আপনি মূলত নিজের মতো করে তৈরি করতে পারেন
function bind(funcitonToBind, valueToUseForThis) {
return function(...args) {
functionToBind.call(valueToUseForThis, ...args);
};
}
পুরানো জাভাস্ক্রিপ্টে স্প্রেড অপারেটর ছাড়া এটি হবে
function bind(funcitonToBind, valueToUseForThis) {
return function() {
functionToBind.apply(valueToUseForThis, arguments);
};
}
কোডটি বোঝার জন্য ক্লোজারগুলির বোঝাপড়া প্রয়োজন তবে সংক্ষিপ্ত সংস্করণটি bindএকটি নতুন ফাংশন তৈরি করে যা সর্বদা thisএটির সাথে আবদ্ধ মানটির সাথে মূল ফাংশনটিকে কল করে । তীর ফাংশন একই কাজ করে কারণ তারা একটি শর্টকাটbind(this)
