자바 스크립트 클라이언트 코드에 대한 대체 "아키텍처"접근 방식?

https://stackoverflow.com/questions/32540

09-06-2019
|

문제

자바 스크립트 코드는 어떻게 구성되어 있습니까? MVC와 같은 패턴을 따르나요?

저는 한동안 부수적 인 프로젝트를 진행해 왔으며, 더 많이 얻을수록 제 웹 페이지는 더 많은 기능을 갖춘 애플리케이션으로 변모했습니다. 지금은 jQuery 를 고수하고 있지만 페이지의 논리는 일부 조직 또는 감히 "아키텍처"가 필요합니다. 첫 번째 접근 방식은 "MVC-ish"입니다.

'모델'은 도우미로 확장되는 JSON 트리입니다.
보기는이를 조정하는 DOM과 클래스입니다.
컨트롤러는 이벤트 처리를 연결하고 뷰 또는 모델 조작을 시작하는 객체입니다.
그러나 나는 다른 사람들이 어떻게보다 실질적인 자바 스크립트 앱을 구축했는지에 매우 관심이 있습니다. 저는 GWT 나 다른 서버 지향적 인 접근 방식에 관심이 없습니다 ... "javaScript + "의 접근 방식에만 관심이 있습니다.
참고 : 이전에 JavaScript는 "정말 OO가 아니고 실제로 작동하지 않습니다"라고 말했습니다. 이것은 모든 사람을 산만하게 한 것 같습니다. 자바 스크립트는 여러면에서 독특하고 강력한 유형의 배경에서 왔기 때문에 이렇게 설명하겠습니다. 제가 알고있는 패러다임을 강요하고 싶지는 않지만 매우 다른 언어로 개발되었습니다.

해결책

.. 그러나 Javascript에는 OO 인 많은 측면이 있습니다.

다음 사항을 고려하십시오. 라코 디스

저는이 기술을 사용하여 자체 상태가있는 페이지 수준의 자바 스크립트 클래스를 만들었습니다. 이는이를 포함하는 데 도움이됩니다 (그리고 종종 재사용하고 다른 클래스에 넣을 수있는 영역을 식별합니다).

이것은 실행할 자체 스크립트가있는 구성 요소 / 서버 컨트롤이 있지만 동일한 페이지에 여러 인스턴스가있을 때 특히 유용합니다.이렇게하면 주가 분리됩니다.

다른 팁

JavaScriptMVC는 대규모 JS 애플리케이션을 구성하고 개발하는 데 적합합니다.

아키텍쳐 디자인은 매우 잘 고려되었습니다. 자바 스크립트로 할 수있는 작업은 4 가지입니다.

