àª¶à«àª àªà« Function.prototype.bind()?

JavaScript માં કૉલ અને અરજી

Arthur Petit

બુધવાર, 26 જૂન, 2024 એ 03:20:36 PM વાગ્યે

JavaScript માં ફંક્શન ઇન્વોકેશન પદ્ધતિઓ

JavaScript માં, કાર્યોને વિવિધ રીતે બોલાવી શકાય છે, અને બે સામાન્ય રીતે ઉપયોગમાં લેવાતી પદ્ધતિઓ છે `કૉલ` અને `એપ્લાય`. આ પદ્ધતિઓ તમને સંદર્ભ (`આ` મૂલ્ય) ને નિયંત્રિત કરવાની મંજૂરી આપે છે જેમાં ફંક્શન ચલાવવામાં આવે છે. કાર્યક્ષમ અને અસરકારક JavaScript કોડ લખવા માટે `કૉલ` અને `એપ્લાય` વચ્ચેના તફાવતને સમજવું મહત્વપૂર્ણ છે.

આ લેખ ફંક્શનની વિનંતી કરતી વખતે `Function.prototype.call()` અને `Function.prototype.apply()` વચ્ચેના તફાવતની શોધ કરે છે. અમે તેમના વાક્યરચના, ઉપયોગના કિસ્સાઓ અને સંભવિત પ્રદર્શન તફાવતોની તપાસ કરીશું. આ લેખના અંત સુધીમાં, તમને એ સ્પષ્ટ સમજ હશે કે `લાગુ` પર `કૉલ`નો ઉપયોગ ક્યારે કરવો અને તેનાથી વિપરીત.

આદેશ	વર્ણન
Function.prototype.call()	આપેલ આ મૂલ્ય અને વ્યક્તિગત રીતે આપેલ દલીલો સાથે ફંક્શનને કૉલ કરે છે.
Function.prototype.apply()	આપેલ આ મૂલ્ય સાથે ફંક્શનને કૉલ કરે છે, અને એરે તરીકે પ્રદાન કરેલી દલીલો.
this	તે ઑબ્જેક્ટનો સંદર્ભ આપે છે જેમાંથી ફંક્શનને કૉલ કરવામાં આવ્યો હતો, જે ગતિશીલ સંદર્ભ સોંપણીને મંજૂરી આપે છે.
console.log()	ડિબગીંગ હેતુઓ માટે કન્સોલ પર સંદેશાઓ અથવા ચલોને છાપે છે.
res.writeHead()	Node.js સર્વરમાં HTTP સ્ટેટસ કોડ અને રિસ્પોન્સ હેડરો સેટ કરે છે.
res.end()	Node.js સર્વરમાં પ્રતિભાવ પ્રક્રિયા સમાપ્ત થાય છે, જે સંકેત આપે છે કે તમામ ડેટા મોકલવામાં આવ્યો છે.
http.createServer()	Node.js માં HTTP સર્વર ઇન્સ્ટન્સ બનાવે છે, આવનારી વિનંતીઓ સાંભળીને.
listen()	HTTP સર્વરને શરૂ કરે છે, તેને સ્પષ્ટ કરેલ પોર્ટ પર સાંભળવા માટે પરવાનગી આપે છે.

કૉલના ઉપયોગને સમજવું અને JavaScriptમાં અરજી કરવી

પૂરી પાડવામાં આવેલ સ્ક્રિપ્ટો ઉપયોગ વચ્ચેના તફાવતોને સમજાવે છે Function.prototype.call() અને Function.prototype.apply() JavaScript માં. બંને પદ્ધતિઓનો ઉપયોગ ઉલ્લેખિત સાથે કાર્યોને બોલાવવા માટે થાય છે this સંદર્ભ. પ્રથમ ઉદાહરણમાં, ધ call() પદ્ધતિનો ઉપયોગ કરવામાં આવે છે fullName વિવિધ વસ્તુઓ પર પદ્ધતિ (person1 અને person2), દરેક ઑબ્જેક્ટના ગુણધર્મોને વ્યક્તિગત દલીલો તરીકે પસાર કરવું. જ્યારે દલીલોની સંખ્યા જાણીતી અને નિશ્ચિત હોય ત્યારે આ પદ્ધતિ સંક્ષિપ્ત વાક્યરચના માટે પરવાનગી આપે છે. બીજું ઉદાહરણ ઉપયોગ દર્શાવે છે apply() પદ્ધતિ, જે સમાન છે call() પરંતુ વ્યક્તિગત મુદ્દાઓને બદલે દલીલોની શ્રેણી લે છે. આ લવચીકતા ખાસ કરીને ઉપયોગી છે જ્યારે દલીલોની સંખ્યા ચલ હોય અથવા એરે સ્ત્રોતમાંથી આવે.

