web-dev-qa-db-ja.com

オープンソースWebアプリの優れたJavaScriptコードの例

私は、効率的で、他の開発者に広く受け入れられ、それほど醜くない、優れたJavaScriptコードを書く方法を見つけるのに苦労しています。

最近まで、私が使用したのはリテラルオブジェクトとjQueryのビットだけでしたが、Douglas Crockfordの「JavaScript：The Good Parts」を読んだ後、JavaScriptにはAJAX、DOMの変更、単純なアニメーション以上のものがあることに完全に気付きました。

問題は、JavaScriptがあまり標準化されていないように見えることです。利用可能なOOP /継承パターンの量は私を圧倒します。私は、独自の継承の実装を提供するすべてのフレームワーク/ライブラリに慣れているわけではありません。また、問題が発生した場合にすべてのコードを書き直すことになるため、このようなことに関して間違った決定をしたくありません。

ですから、私が探しているのは、可能であればクライアント側でJavaScriptを多用して、実際のプロジェクトでどのパターンが使用されているかを確認する既存のオープンソースWebアプリケーションです。フレームワークやライブラリではなく、Webアプリケーションのコードを見たいのですが。これらのWebアプリが何らかのフレームワークに基づいているかどうかは気にしません（DojoまたはRequireJSの場合は、それらを使用しているのでさらに優れています;）

javascriptdesign-patternsopen-source
38
Juliusz Gonera

この種のことに興味がある人に私がいつもお勧めするのは：あなたのチームがしていることに固執する。メソッドにcamelCaseを使用する場合は、それを使用します。変数にsnake_caseを使用する場合は、それを行います。チームがタブよりもスペースを好む場合。それらを使用してください。

深刻な問題を引き起こしていない限り、見た目が良くなるため、標準化されたスタイル変更で安定したチームに入らないでください。

チームで作業しておらず、コーディングスタイルの使用に関心がある場合。次に最もよく使用するライブラリのスタイルを使用します。

組織的には、クロージャが最適です。しかし、どういうわけか、javascriptの代わりにJavaを読んでいるように感じます。図を見てください。

7
Ferrerira

うん。 JavaScriptの書き方、JavaScriptを使用したプロトタイプベースのOOP、変数のインデントと命名の方法についてさえ）について多くのことを書いたJavaScriptの達人がいくつかいます。

ただし、例として学習するJavaScriptの大規模な実装を探している場合は、HTML5ゲームの実装を探します。縮小されていない、十分に大きく、よく書かれた例が見つかることは事実上保証されています。

5
filipemgs

JavaScript標準に興味がある場合は、 commonJS を確認してください。彼らはJavaScriptがどのように行われるべきかについて多くの良いアイデアを持っています。

BravoJS は、ブラウザに適したモジュール実装です。

例として、jQueryのソースコードがコメントで言及されました。 jQueryは良い仕事をしますが、それは私もチェックするでしょう Narwhal JS 物事がどのように行われるべきかの例について。

これは私が役に立ったと思った良い無料のデザインパターンの本です Essential JavaScript And jQuery Design Patterns 。

問題に対する1つの解決策は見つかりません。それが、JavaScriptの設計方法です。実験することをお勧めします。ダグラス・クロックフォードには素晴らしいアイデアがたくさんあると思いますが、それはあなたが彼の手紙に従う必要があるという意味ではありません。

4
babsher

良いプロジェクトは： http://impactjs.com/ 良い読み物は： http://addyosmani.com/blog/essentialjsdesignpatterns/

2
standup75

素晴らしい質問です。よく書かれたオブジェクト指向のオープンソースアプリケーションの一例を見つけることができませんでした。 Tiny MCEはまあまあでしたが、うまく書かれているとは思いません： http://www.tinymce.com/

しかし、私は仕事でクリーンでよく因数分解されたオブジェクト指向のJavaScriptを書きました。それは独占的であるため、共有することはできませんが、それを行う方法を学ぶために私が何がうまくいったかを説明することができます：

1）mozillajavascriptオブジェクト指向プログラミングチュートリアルを読んでください。彼らのJavaScript継承の説明は、まさにグーグルクロージャーが使用しているものです。個人的には、Crockfordが疑似クラシックと呼んでいるものは、私が知っている他の5つのプログラミング言語のうち4つがクラス（Java、c＃、python、php。Perlはクラスのない奇妙なものです）を使用しているため、読みやすく、維持しやすいと思います。

https://developer.mozilla.org/en/Introduction_to_Object-Oriented_JavaScript

2）StoyanStefanovによる「ObjectOrientedJavascript」という本を読んでください。

3）既存の手続き型JavaScriptコードベースを取得し、オブジェクトにリファクタリングします。 Robert C. Martinによる「CleanCode」のヒントは、あらゆるプログラミング言語に適用されるので使用してください。

4）クラスを含む言語でクラスを使用する方法と同様に、多くの異なるファイルが含まれるようにコードを構造化します。

5）すべてのオブジェクトをトップレベルで作成し、それらに依存するオブジェクトにフィードダウンすることにより、IOCコンテナーなしで依存性注入を実装します。

他にもたくさんありますが、これが役立つスタートになることを願っています。

これが私がjavascriptで継承を実装する正しい方法だと思うものです。これはグーグルクロージャーライブラリからです：

goog.inherits = function(childCtor, parentCtor) {
  /** @constructor */
  function tempCtor() {};
  tempCtor.prototype = parentCtor.prototype;
  childCtor.superClass_ = parentCtor.prototype;
  childCtor.prototype = new tempCtor();
  childCtor.prototype.constructor = childCtor;
};
2
davidjnelson

優れたJSコードの書き方を学ぶ方法はいくつかあります。

あなたは本を読むことができます。 JSコードの編成と、継承を含む一般的なパターンについての最も良いものは、StoyanStefanovによるJavaScriptパターンです。

学ぶためのもう1つの良い方法は、他の開発者の優れたコードを調べて使用することです。コード編成とパターンの使用の観点から私が見た中で最高のライブラリは Google Closure Library です。これは、Gmail GoogleDocsのようにRIAでGoogleによって内部的に使用されます。

0
bjornd

Ircの親切な人がこのeBookを提案し、私はそれが非常に役に立ったと感じました。

JavaScriptデザインパターンの学習

アッディ・オスマニの本

http://addyosmani.com/resources/essentialjsdesignpatterns/book/

0
Bronwen

偶然にも、今日のSlashDotには、Javascript：The Definitive Guideの第6版の review があります。 「JavaScriptプログラマーのための究極のリファレンスリソースとしての地位を維持しています。」 1,100ページです。

はい、これはあなたが探していたサンプルアプリではありませんが、この本にはベストプラクティスに関する多くの例とアドバイスがあります。

0
DOK