Articles
Panimula sa JavaScript
Bagay na `Set`

Bagay na `Set`

Ipinaliwanag ng artikulong ito ang bagay na Set.

Ipapaliwanag namin ang bagay na Set gamit ang mga praktikal na halimbawa.

YouTube Video

Bagay na Set

Ang Set ay isang built-in na bagay na ginagamit upang humawak ng mga koleksiyon ng kakaiba at hindi nauulit na mga halaga. Pinapayagan ka nitong magsulat ng mas simpleng pagtanggal ng mga duplikado at pag-check ng pag-iral kaysa sa arrays, at pinapadali ang pagpapatupad ng mga operasyon tulad ng union at intersection.

Mga Batayan: Paggawa at Paggamit ng Set

Una, tingnan natin kung paano gumawa ng Set, magdagdag at mag-alis ng mga elemento, mag-check kung may laman, at kunin ang laki nito.

Sa ibaba ay isang pangunahing pattern na gumagawa ng bagong Set at nagpapakita ng paggamit ng add, has, delete, at size.

 1// Create a Set and demonstrate add, has, delete, and size
 2const s = new Set();
 3
 4s.add(1);
 5s.add(2);
 6s.add(2); // duplicate, ignored
 7
 8console.log(s.has(1)); // true
 9console.log(s.has(3)); // false
10
11s.delete(2);
12console.log(s.size); // 1
13
14console.log([...s]); // [1]
  • Tulad ng ipinapakita sa code na ito, awtomatikong inaalis ng Set ang mga dobleng primitive values, at makukuha mo ang bilang ng mga elemento gamit ang size.

Pamamaraan ng pag-ikot

Ang Set ay iterable, kaya maaari mo itong i-loop gamit ang for...of o forEach. Ang pagkakasunod-sunod ay ayon sa pagkakasaksak ng mga halaga.

Narito ang mga karaniwang paraan ng paggamit ng for...of at forEach.

 1// Iterate a Set with for...of and forEach
 2const s = new Set(['a', 'b', 'c']);
 3
 4for (const v of s) {
 5  console.log('for...of:', v);
 6}
 7
 8s.forEach((value, sameValue, setRef) => {
 9  // Note: second arg is same as first for Set API to match Map signature
10  console.log('forEach:', value);
11});
  • Ang callback signature para sa forEach ay value, value, set (para sa compatibility sa Map), ngunit sa praktika, kadalasan ay ang unang value lang ang kailangan.

Pagpalit sa pagitan ng Arrays at Set (kapaki-pakinabang para sa pagtanggal ng duplikado)

Dito ipinapakita ang isang simpleng paraan sa pagtanggal ng duplikado sa isang array, at paano gawing array ulit ang isang Set.

Nasa ibaba ang isang halimbawa ng pagtanggal ng duplikado mula sa array sa pamamagitan ng pagpapadaan nito sa Set.

1// Deduplicate an array using Set
2const arr = [1, 2, 2, 3, 3, 3];
3const deduped = [...new Set(arr)];
4console.log(deduped); // [1, 2, 3]
5
6// Convert a Set to an array using Array.from
7const s = new Set([4, 5, 6]);
8const arrFromSet = Array.from(s);
9console.log(arrFromSet); // [4, 5, 6]
  • Maikli at mabilis ang pattern na ito, kaya madalas itong gamitin sa pagtanggal ng duplikado sa array. Lalo itong epektibo para sa mga primitive na halaga.

Object at Paghawak ng Reference

Ang mga object sa isang Set ay kinukumpara ayon sa reference, kaya kahit pareho ang content, magkahiwalay na elemento pa rin ang magkakaibang instance.

Ipinapakita ng sumusunod na code kung ano ang nangyayari kapag nagdagdag ka ng mga object sa isang Set.

 1// Objects are compared by reference in a Set
 2const obj1 = { x: 1 };
 3const obj2 = { x: 1 };
 4
 5const s = new Set();
 6s.add(obj1);
 7s.add(obj2);
 8
 9console.log(s.size); // 2 (different references)
10console.log(s.has(obj1)); // true
11console.log(s.has({ x: 1 })); // false (different object)
  • Ang pag-detect ng duplikado sa mga object ay base sa identity ng reference, kaya kung gusto mong tanggalin ang duplikado base lang sa laman ng object, kailangan mo itong i-serialize o bigyan ng ibang proseso.

Espesyal na Halaga: Pag-handle ng NaN at -0/+0

