Rumah  >  Artikel  >  hujung hadapan web  >  Jadikan hidup anda lebih mudah dengan Set Komposisi

Jadikan hidup anda lebih mudah dengan Set Komposisi

WBOY
WBOYasal
2024-08-21 06:17:32496semak imbas

Akhir sekali! Apabila Set diperkenalkan pada masa lalu ia sudah menjadikan hidup kita lebih baik. Kami dapat menjana senarai unik dengan mudah, tetapi juga mempunyai prestasi yang lebih baik dalam mencari dan menetapkan item pada senarai tersebut.

Itu bagus, tetapi kami masih kehilangan beberapa perkara yang dimiliki oleh bahasa lain. Dan ini benar, kerana kita pernah. Dengan kaedah gubahan baharu ditambahkan pada Set pada 2024, akhirnya kami akan dapat melakukan penyatuan, persilangan, perbezaan dan banyak lagi dengan panggilan mudah.

Tanpa berlengah-lengah lagi, mari teruskan.

Perbezaan

Mengembalikan Set baharu yang mengandungi elemen yang wujud dalam Set pertama tetapi tidak dalam Set kedua.

Make your life easier with Set Compositions

Contoh: Anda ingin melihat pengguna yang melawat tapak pada minggu ini yang tidak melawati bulan lepas.

Bagaimana cara menggunakannya?

const thisWeekUsers = new Set([1, 2, 3, 4]);
const lastMonthUsers = new Set([3, 4, 5, 6]);

const newUsers = thisWeekUsers.difference(lastMonthUsers);

console.log(newUsers); // Set(2) { 1, 2 }

Bagaimanakah kita akan melakukannya pada masa lalu?

const thisWeekUsers = [1, 2, 3, 4];
const lastMonthUsers = [3, 4, 5, 6];

let newUsers = thisWeekUsers.filter(x => !lastMonthUsers.includes(x));

console.log(newUsers); // (2) [1,2]

Ketahui lebih lanjut di: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set/difference


persimpangan

Mengembalikan Set baharu dengan hanya nilai yang terdapat dalam kedua-dua Set.

Make your life easier with Set Compositions

Contoh: Anda menambahkan berkas e-buku pada troli, tetapi anda sudah mempunyai beberapa buku tersebut di sana.

Bagaimana cara menggunakannya?

const booksBundle = new Set([1, 2, 3, 4]);
const cart = new Set([3, 4, 5, 6]);

const booksToAdd = booksBundle.intersection(cart);

console.log(booksToAdd); // Set(2) { 3, 4 }

Bagaimanakah kita akan melakukannya pada masa lalu?

const booksBundle = [1, 2, 3, 4];
const cart = [3, 4, 5, 6];

const booksToAdd = booksBundle.filter(book => cart.includes(book));

console.log(booksToAdd); // (2) [3, 4]

Ketahui lebih lanjut di: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set/intersection


Perbezaan simetri

Mengembalikan Set baharu dengan nilai yang tidak berulang dalam kedua-dua kumpulan.

Make your life easier with Set Compositions

Contoh: Menyemak item yang terlebih stok antara kedai untuk menyemak item yang boleh ditukar.

Bagaimana cara menggunakannya?

const firstStore = new Set([1, 2, 3, 4]);
const secondStore = new Set([3, 4, 5, 6]);

const overstockedItems = firstStore.symmetricDifference(secondStore);

console.log(overstockedItems); // Set(4) { 1, 2, 5, 6 }

Bagaimanakah kita akan melakukannya pada masa lalu?

const firstStore = [1, 2, 3, 4];
const secondStore = [3, 4, 5, 6];

const allItems = [firstStore, secondStore].flat();
const overstockedItems = allItems.filter(item => {
  return !firstStore.includes(item) || !secondStore.includes(item);
});

console.log(overstockedItems); // (4) [1, 2, 5, 6]

