JavaScript берет на себя управление новыми

Как быстро начать работу с VUE3.0: Введите обучающее

предисловие.

Что new ?

Оператор new создает экземпляр определяемого пользователем типа объекта или одного из встроенных типов объектов, у которого есть конструктор.

Это все еще немного непонятно, просто взглянув на определение. Давайте рассмотрим конкретный пример, чтобы понять функцию new в JavaScript .

Например

// В реальной жизни вы не можете похудеть, но должны оставаться стройными онлайн function Thin_User(name, age) {
    это.имя = имя;
    this.age = возраст;
}

Thin_User.prototype.eatToMuch = функция () {
    // Мечтаем и оставляем толстые слезы console.log('я так много ем, но я очень худой!!!');
}

Thin_User.prototype.isThin = true;

const xiaobao = новый Thin_User('zcxiaobao', 18);
console.log(xiaobao.name); // zcxiaobao;
console.log(xiaobao.age // 18);
console.log(xiaobao.isThin); // правда
// я так много ем, но я очень худая!!!
xiaobao.eatToMuch();

В приведенном выше примере мы можем обнаружить xiaobao может:

• получать доступ к свойствам в конструкторе Thin_User
• получать доступ к свойствам в Thin_User.prototype

и описывать его более прямо, new делает следующее:

• создает пустой объект, __proto__->Thin_User.prototype объекта
• выполняет конструктор и указывает this на новый объект
,
• чтобы вернуть новый объект.

Дополнительные инструкции:

поскольку new является ключевым словом, мы не можем переопределить его, как метод высокого порядка моделирования массивов, поэтому мы пишем. функция createObject для имитации new эффекта. Использование следующее:

function Thin_User(name, age) {}

const u1 = новый Thin_user(...)
const u2 = createObject(Thin_User, ...a)

Предварительное моделирование

Согласно приведенному выше анализу, общие шаги для написания createObject следующие:

• Создайте новый объект obj
• и установите obj.__proto__->constructor.prototype ( но JavaScript не рекомендует непосредственно изменяя атрибуты __proto__, метод setPrototypeOf предназначен для изменения прототипа .
• Используйте constructor.call/apply(obj, ...) для добавления атрибутов в obj и
• возврата obj

__proto__和prototype . Для полного понимания работы вы можете просмотреть JavaScript. прототипы и цепочки прототипов.
call/apply вы можете просмотреть руководство по JavaScript по вызову и применению.

Изучив их, мы можем написать первую версию кода:

function createObject(Con) {.
    //Создаем новый объект obj
    // var obj = {}; также может быть var obj = Object.create(null);

    // Преобразование obj.__proto__ -> прототип конструктора // (не рекомендуется) obj.__proto__ = Con.prototype
    Object.setPrototypeOf(obj, Con.prototype);

    //Выполняем конструктор Con.apply(obj, [].slice.call(arguments, 1));

    // Возвращаем новый объект return obj;}

Эффект возвращаемого значения

Как мы все знаем, функции имеют возвращаемые значения, поэтому, если конструктор имеет возвращаемое значение, какой результат возвращается после окончательного выполнения new ?

Возвращаемое значение является базовым типом.

Предполагая, что возвращаемое значение конструктора является базовым типом, давайте посмотрим на окончательный возвращаемый результат:

function Thin_User(name, age) {
    это.имя = имя;
    this.age = возраст;
    вернуть «я буду худым навсегда»;
}

Thin_User.prototype.eatToMuch = функция () {
    console.log('Я так много ем, но я очень худой!!!');
}

Thin_User.prototype.isThin = true;

const xiaobao = новый Thin_User('zcxiaobao', 18);
console.log(xiaobao.name); // zcxiaobao;
console.log(xiaobao.age // 18);
console.log(xiaobao.isThin); // правда
// я так много ем, но я очень худая!!!
xiaobao.eatToMuch();

Конечный возвращаемый результат, похоже, подвергается каким-либо вмешательствам. Разве конструктор не обрабатывает возвращаемое значение?

Не волнуйтесь, давайте продолжим тестировать ситуацию, когда возвращаемое значение является объектом.

Возвращаемое значение — это объектная

функция Thin_User(name, age) {
    это.имя = имя;
    this.age = возраст;
    возвращаться {
        имя: имя,
        возраст: возраст * 10,
        толстый: правда
    }
}

Thin_User.prototype.eatToMuch = функция () {
    // Мечтаем и оставляем толстые слезы console.log('я так много ем, но я очень худой!!!');
}

Thin_User.prototype.isThin = true;

const xiaobao = новый Thin_User('zcxiaobao', 18);
// Ошибка: xiaobao.eatToMuch не является функцией
xiaobao.eatToMuch();

Когда я выполнил eatToMuch , консоль напрямую сообщила об ошибке, и текущей функции не было, поэтому я напечатал объект xiaobao :

Было обнаружено, что age объекта xiaobao изменился, и был добавлен атрибут fat , который точно совпадает с возвращаемым значением конструктора.

Прочитав эти два примера, вы сможете в принципе прояснить ситуацию, когда конструктор возвращает значение: когда конструктор возвращает объект, объект возвращается напрямую.

Окончательная

функция моделирования createObject(Con) {
    //Создаем новый объект obj
    // var obj = {}; также может быть var obj = Object.create(null);

    // Преобразование obj.__proto__ -> прототип конструктора // (не рекомендуется) obj.__proto__ = Con.prototype
    Object.setPrototypeOf(obj, Con.prototype);

    //Выполняем конструктор и принимаем возвращаемое значение конструктора const ret = Con.apply(obj, [].slice.call(arguments, 1));

    // Если возвращаемое значение конструктора является объектом, верните объект напрямую // В противном случае верните obj
    return typeof(ret) === 'объект' ? ret: obj;}