Prototype Наследование через прототипирование

@lexu · Регистрация: 22.01.2011

Студворк — интернет-сервис помощи студентам

Добрый день! Есть написанный плагин для jquery. Хочу разделить плагин на 3 плагина, чтобы они использовали общий код. Для этого в функцию хочу положить общие методы, константы и т.д. Установить прототип для плагина, чтобы унаследовать функции из общей функции, но почему-то нет доступа к вложенным в общую функцию методам. Подскажите как сделать выше описанное. Вот как пробовал:

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
function BasicWizard(){
    var error_setter = {
            '1' : 1
        },
        ok_setter = {
            '2' : 2
        },
        nothing_setter = [];
}
 
(function ( $ ){
    var error_setter = BasicWizard.error_setter;
    this.prototype = BasicWizard;
     
    $.fn.card_payment_form = function( ) {
        console.log(ok_setter);
        console.log(error_setter);
    };
})( JQuery );

Вызов:

JavaScript
1
$('div').card_payment_form();

Результат:

JavaScript
1
2
undefined
undefined

@BANO · 13.10.2015, 22:32

lexu, ошибка здесь

JavaScript
1
var error_setter = BasicWizard.error_setter;

у функции нету такого свойства

как я понял вы вообще не поняли что такое классы в js
вот, почитайте, поймите как это работает, а делите плагин на модули

Добавлено через 1 минуту

Сообщение от lexu

this.prototype = BasicWizard;

устанавливает объекту window.prototype равным функции

это непрофессионализм в чистейшем виде

@lexu · 14.10.2015, 11:22 **[ТС]**

BANO, я действительно не понимаю как установить прототип функции, чтобы наследовать методы прототипа. Я пришел из ООП языка и достаточно сложно освоить.
P.S. this.prototype = BasicForm устанавливает прототип в div, а не в window. Я пробовал вот такой вариант:

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
function BasicForm() {
    var
        ok_setter = [],
        error_setter = [],
        nothig_setter = [];
        
    var init = function () {
        throw new Exception('not initialized');
    };
}
 
function WizzardFrom() {
 var init = function () {
        // Тут инициализация всей формы, как было раньше
    };
} 
 
(function( $ ){
    WizzardFrom.prototype = BasicForm;
    
    $.fn.card_payment_form = function( method ) {
        var form = new WizzardFrom();
        
 
        if ( typeof method === 'object' || ! method ) {
            var _return = BasicForm.init.apply( form, arguments );
 
            return _return;
        } 
        else {
            $.error( 'Метод с именем ' +  method + ' не существует для jQuery.card_payment_form' );
        }    
 
    };
}) (JQuery);

Тоже нет доступа к методам BasicForm из анонимной функции

@BANO · 14.10.2015, 19:15

lexu, зачем вставлять в прототип window?
объясните пожалуйста

Добавлено через 41 секунду
учитывая, что у window нет прототипа

@lexu · 15.10.2015, 11:08 **[ТС]**

Желанием было вставить в функцию прототипом другую, чтобы наследовать ее методы и свойства. Хоть я и понимал, что в this у меня объект window, но других предположений как это сделать не было. Вот и взял конструкцию из ООП. На самом деле я ожидал совета, а не вопроса почему я делаю именно так.
В итоге нашел на форуме, что если в BasicForm в его прототип установить методы, то при простановке прототипа в другую функцию становятся доступны методы этого BasicForm:

JavaScript
1
2
3
4
5
6
7
8
9
10
11
function BasicForm() {
    BasicForm.prototype.ok_setter = [];
    var error_setter = [];
}
var Form = new BasicForm();
Form .init() = function(){
     console.log(ok_setter);
     console.log(error_settor);
}
 
Form.init();

Единственное что мне непонятно - это почему нужно именно в прототип BasicForm указывать свойства... У вас есть ответ или это просто особенность прототипирования? По какой причине доступен ok_setter и не доступен error_settor?

@BANO · 16.10.2015, 00:17

Сообщение от lexu

По какой причине доступен ok_setter и не доступен error_settor?

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

в js классов нет, и все стандартные методы доступные в других языках тут посылаются на...
в js всё - объект(строка, функция, число, и тд)
у всех объектов можно задать и получить свойство

ваш код может и рабочий, но я его вижу как слова "Папо Вася пошла на улицо", вроде понятно, но не грамматно

тк вот, когда мы делаем объект, мы на самом деле вызываем функцию, и this передаём ей как пустой объект
и результатом выполнения этой функции будет то, что она поставила в свойства объекта
код примерно такой

