Question

我正在尝试学习和理解javascript中的对象，并提出了以下脚本：

    jQuery(document).ready(function(){
    var test = new Project('Anton');
    $('#btn_add_project').click(function(){
        test.addElement();
    });
});
function Project(name)
{
    this.panel = $('#worksheet_panel');
    this.name = name;
    function changeName(name)
    {
        this.name = name;
    }

    function addElement()
    {
        this.element =
            '<div id="1" class="col-md-3 table-bordered worksheet_overall_box" draggable="true" ondragstart="drag(event)">'+
                '<div class="table-bordered title_box">'+
                '<h4 class="title text-center worksheet_title">Dansk handicap</h4>'+
                '</div>'+
                '<div class="worksheet_box">'+
                '    <div class="list-group ">'+
                '        <a href="#" class="list-group-item">'+
                '            <h5 class="list-group-item-heading">Marc</h5>'+
                '            <p class="list-group-item-text">...</p>'+
                '        </a>'+
                '    </div>'+
                '    <div class="list-group ">'+
                '        <a href="#" class="list-group-item">'+
                '            <h5 class="list-group-item-heading">'+name+'</h5>'+
                '            <p class="list-group-item-text">...</p>'+
                '        </a>'+
                '    </div>'+
                '    <div class="list-group">'+
                '        <button class="btn-block btn-primary btn">Add</button>'+
                '    </div>'+
                '</div>'+
                '</div>';
        this.panel.appendChild(this.element);
    }


}

然而，当我运行click功能时，我收到以下错误：

    TypeError: test.addElement is not a function

test.addElement();

谁能告诉我我做错了什么？

Answer 1

addElement是一个仅在Project范围内可用的函数声明。将函数附加到prototype以使其可用于新实例，其中this引用实例。

Project.prototype.addElement = function() {
  this.element = ...
};

Answer 2

时尚在哪里，addElement是构造函数的内部函数。您必须将其添加到原型中，以便它可以在类的实例上使用。

在javascript中有不同的方法来编写类（即不同的语法），但最终都在相同的内部结构中。

我通常使用这种语法：一个声明类的anonimous函数。然后我将它导出到声明的命名空间。

// declare a namesapce 
var NAMESPACE = NAMESPACE || {};

(function() {

  function Project() {

  }

  Project.prototype.addElement = function() {

  }

  // export here!
  NAMESPACE.Project = Project;

})();

var test = new NAMESPACE.Project();

test.addElement();

Javascript对象函数

2 个答案: