Wie simuliert JavaScript die Implementierung des neuen Schlüsselworts? (mit Code)

Im Inhalt dieses Artikels geht es darum, wie JavaScript die Implementierung des neuen Schlüsselworts simuliert? (Beigefügt ist der Code), der einen gewissen Referenzwert hat. Freunde in Not können sich darauf beziehen. Ich hoffe, er wird Ihnen hilfreich sein.

Ich war in letzter Zeit zu beschäftigt mit der Arbeit und habe meinen Blog seit fast zwei Wochen nicht aktualisiert. Obwohl der Arbeitsinhalt mich erheblich verbessert hat Ich habe immer das Gefühl, dass ich mit vergrabenem Kopf weitergehe. Gelegentlich muss ich den Kopf heben und sehen, ob meine aktuelle Situation nicht meinen Erwartungen entspricht, deshalb gehe ich am Wochenende immer noch zu Starbucks, um ein paar Worte zu schreiben.

Heute zeichnen wir die Simulationsimplementierung des neuen Schlüsselworts in JavaScript auf. Bevor wir ein bestimmtes Sprachverhalten simulieren, sollten wir durch Übung die Wissenspunkte besser beherrschen Warum wird in vielen Vorstellungsgesprächen nach Simulationsimplementierungen gefragt, um die Tiefe des Wissens des Kandidaten zu prüfen?

function Person(name) {
    this.name = name;
}
var person = new Person('jayChou');
typeof(person)  // "object"
person instanceof Person  // true
person.__proto__ === Person.prototype  // true
person.constructor === Person  //  true
person.constructor === Person.prototype.constructor  // true

Wie oben zu sehen ist:

1. new erstellt ein neues Objekt und gibt es zurück, das eine Instanz des Konstruktors

2. Das Konstruktorattribut der Objektinstanz ist eigentlich das Konstruktorattribut des Prototypobjekts des Konstruktors

3. Das __proto__ der Objektinstanz ist dem Prototypobjekt des Konstruktors zugeordnet

Der obige Inhalt enthält Wissen über Prototypobjekte und Prototypketten in JavaScript. Studenten, die nicht klar genug sind, können meinen vorherigen Blog lesen.

Da new ein Schlüsselwort in JS ist, können wir das Schlüsselwort nicht implementieren, aber wir können das Verhalten des neuen Schlüsselworts durch Funktionen simulieren.

1. Grundidee

Wenn wir wissen, was das neue Schlüsselwort bewirkt, dann haben wir die Grundidee für die Simulationsimplementierung.

/**
 * 模拟实现 JavaScript new 操作符
 * @param  {Function} constructor [构造函数]
 * @return {Object|Function|Regex|Date|Error}      [返回结果]
 */
function mockNew() {
    // 创建一个空对象
    let resultObj = new Object();

    // 取传入的第一个参数，即构造函数，并删除第一个参数。
    let constructor =  Array.prototype.shift.call(arguments);
    
    // 类型判断，错误处理
    if(typeof constructor !== "function") {
        throw("构造函数第一个参数应为函数");
    }
    
    // 绑定 constructor 属性
    resultObj.constructor = constructor;
    
    // 关联 __proto__ 到 constructor.prototype
    resultObj.__proto__ = constructor.prototype;
    
    // 将构造函数的 this 指向返回的对象
    constructor.apply(resultObj, arguments);
    
    // 返回对象
    return resultObj;
}

function Person(name) {
    this.name = name;
}


var person = mockNew(Person, "jayChou");

console.log(person);

// constructor: ƒ Person(name)
// name: "jayChou"
// __proto__: Object

Der Grundgedanke ist richtig! Also haben wir die vorläufige Simulation des neuen Schlüsselworts abgeschlossen. Freunde können es selbst eingeben, um zu sehen, ob sie jeden Codesatz verstehen können.

2. Rückgabewerte verarbeiten

Konstruktoren sind ebenfalls Funktionen mit unterschiedlichen Arten von Rückgabewerten. Manchmal gibt der Konstruktor den angegebenen Objektinhalt zurück, sodass dieser Teil verarbeitet werden muss.

/**
 * 模拟实现 JavaScript new 操作符
 * @param  {Function} constructor [构造函数]
 * @return {Object|Function|Regex|Date|Error}      [返回结果]
 */
function mockNew() {
    // 创建一个空对象
    let emptyObj = new Object();

    // 取传入的第一个参数，即构造函数，并删除第一个参数。
    // 关于为什么要用 Array.prototype.shift.call 的形式，见之前的博客文章 《JavaScript之arguments》
    let constructor =  Array.prototype.shift.call(arguments);
    
    // 类型判断，错误处理
    if(typeof constructor !== "function") {
        throw("构造函数第一个参数应为函数");
    }
    
    // 绑定 constructor 属性
    emptyObj.constructor = constructor;
    
    // 关联 __proto__ 到 constructor.prototype
    emptyObj.__proto__ = constructor.prototype;
    
    // 将构造函数的 this 指向返回的对象
    let resultObj = constructor.apply(emptyObj, arguments);
    
    // 返回类型判断, 如果是对象，则返回构造函数返回的对象
    if (typeof resultObj === "object") {
        return resultObj
    }
    
    // 返回对象
    return emptyObj;
}

function Person(name) {
    this.name = name;
    return {
        name: this.name,
        age: 40
    }
}


var person = mockNew(Person, "jayChou");

console.log(person);

// {name: "jayChou", age: 40}
// age: 40
// name: "jayChou"
// __proto__: Object

Wenn der Rückgabewert ein benutzerdefiniertes Objekt zurückgibt, gibt die simulierte neue Funktion das benutzerdefinierte Objekt zurück.

Zusammenfassung

Die Bedeutung des JavaScript-Schlüsselworts new besteht darin, einer gewöhnlichen Funktion zu ermöglichen, ein neues Objekt zu generieren und das

der Objektinstanz mit dem Prototypobjekt der Funktion zu verknüpfen. __proto__

Einige Teile dieses Artikels erfordern einige Vorkenntnisse, aber insgesamt ist er relativ leicht zu verstehen.

Das obige ist der detaillierte Inhalt vonWie simuliert JavaScript die Implementierung des neuen Schlüsselworts? (mit Code). Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!