JavaScript
1
2
3
4
5
function Class(tem){
    this.tem=tem;
}
var a=new Class; // пустой класс, типа "класс" имеющий свойство tem равное undefined
var b=new Class("tem") // класс имеющий свойство tem равное "tem"

а теперь прототипы
обычно в функции конструкторе(в прошлом примере это class) задаются параметры, которые генерятся динамически, в звисемости от параметров, переданных при инициализации

JavaScript
1
2
3
4
5
function Class(tem){
    this.tem=tem*tem;
}
a=new Class(1); // a.tem==1
b=new Class(2); // b.tem==4

а остальные свойства и методы, которые у всех классов одинаковые, записываются в прототип

JavaScript
1
2
3
4
5
6
7
8
9
function Class(tem){
    this.tem=tem*tem;
}
Class.prototype.log=function(){
    alert(this.tem)
}
a=new Class(1); // a.tem==1
b=new Class(2); // b.tem==4
a.log()

а ещё меня поразила строчка

JavaScript
1
Form .init() = function()

она выдаст ошибку(ds наверное с с++ перешли к нам) поскольку у класса НЕТ ПОКА ТАКОГО МЕТОДА, А ВЫ ЕГО УЖЕ ВЫЗЫВАЕТЕ

короче ваш код не правильный совершенно
вот как надо

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
function BasicForm(){}; // создаём пустой конструктор класса
BasicForm.prototype={ // и задам прототип для класса
    init: function(){
        console.log(this.ok_setter);
        console.log(this.error_settor);
    },
    ok_setter: [],
    error_setter: []
};
 
var Form=new BasicForm;
Form.init();

Новые блоги и статьи Все статьи Все блоги /
Как дизайн сайта влияет на конверсию: 7 решений, которые реально повышают заявки Neotwalker 08.03.2026 Многие до сих пор воспринимают дизайн сайта как “красивую оболочку”. На практике всё иначе: дизайн напрямую влияет на то, оставит человек заявку или уйдёт через несколько секунд. Даже если у вас. . .	Модульная разработка через nuget packages DevAlt 07.03.2026 Сложившийся в . Net-среде способ разработки чаще всего предполагает монорепозиторий в котором находятся все исходники. При создании нового решения, мы просто добавляем нужные проекты и имеем. . .	Модульный подход на примере F# DevAlt 06.03.2026 В блоге дяди Боба наткнулся на такое определение: В этой книге («Подход, основанный на вариантах использования») Ивар утверждает, что архитектура программного обеспечения — это структуры,. . .	Управление камерой с помощью скрипта OrbitControls.js на Three.js: Вращение, зум и панорамирование 8Observer8 05.03.2026 Содержание блога Финальная демка в браузере работает на Desktop и мобильных браузерах. Итоговый код: orbit-controls-threejs-js. zip. Сканируйте QR-код на мобильном. Вращайте камеру одним пальцем,. . .
SDL3 для Web (WebAssembly): Синхронизация спрайтов SDL3 и тел Box2D 8Observer8 04.03.2026 Содержание блога Финальная демка в браузере. Итоговый код: finish-sync-physics-sprites-sdl3-c. zip На первой гифке отладочные линии отключены, а на второй включены:. . .	SDL3 для Web (WebAssembly): Идентификация объектов на Box2D v3 - использование userData и событий коллизий 8Observer8 02.03.2026 Содержание блога Финальная демка в браузере. Итоговый код: finish-collision-events-sdl3-c. zip Сканируйте QR-код на мобильном и вы увидите, что появится джойстик для управления главным героем. . . .	Реалии Hrethgir 01.03.2026 Нет, я не закончил до сих пор симулятор. Эта задача сложнее. Не получилось уйти в плавсостав, но оно и к лучшему, возможно. Точнее получалось - но сварщиком в палубную команду, а это значит, в моём. . .	Ритм жизни kumehtar 27.02.2026 Иногда приходится жить в ритме, где дел становится всё больше, а вовлечения в происходящее — всё меньше. Плотный график не даёт вниманию закрепиться ни на одном событии. Утро начинается с быстрых,. . .

@BANO Ренегат 1740 / 1085 / 386 Регистрация: 06.08.2014 Сообщений: 5,203 Записей в блоге: 1
	14.10.2015, 19:15
	lexu, зачем вставлять в прототип window? объясните пожалуйста Добавлено через 41 секунду учитывая, что у window нет прототипа 0