编程知识 cdmana.com

Syntaxe de base de la classe

jsDans la langue,La façon traditionnelle de générer un objet instance est par le constructeur: Es6 Adoptionclass (Catégorie)Cette couverture,Modèle comme objet,Adoptionclass,Les classes peuvent être définies. NouveauclassL'écriture est un bonbon grammatical,La plupart de ses fonctions,es5Tout va bien. Tu vois?,NouveauclassL'intelligence d'écriture rend l'écriture du prototype d'objet plus claire,C'est plus une syntaxe orientée objet.

  1. Exemple
function Point(x,y){
    this.x=x;
    this.y=y
}

Point.prototype.toString=function (){
    return `${this.x}${this.y} `
}
var p = new Point(1,2);
p.toString();
//"(1,2)"

//Réécritureclass
 class Point{
     constructor(x,y){
         this.x=x;
         this.y=y;
     }
      toString () {
        return `( ${this.x}, ${this.y} )`;
       }
       toValue () {
        return this.x+this.y;
       }
 }

 var p = new Point(1,2);
p.toString();
//"(1,2)"
p.toValue();
//3
Copier le Code

Définit unPointCatégorie, Il y a un constructorMéthodes, C'est comme ça qu'on construit ;Etthis Les lettres clés représentent l'objet instance ,C'est - à - direEs5Le constructeur dePonitCorrespondant àEs6DePointMéthode de construction de la classe,Point Classe en plus de la méthode de construction , Il y a aussi une définition de toStringMéthode, Il n'est pas nécessaire d'ajouter FunctionCe mot - clé, Mettez la définition de la fonction directement dans , Pas besoin de tout séparer . Du constructeurprototypePropriétés,Ines6 Continue d'exister sur la classe de , En fait, toutes les méthodes de la classe sont définies dans la classe PrototypePropriétés ci - dessus;

  1. Mode strict

Le mode strict est par défaut à l'intérieur des classes et des modules Il n'est pas nécessaire de spécifier le mode de fonctionnement

constructor Méthodes

constructor La méthode est la méthode par défaut de la classe,Adoptionnew Lorsque la commande génère une instance ,Appeler automatiquement la méthode,Une classe doit avoirconstructorMéthodes, Si aucune définition n'est affichée , Sera ajouté par défaut .

class A{

}
//égal à
class A{
    constructor(){

    }
}
// Définir une classe vide A JavaScript Le moteur ajoutera automatiquement un vide constructorMéthodes
Copier le Code

constructor Méthode par défaut renvoie l'objet instance (this); Vous pouvez spécifier de retourner un autre objet .

class A {
    constructor(){
        return Object.create(null)
    }
}
new A() instanceof A

//false

//Exemple  instanceof  Le constructeur est utilisé pour déterminer s'il s'agit d'une instance du constructeur 

Copier le Code
Objet instance de la classe

Générer l'écriture de l'objet instance ,AvecEsC'est la même chose avecNewLes ordres, Propriétés de l'Instance à moins qu'elles ne soient définies en elles - mêmes ( Défini à thisObjet), Sinon, tout est défini sur le prototype :Défini dansclassAllez..

class A{
    constructor(x,y){
        this.x=x
        this.y =y
    }
    toString(){
          return `( ${this.x}, ${this.y} )`;
    }
}
var B=new A(1,2)
A.toString();
A.hasOwnProperty(x)//true
A.hasOwnProperty(y)//true
A.hasOwnProperty('toString')//true
A.__proto__.hasOwnProperty('toString')//true
Copier le Code

xy Ce sont tous des objets d'instance A Propriétés propres Défini dansthisAllez.,Alors...hasOwnPropertyIls reviendront.true EttoString Est la propriété de l'objet prototype ,Alors...hasOwnPropertyRetourfalse. EtEs5Soyez cohérent.

classExpression
 const MyClass =class Me{
    getClassName(){
        return Me.name
    }
}

let inst =new MyClass();
inst .getClassName();
//A
Me.name
//ReferenceError :Me is not defined

Copier le Code

MeSeulement siClass Il y a une définition à l'intérieur , Peut être omis s'il n'est pas utilisé à l'intérieur de la classe MeRéécrit comme suit::

class MyClass =class {
    getClassName(){
        return Me.name
    }
}
Copier le Code

C'est vrai.class L'expression peut écrire directement la fonction d'exécution immédiate class

let person =new class{
    constructor 
(name){
        this.name =name;
    }
    sayName(){
        console.log(
        this.name
    )}
}(' Prunier 13 ');