이벤트에 응답
데이터 요청 / 서비스 조작 (Ajax)
Ajax 응답에 도메인 별 정보를 추가합니다.
DOM 업데이트
JMVC는이를 모델,보기, 컨트롤러 패턴으로 분할합니다.
첫 번째이자 아마도 가장 중요한 이점은 컨트롤러입니다. 컨트롤러는 이벤트 위임을 사용하므로 이벤트를 첨부하는 대신 페이지에 대한 규칙을 만들기 만하면됩니다. 또한 컨트롤러의 이름을 사용하여 컨트롤러가 작동하는 범위를 제한합니다. 이렇게하면 코드가 결정적입니다. 즉, '#todos'요소에서 이벤트가 발생하면 할일 컨트롤러가 있어야한다는 것을 알고 있습니다. 라코 디스
다음은 모델입니다. JMVC는 Ajax 기능 (# 2)을 신속하게 구성하고 도메인 별 기능 (# 3)으로 데이터를 래핑 할 수있는 강력한 클래스 및 기본 모델을 제공합니다. 완료되면 컨트롤러에서 다음과 같은 모델을 사용할 수 있습니다.
Todo.findAll ({after : new Date ()}, myCallbackFunction);
마지막으로 할 일이 돌아 오면 표시해야합니다 (# 4). JMVC의 관점을 사용하는 곳입니다. 라코 디스
'views / todos / list.ejs'에서 라코 디스
JMVC는 아키텍처 이상의 기능을 제공합니다. 다음을 통해 개발주기의 모든 부분에서 도움이됩니다.
- 코드 생성기
- 통합 브라우저, Selenium 및 Rhino 테스트
- 문서
- 스크립트 압축
- 오류보고

MochiKit은 훌륭합니다. js 라이브러리에 관한 한 말하자면 저의 첫사랑이었습니다.하지만 MochiKit은 구문이 매우 표현력이 뛰어나지 만 Prototype / Scriptaculous 또는 jQuery가 저에게 해준 것만 큼 편안하지 않습니다.

파이썬을 알고 있거나 좋아한다면 MochiKit이 좋은 도구라고 생각합니다.

답변 해 주셔서 감사합니다. 얼마 후 지금까지 배운 내용을 게시하고 싶습니다.

지금까지 Ext 와 같은 것을 사용하는 접근 방식과 JQuery UI , Scriptaculous , MochiKit 등

Ext를 사용하면 HTML은 하나의 자리 표시 자일뿐입니다. 여기에 UI가 표시됩니다. 그때부터 모든 것 이 자바 스크립트로 설명됩니다. DOM 상호 작용은 다른 (아마도 더 강력한) API 레이어 아래에서 최소화됩니다.

다른 키트에서는 약간의 HTML 디자인으로 시작한 다음 DOM을 멋진 효과로 직접 확장하거나 여기에서 양식 입력을 대체하고 거기에 추가했습니다.

이벤트 처리 등을 처리해야 할 때 주요 차이점이 발생하기 시작합니다. 모듈이 서로 "대화"해야하므로 DOM에서 한 발짝 물러나서 조각으로 추상화해야합니다.

이러한 라이브러리 중 상당수에는 흥미로운 모듈화 기술도 포함되어 있습니다. Ext 웹 사이트에 매우 명확한 설명이 제공됩니다. 여기에는 모듈로 코드를 "보호"하는 멋진 방법이 포함됩니다. .

내가 완전히 평가 한 새 선수는 Sproutcore 입니다. DOM이 숨겨져있는 Ext 접근 방식처럼 보이며 대부분 프로젝트의 API를 다루고 싶습니다.

Tristan은 JavaScript를 MVC 애플리케이션으로 아키텍처하려고 할 때 모델이라는 한 영역에서 부족한 경향이 있다는 것을 알게 될 것입니다. 처리하기 가장 어려운 영역은 모델입니다. 데이터가 애플리케이션 전체에 걸쳐 유지되지 않기 때문에 모델은 본질적으로 클라이언트 측에서 꽤 일관되게 변경되는 것처럼 보입니다. 서버에서 데이터를 전달하고 수신하는 방법을 표준화 할 수 있지만이 시점에서 모델은 실제로 JavaScript에 속하지 않고 서버 측 애플리케이션에 속합니다.

나는 SQLite가 애플리케이션에 속하는 방식과 마찬가지로 누군가 JavaScript로 데이터를 모델링하기위한 프레임 워크를 만든 한 번의 시도를 보았습니다. Model.select ( "Product") 및 Model.update ( "Product", "Some data ...")와 같습니다. 기본적으로 현재 페이지의 상태를 관리하기 위해 많은 데이터를 보유한 객체 표기법이었습니다. 그러나 새로 고치는 순간 모든 데이터가 손실됩니다. 나는 아마도 구문을 잘 모르지만 요점을 알 수 있습니다.

jQuery를 사용하는 경우 Ben의 접근 방식이 가장 좋습니다. 함수와 속성으로 jQuery 객체를 확장 한 다음 "컨트롤러"를 구분합니다. 일반적으로이를 별도의 소스 파일에 넣고 섹션별로로드합니다. 예를 들어, 전자 상거래 사이트 인 경우 결제 프로세스를위한 기능을 처리하는 컨트롤러로 가득 찬 JS 파일이있을 수 있습니다. 이렇게하면 가볍고 관리하기 쉬운 경향이 있습니다.

간단히 설명하겠습니다.

서버 지향적이지 않은 GWT 앱을 작성하는 것은 완벽하게 가능합니다. 서버 지향에서 Java 기반 백엔드가 필요한 GWT RPC를 의미한다고 가정합니다.

클라이언트 측에서만 매우 "MVC와 유사한"GWT 앱을 작성했습니다.

모델은 개체 그래프였습니다. Java로 코딩하더라도 런타임시 객체는 클라이언트 또는 서버 측에서 JVM이 필요없는 자바 스크립트로되어 있습니다. GWT는 또한 완전한 구문 분석 및 조작 지원과 함께 JSON을 지원합니다. JSON 웹 서비스에 쉽게 연결할 수 있습니다. 2 를 참조하세요. JSON 매시업 예제입니다.
보기는 표준 GWT 위젯 (및 일부 자체 합성 위젯)으로 구성되었습니다.
컨트롤러 레이어가 관찰자 패턴을 통해보기에서 깔끔하게 분리되었습니다.
당신의 " 강력한 "배경이 자바 나 유사한 언어를 사용한다면 큰 프로젝트의 경우 GWT를 진지하게 고려해야한다고 생각합니다. 작은 프로젝트의 경우 저는 보통 jQuery를 선호합니다. 예정된 GWTQuery 는 jQuery 용 플러그인이 풍부하기 때문에 가까운 시일 내에 변경 될 수 있습니다.

여기서 의미하는 바는 100 % 확실하지는 않지만, 지난 6 년 동안 ASP.NET을 수행 한 후 기본 페이지 렌더링이 서버에서 수행되면 내 웹 페이지는 대부분 JavaScript로 구동됩니다.모든 작업에 JSON을 사용하고 (현재 약 3 년 동안) MochiKit 을 사용합니다.내 클라이언트 측 요구를 충족합니다.

그런데 자바 스크립트는 OO이지만 프로토 타입 상속을 사용하기 때문에 사람들은 그런 식으로 인정하지 않습니다.나는 또한 그것이 기능적이라고 주장하고, 그것은 모두 당신이 그것을 작성하는 방법에 달려 있습니다.함수형 프로그래밍 스타일에 정말 관심이 있다면 MochiKit 을 확인하세요.그것;JavaScript의 기능적 프로그래밍 측면에 상당히 기울입니다.

라이센스 : CC-BY-SA ~와 함께 속성

제휴하지 않습니다 StackOverflow