"यदि कोई कर्मचारी अपना काम अच्छी तरह से करना चाहता है, तो उसे पहले अपने औजारों को तेज करना होगा।" - कन्फ्यूशियस, "द एनालेक्ट्स ऑफ कन्फ्यूशियस। लू लिंगगोंग"
मुखपृष्ठ > प्रोग्रामिंग > जावास्क्रिप्ट में कार्यात्मक प्रोग्रामिंग का परिचय: लेंस #9

जावास्क्रिप्ट में कार्यात्मक प्रोग्रामिंग का परिचय: लेंस #9

2024-08-06 को प्रकाशित
ब्राउज़ करें:697

Introduction to Functional Programming in JavaScript: Lenses #9

लेंस कार्यात्मक प्रोग्रामिंग में अपरिवर्तनीय डेटा संरचनाओं के हिस्सों पर ध्यान केंद्रित करने और उनमें हेरफेर करने का एक शक्तिशाली और सुरुचिपूर्ण तरीका है। वे मूल डेटा को परिवर्तित किए बिना नेस्टेड ऑब्जेक्ट या सरणियों के भीतर मान प्राप्त करने और सेट करने के लिए एक तंत्र प्रदान करते हैं।

लेंस क्या हैं?

एक लेंस एक प्रथम श्रेणी का अमूर्त है जो डेटा संरचना के हिस्सों तक पहुंचने और अद्यतन करने का एक तरीका प्रदान करता है। एक लेंस को आम तौर पर दो कार्यों द्वारा परिभाषित किया जाता है: एक गेटर और एक सेटर।

  • गेटर: एक फ़ंक्शन जो डेटा संरचना से एक मान निकालता है।
  • सेटर: एक फ़ंक्शन जो डेटा संरचना के भीतर एक मान को अद्यतन करता है और संरचना की एक नई प्रति लौटाता है।

लेंस अपरिवर्तनीय डेटा संरचनाओं के साथ काम करने के लिए विशेष रूप से उपयोगी होते हैं, क्योंकि वे मूल डेटा को परिवर्तित किए बिना परिवर्तन करने की अनुमति देते हैं।

लेंस के लाभ

  1. अपरिवर्तनीयता: लेंस अपरिवर्तनीय डेटा संरचनाओं के साथ काम करने की सुविधा प्रदान करते हैं, यह सुनिश्चित करते हुए कि मूल डेटा संशोधित नहीं है।
  2. मॉड्यूलैरिटी: लेंस आपको डेटा एक्सेस और अपडेट को मॉड्यूलर करने की अनुमति देते हैं, जिससे आपका कोड अधिक पुन: प्रयोज्य और बनाए रखने में आसान हो जाता है।
  3. कंपोजिबिलिटी: डेटा संरचना के नेस्टेड भागों पर ध्यान केंद्रित करने के लिए लेंस की रचना की जा सकती है, जिससे जटिल डेटा हेरफेर को सरल, कंपोजिट ऑपरेशन में विभाजित किया जा सकता है।

जावास्क्रिप्ट में लेंस लागू करना

आइए जावास्क्रिप्ट में लेंस के बुनियादी कार्यान्वयन से शुरुआत करें।

बुनियादी लेंस कार्यान्वयन

एक लेंस को प्राप्त और सेट विधियों के साथ एक ऑब्जेक्ट के रूप में कार्यान्वित किया जा सकता है।

const lens = (getter, setter) => ({
  get: (obj) => getter(obj),
  set: (val, obj) => setter(val, obj),
});

const prop = (key) => lens(
  (obj) => obj[key],
  (val, obj) => ({ ...obj, [key]: val })
);

// Usage
const user = { name: 'Alice', age: 30 };

const nameLens = prop('name');

const userName = nameLens.get(user);
console.log(userName); // 'Alice'

const updatedUser = nameLens.set('Bob', user);
console.log(updatedUser); // { name: 'Bob', age: 30 }

इस उदाहरण में, प्रोप एक लेंस बनाता है जो किसी वस्तु की विशिष्ट संपत्ति पर ध्यान केंद्रित करता है। प्राप्त विधि संपत्ति के मूल्य को पुनः प्राप्त करती है, और सेट विधि मूल्य को अद्यतन करती है और एक नई वस्तु लौटाती है।

