자바 스크립트 모듈 패턴이 작동하지 않습니다.

저는 온라인에서 몇 가지 예제에 따라 코드에서 모듈 패턴을 구현하려고합니다. 달성하려는 것은 단순히 내 HTML에서 버튼 클릭 이벤트를 (작동하지 않는) 함수에 바인딩하는 것입니다. 아래 내 HTML입니다 :자바 스크립트 모듈 패턴이 작동하지 않습니다.

여기

//CRUD Start 
var Rutherford = Rutherford || {}; 
Rutherford.crud = function() { 

    function _readLists() { 
    alert("am here"); 
    } 

    return { 
    readLists: _readLists 
    } 
} 

Rutherford.Initiate = function() { 
    $("#btn-msg").click(Rutherford.crud.readLists); 
} 

$(function() { 
    Rutherford.Initiate(); 
});

뿐만 아니라 내 plunker에 대한 링크입니다 : 여기

<!DOCTYPE html> 
<html> 

    <head> 
    <script data-require="[email protected]*" data-semver="1.3.7" src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.7/angular.js"></script> 
    <script data-require="[email protected]*" data-semver="2.1.1" src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
    <link rel="stylesheet" href="style.css" /> 
    <script src="script.js"></script> 
    </head> 

    <body> 
    <h1>Hello Plunker!</h1> 
    <input type="button" id="btn-msg" value="click me"/> 
    </body> 

</html>

와 나의 JS입니다 http://plnkr.co/edit/tA94lzMPHkUOr8QuyJK8?p=preview

에 achiev하려고 무엇을 모든 e는 버튼을 함수에 바인딩하는 것입니다.

출처

2015-01-10 Brittany Rutherford

익명 기능을 호출해야하며 할당하지 않아야합니다. 참조 () 아래 : 여기

Rutherford.crud = (function() { 

    function _readLists() { 
    alert("am here"); 
    } 

    return { 
    readLists: _readLists 
    } 
}());

의 업데이트 plunkr이 변화 : http://plnkr.co/edit/uiWHmtkMFEKywvFRk6DF?p=info

출처

2015-01-10 14:44:10 Brandon

안녕하세요, Brandon 님, 아직 작동하지 않습니다. 내게 plunker로 보여줄 수 있습니까? –

내가 생각 에반 놀즈이 말을하고 싶다고 다음과 같은 경우

가

//CRUD Start 
var Rutherford = Rutherford || {}; 
Rutherford.crud = (function() { 

    function _readLists() { 
    alert("am here"); 
    } 

    return { 
    readLists: _readLists 
    } 
})(); 

Rutherford.Initiate = function() { 
    $("#btn-msg").click(Rutherford.crud.readLists); 
} 

$(function() { 
    Rutherford.Initiate(); 
});

이 제대로 작동 것을 Rutherford을 싱글 톤으로 사용할 수 있습니다.

출처

2015-01-10 14:50:53

하지만하지 않습니다'Rutherford.crud = (함수() { 기능 _readLists() { 경고() "여기입니다"; } 반환 { readLists : _readLists } 을}()); ' 코드를 즉시 실행 하시겠습니까? 함수 정의를 crud에 저장하고 싶지만 IIFY는 바로 실행합니다. 맞습니까? –

이 crud 함수를 사용하는 방법에 따라 다릅니다. 이 클로저를 사용하면 Initiate를 호출 할 때가 아니라 구문 분석시 코드가 실행됩니다. 이것은 crud 객체가 함수의 반환 된 객체 만 포함하고 정의는 포함하지 않는다는 것을 의미합니다. 정의를 보존하고 crud 함수를 다시 사용하려면 Initiate에서 실행하여 새 객체를 만들어야합니다. 저는 첫 번째 해결책이 당신의 경우에 더 좋다고 생각합니다. –

삽입/삭제 등의 모든 중요한 작업을 저장하는 유틸리티로 crud 함수를 갖고 싶습니다. 무엇이 가장 좋은 방법입니까? –

자바 스크립트 모듈 패턴이 작동하지 않습니다.

답변

관련 문제