IT story

객체 지향 자바 스크립트 모범 사례?

hot-time 2020. 4. 4. 11:02
반응형

객체 지향 자바 스크립트 모범 사례? [닫은]


Javascript에서 큰 프로젝트를 코딩하고 있습니다. 해키 JS가 빠르게 읽을 수 없게되고이 코드를 깨끗하게하기를 원하기 때문에 마지막 것은 상당히 모험 이었다는 것을 기억합니다.

글쎄, 나는 lib를 구성하기 위해 객체를 사용하고 있지만 JS에서 것들을 정의하는 몇 가지 방법이 있는데, 범위, 메모리 관리, 네임 스페이스 등에 중요한 결과를 내포한다. EG :

  • 사용 var여부;
  • 파일 또는 (function(){...})()jquery 스타일로 항목을 정의합니다.
  • 사용 this여부;
  • function myname()또는 사용 myname = function();
  • 물체의 몸체에서 방법을 정의하거나 "시제품"을 사용하는 것;
  • 기타

그렇다면 JS에서 OO로 코딩 할 때 실제로 가장 좋은 방법은 무엇입니까?

학문적 설명은 여기서 실제로 기대되었습니다. 품질과 견고성을 다루는 한 책에 대한 링크는 따뜻하게 환영합니다.

편집하다 :

약간의 독서가 있지만 위의 질문에 대한 답변과 모범 사례에 여전히 관심이 있습니다.


`var` 사용 여부

var명령문에 변수를 도입해야합니다 . 그렇지 않으면 전역 범위에 도달합니다.

(Strict 모드에서 그 언급이의 가치 "use strict";) 변수 할당을 선언되지 않은 던졌습니다ReferenceError .

현재 JavaScript에는 블록 범위가 없습니다. Crockford 학교는 함수 본문의 시작 부분에 var 문넣도록 가르치고 Dojo의 스타일 가이드는 모든 변수가 가능한 가장 작은 범위에서 선언되어야한다고 읽습니다 . 합니다 ( let문 및 정의 자바 스크립트 1.7에서 소개는 ECMAScript를 표준의 일부가 아닙니다.)

전체 범위 체인을 찾는 것보다 빠르기 때문에 규칙적으로 사용되는 객체의 속성을 로컬 변수에 바인딩하는 것이 좋습니다. 최고의 성능과 낮은 메모리 소비를 위해 JavaScript 최적화를 참조하십시오 .

파일 또는`(function () {...}) ()`에서 사물 정의하기

코드 외부에서 객체에 도달 할 필요가없는 경우 전체 코드를 함수 표현식으로 묶을 수 있습니다.이를 모듈 패턴이라고합니다. 성능상의 이점이 있으며 코드를 최소화하고 모호하게 할 수 있습니다. 전역 네임 스페이스를 오염시키지 않도록 할 수도 있습니다. JavaScript로 함수 랩핑 을 사용하면 측면 지향 동작을 추가 할 수도 있습니다. Ben Cherry에는 모듈 패턴에 대한 자세한 기사가 있습니다.

`this` 사용 여부

JavaScript에서 의사 클래식 상속을 사용하는 경우을 사용하는 것을 피할 수 없습니다 this. 어떤 상속 패턴을 사용하는지는 맛의 문제입니다. 다른 경우에는 "this"없는 JavaScript 위젯 에 대한 Peter Michaux의 기사를 확인하십시오 .

`function myname ()`또는`myname = function ();`사용

function myname()함수 선언이며 myname = function();variable에 지정된 함수 표현식 myname입니다. 후자의 형식은 함수가 일류 객체이며 변수와 마찬가지로 무엇이든 할 수 있음을 나타냅니다. 그들 사이의 유일한 차이점은 모든 함수 선언이 특정 범위에서 중요 할 수있는 범위의 최상위에 게양된다는 것입니다. 그렇지 않으면 동일합니다. function foo()속기 형태입니다. 호이 스팅에 대한 자세한 내용은 JavaScript Scoping and Hoisting 기사를 참조하십시오.

객체의 본문에서 "프로토 타입"을 사용하여 메소드 정의

그것은 당신에게 달려 있습니다. JavaScript에는 의사 클래식, 프로토 타입, 기능 및 파트의 네 가지 객체 생성 패턴이 있습니다 ( Crockford, 2008 ). 각각의 장단점이 있습니다. 비디오 대화에서 Crockford를 보거나 Anon이 이미 제안한The Good Parts얻으십시오 .