Node.js બેકએન્ડ ઉદાહરણમાં, આ call() સાથે બનાવેલ HTTP સર્વરમાં પદ્ધતિનો ઉપયોગ થાય છે http.createServer(). આ ઉદાહરણ દર્શાવે છે કે કેવી રીતે this HTTP વિનંતીઓને ગતિશીલ રીતે પ્રતિસાદ આપવા માટે સર્વર-સાઇડ JavaScript માં સંદર્ભને હેરફેર કરી શકાય છે. સર્વર શુભેચ્છા સાથે પ્રતિસાદ આપે છે, તે દર્શાવે છે કે કેવી રીતે call() પદ્ધતિનો સંદર્ભ બદલી શકે છે greet કાર્ય છેલ્લે, સંયુક્ત ફ્રન્ટએન્ડ અને બેકએન્ડ ઉદાહરણ બતાવે છે કે બંને કેવી રીતે call() અને apply() વધુ ગતિશીલ કાર્યમાં વાપરી શકાય છે. ઉપયોગ કરીને call() વ્યક્તિગત દલીલો સાથે અને apply() દલીલોની શ્રેણી સાથે, સ્ક્રિપ્ટ ગતિશીલ રીતે વપરાશકર્તાની વિગતો જનરેટ કરે છે, ક્લાયંટ-સાઇડ અને સર્વર-સાઇડ JavaScript ડેવલપમેન્ટ બંનેમાં આ પદ્ધતિઓના વ્યવહારુ કાર્યક્રમોનું વર્ણન કરે છે.

ફંક્શન ઇન્વોકેશન માટે JavaScriptમાં કૉલ અને એપ્લાય મેથડનો ઉપયોગ કરવો

જાવાસ્ક્રિપ્ટ ફ્રન્ટએન્ડ સ્ક્રિપ્ટ

// Example 1: Using Function.prototype.call()
const person = {
    fullName: function() {
        return this.firstName + " " + this.lastName;
    }
};
const person1 = {
    firstName: "John",
    lastName: "Doe"
};
const person2 = {
    firstName: "Jane",
    lastName: "Smith"
};
// Call the fullName method on person1 and person2
console.log(person.fullName.call(person1)); // Output: John Doe
console.log(person.fullName.call(person2)); // Output: Jane Smith

ફ્લેક્સિબલ આર્ગ્યુમેન્ટ પાસિંગ માટે Function.prototype.apply() લાગુ કરવું

જાવાસ્ક્રિપ્ટ ફ્રન્ટએન્ડ સ્ક્રિપ્ટ

// Example 2: Using Function.prototype.apply()
const person = {
    fullName: function(city, country) {
        return this.firstName + " " + this.lastName + ", " + city + ", " + country;
    }
};
const person1 = {
    firstName: "John",
    lastName: "Doe"
};
const person2 = {
    firstName: "Jane",
    lastName: "Smith"
};
// Apply the fullName method with arguments on person1 and person2
console.log(person.fullName.apply(person1, ["New York", "USA"])); // Output: John Doe, New York, USA
console.log(person.fullName.apply(person2, ["London", "UK"])); // Output: Jane Smith, London, UK

Node.js બેકએન્ડ ઉદાહરણ કૉલ અને અરજીનો ઉપયોગ કરીને

Node.js સાથે JavaScript બેકએન્ડ સ્ક્રિપ્ટ

