जुलाई 2023 में, ईसीएमएस्क्रिप्ट ने जावास्क्रिप्ट के लिए कई नए विनिर्देश जारी किए। कुछ विशेषताओं में नई ऐरे विधियाँ शामिल हैं जो मौजूदा ऐरे को संशोधित नहीं करती हैं। इस ब्लॉग में, हम उनमें से तीन (एक 2024 से) के बारे में बात करेंगे, जो आपको जानना चाहिए यदि आप वेब और जावास्क्रिप्ट में नवीनतम रुझानों के साथ अपडेट रहना चाहते हैं !

Array.toSorted()

मूल Array.sort() एक सरणी के तत्वों को सॉर्ट करता है इन-प्लेस। कभी-कभी आप यह व्यवहार नहीं चाहेंगे. प्रोग्रामिंग में, मौजूदा मानों को संशोधित करने से बचना और इसके बजाय एक नया संस्करण लौटाना आम तौर पर एक अच्छा अभ्यास है।

Array.toSorted() कॉलबैक फ़ंक्शन में वर्णित अनुसार क्रमबद्ध तत्वों के साथ एक नई सरणी लौटाकर इस समस्या को हल करता है!

मुझे यह सुविधा विशेष रूप से पसंद है क्योंकि VSCode और वेब ब्राउज़र के पास इसके लिए उचित समर्थन होने से बहुत पहले ही मैंने इसे अपने कोड में उपयोग करना शुरू कर दिया था!

let numbers = [4, 2, 1, 3];
let sortedNumbers = numbers.toSorted();
console.log(sortedNumbers); // Output: [1, 2, 3, 4]

Array.toReversed()

Array.toReversed() एक नया जोड़ है जो किसी सरणी को उलटने का एक अपरिवर्तनीय तरीका प्रदान करता है। Array.reversed() के विपरीत, जो मूल सरणी को संशोधित करता है, Array.toReversed() मूल को अपरिवर्तित छोड़कर, सरणी की उलटी प्रतिलिपि लौटाता है।

let letters = ['a', 'b', 'c', 'd'];
let reversedLetters = letters.toReversed();
console.log(reversedLetters); // Output: ['d', 'c', 'b', 'a']
console.log(letters); // Output: ['a', 'b', 'c', 'd']

ऐरे.टूस्प्लिस्ड()

Array.toSpliced() किसी सरणी के भीतर तत्वों को हटाने, बदलने या जोड़ने का एक गैर-विनाशकारी तरीका प्रदान करता है। पारंपरिक Array.splice() सीधे सरणी को संशोधित करता है, लेकिन Array.toSpliced() लागू किए गए परिवर्तनों के साथ एक नई सरणी बनाता है, जिससे मूल सरणी अपरिवर्तित रह जाती है। यह तब फायदेमंद हो सकता है जब आपको स्रोत डेटा को प्रभावित किए बिना परिवर्तन लागू करने की आवश्यकता हो।

let numbers = [1, 2, 3, 4, 5];
let splicedNumbers = numbers.toSpliced(1, 2, 6, 7);
console.log(splicedNumbers); // Output: [1, 6, 7, 4, 5]
console.log(numbers); // Output: [1, 2, 3, 4, 5]

ऑब्जेक्ट.ग्रुपबाय()

यह विधि आधिकारिक तौर पर ES2024 में जारी की गई थी, लेकिन पॉलीफ़िल के साथ पहले भी उपलब्ध थी और ECMAScript के बाद के चरण में पहले ही उन्नत हो चुकी थी।

Object.groupBy() किसी विशिष्ट ऑब्जेक्ट प्रॉपर्टी के आधार पर दिए गए ऐरे के आइटम को समूहित करता है। यह बेहद उपयोगी है और तब बहुत काम आ सकता है जब आप वस्तुओं की एक निश्चित सूची को समूहीकृत करना चाहते हैं और फिर कुंजी-मूल्य संरचना के अनुसार उन पर पुनरावृत्ति करना चाहते हैं। इस विधि के बारे में एक दिलचस्प तथ्य यह है कि इसे वेब संगतता समस्याओं के कारण किसी सरणी के प्रोटोटाइप विधि के रूप में लागू नहीं किया गया था। (कई पुरानी जावास्क्रिप्ट लाइब्रेरी पहले से ही Array.prototype.group() नेमस्पेस के भीतर कुछ कोड लागू कर रही थीं, इसीलिए!)

बोनस: अनेक तत्वों के आधार पर समूह बनाने के लिए अपना स्वयं का object.groupBy() लागू करना

आखिरकार, आपको कई संपत्तियों के आधार पर समूह बनाने की भी आवश्यकता हो सकती है। मूल object.groupBy() समूह केवल एक स्तर पर हैं।

तत्वों को एकाधिक गुणों के आधार पर समूहित करने के लिए अपने प्रोजेक्ट में नीचे दिए गए कोड को लागू करें!

function multiLevelGroupBy(array, criteria) {
  // Base case: if no criteria are left, return the array itself
  if (criteria.length === 0) return array;

  // Get the first criterion
  const [firstCriterion, ...remainingCriteria] = criteria;

  // Group by the first criterion
  const grouped = array.reduce((acc, item) => {
    const key = firstCriterion(item);
    if (!acc[key]) acc[key] = [];
    acc[key].push(item);
    return acc;
  }, {});

  // For each group, recursively apply the remaining criteria
  for (let key in grouped) {
    grouped[key] = multiLevelGroupBy(grouped[key], remainingCriteria);
  }

  return grouped;
}

उदाहरण:

const data = [
  { country: 'USA', state: 'California', city: 'Los Angeles', name: 'John' },
  { country: 'USA', state: 'California', city: 'San Francisco', name: 'Alice' },
  { country: 'USA', state: 'New York', city: 'New York City', name: 'Bob' },
  { country: 'Canada', state: 'Ontario', city: 'Toronto', name: 'Carol' },
  { country: 'Canada', state: 'Quebec', city: 'Montreal', name: 'Dave' },
]

let groupedData = multiLevelGroupBy(data, [
  item => item.country,
  item => item.state,
  item => item.city
]);

console.log(groupedData);

/* Expected Output: */
{
  USA: {
    California: {
      'Los Angeles': [{ country: 'USA', state: 'California', city: 'Los Angeles', name: 'John' }],
      'San Francisco': [{ country: 'USA', state: 'California', city: 'San Francisco', name: 'Alice' }]
    },
    New York: {
      'New York City': [{ country: 'USA', state: 'New York', city: 'New York City', name: 'Bob' }]
    }
  },
  Canada: {
    Ontario: {
      Toronto: [{ country: 'Canada', state: 'Ontario', city: 'Toronto', name: 'Carol' }]
    },
    Quebec: {
      Montreal: [{ country: 'Canada', state: 'Quebec', city: 'Montreal', name: 'Dave' }]
    }
  }
}

अंत!

यदि आप इस लेख के अंत तक पहुंच गए हैं, तो पढ़ने के लिए बहुत-बहुत धन्यवाद! ?