Utiliser JavaScript pour encapsuler une classe

Cet article décrit comment utiliser JavaScript pour encapsuler une classe. Si vous ne savez pas utiliser JavaScript pour encapsuler une classe ou si vous souhaitez utiliser JavaScript pour encapsuler une classe, jetons un coup d'œil à. cet article. Entrons dans le vif du sujet. Les

Les JavaScripters qui ont appris d'autres langages orientés objet peuvent avoir utilisé des classes, telles que class{}, et une série de méthodes définies par eux. ,
Mais lorsque les débutants apprennent le js, ils voient souvent cette phrase, c'est-à-dire que JavaScript est un langage orienté objet, mais peu importe ce que j'apprends, je ne connais pas grand chose en programmation orientée objet. La même chose est vraie pour moi. J'ai du mal avec la programmation orientée objet js, je l'ai un peu compris ces derniers jours. . .

La soi-disant classe aura les fonctions suivantes :

1. Constructeur

2 Propriétés statiques et méthodes statiques

3. méthodes partagées

4. Propriétés privées, méthodes privées

Cet article expliquera comment utiliser js pour encapsuler des classes et réaliser les fonctions ci-dessus,

1. Une classe simple

var Person = function(name, age){
    this.name = name;    this.age = age;    this.sayName = function(){
        console.log(this.name);
    };
}

Si vous sentez que ce n'est pas comme une classe, alors vous pouvez le faire

var Person = function(name, age){
    //共有属性
    this.name = name;    this.age = age;    //共有方法
    this.sayName = function(){
        console.log(this.name);
    };
}

Si le modèle Constructeur n'est pas clair Si tel est le cas, vous pouvez jeter un œil à jsCreate ObjectDesign Pattern

2 Une classe complexe

Avec l'exemple ci-dessus. , nous Sur cette base, nous pouvons procéder à nos améliorations.

var Person = function(name, age){
    //共有属性
    this.name = name;    //共有方法
    this.sayName = function(){
        console.log(this.name);
    };    //静态私有属性(只能用于内部调用)
    var home = "China";    //静态私有方法(只能用于内部调用)
    function sayHome(){
        console.log(home);
    }    //构造器
    this.setAge = function(age){
        console.log(age + 12);
    };    this.setAge(age);
}//静态方法（只能被类来访问）Person.sayAge = function(){
    console.log("your age is 12");
}//静态属性（只能被类来访问）Person.drink = "water";//静态共有方法（类和实例都可以访问）Person.prototype.sayWord = function(){
    console.log("ys is a boy");
}

JS utilise la méthode de simulation ci-dessus pour réaliser la création de classes. Sur cette base, nous ne sommes pas satisfaits du statu quo et souhaitons l'encapsuler et en faire un tout, ce qui est plus propice à. reflétant JS d'encapsulation.

3. Encapsulation des classes js

Ici, nous utilisons des fermetures pour l'implémenter. Tout d'abord, expliquons le concept des fermetures.
Concept de fermeture : Une fonction a le droit d'accéder aux variables dans une autre portée de la fonction, c'est-à-dire que la création d'une autre fonction à l'intérieur d'une fonction

est implémentée comme suit :

var Person = (function(){
    //静态私有属性方法
    var home = "China";    function sayHome(name){
        console.log(name + "'s home in " + home);
    }    //构造函数
    function _person(name, age){
        var _this = this;        //构造函数安全模式，避免创建时候丢掉new关键字
        if(_this instanceof _person){            //共有属性, 方法
            _this.name = name;
            _this.getHome = function(){
                //内部访问私有属性，方法
                sayHome(_this.name);
            };
            _this.test = sayHome; //用于测试
            //构造器
            _this.setAge = function(age){
                _this.age = age + 12;
            }(age);
        }else{            return new _person(name, age);
        }
    }    //静态共有属性方法
    _person.prototype = {
        constructor: _person,
        drink: "water",
        sayWord: function(){
            console.log("ys is a boy");
        }
    }    return _person;
})();

L'appel est le suivant :

var p1 = new Person("ys", 12);
p1.getHome();                   //ys's home in China
console.log(p1.age);            //24     

var p2 = Person("ys", 12);
p2.getHome();                   //ys's home in China
console.log(p2.age);            //24   

console.log(p2.test == p1.test);  //true, 证明静态私有变量共享性

Comme le code ci-dessus, nous utilisons js pour implémenter la classe

Résumé :

Quelques attributs publics. et méthodes , peuvent être définies sur statique, de sorte qu'à chaque fois qu'elles sont instanciées, il n'est pas nécessaire d'ouvrir des ressources mémoire supplémentaires pour obtenir un véritable partage

2. programmes internes Pour réaliser le partage pendant le traitement, définissez-le sur une méthode d'attribut privé statique,

3. Pour certaines méthodes d'attribut public, si vous souhaitez réaliser le partage dans un objet d'instance, définissez-le sur une méthode d'attribut prototype,
C'est tout pour cet article. Si vous ne comprenez pas tout le contenu de l'article, vous pouvez facilement maîtriser les deux côtés par vous-même !

Recommandations associées :

Différentes façons d'écrire l'encapsulation JavaScript

Encapsulation Javascript Explication détaillée des exemples de codes de fonction de téléphone mobile

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!