Qu'est-ce qui est défini en JavaScript ? Quand l'utiliser ? Comment utiliser ?

Javascript nécessite l'utilisation de Set dans certains cas. L'article suivant vous amènera à comprendre Set, à présenter ce qu'est Set, quand utiliser Set et les opérations sur les données de Set (intersection, ensemble de différences, intersection, ensemble de différences symétriques).

Dans de nombreux cas, il est nécessaire de comparer plusieurs listes et d'obtenir si elles ont une intersection ou une différence, etc. Il existe un type de données en Javascript qui peut bien répondre à ces besoins, c'est-à-dire Set .

SetUn objet est comme un tableau, mais ne contient que des éléments uniques. SetUn objet est une collection de valeurs et ses éléments peuvent être itérés par ordre d'insertion. Les éléments de Set n'apparaîtront qu'une seule fois, c'est-à-dire que les éléments de Set sont uniques.

L'adresse du code impliquée dans l'article : https://codepen.io/quintiontang/pen/rNmNbbY

Qu'est-ce que Set

Set Un objet est une collection de valeurs, et ses éléments peuvent être itérés dans l'ordre d'insertion. Il n'apparaîtra qu'une seule fois, c'est-à-dire que Set est un ensemble de valeurs uniques qui sont stockées sans ordre particulier. Contrairement à d'autres types de collections tels que les piles, les files d'attente et les tableaux, les ensembles peuvent être utilisés pour des comparaisons de listes et pour détecter la présence d'un élément dans un ensemble.

Set est un type de données abstrait défini par son comportement, similaire aux structures de données de pile et de file d'attente. Ceci est similaire à key-key en raison des propriétés de Map.

Javascript Set

Set en Javascript est très basique et simple, il ne fournit pas de fonctionnalité générale de manipulation d'ensembles comme les autres langages. Il utilise un algorithme unique (non basé sur une égalité stricte ===) pour détecter si les éléments sont identiques.

Cela signifie que le stockage de undefined, null et NaN dans une collection ne sera stocké qu'une seule fois, même pour NaN !== NaN, ce qui s'applique généralement au stockage de types d'objets.

const setTest = new Set([0, -0, Infinity,null, undefined, null, NaN, NaN, Infinity,null]);
console.log(setTest);  // Set { 0, Infinity, null, undefined, NaN }

Les conclusions suivantes peuvent être tirées des résultats d'exécution ci-dessus :

• Bien que NaN et NaN ne soient pas égaux, il n'y aura qu'un Set
• et undefined dans l'ensemble Infinity. En gros, il n'y en aura qu'un Set
.

L'utilisation de Set ne sera pas présentée dans cet article. Vous pouvez vous référer au site

mozilla.

Quand utiliser Set

Lorsque vous devez comparer des listes spécifiques et juger si elles sont égales, vous pouvez utiliser

Décrivons les occasions applicables, principalement les opérations d'ensemble dans les données : Set

Obtenez deux ensembles. union de
• union
Obtient la différence entre deux ensembles
• difference
Obtient l'intersection de deux ensembles
• intersection
Obtient la différence symétrique entre deux ensembles
• intersectionDifference
Juge si deux ensembles sont des sous-ensembles
• isSubset
Juge deux Si l'ensemble est un surensemble
• isSuperset

Ce qui suit présentera les opérations liées de

dans ces trois situations. Set

OpérationsSet

En mathématiques, chaque fois que l'on parle d'ensembles, certaines opérations peuvent être effectuées. En fait,

est l'implémentation informatique d'ensembles mathématiques finis. Set

Afin de mieux démontrer les opérations

dans le code, l'exemple de code étendra Javascript Set pour hériter de ses propriétés et méthodes, et y ajoutera d'autres méthodes. Set

Pour l'exemple de code, seule une méthode simple est utilisée pour vérifier s'il s'agit d'une collection valide qui n'est pas vide. L'opération

class SetHelper extends Set {
    /**
     * 验证集合是否为有效集合
     * @param {*} set
     * @returns
     */
    _isValid = (set) => {
        return set && set instanceof Set && set.size > 0;
    };
}

