Maison > interface Web > js tutoriel > Quels sont les nouveaux types de données ajoutés dans es6 ?

Quels sont les nouveaux types de données ajoutés dans es6 ?

青灯夜游
Libérer: 2023-01-07 11:47:08
original
7960 Les gens l'ont consulté

Types de données ES6 nouvellement ajoutés : 1. Type de symbole ; 2. Type de jeu ; 3. Type de carte ; 4. Type WeakSet ; 6. Type TypedArray ;

Quels sont les nouveaux types de données ajoutés dans es6 ?

L'environnement d'exploitation de ce tutoriel : système Windows 7, ECMAScript version 6, ordinateur Dell G3.

ES6 nouveaux types de données

  • Type de symbole (de base)
  • Type de jeu (complexe)
  • Type de carte (complexe)
  • Type WeakSet (complexe)
  • Type de carte faible (complexe)
  • Type TypedArray (complexe)

Jetons un coup d'œil aux types de données disponibles avant es6, es6 之前有哪些数据类型,

  • 基本类型:

    • string

    • null

    • undefined

    • number

    • boolean

  • 复杂类型:

    • object

由于新出的类型在平常工作中基本用不到,所以具体介绍还是直接看 MDN 的专业解释把,下面给大家讲解一些面试经常遇到的问题....

Q1:怎么让一个对象具有一个私有属性?(Symbol有什么用?)

Answer:用 Symbol 作为对象的 key 即可

{ // 私有作用域
  let a = Symbol()
  window.oo = {
    name: '对象',
    age: 18,
    [a]: '这是一个私有属性'
  }
  console.log(oo[a]) // 这是一个私有属性
}
// 不能再作用域外打印...
Copier après la connexion

此时对象 oo 就有一个私有属性,该属性在作用域外就无法正确打印。

Quels sont les nouveaux types de données ajoutés dans es6 ?

Q2:怎么快速去重一个数组?

Answer:用 SetArray.form()
这是一道很经典的面试题,在此之前先讲讲 es6 之前的去重方法:

let array = [1, 2, 3, 4, 4, 5, 5, 6]
~function uniq() {
  let result = []
  let hash = {}
  for (let i=0; i<array.length><p class="image-package"><img src="https://img.php.cn/upload/image/369/298/171/1630654569660947.png" title="1630654569660947.png" alt="Quels sont les nouveaux types de données ajoutés dans es6 ?"></p>
<p>但是该方法有巨大的弊端,去重数组中不能有对象,而且该方法返回的结果中都是字符串,所以无法对这样的数组进行去重。</p>
<p>当我们使用 <code>Set</code> 时</p>
<pre class="brush:php;toolbar:false">let a = {a: 11}
let array = [0, 1, '1', '22', 22, a, a, 66]
~function uniq() {
  return Array.from(new Set(array)) // 装比写法 [... new Set(array)]
}()
Copier après la connexion

Quels sont les nouveaux types de données ajoutés dans es6 ?

甚至连对象的引用也能去重,很简略的方法。

Q3:Map有啥用?

Answer:map 更像是对象的拓展,他的 key 可以是任意类型,不再像之前的对象 key 只能是字符串,也就是这个特性,我们可以去优化之前的去重,但是也没有必要,因为已经有 set 了。

举个栗子

let myMap = new Map()
 
let keyObj = {}
let keyFunc = function () {}
let keyString = "a string"
 
// 添加键
myMap.set(keyString, "和键'a string'关联的值");
myMap.set(keyObj, "和键keyObj关联的值");
myMap.set(keyFunc, "和键keyFunc关联的值");
Copier après la connexion

Quels sont les nouveaux types de données ajoutés dans es6 ?

Q4:WeakMap 和 Map 的区别?

Answer:

  • WeakMap 区别就是对 key 的引用是弱引用

  • WeakMapkey

    • Type de base :


      string

      null

      indéfini

      numéro

      booléen

      🎜🎜🎜🎜🎜Type complexe : 🎜
        🎜🎜object🎜🎜🎜🎜🎜🎜Étant donné que les nouveaux types ne sont fondamentalement pas utilisés dans le travail quotidien, veuillez vous référer à MDNpour une introduction détaillée > Pour un explication professionnelle, voici quelques questions fréquemment posées lors des entretiens....🎜🎜🎜Q1 : Comment faire pour qu'un objet ait un attribut privé ? (À quoi sert Symbol ?)🎜🎜🎜Réponse : Utilisez Symbol comme clé de l'objet🎜rrreee🎜À ce moment, l'objet oo sera disponible. Une propriété privée qui ne peut pas être imprimée correctement en dehors de la portée. 🎜🎜<img src="https://img.php.cn/upload/image/226/770/242/163065456437873Quels%20sont%20les%20nouveaux%20types%20de%20donn%C3%A9es%20ajout%C3%A9s%20dans%20es6%20?" title="163065456437873Quels sont les nouveaux types de données ajoutés dans es6 ?" alt="Quels sont les nouveaux types de données ajoutés dans es6 ?">🎜🎜🎜 Q2 : Comment supprimer rapidement les doublons d’un tableau ? 🎜🎜🎜Réponse : utilisez <code>Set plus Array.form()🎜C'est une question d'entretien très classique. Avant cela, parlons de es6. Méthode de déduplication précédente : 🎜rrreee

        Quels sont les nouveaux types de données ajoutés dans es6 ?🎜🎜Cependant, cette méthode présente d'énormes inconvénients. Il ne peut pas y avoir d'objets dans le tableau de déduplication et les résultats renvoyés par cette méthode sont tous des chaînes, donc un tel tableau ne peut pas être traité. déduplication. 🎜🎜Lorsque nous utilisons Set🎜rrreee

        Quels sont les nouveaux types de données ajoutés dans es6 ?🎜🎜Même les références d'objet peuvent être dédupliquées, une méthode très simple. 🎜🎜🎜Q3 : A quoi sert Map ? 🎜🎜🎜Réponse : map ressemble plus à une extension d'un objet. Sa clé peut être de n'importe quel type, contrairement à l'objet précédent clé qui. seulement Il peut s'agir d'une chaîne, c'est-à-dire qu'avec cette fonctionnalité, nous pouvons optimiser la déduplication précédente, mais ce n'est pas nécessaire car il y a déjà un set. 🎜🎜Donnez-moi un exemple🎜rrreee

        Quels sont les nouveaux types de données ajoutés dans es6 ?🎜🎜🎜Q4 : Quelle est la différence entre WeakMap et Map ? 🎜🎜🎜Réponse : 🎜

          🎜🎜WeakMap La différence est que la référence à key est une référence faible 🎜🎜🎜 🎜La clé de WeakMap ne peut être qu'un objet🎜🎜🎜🎜Ce que vous devez savoir, c'est ce qu'est une référence faible : 🎜Article : Apprendre et utiliser ES2015 WeakMap🎜🎜🎜Q5 : Quelle est la différence entre WeakSet et Set ? 🎜🎜🎜Réponse : Comme ci-dessus🎜🎜🎜Q6 : À quoi sert TypedArray ? 🎜🎜🎜Réponse : Ce type utilise moins de méthodes. Il est principalement utilisé pour le traitement des fichiers binaires (audio, fichiers, vidéos, images...) et n'est généralement utilisé que si vous développez votre propre roue. 🎜🎜【Apprentissage recommandé : 🎜Tutoriel avancé javascript🎜】🎜

    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!

    Étiquettes associées:
    source:php.cn
    Déclaration de ce site Web
    Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
    Tutoriels populaires
    Plus>
    Derniers téléchargements
    Plus>
    effets Web
    Code source du site Web
    Matériel du site Web
    Modèle frontal