ES6 apprentissage (9) --- objets

1, les propriétés d'objet d'expression succincte

　　ES6, si la valeur de la propriété est une variable, si les noms d'attributs d'objet et les valeurs sont les mêmes, vous pouvez utiliser une formulation simple

laissez key = "touche" 
Apprécions = "valeur" 
laisser obj = {clé, valeur}

　　La méthode peut également être propriété raccourcie

obj = let { 
  Méthode () {la console.log ( "Méthode abrégée" )}           
} 

// utilisé dans le setter et getter 
const panier = { 
  _wheels: . 4 , 

  GET Wheels () { 
    retourne  les ce ._wheels; 
  }, 

  SET Wheels (valeur ) { 
    IF (valeur < les ce ._wheels) {
       le lancer  nouvelle nouvelle erreur ( «valeur est trop petite! ); 
    } 
    la cette ._wheels = valeur; 
  } 
}

　　Il convient de noter que la méthode ne peut pas être utilisé un raccourci constructeur

 

2, l'expression du nom de la propriété

　　ES6 utilisé propriétés de l'objet défini de nom d'argument, l'expression accrue peut être définie, à des expressions besoin entre crochets ([]), mais ne peut pas être utilisé conjointement avec les propriétés d'expression de brièveté

. 1 let propKey = 'foo' ;
 2  
3. Let obj = {
 4.    [PropKey]: true ,   // expression définit le nom de l' attribut 
5.    : [ 'A' + 'BC'] 123
 6.  ;}
 7.  // nom de méthode de l' objet peuvent également être utilisés pour définir l'expression 
8. let obj = {
 9.    [ 'H' + 'ello' ] () {
 10      retour 'Salut' ;
 . 11    }
 12 est  };
 la figure 13 est  
14 obj.hello () // Salut 
15  
16  // ne peut pas être utilisé avec des expressions simples 
17. const foo 'bar' = ;
18 const baz = {[foo]};

　　Note: Lorsque l'expression est une définition de l'attribut nom d'un objet, il est automatiquement converti en une chaîne [objet objet]

 

3, nommez la nouvelle méthode renvoie objet d'attribut le nom de méthode //

　　Sur la propriété est pas dans cette méthode, mais si elle est sur un setter et getter, le nom méthodes get et set dans l'objet

const obj = { 
  get foo () {}, 
  set foo (x) {} 
}; 

obj.foo.name 
// TypeError: Impossible de lire le 'nom' de la propriété undefined 

descripteur const = Object.getOwnPropertyDescriptor (obj, 'foo' ); 

descriptor.get.name // "get foo" 
descriptor.set.name // "set foo"

　　Si la fonction est une fonction pour lier ou lier configuration de fonction, attribut name avec le même nom attribut Fonction

　　Si le nom de la méthode est d'utiliser le type Symbol, le type de ce symbole Description Valeur renvoyée

const key1 = Symbole ( 'description' ); 
const key2 = Symbole (); 
laisser obj = { 
  [key1] () {}, 
  [key2] () {}, 
}; 
obj [key1] .name // "[description]" 
obj [key2] .name // ""

 

4, l'attribut énumération de traversée et

　　Chaque propriété d'un objet a une description de l'objet (descripteur), pour commander le comportement de la propriété (comme on peut le traverser, peut être modifiée, les valeurs, configurable)

　　Pour obtenir ces actes par la méthode Object.getOwnPropertyDescriptor ()

{Obj = foo let: 123 }; 
Object.getOwnPropertyDescriptor (obj, 'foo' )
 //   { 
//     valeur: 123, valeur // 
//     inscriptibles: true, // écriture 
//     Enumerable: true, // peut énumération 
@     configurable: configurable à true // 
//   }

 

À l' heure actuelle, il y a quatre fonctionnement ignorés enumerablepour la falsepropriété.

• for...inLoop: seulement traverser l'objet et la propriété héritée dénombrable lui-même.
• Object.keys(): Renvoie les noms de tous les objets clé elle-même propriété dénombrable.
• JSON.stringify(): Seul objet sérialisé lui-même propriété dénombrable.
• Object.assign(): Ignorer enumerablela falsepropriété, seule une copie de ses propres propriétés énumérables de l'objet.

5, objet opérateur étendu (...) // avec le tableau, sauf que: deconstruction tableau de bits, et détiennent les clés lorsque l'objet est déconstruit;

　  Laissez obj copie superficielle de l'objet opérateur étendu peut être utilisé subject = {... {a: 1, b: 2}}

　  L'objet peut être combiné laisser obj = {... {a 1, b 2}, {... c: 3, d: 4}} est équivalente à Object.assign ({}, {a 1, b : 2}, {c: 3, d: 4}); Notez que si l'objet de fusionner le même attribut name, puis celui-ci sur l'ancien serait

6, l'opérateur de la chaîne est déterminée (?.) (ES2020 nouveau)

　　Interface d'appel au travail, obtenir l'objet dans une propriété de l'empilement se, cependant, si une propriété qui n'existe pas entre l'erreur sera donc ES2020 nouvelle détermination de l'opérateur de la chaîne, si l'attribut n'existe pas quelque part au milieu est retourné non défini　　

1  // 之前写法
2 const firstName = ( le message
 3    && message.body
 4    && message.body.user
 5    && message.body.user.firstName) || « par défaut » ;
6  
7   // 链判断运算符
8 const prenom = message? .Body? .User? .FirstName || 'défaut';

 

7, l'opérateur détermine Null (??) (ES2020 nouveau)

　　RÉGL.GÉNÉRAUX valeurs par défaut pour les variables du modèle que nous allons utiliser la « chaîne » mécanisme de court-circuit str ||, la variable str est « », 0, null, non défini, se verront attribuer la valeur par défaut faux, si et seulement si la variable est nulle et non définie quand, utilisera la valeur par défaut, vous ne pouvez pas utiliser cette méthode;

　　Ainsi ES2020 ajouté jugement opérateur nul, que lorsque la valeur de la variable est nulle ou non définie, la valeur par défaut sera attribué

const headerText = response.settings.headerText ?? 'Bonjour le monde!' ; 

const animationDuration = response.settings.animationDuration ?? 300 ; 

const ShowSplashScreen = response.settings.showSplashScreen ?? vrai ;

　　Notez que, si lorsqu'il est utilisé avec une pluralité d'opérateurs logiques, ont besoin d'utiliser () indique une priorité, sinon une erreur