프레임 워크

JavaScript 프레임 워크를 선택하고 해당 규칙과 스타일을 연구하고 자신에게 가장 적합한 관행과 패턴을 찾으십시오. 예를 들어, Dojo 툴킷 은 다중 상속을 지원하는 객체 지향 JavaScript 코드를 작성할 수있는 강력한 프레임 워크를 제공합니다.

패턴

마지막으로 일반적인 JavaScript 패턴 및 안티 패턴탐색하기 위한 블로그 가 있습니다 . JavaScript에 대한 코딩 표준이 있습니까? 라는 질문도 확인하십시오 . 스택 오버플로


이 질문을 한 후 읽거나 응용 프로그램에 넣은 내용을 적어 보겠습니다. 따라서 대부분의 답변은 위장관 RTMF의 위장에 속하기 때문에 좌절하지 않습니다. (제가 인정해야 할지라도 제안 된 책은 훌륭합니다).

Var 사용법

모든 변수는 JS의 상위 범위에서 이미 선언되어 있어야합니다. 따라서 새로운 변수를 원할 때 전역 변수를 인식하지 않고 조작하는 것과 같은 나쁜 놀라움을 피하기 위해 변수를 선언하십시오. 따라서 항상 var 키워드를 사용하십시오.

객체 make에서 변수를 private로 바꿉니다. 공용 변수를 선언하려면 this.my_var = my_value그렇게하십시오.

메소드 선언

JS에서는 메소드를 선언하는 수많은 방법입니다. OO 프로그래머에게는 가장 자연 스럽지만 효율적인 방법은 다음 구문을 사용하는 것입니다.

대상체 내부

this.methodName = function(param) {

/* bla */

};

재미있는 JS 범위로 인해 내부 함수가 "this"에 액세스 할 수 없다는 단점이 있습니다. Douglas Crockford는 "that"이라는 기존 로컬 변수를 사용하여이 제한을 무시할 것을 권장합니다. 그래서 그것은

function MyObject() {

    var that = this;

    this.myMethod = function() {

        jQuery.doSomethingCrazy(that.callbackMethod);

    };

};

자동 줄 끝에 의존하지 마십시오

JS는 ;잊어 버린 경우 줄 끝에 자동으로 추가하려고 합니다. 디버깅해야하는 오류가 발생하므로이 동작에 의존하지 마십시오.


첫 번째는 읽어한다고 프로토 타입 기반 프로그래밍 이 종류의 짐승의 당신이 무엇을 다루고 있는지 알 수 있도록 다음 번 봐 걸릴 MDC에서 자바 스크립트 스타일 가이드MDC에서 자바 스크립트 페이지를 . 또한 도구를 사용하여 코드 품질을 강제하는 것이 가장 좋습니다. JavaScript Lint 또는 기타 변형

OO를 사용하는 모범 사례는 코드 품질에 중점을 두는 것보다 패턴을 찾고자하는 것처럼 들리므로 Google 검색 에서 javascript 패턴jQuery 패턴을 살펴보십시오 .


John Resig (jQuery) 의 JavaScript Ninja의 비밀 을 확인하고 싶을 수도 있습니다 . "이 책은 중간 JavaScript 개발자를 대상으로 크로스 브라우저 JavaScript 라이브러리를 처음부터 작성하는 데 필요한 지식을 제공합니다."

초안은 게시자를 통해 제공됩니다. http://www.manning.com/resig/

Douglas Crockford는 자신의 홈페이지에 다음과 같은 멋진 JavaScript 기사를 제공합니다. http://www.crockford.com/


나는 종종 내 자바 스크립트에 MooTools를 사용하는 유일한 사람처럼 느낍니다.

그것은 약자 M의 Y O bject O riented 도구, Mootools의.

나는 자바 스크립트에서 OOP를 취하는 것을 정말로 좋아합니다. jquery와 함께 클래스 구현을 사용할 수도 있으므로 jquery를 버릴 필요가 없습니다 (mootools가 모두 수행하지만).

어쨌든 첫 번째 링크를 잘 읽고 두 번째 링크는 mootools 문서에 대한 것입니다.

MooTools 및 상속

MooTools 클래스


다음은 대부분의 기반을 다루는 책입니다.

고품질 응용 프로그램 및 라이브러리를위한 객체 지향 Javascript

참고 URL : https://stackoverflow.com/questions/907225/object-oriented-javascript-best-practices

반응형