Le principe de mise en œuvre et la méthode de réécriture de NEW en JS

L'opérateur new en JavaScript crée une instance d'un type d'objet défini par l'utilisateur ou une instance d'un objet intégré avec un constructeur. Cet article vous présentera le principe de mise en œuvre et la méthode de réécriture de NEW.

Quand il s'agit de nouveauté, elle sera certainement liée à des classes et des instances, telles que :

function Func() {
    let x = 100;    
    this.num = x +}
let f = new Func();

Dans le code ci-dessus, nous d'abord créer une fonction, En termes orientés objet, une instance de la classe Function est créée. Si la fonction est exécutée directement, c'est une fonction ordinaire. Si elle est exécutée en utilisant new, la fonction est appelée une classe personnalisée.

S'il s'agit d'une exécution de fonction ordinaire, elle fera plusieurs choses comme suit :

• Former un nouveau contexte d'exécution EC (Environnement d'exécution du contexte d'exécution)

• Former un objet variable AO (Activation Object), initialiser les arguments et l'affectation formelle des paramètres
  

• Initialiser la chaîne de portée
  

• Exécution de code
  

Si la nouvelle fonction est exécutée, elle a à la fois le côté exécution de fonction ordinaire et ses propres éléments uniques :

• Créez un objet par défaut, et cet objet est une instance de la classe actuelle

• Déclarez son pointeur this et laissez-le pointer vers cette instance nouvellement créée
  

• Peu importe qu'il écrive return ou non, l'instance nouvellement créée sera renvoyée. Il y a un point spécial ici si l'utilisateur renvoie le contenu lui-même et que la valeur renvoyée est. une valeur de type référence, puis l'instance renvoyée par défaut sera écrasée et la valeur renvoyée ne sera plus une instance de la classe
  

console.log(f);  //=>{num:200}
//f是Func这个类的实例 
//相当于给创建的实例对象新增一个num的属性 obj.num=200 （因为具备普通函数执行的一面，所以只有this.xxx=xxx才和创建的实例有关系，此案例中的x只是AO中的私有变量）

console.log(f instanceof Func); //=>TRUE instanceof用来检测某一个实例是否属于这个类

Chaque fois qu'un nouveau sort , c'est un nouveau L'objet instance de

console.log(f === f2); //=>false

Maintenant que nous savons ce que new a fait, essayons à nouveau new :

/* 
 * 内置NEW的实现原理 
 * @params
 *    Func：操作的那个类
 *    ARGS：NEW类的时候传递的实参集合
 * @return
 *    实例或者自己返回的对象
 */
function _new(Func, ...args) {
    //默认创建一个实例对象（而且是属于当前这个类的一个实例）
    let obj = {};

    //也会把类当做普通函数执行
    //执行的时候要保证函数中的this指向创建的实例
    let result = Func.call(obj, ...args);

    //若客户自己返回引用值，则以自己返回的为主，否则返回创建的实例
    if ((result !== null && typeof result === "object") || (typeof result === "function")) {
        return result;
    }
    return obj;
}

Essayons :

let f3 = _new(Func);
console.log(f3); // =>{num: 200}

On continue les tests :

Func.prototype.log = function () {
    console.log('ok');
}

let f4 = _new(Func);
f4.log(); //=>Uncaught TypeError: f4.log is not a function

Autrement dit, la méthode sur le prototype Func ne peut pas être appelée sur son instance. Il faut encore la modifier :

/* 
 * 内置NEW的实现原理 
 * @params
 *    Func：操作的那个类
 *    ARGS：NEW类的时候传递的实参集合
 * @return
 *    实例或者自己返回的对象
 */
function _new(Func, ...args) {
    //默认创建一个实例对象（而且是属于当前这个类的一个实例）
    // let obj = {};
    let obj = Object.create(Func.prototype);

    //也会把类当做普通函数执行
    //执行的时候要保证函数中的this指向创建的实例
    let result = Func.call(obj, ...args);

    //若客户自己返回引用值，则以自己返回的为主，否则返回创建的实例
    if ((result !== null && typeof result === "object") || (typeof result === "function")) {
        return result;
    }
    return obj;
}

. Cela devrait suffire.

let f6 = _new(Func);
f6.log(); //=>ok

Cet article provient de la rubrique tutoriel js, bienvenue pour apprendre !

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!