Maison > interface Web > js tutoriel > Explication détaillée d'exemples étendus de différents types de données dans es6

Explication détaillée d'exemples étendus de différents types de données dans es6

零下一度
Libérer: 2017-06-26 10:24:42
original
1838 Les gens l'ont consulté

1. L'extension de chaîne

  1. ajoute un itérateur à la chaîne, qui peut être parcouru par for...of

  2. inclut , StartsWith et EndsWith renvoient tous deux des valeurs booléennes et prennent en charge le deuxième paramètre (la position de départ de la recherche EndsWith cible les n premiers caractères, et les deux autres vont du nième à la fin

  3. repeat renvoie une nouvelle chaîne, et le paramètre est le nombre de répétitions (les décimales seront arrondies, les nombres négatifs ou Infnity signalera une erreur, 0 à -1 équivaut à 0, et la chaîne sera convertie en nombres)

  4. padStart et padEnd sont complétés en tête ou en queue. Le premier paramètre est la longueur minimale de la chaîne et le deuxième paramètre est la chaîne utilisée pour la complétion.

  5. modèle String `${...}`
  6. 2. Expansion numérique

    Number.isFinite vérifie si une valeur est finie, renvoie toujours faux pour les valeurs non numériques
  1. Number.isNaN vérifie si une valeur est NaN Seul NaN renvoie vrai
  2. La méthode traditionnelle isFinite isNaN ; appellera d'abord Number() pour convertir la valeur non numérique Convertir en valeur numérique


  3. Number.parseInt(), Number.parseFloat() sont les mêmes que la méthode traditionnelle, le le but est de réduire la modularité globale de la méthode et du langage
  4. Number.isInteger() détermine s'il s'agit d'un entier
  5. Number.EPSILON est un très petite constante. Si l'erreur de calcul de la virgule flottante est inférieure à cette valeur, c'est ok
  6. La plage entière exacte de JS : -2^53~2^53 (à l'exclusion des deux). se termine),
  7. Number.MAX_SAFE_INTEGER = Math.pow(2, 53) - 1;

    Number.MIN_SAFE_INTEGER = -Number.MAX_SAFE_INTEGER;
    Number.isSafeInteger() est utilisé pour déterminer si un entier se situe dans cette plage ;

  8. Math.trunc() supprime la partie décimale et renvoie une partie entière
  9. Math.sign() détermine s'il s'agit d'un entier négatif ou de 0 ; >Math.cbrt() calcule la racine cubique d'un nombre ; il existe également des méthodes logarithmiques et des méthodes de fonctions trigonométriques ;

    opérateur exponentiel 2 * * 3 === 8, différent de l'implémentation Math.pow, pour des opérations particulièrement volumineuses ; , le dernier chiffre du résultat de l'opération est différent


    3. L'extension du tableau

Array.from peut convertir des objets de type tableau et objets traversables en tableaux, et l'opérateur spread peut également convertir certains objets en tableaux ;
    peut accepter un deuxième paramètre, similaire à la méthode map , renvoie la valeur traitée dans un tableau

  1. Array.of convertit un ensemble de valeurs en un tableau
  2. copyWithin copie le membre à l'emplacement spécifié vers d'autres emplacements
  3. Array.prototype.copyWithin(target; , start = 0, end = this.length)

  4. find trouve le premier membre qualifié, le paramètre est une fonction de rappel
  5. findIndex renvoie la position du premier membre éligible du tableau ;

  6. fill remplit le tableau avec la valeur donnée, et les deuxième et troisième paramètres peuvent spécifier les positions de début et de fin
  7. clés, valeurs ; , entrées
  8. inclut, indexOf n'est pas assez sémantique et est utilisé en interne pour juger,
  9. [NaN] .indexOf(NaN) // -1 , [NaN].includes (NaN) // true
  10. Le has de Map est utilisé pour trouver le nom de la clé, et le has de Set est utilisé pour trouver la valeur



    La position vide du tableau n'a pas de valeur, 0 in [,,] // false, es6 convertira la position vide en indéfini, et la position vide doit être évitée
  11. L'extension de la fonction

Quatre. 🎜>
  1. permet de définir une valeur par défaut pour la fonction. Si un paramètre non-tail est défini sur une valeur par défaut, en fait ce paramètre ne peut pas être omis
    Après avoir défini la valeur par défaut, l'attribut length de la fonction renverra le nombre de paramètres sans valeur par défaut spécifiée
    Si le paramètre avec une valeur par défaut définie n'est pas le dernier paramètre, alors l'attribut length ne sera plus compté dans le paramètres suivants ;

  2. Une fois la valeur par défaut du paramètre définie, le paramètre formera une portée (contexte) distincte lorsque la fonction est déclarée et initialisée. Une fois l'initialisation terminée, cette portée disparaîtra. Ce comportement de syntaxe n'apparaîtra pas lorsque la valeur par défaut du paramètre n'est pas définie.

  3. Paramètre de repos (... nom de la variable)

  4. Opérateur d'extension (...), convertit un tableau en séquence de paramètres séparés par des virgules .

    /* 替代数组的apply方法 */// ES5的写法function f(x, y, z) {  // ...}var args = [0, 1, 2];
    f.apply(null, args);// ES6的写法function f(x, y, z) {  // ...}var args = [0, 1, 2];
    f(...args);/* --------------------------------- */// ES5的写法Math.max.apply(null, [14, 3, 77])// ES6的写法Math.max(...[14, 3, 77])// 等同于Math.max(14, 3, 77);/* --------------------------------- */// ES5的写法var arr1 = [0, 1, 2];var arr2 = [3, 4, 5];
    Array.prototype.push.apply(arr1, arr2);// ES6的写法var arr1 = [0, 1, 2];var arr2 = [3, 4, 5];
    arr1.push(...arr2);
    Copier après la connexion
  5. Remarque sur l'utilisation des fonctions fléchées :

    (1) L'objet this dans le corps de la fonction est l'endroit où il s'agit d'un objet défini, plutôt que de l'objet dans lequel il est utilisé.

    (2) ne peut pas être utilisé comme constructeur, c'est-à-dire que la commande new ne peut pas être utilisée, sinon une erreur sera générée.

    (3) L'objet arguments ne peut pas être utilisé, car l'objet n'existe pas dans le corps de la fonction. Si vous souhaitez l'utiliser, vous pouvez utiliser le paramètre rest à la place.

    (4) La commande yield ne peut pas être utilisée, donc la fonction flèche ne peut pas être utilisée comme fonction Générateur.

5. Extensions d'objet

  1. Notation d'abréviation d'attribut

  2. Attribut expression de nom, [nom de la variable]

  3. L'attribut name de la méthode renvoie le nom de la fonction (c'est-à-dire le nom de la méthode)

  4. Objet. C'est fondamentalement la même chose que ===. La différence est que l'un est que +0 n'est pas égal à -0, et l'autre est que NaN est égal à lui-même

    // es5实现Object.isObject.defineProperty(Object, 'is', {
      value: function(x, y) {if (x === y) {      // 针对+0 不等于 -0的情况  return x !== 0 || 1 / x === 1 / y;
        }// 针对NaN的情况return x !== x && y !== y;
      },
      configurable: true,
      enumerable: false,
      writable: true});
    Copier après la connexion
  5. Object.assign(target, o1, o2) est utilisé pour fusionner des objets avec le même nom, les précédentes seront écrasées plus tard ; la copie superficielle implémentée
    ne peut pas. être convertis en raison d'undefined et null en objets, donc s'ils sont utilisés comme paramètres, une erreur sera signalée

  6. La méthode Object.getOwnPropertyDescriptor peut obtenir l'objet de description de cette propriété ;

  7. Parcours des propriétés :
    for...in, Object.keys, Object.getOwnPropertyNames(obj), Object.getOwnPropertySymbols(obj), Reflect.ownKeys(obj)

  8. __proto__ a la même fonction que Object.setPrototypeOf(), utilisée pour définir l'objet prototype d'un objet, Object.getPrototypeOf()

  9. Object.keys(), Object.values(), Object.entries()

  10. Object.getOwnPropertyDescriptors renvoie l'objet de description de toutes ses propres propriétés (propriétés non héritées) du spécifié objet

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