Union union

combinera plusieurs union objets et renverra le résultat combiné. L'implémentation fusionne l'ensemble actuel et l'ensemble donné dans un tableau et le crée, renvoyant ainsi un nouvel ensemble. Set

union(set) {
    if (!this._isValid(set)) return new SetHelper();
    return new SetHelper([...this, ...set]);
}

Ensemble de différences difference

L'opération renverra un nouvel ensemble qui contient uniquement des éléments qui sont dans un ensemble et pas dans l'autre ensemble, c'est-à-dire le concept mathématique d'ensemble de différences. L'opération difference

difference(set) {
    if (!this._isValid(set)) return new SetHelper();
    const differenceSet = new SetHelper();
    this.forEach((item) => {
        !set.has(item) && differenceSet.add(item);
    });
    return differenceSet;
}

intersection intersection

renvoie une nouvelle collection contenant uniquement des éléments communs aux deux collections. L'implémentation parcourra la plus petite collection (en évitant les vérifications inutiles) et vérifiera si chaque élément existe dans la plus grande collection et l'ajoutera à l'intersection, qui sera renvoyée une fois le parcours terminé. L'opération intersection

intersection(set) {
    const intersectionSet = new SetHelper();
    if (!this._isValid(set)) return intersectionSet;
    const [smallerSet, biggerSet] =
        set.size <= this.size ? [set, this] : [this, set];
    smallerSet.forEach((item) => {
        biggerSet.has(item) && intersectionSet.add(item);
    });
    return intersectionSet;
}

Ensemble de différences symétriques intersectionDifference

renverra un nouvel ensemble contenant tous les éléments des deux ensembles qui n'ont pas d'intersection. intersectionDifference

intersectionDifference(set) {
    if (!this._isValid(set)) return new SetHelper();
    return new SetHelper([
        ...this.difference(set),
        ...set.difference(this),
    ]);
}

sous-ensemble subset

isSubset 操作将判断两个集合是否为子集关系（当一个集合的所有项都包含在另一个集合中时）。实现上首先检查两个集合的大小，如果一个集合更大，则它不能是另一个集合的子集，然后对于每个项目，它检查它是否存在于另一个中。

isSubset(set) {
    if (!this._isValidSet(set)) return false;
    return (
        this.size <= set.size && [...this].every((item) => set.has(item))
    );
}

超集 superset

isSuperset 操作将判断两个集合是否为超集关系。超集是子集的反操作。当一个集合包含另一个较小或相等大小的集合的所有项目时，它就是一个超集。

isSuperset(set) {
    if (!this._isValidSet(set)) return false;
    return (
        this.size >= set.size && [...set].every((item) => this.has(item))
    );
}

静态 Set

静态Set 是一个始终包含它初始化元素的集合，不能添加、删除、清除元素。Javascript Set 不是静态的，它总能在创建后可以公开修改该集合的方法，如 add、delete ，为避免集合被修改，可以创建一个新的 Set ，将其修改方法重置 。

class StaticSet extends SetHelper {
    constructor(items) {
        super(items);

        this.add = undefined;
        this.delete = undefined;
        this.clear = undefined;
    }
}

使用

现在就可以使用上面定义的方法操作两个 Set，如下：

const setA = new StaticSet(new Set([1, 2, 3, 4]));
const setB = new StaticSet(new Set([3, 4, 5, 6]));
console.log([...setA.union(setB)]); // [ 1, 2, 3, 4, 5, 6 ]
console.log([...setA.difference(setB)]); // [ 1, 2 ]
console.log([...setA.intersection(setB)]); // [ 3, 4 ]
console.log([...setB.intersectionDifference(setA)]); // [ 5, 6, 1, 2 ]

总结

Set 不限于上面这些操作，之前有介绍过可以用来合并数组去重，由于 Set 和 Array 相互转换很简单，因此可以用到 Array 的场合可以优先考虑一下 Set ，因为在内存使用上， Set 比 Array 占用更少。

更多编程相关知识，请访问：编程视频！！

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!