CODEWITHSUNDEEP
javascript
Goldenbough
Goldenbough

Reputation: 93

prototype function error : is not a function

I tried to encapsulate a javascript object and declared some prototype function. But there were some errors.

Here is my code:

const editor_theme = require('./editor-theme.js')

let defaultTheme = new editor_theme.Editor_Theme('{"titlebar_color": "f0f0f0", "background_color": "ffffff"}')
defaultTheme.setTitlebarColor('888888')
console.log(defaultTheme.getTitlebarColor())

//main.js

module.exports = {
    Editor_Theme: function (data) {
        var _themeData = JSON.parse(data)

        var _titlebar_color = _themeData.titlebar_color
        var _background_color = _themeData.background_color

        const Func = function() { }

        Func.prototype = {
            getTitlebarColor : function () {
                return _titlebar_color
            },
            getBackgroundColor : function () {
                return _background_color
            },
            setTitlebarColor : function (titlebarColor) {
                _titlebar_color = titlebarColor || _titlebar_color
            }
        }

        Object.freeze(Func)
        Object.freeze(Func.prototype)

        return Func
    }

}


//editor-theme.js

The error log is it:

Uncaught TypeError: defaultTheme.setTitlebarColor is not a function

Upvotes: 1

Views: 1015

Answers (1)

FZs
FZs

Reputation: 18639

Your constructor now returns another constructor function, not an object. Return an instance of that constructor instead:

// module.exports = {
let moduleExports = {

  Editor_Theme: function(data) {

    var _themeData = JSON.parse(data)

    var _titlebar_color = _themeData.titlebar_color
    var _background_color = _themeData.background_color

    const Func = function() {}

    Func.prototype = {
      getTitlebarColor: function() {
        return _titlebar_color
      },
      getBackgroundColor: function() {
        return _background_color
      },
      setTitlebarColor: function(titlebarColor) {
        _titlebar_color = titlebarColor || _titlebar_color
      }
    }

    Object.freeze(Func)
    Object.freeze(Func.prototype)

    return new Func() //Instantiate constructor
  }

}

// const editor_theme = require('./editor-theme.js')
const editor_theme = moduleExports

let defaultTheme = new editor_theme.Editor_Theme('{"titlebar_color": "f0f0f0", "background_color": "ffffff"}')
defaultTheme.setTitlebarColor('888888')
console.log(defaultTheme.getTitlebarColor())

Or even better, just Object.create an object with a custom prototype:

// module.exports = {
let moduleExports = {

  Editor_Theme: function(data) {

    var _themeData = JSON.parse(data)

    var _titlebar_color = _themeData.titlebar_color
    var _background_color = _themeData.background_color

    const prototype = {
      getTitlebarColor: function() {
        return _titlebar_color
      },
      getBackgroundColor: function() {
        return _background_color
      },
      setTitlebarColor: function(titlebarColor) {
        _titlebar_color = titlebarColor || _titlebar_color
      }
    }

    Object.freeze(prototype)

    return Object.create(prototype) //Object with custom prototype
  }

}

// const editor_theme = require('./editor-theme.js')
const editor_theme = moduleExports

let defaultTheme = new editor_theme.Editor_Theme('{"titlebar_color": "f0f0f0", "background_color": "ffffff"}')
defaultTheme.setTitlebarColor('888888')
console.log(defaultTheme.getTitlebarColor())

Upvotes: 2

Related Questions