person.sayName();
Copier le Code
Il n'y a pas de promotion variable
new Foo();//ReferenceError
class Foo{};
Copier le Code

foo L'utilisation d'une classe est définie avant et après , C'est une erreur.,Es6 Non, la vie de la classe monte à l'en - tête du Code . Les raisons de cette disposition sont liées à la succession dont il est question ci - après , Vous devez vous assurer que la Sous - classe est définie après la classe mère

thisDirection de

Méthode interne de la classe si elle contientthis, Il pointe par défaut vers l'Instance de la classe , Mais il faut être très prudent , Une fois la méthode utilisée seule ,Peut signaler une erreur.

class Logger{
    printName(name="three"){
        this.print(`hello${name}`)
    }
    print(text) {
    console.log(text);
  }
}
  

const logger =new Logger()
const {printName} =logger;
printName();// TypeError: Cannot read property 'print' of undefined
Copier le Code

printName Dans la méthodethis,Pointage par défautLoggerExemple de classe, Mais si cette méthode est extraite et utilisée seule ,thisPointera vers l'environnement dans lequel la méthode s'exécute,Parce que je ne trouve pasprint Méthode entraînant une déclaration d'erreur .

#####Class Fonction de valeur pour (getter)Et enregistrer la fonction(setter) Peut être utilisé à l'intérieur de la classe getEtsetMots clés,Définir les fonctions de stockage et de récupération d'une propriété,Intercepter le comportement d'accès pour cette propriété

class MyClass1{
    constructor(){
        //...
    }
    get prop(){
        return 'get'
    }
    set prop(value){
        console.log('set'+value)
    }
}

let inst =new MyClass1();
inst.prop=123;
inst.prop
Copier le Code

prop L'attribut a la fonction de valeur stockée et la fonction de valeur correspondante , Le comportement d'assignation et de lecture est donc personnalisé .

class Méthode statique

La classe correspond au prototype de l'Instance, Toutes les méthodes définies dans la classe , Sont hérités par l'Instance . Si une méthode est précédée de static , Indique simplement que la méthode n'est pas héritée par l'Instance Mais directement à travers la classe .

class Foo {
  static classMethod() {
    return 'hello';
  }
}

Foo.classMethod() // 'hello'
var foo =new Foo();
foo.classMethod()// foo.classMethod is not a function
Copier le Code

FooClasseclassMethod Il y a staticMots clés, Indique que la méthode est statique ,Peut être directement àFoo Appel en classe ;Au lieu deFoo Appelé sur l'Instance de la classe si sur l'Instance Appelez la méthode statique, L'identité n'existe pas . Si la méthode statique contientthisMots clés,C'estthisIl s'agit de la classe,Au lieu d'exemples.

class Foo {
  static bar () {
    this.baz();
  }
  static baz () {
    console.log('hello');
  }
  baz () {
    console.log('world');
  }
}

Copier le Code

Méthode statiquebarAppeléthis.baz,Ici.thisÇa veut direFooCatégorie,Au lieu deFooExemples,équivalent à appelerFoo.baz. Et d'après cet exemple, Kay , Les méthodes statiques peuvent être renommées sur les méthodes non statiques . Les méthodes statiques de la classe mère peuvent être héritées par la classe Enfant .

class Foo {
  static classMethod() {
    return 'hello';
  }
}

class Bar extends Foo {
}

Bar.classMethod() // 'hello

Copier le Code

La méthode statique peut également être utilisée à partir de superAppel supérieur.

Class Propriétés statiques et d'instance pour

Les propriétés statiques sont class Les attributs eux - mêmes ,Oui.class.propName, Au lieu de définir dans l'Instance thisPropriétés sur.

class Foo {

}
Foo.prop=1;
Foo.prop
//Foo La classe définit une propriété statique prop C'est la seule façon d'écrire ,Parce que ES6 Clairement défini,Class  Il n'y a que des méthodes statiques à l'intérieur , Pas de propriétés statiques .
Copier le Code
  1. Propriétés de l'instance pour la classe

Les propriétés d'instance d'une classe peuvent être utilisées avec l'équation , Écrire dans la définition de la classe .

class MyClass1{
    myProp=34;
    constructor(){
        console.log(this.myProp)
    }
}
var myclass= new MyClass1();
myclass
// myPropC'estMyClass1Propriétés de l'instance pour,InMyClass Cette propriété peut être lue sur l'Instance de .
Copier le Code

Basé sur# Ruan YifengES6

版权声明
本文为[Déchets lhpi]所创,转载请带上原文链接,感谢
https://cdmana.com/2021/09/20210914170046020b.html

Scroll to Top