Допустим, вы хотите использовать шаблон проектирования модуля javascript для создания пользовательского компонента. В этом примере мы создадим простой компонент формы. Типичный шаблон проектирования выглядит следующим образом:

Этот шаблон дает нам контроль и безопасность над нашими функциями. Однако что, если мы хотим предоставить больше возможностей для настройки функции сборки?

Здесь мы можем использовать прототипную функцию и свойство valueOf. Внутри simpleForm iifie мы используем синтаксис функции с заглавной F вместе со словом прототип и именем нашей функции, которую мы хотим предоставить (строка 2). эм>). Затем мы можем использовать значение, возвращаемое этой функцией, внутри нашего метода сборки, поскольку функция-прототип имеет глобальную область видимости (строка 22 | title.innerHTML = simpleForm.valueOf.title()). Вы заметите, что если вы не используете этот синтаксис Function.protoype, ваша функция недоступна вне этого файла.

Что приведет к:

Теперь к захватывающей части! Мы можем легко перезаписать эту функцию-прототип в нашем JS-файле, где мы вызываем наш компонент. (это отдельный файл, который также включен в наш файл HTML)

Мы также можем передавать данные нашим функциям-прототипам. В строке 5 мы передаем значение индекса нашего экземпляра цикла в строке 31. Это означает, что метод Function.prototype.placeholder имеет доступ к индексу.

Теперь, вернувшись в наш вызывающий файл, мы можем использовать оператор switch для вставки пользовательских заполнителей для наших полей ввода.

Тада!