Gumagamit ang Set ng tuntunin ng Same-value-zero bilang pamantayan ng pagkakapareho ng halaga. Ang paraan ng paghahambing na ito ay may mga sumusunod na katangian para sa mga numero:.

  • Ang NaN ay itinuturing na katumbas ng NaN.
  • Ang positibong +0 at negatibong -0 ay hindi pinagkaiba at itinuturing na iisang halaga lamang.

Kaya kapag inilagay mo ang mga halagang ito sa isang Set, ito ang nagaganap:.

 1// NaN and zero behavior in Set
 2const s = new Set();
 3
 4s.add(NaN);
 5s.add(NaN);
 6console.log(s.size); // 1 (NaN considered the same)
 7
 8s.add(+0);
 9s.add(-0);
10console.log(s.size); // still 2 (NaN + 0)
11console.log([...s]); // [NaN, 0] (order may vary but only one zero)
  • Sa normal na paghahambing (NaN === NaN), nagbabalik ito ng false, ngunit sa loob ng isang Set, lahat ng NaN ay itinuturing na 'parehong halaga'.
  • Maaaring pag-iba ng matematika ang +0 at -0, ngunit sa isang Set, pareho lamang silang kinikilala bilang 0.
  • Bilang resulta, isa lang NaN at isang 0 ang natitira sa Set.
  • Kapareho ng tuntunin ng Set ang kay Object.is, ngunit hindi ganap na magkapareho. Ang Object.is(+0, -0) ay nagbabalik ng false, ngunit sa Set, magkakapareho lang ang turing sa kanila. Paki-tandaan ang pagkakaibang ito.

Karaniwang Gamit: Mga Operasyon ng Set (Union, Intersection, Difference)

Mas malinaw na maisusulat ang mga operasyon ng set gamit ang Set. Sa ibaba ay mga karaniwang halimbawa ng pagpapatupad.

Narito ang mga halimbawa ng mga function para sa union, intersection, at difference.

 1// Set operations: union, intersection, difference
 2function union(a, b) {
 3  return new Set([...a, ...b]);
 4}
 5
 6function intersection(a, b) {
 7  return new Set([...a].filter(x => b.has(x)));
 8}
 9
10function difference(a, b) {
11  return new Set([...a].filter(x => !b.has(x)));
12}
13
14// Demo
15const A = new Set([1, 2, 3]);
16const B = new Set([3, 4, 5]);
17
18console.log('union', [...union(A, B)]); // [1,2,3,4,5]
19console.log('intersection', [...intersection(A, B)]); // [3]
20console.log('difference A\\B', [...difference(A, B)]); // [1,2]
  • Maaaring isulat nang simple ang mga operasyon ng set sa pamamagitan ng mga filter na pinagsasama ang Set at mga array. Kapag malalaki ang dataset, napapabilis ang mga operasyon dahil sa O(1) performance ng has.

Praktikal na Halimbawa: Paghahanap ng Pagkakaiba ng mga Array (Pagtukoy ng Nadagdag/Nabawas na Mga Item)

Ipinapakita ng sumusunod na halimbawa kung paano gumamit ng Set upang matukoy ang kaibahan ng dalawang array (isang lumang listahan at isang bago). Pinapayagan ka nitong tukuyin kung aling mga elemento ang nadagdag at alin ang natanggal.

 1// Find added and removed items between two arrays
 2function diffArrays(oldArr, newArr) {
 3  const oldSet = new Set(oldArr);
 4  const newSet = new Set(newArr);
 5
 6  const added = [...newSet].filter(x => !oldSet.has(x));
 7  const removed = [...oldSet].filter(x => !newSet.has(x));
 8
 9  return { added, removed };
10}
11
12const oldList = [1, 2, 3];
13const newList = [2, 3, 4, 5];
14
15console.log(diffArrays(oldList, newList));
16// { added: [4,5], removed: [1] }
  • Napaka-kombinyente ng pamamaraang ito para makita ang pagkakaiba ng mga ID list, tag list, at iba pang kahalintulad na kaso. Pinaka-madaling gamitin ito kapag mga primitive na halaga ang laman.

Pagkaiba ng WeakSet at Set (Pamamahala ng Memorya)

Ang WeakSet ay katulad ng Set, ngunit gumagamit ito ng weak references, kaya pwedeng ma-garbage collect ang mga items nito. Ang sumusunod ay nagpapakita ng mga batayang paggamit ng WeakSet.

1// WeakSet basics (objects only, not iterable)
2const ws = new WeakSet();
3let obj = { id: 1 };
4ws.add(obj);
5
6console.log(ws.has(obj)); // true
7
8obj = null; // Now the object is eligible for GC; WeakSet won't prevent collection

