带有方法的 Javascript 对象返回 "has no method ' 我的方法名称'"错误

Question

我正在尝试使用 JavaScript 中的方法构建自己的对象，但是，我第一次尝试失败，以下代码返回完整的代码以及“在 chrome 开发工具控制台中没有方法“writeOut”。

    var link = function bhLink(options)  { 

        defaultOptions = {
            targetURL: '#',
            target: '_blank',
            textColor: '#000',
            bgColor: '#fff',
            font: 'Arial',
            fontSize:  '12px',
            lineHeight: '12px',
            text: '[Test]'
        }

            if (typeof options == 'object') {
                options = $.extend(defaultOptions, options);
            } else {
                options = defaultOptions;
            }

        link.prototype.writeOut = function() {
            return $('<a></a>')
                .prop({'href':this.targetURL, 'target': this.target})
                .css({'font-family':this.font, 'color':this.textColor, 'font-size': this.fontSize, 'line-height':this.lineHeight});
        }
    } // end link

我使用它就像

$('#id_of_some_button').click(function(e) {
    e.preventDefault();
    $('#id_of_some_div').html(link.writeOut);
});

点击事件和链接都在 $(document).ready({}); block 内。

有什么想法吗？

编辑 =========================================== =======

添加了选项作为参数和 if 语句来检查是否提供了选项..

Answer 1

对于尝试构建包含方法的对象，您的语法非常奇怪。首先，您尝试仅使用 this 访问 defaultOptions 对象。其次，在html() block 中调用writeOut只是传递函数引用，而不是实例化函数。试试这个:

var link = {    
    defaultOptions: {
        targetURL: '#',
        target: '_blank',
        textColor: '#000',
        bgColor: '#fff',
        font: 'Arial',
        fontSize: '12px',
        lineHeight: '12px',
        text: '[Test]'
    },
    writeOut: function () {
        return $('<a></a>', { 
            'text': this.defaultOptions.text,
            'href': this.defaultOptions.targetURL,
            'target': this.defaultOptions.target
        })
        .css({
            'font-family': this.defaultOptions.font,
            'color': this.defaultOptions.textColor,
            'font-size': this.defaultOptions.fontSize,
            'line-height': this.defaultOptions.lineHeight
        });
    }    
} // end link

$('#id_of_some_button').click(function (e) {
    e.preventDefault();
    $('#id_of_some_div').append(link.writeOut());
});

Example fiddle