2015-01-23 14 views
3

저는 (자바 스크립트 C/C++/Java에서) 자바 스크립트를 처음 사용했습니다.상호 의존적 인 자바 스크립트 파일로 구성된 프로젝트에서 jshint를 효율적으로 사용하는 방법은 무엇입니까?

linting은 좋은 일인 것처럼 보입니다. 그러나 많은 "정의되지 않은 변수/참조"오류가 발생하며 '좋은/효율적인 방법으로'문제를 해결하는 방법을 알지 못합니다.

내가 큰 프로젝트를 Html/Javascript로 작성했다고 가정 해 보겠습니다. 그래서 서로에 따라 JS-모듈, 예컨대 :

common_utils.js (depends on external lib d3.js) 
app1.js (depends on common_utils.js) 
app2.js (depends on common_utils.js as well) 

오른쪽 app1.js에 /로 commmon_utils.js를 참조/포함하는 방법이 없습니다 우선으로 분할하려면? html 파일에서 동적로드 만 사용할 수 있습니다.

는 (? 내 말은 다시 (! ... 이상한의 종류되지 않습니다 할 수있는 가장 일상적인 일처럼 보인다 : 나는 C에서오고 ++/자바))

좋아, 충분히 공정 따라서 jslint/hint는 d3.js가로드 될 때만 common_utils.js가 사용된다는 것을 알 수있는 방법이 없습니다. 모두가 '네임 스페이스'에 있기 때문에 문제 없습니다, 나는 나의 jshint 구성에

글로벌 D3

를 추가하지 않습니다. 예쁘지는 않지만 괜찮습니다.

내 common_utils.js는 어떻습니까? 해당 파일의 모든 단일 함수 정의에 대해 linter 예외를 수동으로 추가하고 싶지 않습니다.

자바 스크립트로 프로젝트를 구성하고 개발하는 방법에 대해 완전히 잘못된 점이 있습니까?

시간 내 주셔서 감사합니다.

답변

1

자바 스크립트로 프로젝트를 구성하고 개발하는 방법에 대해 완전히 잘못된 것이 있습니까?

아니요, 당신은 돈이 있습니다.

common_utils.js이 (가) 올바른 것으로 들리십니까? 즉, 귀하의 코드입니까? 나는 그것이 지금 당연하다고 생각할 것입니다.


당신은 당신이 모든 기능에 대한 예외를 추가하는 것을 발견하면, 당신은 아니에요 많은 쉽게 linting 것 namespacing .

d3js가 수행 중이거나주고받는 것임에 유의하십시오.

D3는 선택이라고 노드의 임의의 세트에서 작동 선언적 접근 방식을 사용 : 여기에 자신의 웹 사이트에서 d3 네임 스페이스 D3 사용의 예입니다.

d3.selectAll("p").style("color", "white");

d3 오브젝트 것을 참조 : 예를 들어, 당신은 위의 루프 를 다시 작성할 수 있습니까? 당신도 똑같은 일을해야합니다.

common_utils.js에 하나의 "상위"개체를 선언하고 모든 기능을 첨부해야합니다. 그런 다음 모두common_util.js의 기능을 얻으려면 JSL/힌트 설정에서 하나의 전역 만 선언하면됩니다.

두 가지 빠른 OO 예가 있습니다. 첫 번째는 아마도 가장 직설적 일 것입니다. 당신이을

참고는 function 키워드와 첫 번째 괄호 사이의 (공간)가 필요합니다. 즉, var spam = function()은 JSLint에서 정확하고 var spam = function()은 올바르지 않습니다. JSLint는 두 번째가 일반적인 명명 된 함수처럼 보이지만 할당이 아니라고 생각합니다. 공정하다.

/*jslint browser: true, devel: true, sloppy: true, white: true */ 
var commonUtils = {}; // create the "parent" object. 

// then add your functions to it, one by one. 
commonUtils.test1 = function (myString) { 
    if (console.log) { console.log("myString is: " + myString); } 
}; 

commonUtils.test2 = function (myString) { 
    window.alert("myString is: " + myString); 
}; 

... 나 -이 좀 더 일반적이다, 생각 - 당신이 위의 예를 가지고 일단 이해할 수있을만큼 쉽게 JSON 표기법을 사용할 수 있습니다 :

/*jslint browser: true, devel: true, sloppy: true, white: true */ 
var commonUtils = { 
    test1: function (myString) { 
     if (console.log) { console.log("myString is: " + myString); } 
    }, 
    test2: function (myString) { 
     window.alert("myString is: " + myString); 
    } 
}; 

go full object oriented도 중요하지만 지금은 필요하지 않은 것처럼 들릴 수도 있습니다. 네임 스페이스는 트릭을 수행해야합니다. 당신의 전역 목록에 이제 같은 코드로 호출 할 수 있습니다

...

/*jslint browser: true, devel: true, sloppy: true, white: true */ 
/*global commonUtils */ 

commonUtils.test1("console write"); 
commonUtils.test2("alert write"); 

유일한 항목은 상관없이 네임 스페이스에 얼마나 많은 기능 commonUtils 없습니다. Voila.

+0

고맙습니다. 그것은 의미가 있으며, 내 문제를 해결하고 유용한 배경 정보를 제공합니다. 그러나 JSL/Hint는 정의 된 변수/네임 스페이스에 의해 '숨김'될 때 맞춤법이 틀린 함수 호출을 더 이상 인식하지 못합니다. 예 : 'd3.thereIsNoSuchFunction()'은 에러로보고되지 않습니다. 그 유감! – nandaloo

+0

아, 전화하세요. JSLint는 파일에 따라 다르며 linter 범위 밖에서 함수 이름을 검사하는 것을 고려할 수도 있지만 좋은 결과를 얻을 수 있습니다. [Steve Sanderson의 블로그] (http://blog.stevensanderson.com/2012/08/17/using-jshint-inside-visual-studio-the-basics/) (KnockoutJS의 저자)는 JSHint 단점에 관한 관련된 점을 지적했다 : "자바 스크립트는 동적이기 때문에 런타임에 주어진 객체가 특정 속성을 가질 지 여부를 알 수 없습니다."그렇다고해도 좋은 경고가 좋을 것입니다. [WebStorm] (https://www.jetbrains.com/webstorm/)이이를 시도 할 수 있습니다. 기억할 수 없다. – ruffin

+0

WebStorm은 그것을 '약한 경고'라고보고합니다. 그게 뭔가요. 스티브 샌더슨이 좋은 지적을했기 때문에 가능한 모든 것 같습니다. 다시 한번 감사드립니다. – nandaloo