लेंस रचना

लेंस को नेस्टेड डेटा संरचनाओं के साथ काम करने के लिए तैयार किया जा सकता है। यहां, हम लेंस बनाने के लिए एक उपयोगिता बनाएंगे।

const composeLenses = (outerLens, innerLens) => ({
  get: (obj) => innerLens.get(outerLens.get(obj)),
  set: (val, obj) => outerLens.set(innerLens.set(val, outerLens.get(obj)), obj),
});

// Usage with nested data
const addressLens = prop('address');
const cityLens = prop('city');

const userAddressCityLens = composeLenses(addressLens, cityLens);

const user = {
  name: 'Alice',
  address: {
    city: 'Wonderland',
    zip: '12345',
  },
};

const userCity = userAddressCityLens.get(user);
console.log(userCity); // 'Wonderland'

const updatedUser = userAddressCityLens.set('Oz', user);
console.log(updatedUser); // { name: 'Alice', address: { city: 'Oz', zip: '12345' } }

इस उदाहरण में, कंपोज़लेंस हमें एक लेंस बनाने की अनुमति देता है जो एड्रेस ऑब्जेक्ट के अंदर शहर की संपत्ति पर केंद्रित होता है। यह नेस्टेड प्रॉपर्टी एक्सेस और अपडेट को मॉड्यूलर और पुन: प्रयोज्य तरीके से सक्षम बनाता है।

लेंस के व्यावहारिक अनुप्रयोग

लेंस उन परिदृश्यों में विशेष रूप से उपयोगी होते हैं जहां अपरिवर्तनीयता और मॉड्यूलर डेटा हेरफेर महत्वपूर्ण होते हैं, जैसे फ्रंट-एंड अनुप्रयोगों के लिए राज्य प्रबंधन में।

प्रतिक्रिया में राज्य का प्रबंधन

रिएक्ट एप्लिकेशन में, लेंस का उपयोग राज्य अपडेट को अधिक कार्यात्मक और पूर्वानुमानित तरीके से प्रबंधित करने के लिए किया जा सकता है।

import React, { useState } from 'react';

const App = () => {
  const [state, setState] = useState({
    user: {
      name: 'Alice',
      address: {
        city: 'Wonderland',
      },
    },
  });

  const userLens = prop('user');
  const addressLens = prop('address');
  const cityLens = prop('city');

  const userAddressCityLens = composeLenses(userLens, composeLenses(addressLens, cityLens));

  const updateCity = (newCity) => {
    const newState = userAddressCityLens.set(newCity, state);
    setState(newState);
  };

  return (
    

City: {userAddressCityLens.get(state)}

); }; export default App;

इस उदाहरण में, हम रिएक्ट घटक की स्थिति के भीतर नेस्टेड शहर की संपत्ति की पहुंच और अद्यतन को मॉड्यूलर करने के लिए लेंस का उपयोग करते हैं। यह दृष्टिकोण राज्य अपडेट को अधिक पूर्वानुमानित और प्रबंधित करने में आसान बनाता है।

विज्ञप्ति वक्तव्य यह आलेख यहां पुन: प्रस्तुत किया गया है: https://dev.to/francescoagati/introduction-to-functional-programming-in-javascript-lenses-9-3217?1 यदि कोई उल्लंघन है, तो कृपया हटाने के लिए स्टडी_गोलंग@163.com पर संपर्क करें यह
नवीनतम ट्यूटोरियल अधिक>

चीनी भाषा का अध्ययन करें

अस्वीकरण: उपलब्ध कराए गए सभी संसाधन आंशिक रूप से इंटरनेट से हैं। यदि आपके कॉपीराइट या अन्य अधिकारों और हितों का कोई उल्लंघन होता है, तो कृपया विस्तृत कारण बताएं और कॉपीराइट या अधिकारों और हितों का प्रमाण प्रदान करें और फिर इसे ईमेल पर भेजें: [email protected] हम इसे आपके लिए यथाशीघ्र संभालेंगे।

Copyright© 2022 湘ICP备2022001581号-3