Tanging mga object lamang ang puwedeng lamanin ng WeakSet at hindi ito puwedeng i-iterate. Narito ang mga halimbawa ng mga limitasyon ng WeakSet—tanging mga object lamang ang laman at hindi ito puwedeng i-iterate.

 1// WeakSet basics (objects only, not iterable)
 2const ws = new WeakSet();
 3
 4// --- Only objects can be added ---
 5try {
 6	ws.add(1); // number
 7} catch (e) {
 8	console.log("Error: WeakSet can only store objects. Adding a number is not allowed.");
 9}
10
11try {
12	ws.add("text"); // string
13} catch (e) {
14	console.log("Error: WeakSet can only store objects. Adding a string is not allowed.");
15}
16
17// --- WeakSet is not iterable ---
18try {
19	for (const value of ws) {
20		console.log(value);
21	}
22} catch (e) {
23	console.log("Error: WeakSet is not iterable. You cannot use for...of to loop over its elements.");
24}
25
26// --- Cannot convert to array ---
27try {
28	console.log([...ws]);
29} catch (e) {
30	console.log("Error: WeakSet cannot be converted to an array because it does not support iteration.");
31}
32
33// The object becomes eligible for garbage collection
34let obj = { id: 1 };
35ws.add(obj);
36obj = null;
  • Magagamit ang WeakSet para pansamantalang subaybayan ang pag-iral ng mga object, ngunit hindi mo maaaring isa-isahin ang laman nito o kunin ang laki.

Performance at Pagpili Kung Kailan Dapat Gamitin

Kapag nagpapasya kung gagamit ng Set, mahalagang maintindihan ang performance nito at ang katangian ng iyong data.

  • Karaniwan, ang has, add, at delete ay gumagana sa halos O(1) na bilis. Kaya sa mga sitwasyon na madalas kang nagche-check ng pagkakaroon o nag-aalis ng duplikado, mas mainam gamitin ang Set kaysa sa array.
  • Mag-ingat kung nais mong tanggalin ang duplikado ng mga object base sa laman (halaga) nila. Kung reference ang batayan ng paghahambing ng Set, subukan gumamit ng IDs o iba pang susi, o kaya'y iserialize ang mga object bilang primitive value bago ilagay sa Set kung halaga ang basehan ng paghahambing.
  • Lalo nang kapaki-pakinabang ang Set para mapaganda ang readability ng code para sa maliliit hanggang katamtamang laki ng koleksiyon. Sa kabilang banda, kung sobrang dami ng elemento ang hahawakan mo o madalas kang nagko-convert sa pagitan ng arrays at Set, inirerekomendang mag-benchmark at mag-test muna.

Karaniwang Pagkakamali

Maginhawa ang Set, ngunit kung hindi mo alam ang detalye ng gamit nito, maaari kang malito sa mga hindi inaasahang kilos. Narito ang ilang mahalagang bagay na dapat bantayan:.

  • Ang mga object ay kinukumpara sa pamamagitan ng reference, kaya kahit pareho ang laman, hindi pa rin duplikado ang magkahiwalay na object.
  • Ang Set ay nagpapanatili ng pagkakasunod ng ipinasok, ngunit hindi mo pwedeng i-access ang mga elemento gamit ang index gaya ng sa array. Kung gusto mong mag-access gamit ang index, gawing array muna ang Set.
  • Hindi maaaring isa-isahin ang WeakSet, at tanging mga object lang ang pwede nitong lamanin. Tandaan na limitado ang gamit nito.
  • Ang NaN ay turing na parehong halaga, at hindi pinag-iba ang +0 at -0. Dahil ito sa Same-value-zero na tuntunin sa paghahambing.

Buod

Ang Set ay isang maginhawang istruktura ng datos na nagbibigay-daan na humawak ng koleksiyon ng kakaibang mga halaga sa madaling paraan. Pwede mo itong gamitin upang tanggalin ang duplikado sa arrays, mabilis na mag-check ng pag-iral, o gumawa ng mga operasyon ng set tulad ng union at intersection gamit ang simple at madaling basahing code.

Sa kabilang banda, dahil reference ang basehan ng paghahambing ng objects, kailangan pa ng karagdagang hakbang kung paghahambingin mo ang laman lang nila.

Kapag nauunawaan mo ang mga katangiang ito at ginagamit ng tama, nagiging malakas na pagpipilian ang Set para mapahusay ang readability at maintainability ng code mo.

Maaari mong sundan ang artikulo sa itaas gamit ang Visual Studio Code sa aming YouTube channel. Paki-check din ang aming YouTube channel.

YouTube Video

Bagay na `Map``Date` na Bagay