2014-02-23 12 views
0

내가 자바 스크립트에서 개체를 배우고 이해하려고 노력하고 다음과 같은 스크립트에 도달했습니다 :자바 스크립트 객체의 기능

TypeError: test.addElement is not a function 

test.addElement(); 
: 그러나

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); 
    } 


} 

나는 다음과 같은 오류를 얻을 클릭 기능을 실행할 때

누구든지 내가 뭘 잘못하고 있다고 말할 수 있습니까?

+0

자바 스크립트에서 프로토 타입을 사용하는 것에 대해 더 알고 싶습니다. 'this'의 가치는 무엇입니까. 다음 답변이 도움이 될 수 있습니다. http://stackoverflow.com/a/16063711/1641941 – HMR

답변

1

addElementProject 범위 내에서만 사용할 수있는 함수 선언입니다. 새 인스턴스에 사용할 수 있도록 기능을 prototype에 연결하십시오. 여기서 this은 인스턴스를 나타냅니다.

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

http://www.w3schools.com/js/js_objects.asp의 변경 이름 기능이 왜 작동하지 않는지 설명 할 수 있습니까? 프로토 타입이 필요하며 프로토 타입이 무엇인지 설명하십시오. –

+0

W3Schools는 최고의 리소스가 아닙니다. http://www.w3fools.com/을 참조하십시오. 객체, 프로토 타입, 상속에 대한 자세한 내용은 [MDN] (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Inheritance_and_the_prototype_chain)을 참조하십시오. – elclanrs

1

fashion 여기서 addElement는 생성자의 내부 함수입니다. 프로토 타입에 추가하여 클래스의 인스턴스에서 사용할 수 있도록해야합니다.

클래스를 자바 스크립트 (즉, 다른 구문)로 코딩하는 데는 여러 가지 방법이 있지만 모두 동일한 내부 구조로 끝납니다.

보통이 구문을 사용합니다 : 클래스를 선언하는 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();