// Load the required modules
const http = require('http');
// Create a server object
http.createServer((req, res) => {
    res.writeHead(200, {'Content-Type': 'text/plain'});
    // Example using call()
    function greet() {
        return 'Hello ' + this.name;
    }
    const user = { name: 'Alice' };
    res.write(greet.call(user)); // Output: Hello Alice
    res.end();
}).listen(3000);
console.log('Server running at http://localhost:3000/');

ડાયનેમિક ફંક્શન સાથે કૉલ અને અરજીનું સંયોજન

JavaScript સંપૂર્ણ સ્ટેક સ્ક્રિપ્ટ

// Define a function to display user details
function displayDetails(age, profession) {
    return this.name + " is " + age + " years old and works as a " + profession + ".";
}
// User objects
const user1 = { name: 'Bob' };
const user2 = { name: 'Alice' };
// Use call to invoke displayDetails
console.log(displayDetails.call(user1, 30, 'Engineer')); // Output: Bob is 30 years old and works as a Engineer.
// Use apply to invoke displayDetails
console.log(displayDetails.apply(user2, [28, 'Doctor'])); // Output: Alice is 28 years old and works as a Doctor.

JavaScript માં સંદર્ભ મેનીપ્યુલેશનની શોધખોળ

ના મૂળભૂત ઉપયોગથી આગળ call() અને apply(), વધુ જટિલ અને શક્તિશાળી કોડ બનાવવા માટે આ પદ્ધતિઓને અન્ય JavaScript સુવિધાઓ સાથે જોડી શકાય છે. ઉદાહરણ તરીકે, તેઓ ઘણીવાર સાથે જોડાણમાં વપરાય છે bind(), જે સ્પષ્ટ કરેલ સાથે નવું કાર્ય પરત કરે છે this મૂલ્ય વિપરીત call() અને apply(), જે તરત જ કાર્યને બોલાવે છે, bind() બાઉન્ડ ફંક્શન બનાવવા માટે વાપરી શકાય છે જેને સુસંગત સંદર્ભ સાથે પાછળથી કૉલ કરી શકાય છે. આ ખાસ કરીને ઇવેન્ટ હેન્ડલિંગમાં ઉપયોગી છે, જ્યાં તમે એ સુનિશ્ચિત કરવા માગો છો કે ફંક્શન ચોક્કસ ઑબ્જેક્ટના સંદર્ભને જાળવી રાખે છે ત્યારે પણ જ્યારે તે વિવિધ વાતાવરણમાં ચલાવવામાં આવે છે.

અન્ય અદ્યતન ઉપયોગ કેસમાં એક વસ્તુમાંથી બીજા સાથે ઉપયોગ કરવા માટે ઉધાર લેવાની પદ્ધતિઓનો સમાવેશ થાય છે. આનો ઉપયોગ કરીને પ્રાપ્ત કરી શકાય છે call() અથવા apply() અસ્થાયી રૂપે એક પદ્ધતિને અલગ ઑબ્જેક્ટ સાથે જોડવા માટે. ઉદાહરણ તરીકે, એરે પદ્ધતિઓ જેવી slice() અથવા push() એરે-જેવા ઑબ્જેક્ટ પર ઉધાર લઈ શકાય છે અને લાગુ કરી શકાય છે જેમ કે ફંક્શનમાં દલીલો ઑબ્જેક્ટ. આ ટેકનીક કોડની વધુ સુગમતા અને પુનઃઉપયોગીતા માટે પરવાનગી આપે છે, કારણ કે તે ડુપ્લિકેશન વગર વિવિધ ઓબ્જેક્ટમાં વહેંચવામાં પદ્ધતિઓને સક્ષમ કરે છે.

JavaScript માં કૉલ અને અરજી વિશે સામાન્ય પ્રશ્નો

વચ્ચે મુખ્ય તફાવત શું છે call() અને apply()?
મુખ્ય તફાવત એ છે કે call() દલીલોની સૂચિ સ્વીકારે છે, જ્યારે apply() દલીલોની શ્રેણી સ્વીકારે છે.
તમારે ક્યારે ઉપયોગ કરવો જોઈએ apply() ઉપર call()?
તમારે ઉપયોગ કરવો જોઈએ apply() જ્યારે તમારી પાસે દલીલોની શ્રેણી હોય અથવા ફંક્શનમાં દલીલોની ચલ સંખ્યા પસાર કરવાની જરૂર હોય.
વચ્ચે પ્રદર્શન તફાવત છે call() અને apply()?
સામાન્ય રીતે, વચ્ચે કોઈ નોંધપાત્ર પ્રભાવ તફાવતો નથી call() અને apply(). કોઈપણ તફાવતો સામાન્ય રીતે નહિવત્ હોય છે.
કરી શકે છે apply() ગણિત પદ્ધતિઓ સાથે ઉપયોગ કરી શકાય છે?
હા, apply() જેમ કે ગણિત પદ્ધતિઓમાં સંખ્યાઓની શ્રેણી પસાર કરવા માટે વાપરી શકાય છે Math.max() અથવા Math.min().
શું છે Function.prototype.bind()?
bind() એક નવું ફંક્શન બનાવે છે જે, જ્યારે બોલાવવામાં આવે છે, ત્યારે તેનું હોય છે this પ્રદાન કરેલ મૂલ્ય પર કીવર્ડ સેટ કરે છે, જ્યારે નવું ફંક્શન કૉલ કરવામાં આવે ત્યારે આપેલ કોઈપણ પૂર્વેની દલીલોના આપેલ ક્રમ સાથે.
કેવી રીતે call() ઉધાર પદ્ધતિઓનો ઉપયોગ કરવો?
તમે ઉપયોગ કરી શકો છો call() એક ઑબ્જેક્ટમાંથી પદ્ધતિઓ ઉછીના લેવા અને અન્ય ઑબ્જેક્ટ પર તેનો ઉપયોગ કરવા માટે, ફંક્શનની કૉપિ કર્યા વિના પદ્ધતિના પુનઃઉપયોગ માટે પરવાનગી આપે છે.
શું તેનો ઉપયોગ કરવો શક્ય છે call() અથવા apply() કન્સ્ટ્રક્ટર સાથે?
ના, કન્સ્ટ્રક્ટરને સીધા જ બોલાવી શકાતા નથી call() અથવા apply(). તેના બદલે, તમે ઉપયોગ કરી શકો છો Object.create() વારસાગત પેટર્ન માટે.
એરે જેવી વસ્તુઓ શું છે અને કેવી રીતે કરવું call() અને apply() તેમની સાથે કામ કરો છો?
એરે-જેવી ઑબ્જેક્ટ્સ એવી ઑબ્જેક્ટ છે કે જેમાં લંબાઈની મિલકત અને અનુક્રમિત ઘટકો હોય છે. call() અને apply() આ ઑબ્જેક્ટ્સને એરેની જેમ ચાલાકી કરવા માટે વાપરી શકાય છે.

જાવાસ્ક્રિપ્ટમાં કૉલ અને અરજીના ઉપયોગનો સારાંશ

JavaScript માં, call() અને apply() નિયંત્રિત કરવા માટે જરૂરી છે this કાર્યોની અંદર સંદર્ભ. call() વ્યક્તિગત દલીલો પસાર કરવાની મંજૂરી આપે છે, તેને જાણીતી અને નિશ્ચિત દલીલો માટે યોગ્ય બનાવે છે. વિપરીત, apply() ચલ દલીલ સૂચિઓ માટે લવચીકતા પ્રદાન કરીને દલીલોની શ્રેણી લે છે. બંને પદ્ધતિઓ કોડ પુનઃઉપયોગીતા અને ગતિશીલ ફંક્શન ઇન્વોકેશનને વધારે છે, પછી ભલે તે ફ્રન્ટએન્ડ ડેવલપમેન્ટમાં હોય કે Node.js વાતાવરણમાં. સ્વચ્છ, કાર્યક્ષમ JavaScript કોડ લખવા માટે આ પદ્ધતિઓનો અસરકારક રીતે ક્યારે અને કેવી રીતે ઉપયોગ કરવો તે સમજવું મહત્વપૂર્ણ છે.

JavaScript માં કૉલ અને અરજી વચ્ચેના તફાવતને સમજવું