Maison  >  Article  >  interface Web  >  La classe est-elle es5 ou es6 ?

La classe est-elle es5 ou es6 ?

青灯夜游
青灯夜游original
2022-11-16 19:28:051687parcourir

class est une nouvelle fonctionnalité d'es6. Dans ES6, la classe (class) a été introduite comme modèle pour les objets, et les classes peuvent être définies via le mot-clé class ; la nouvelle méthode d'écriture de classe rend l'écriture de prototypes d'objets plus claire, plus proche de la syntaxe de la programmation orientée objet, et plus encore. compréhensible. La classe est une nouvelle structure syntaxique de base dans ECMAScript. Bien que les classes ES6 semblent prendre en charge la programmation formelle orientée objet, en fait, elles utilisent toujours les concepts de prototypes et de constructeurs derrière elles, permettant aux prototypes d'objets d'écrire plus clairement,

La classe est-elle es5 ou es6 ?

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

class est une nouvelle fonctionnalité d'es6. Dans ES6, la classe (class) a été introduite comme modèle pour les objets, et les classes peuvent être définies via le mot-clé class.

ES6 fournit une méthode d'écriture plus proche des langages traditionnels. Le mot-clé class nouvellement introduit a la capacité de définir formellement des classes. La classe est une nouvelle structure de sucre de syntaxe de base dans ECMAScript. Bien que les classes ECMAScript 6 semblent prendre en charge la programmation formelle orientée objet, elles utilisent en fait toujours les concepts de prototypes et de constructeurs qui les sous-tendent, ce qui permet aux prototypes d'objets d'écrire plus clairement. la syntaxe de la programmation orientée objet.

1. Introduction aux classes

Le JS traditionnel n'a que le concept d'objets, pas de classes, car JS est un langage orienté objet basé sur des prototypes, et la caractéristique des objets prototypes est de partager tous les attributs avec de nouveaux objets .

ES6 introduit le concept de classe. Les classes peuvent être définies via le mot-clé class. Il s'agit d'un langage orienté objet qui correspond davantage à ce que nous comprenons habituellement.

class Person{   //定义一个名为Person的类
    // 构造函数,用来接受参数
    constructor(x,y){
        this.x = x;    //this代表的是实例对象
        this.y = y;
    }
    todoSome(){  //这是个类的方法,不需要加function,有多个方法也不用逗号隔开
        alert(this.x + "的年龄是" +this.y+"岁");
    }
}
export default  Person;

2. Méthodes statiques et propriétés statiques

Les méthodes statiques et les propriétés statiques sont des propriétés et des méthodes qui utilisent le mot-clé statique

2.1 Méthodes statiques

static classMethod(){
		console.log('123456')
	}
  • Les méthodes statiques ne seront pas sous-classées Héritage , les sous-classes ne peuvent pas appeler
  • this dans les méthodes statiques, qui pointent vers la classe, pas vers une instance de la classe. Par conséquent, les méthodes statiques ne peuvent être appelées que via des noms de classe, et non via des instances. via le nom de la classe, pas via l'instance de la classe
3. L'héritage de classe extends

la classe peut être héritée à l'aide du mot-clé extends

Héritage ES6, super() doit être utilisé dans le constructeur de sous-classe. Parce que l'héritage ES6 y ajoute d'abord les attributs et les méthodes de l'objet d'instance de classe parent, puis appelle le constructeur de la sous-classe pour le modifier. Si la sous-classe ne définit pas de méthode constructeur, super() l'ajoutera par défaut. la sous-classe héritera des méthodes et des attributs de la classe parent, mais les méthodes et attributs statiques doivent être appelés via le nom de classe de la sous-classe
  • let p = new Point();
    p.classMethod();  // 报错
  • 4. Le getter de fonction de valeur et le setter de fonction de stockage de la classe

. getter et setter sont utilisés pour lire et transmettre des valeurs aux attributs de classe. Le getter de la fonction de valeur et le setter de la fonction de stockage peuvent personnaliser l'affectation et le comportement de la valeur. Lorsqu'une propriété n'a qu'un getter et aucun setter, la propriété est une propriété en lecture seule et ne peut pas se voir attribuer de valeur, ni être initialisée. pour la première fois.

    Si la variable est définie comme privée (définie en dehors des accolades de la classe), vous ne pouvez utiliser que des getters sans setters.
  • static prop = 1 ;  // 静态属性
  • Comment utiliser :
  • import classtest from "./classtest";  //先引入父类
    class Man extends classtest{
        constructor(x,y){   //构造函数尽量与父类参数保持一致
            super();   //利用super()关键字,这个必须放在子类构造函数中的第一位置
            this.x = x;
            this.y = y;
        }
    }
    export default  Man;
  • 5. Notes :

1. Lors de la définition d'une méthode dans une classe, vous ne pouvez pas ajouter le mot-clé function à la méthode, car le constructeur en JS est défini avec function. Deux séparés. 2. Ne séparez pas toutes les méthodes par des virgules, sinon une erreur sera signalée.

【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!

Déclaration:
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
Article précédent:Es6 est-il un framework ?Article suivant:Es6 est-il un framework ?