Ketahui lebih lanjut di: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set/symmetricDifference


Kesatuan

Mengembalikan Set baharu dengan nilai daripada kedua-dua kumpulan tetapi tanpa mengulangi sebarang nilai.

Make your life easier with Set Compositions

Contoh: Anda dan rakan anda ingin menggabungkan senarai main, tetapi sesetengah muzik adalah sama.

Bagaimana cara menggunakannya?

const yourPlaylist = new Set([1, 2, 3, 4]);
const friendPlaylist = new Set([3, 4, 5, 6]);

const mergedPlaylist = yourPlaylist.union(friendPlaylist);

console.log(mergedPlaylist); // Set(6) { 1, 2, 3, 4, 5, 6 }

Bagaimanakah kita akan melakukannya pada masa lalu?

const yourPlaylist = [1, 2, 3, 4];
const friendPlaylist = [3, 4, 5, 6];

const mergedPlaylist = new Set([yourPlaylist, friendPlaylist].flat());

console.log(mergedPlaylist); // (6) [1, 2, 3, 4, 5, 6]

Ketahui lebih lanjut di: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set/union


Adakah Disjoint From?

Ia mengembalikan Boolean. Ia adalah benar jika kedua-dua Set tidak mempunyai nilai yang sama dan palsu jika mereka mempunyai sekurang-kurangnya satu nilai yang sama.

Make your life easier with Set Compositions

Contoh: Lihat ada produk yang merupakan sebahagian daripada kumpulan lain.

Bagaimana cara menggunakannya?

const electronics = new Set([1, 2, 3, 4]);
const furniture = new Set([3, 4, 5, 6]);
const groceries = new Set(['apple']);

console.log(electronics.isDisjointFrom(furniture)); // false
console.log(electronics.isDisjointFrom(groceries)); // true

Bagaimanakah kita akan melakukannya pada masa lalu?

const electronics = [1, 2, 3, 4];
const furniture = [3, 4, 5, 6];
const groceries = ['apple'];

function isDisjoint(array1, array2) {
  return array1.every(item => !array2.includes(item));
}

console.log(isDisjoint(electronics, furniture)); // false
console.log(isDisjoint(electronics, groceries)); // true

Ketahui lebih lanjut di: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set/isDisjointFrom


Adakah Superset/Subset Daripada?

Kedua-dua fungsi ini sangat serupa. Kedua-duanya mengembalikan nilai Boolean, dan bertentangan langsung. Superset akan kembali benar jika Set ialah superset yang lain dan Subset akan kembali benar jika Set ialah subset yang lain.

Saya menyusun fungsi tersebut kerana mengetahui jawapan kepada salah satu daripadanya sudah cukup untuk mengetahui yang lain. Satu Set hanya boleh menjadi superset Set subset.

Make your life easier with Set Compositions

Contoh: Fahami sama ada pengguna adalah sebahagian daripada kumpulan syarikat.

Bagaimana cara menggunakannya?

const itDepartment = new Set([1, 2, 3, 4]);
const genZFromToronto = new Set([3, 4]);

console.log(itDepartment.isSupersetOf(genZFromToronto)); // true
console.log(genZFromToronto.isSubsetOf(itDepartment)); // true

Bagaimanakah kita akan melakukannya pada masa lalu?

const itDepartment = [1, 2, 3, 4];
const genZFromToronto = [3, 4];

console.log(genZFromToronto.every(item => itDepartment.includes(item))); // true

Ketahui lebih lanjut di:

  • https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set/isSupersetOf
  • https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set/isSubsetOf

Sekarang anda sudah bersedia Saya tidak menyesal untuk menggunakannya dalam projek anda!

Beri tahu saya jika anda juga teruja dengannya, ciri lain atau ingin melihat sesuatu yang lain dilindungi. Sehingga lain kali o/

Atas ialah kandungan terperinci Jadikan hidup anda lebih mudah dengan Set Komposisi. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn