Прототипы и наследование в JavaScript?

Question

[vetsmen]

Пытаюсь вникнуть в наследование в Javascript, пишу на клиенте модуль для чата, в котором есть 2 функции: отправка сообщений и их прием.
Написал что-то подобное:

function Core() {
    this.game = null;
    this.chat = null;
    this.coreInfo = {
        'socket': {
            'ip'   : '...',
            'port' : '...'
        }
    };
};
 
Core.prototype.init = function() {
    var $sendMessage = $('.sendmsg');
 
    $sendMessage.on('click', function(){
        var $textMessage = $('.textmsg'),
            message = $textMessage.val();
 
        this.chat.sendMessage(message, function(){
            $textMessage.val('');
        });
    });
};
 
Core.prototype.initChat = function() {
    this.chat = function(){};
    this.chat.sendMessage = function(message) {
        socket.emit('message', message);
 
        return;
    };
 
    this.chat.onChatHistory = function(data) {
        newMessage(data);
 
        return;
    }
 
    function newMessage(data) {
        $('.messages').append('<div class="msg"><span>' + data.name + '</span><p>' + data.text +'</p></div>');
    };
};
 
Core.prototype.initSocket = function() {
    var socket = null;
 
    this.socket = socket = io.connect(this.coreInfo.socket.ip + ':' + this.coreInfo.socket.port);
    socket.emit('onChatHistory');
    socket.on('onChatHistory', this.onChatHistory);
};
 
$(document).ready(function(){
    Core = new Core();
 
    Core.init();
    Core.initChat();
    Core.initSocket();
});

Но есть вопросы:
1) Оно не работает, выбивает ошибку "Uncaught TypeError: Cannot read property 'apply' of undefined". Как я понял, это я где-то в наследовании ошибся, что-то неправильно определил, но где? Без наследования все работало.
2) Правильно ли я вообще наследую и определяю функции?

Answer 1

[Виктор Стороженко]

Core.prototype.initChat
this.chat.sendMessage = function(message) {
        socket.emit('message', message);
///// ???? что такое socket в этой функции?
        return;
    };

Я бы на вашем месте определил объекты chat, socket, game - протестировал их, а затем уже расширил Core с их помощью.
чтобы в итоге получилось что-то типа
const core = new Core()
core.extend(chat)
core.extend(socket)
...
Вот это выглядит странно - this.chat = function(){};

Сложно сказать правильно ли вы делаете... Core, chat, socket это синглтоны? если так, то нужно их сделать как синглтоны.
Если нет, то будут ли объекты Core без chat или socket? в общем правильность зависит от результата, который хотите получить.

Добавлю.
chat и socket связаны между собой. без сокета чат невозможен, ну и без чата сокет больше не используется (в этом коде). поэтому это один компонент, нет смысла его разделять и инициализировать как отдельные.
В общем присутствуют структурные непонятки, думаю вам нужно с ними разобраться.

Comments

[vetsmen]

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

[Виктор Стороженко]

Что вы имеете ввиду под "прототип функции"?
Я бы вам посоветовал этот вопрос более подробно изучить. Если вы имеете ввиду функцию Core (в вашем коде), то это функция-конструктор, ее вызовом со словом new вы создаете отдельный объект, и то что вы пишите в Core.prototype - это не прототип функции, а прототип создаваемого ей объекта.
примерно (ПРИМЕРНО) это равно
function Core() {
return {
game: null,
chat: null
...
};
}
тоесть она просто возвращает объект.
Короче сложно так в паре строк все это объяснить. Я вообще предпочитаю такие функции не использовать, мне синтаксис такой не кажется очень понятным.
Если вы изучаете вопрос с наследованием в JS то рекомендую так же почитать про такие методы Object как
Object.create()
Object.assign()
возможно что многое понятнее станет. В общем желаю вам успехов в этом - вопрос интересный, нужный!!! думаю достаточно быстро наступит "Ага!!!" момент)))

Answer 2

[gleendo]

Дело не в наследовании, а в методе apply, написано же. Консоль откройте, прочекайте строку с ошибкой и скиньте тот кусок кода в котором используется apply

Comments

[vetsmen]

Я более чем уверен, что наследую не совсем правильно, ибо не до конца вник в суть, но вот на что он ругается:

(function webpackUniversalModuleDefinition(root, factory) {
if(typeof exports === 'object' && typeof module === 'object')
module.exports = factory();
else if(typeof define === 'function' && define.amd)
define([], factory);
else if(typeof exports === 'object')
exports["io"] = factory();
else
root["io"] = factory();
})(this, function() {
return

Преимущественно на вторую строчку. Как я понял, это какой-то локальный файл, ибо его путь - webpack:///webpack/universalModuleDefinition