Maison >interface Web >js tutoriel >Explication détaillée de cinq façons courantes de créer des objets en Javascript
Il existe sept façons de créer des objets au total. Voici des exemples des cinq manières courantes, parmi. which Il existe deux méthodes fréquemment utilisées, assurez-vous de les maîtriser :
1. Méthode de création directe d'objet
La syntaxe de création est la suivante :
var 对象变量名 = new Object(); 对象变量名. property1 = value1; …; 对象变量名. propertyN = valueN; 对象变量名. methodName1 = function([参数列表]){ //函数体} …; 对象变量名. methodNameN = function([参数列表]){ //函数体}Créer d'abord un objet, après avoir défini et paramétré les valeurs de ses propriétés et fonctions Les exemples de référence et les appels sont les suivants :
var student =new Object();student.name="小李";student.age=21;student.dohomework=function(){ console.log(this.name+"正在做作业");} console.log(student.name);student.dohomework();
2. Méthode d'initialisation d'objet
La syntaxe de création est la suivante :var 对象变量名 = { property1 : value1, property2 : value2, …, propertyN : valueN, methodName1 : function([parameter_list]){ //函数体 }, …, methodNameN : function([parameter_list]){ //函数体 } }Attribuez les propriétés de l'objet et définissez la fonction fonction directement entre les accolades
Voir ce qui suit pour des exemples de référence et des appels :
var teacher = { name:"Mr Li", age:21, teach:function(){ console.log(this.name+"正在授课ing"); } } teacher.teach();Remarque : les différentes valeurs d'attribut sont directement séparées par des virgules et il n'y a généralement pas de signe de ponctuation après la dernière valeur
3. Méthode constructeur
Création La syntaxe est la suivante :function 构造函数([参数列表]){ this.属性 = 属性值; … this.属性N = 属性值N; this.函数1 = method1; … this.函数N = methodN; }function method1([参数列表]){ //函数体} …function methodN([参数列表]){ //函数体}ou
function 构造函数([参数列表]){ this.属性 = 属性值; … this.属性N = 属性值N; this.函数1 = function([参数列表]){ //函数体 } ; … this.函数N = function([参数列表]){ //函数体 } ; }Remarque : Certaines valeurs peuvent être défini sur les valeurs par défaut, et certaines valeurs peuvent être données dans la liste des paramètres selon les besoins et attribuées directement
Résumé : 1 Par rapport aux deux méthodes ci-dessus, en utilisant la méthode constructeur. pour créer des objets, vous pouvez effectivement enregistrer du code ;
2. Utiliser la méthode constructeur pour créer des objets, c'est la différence entre les fonctions ordinaires ;
3. la gauche est plus préférable, ce qui améliore la réutilisation du code
function Student(name){ this.name=name; this.age=21; this.play=function(){ console.log(this.name+"正在玩"); } }var student=new Student("仔仔"); student.play();
4. La syntaxe de création est la suivante :
Après avoir déclaré une nouvelle fonction, la fonction (en JavaScript, les fonctions sont aussi des objets) aura un attribut prototype à travers lequel de nouveaux attributs et méthodes pourront être ajoutés à l'objet. . Les exemples de référence et les appels sont les suivants :function 对象构造器( ){} 对象构造器.prototype.属性名=属性值; 对象构造器.prototype.函数名 = function([参数列表]){ //函数体}
5. Méthode mixte constructeur/prototype
function Student(){} Student.prototype.name="仔仔"; Student.prototype.age=21; Student.prototype.dohomework=function(){ console.log(this.name+"正在做作业"); }var student=new Student(); student.dohomework();
La syntaxe de création est la suivante :
La méthode constructeur est pratique pour attribuer dynamiquement des valeursaux propriétés, mais cette méthode définit également la méthode dans le corps de la méthode constructeur, ce qui rend le code plus compliqué pour la méthode prototype ; attribuer dynamiquement des valeurs aux propriétés, mais cette méthode définit Les propriétés et les méthodes sont séparées ; nous apprenons donc des forces et des faiblesses de chacun - le constructeur définit les propriétés et le prototype définit les méthodes. Les exemples de référence et les appels sont les suivants :function 对象构造器([参数列表]){} 对象构造器.prototype.函数名 = function([参数列表]){ //函数体}Il existe deux autres méthodes. La méthode du prototype dynamique et le mode usine ne sont pas courants et ne seront pas expliqués ici. Merci d'avoir regardé mon. travail!
function Student(name){ this.name=name; this.age=21; } Student.prototype.dohomework=function(){ console.log(this.name+"正在做作业"); }var student=new Student("仔仔"); student.dohomework();Recommandations associées :
Illustration Sept façons de créer des objets en 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!