Maison  >  Article  >  interface Web  >  Quelle est la différence entre les propriétés statiques es6 et les propriétés d'instance ?

Quelle est la différence entre les propriétés statiques es6 et les propriétés d'instance ?

青灯夜游
青灯夜游original
2022-04-13 13:52:542457parcourir

Différence : 1. Les propriétés statiques sont des propriétés de la classe elle-même et ne peuvent être appelées que dans la classe elle-même, tandis que les propriétés d'instance sont des propriétés d'objets d'instance ; 2. Les objets d'instance ne peuvent pas appeler de propriétés statiques, mais les classes peuvent appeler des propriétés d'instance ; . Propriétés statiques Il n'existe qu'une seule méthode de déclaration, la syntaxe est "nom de classe. Nom d'attribut = valeur", alors qu'il existe plusieurs méthodes de déclaration pour les attributs d'instance, qui sont définis dans l'exemple de classe avec "nom d'attribut = valeur".

Quelle est la différence entre les propriétés statiques es6 et les propriétés d'instance ?

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

Statique signifie qu'il ne sera pas hérité par l'instance. Il appartient à la classe elle-même. Il ne peut pas être hérité par l'instance et ne peut pas être appelé. C'est la même chose que la portée.

  • Attributs statiques : ce sont des attributs de la classe elle-même, qui ne peuvent être appelés que dans la classe elle-même. Les attributs statiques ne peuvent pas être appelés sur des objets d'instance et ne peuvent être appelés que par la classe elle-même. attributs statiques de la classe parent ;

  • Attributs d'instance : ce sont les attributs de l'instance, les attributs d'instance que l'objet instance peut appeler. N'oubliez pas que l'instance ne peut pas appeler les attributs statiques de la classe, mais que la classe peut appeler. les attributs de l'instance ;

Déclarer les attributs statiques :

C'est la même chose que d'ajouter des propriétés à un objet normal, object.a = 值; (la seule méthode actuellement proposée par certaines personnes pour ajouter le mot-clé static à l'intérieur de la classe, mais c'est le cas) ; pas encore implémenté

class F{};
F.b="父类的静态属性";//给F类加静态方法

Déclarez une méthode statique : ajoutez le mot-clé static avant la méthode

class Foo {
  static bar () {//静态方法  静态方法中的this指向类本身而不是实例
    this.baz();
  }
  static baz () {//静态方法
    console.log('hello');
  }
}
 
Foo.bar() // hello
new Foo().bar();//实例调用不了,会报错

Déclarez les propriétés de l'instance :

1, définies dans la classe

class MyClass {
  myProp = 42;
 
  constructor(props) {
    console.log(this.myProp); // 42
  this.name=props.name

  }
}
 
//上面代码中,myProp就是MyClass的实例属性。在MyClass的实例上,可以读取这个属性。

2, définies dans le constructeur (écriture classique en React )

class ReactCounter extends React.Component {
  constructor(props) {
    super(props);//可以让子类继承
    this.state = {
      count: 0
    };
  }
}
 
//等价于
class ReactCounter extends React.Component {
  state = {
    count: 0
  };
}

Résumé de la différence entre les propriétés statiques et les propriétés d'instance :

  • Les propriétés statiques sont Les attributs de la classe elle-même ne peuvent être appelés que dans la classe elle-même tandis que les attributs d'instance sont des attributs de l'objet instance et ; peut être appelé par l'objet instance.

  • Les objets d'instance ne peuvent pas appeler de propriétés statiques, ils ne peuvent être appelés que par la classe elle-même et les classes peuvent appeler des propriétés d'instance.

  • Les propriétés statiques n'ont qu'une seule méthode de déclaration, tandis que les propriétés d'instance ont plusieurs méthodes de déclaration.

  • Les attributs d'instance sont définis sur l'instance. Ils peuvent être définis là-dessus à l'intérieur du constructeur, ou sur l'instance après l'instanciation du constructeur.

    Propriétés statiques, propriétés définies au dessus du constructeur. Accessible directement via le constructeur.

【Recommandations associées : tutoriel vidéo javascript, front-end web

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