すべてのJavaScriptプログラマーが知っておくべきことは何ですか？[閉まっている]

「私はJavaScriptを知っています」と言えるように、すべてのJavaScriptプログラマーが知っておくべき一連のことはありますか？

jQueryではありません。YUIじゃない。ない（等）

フレームワークは便利かもしれませんが、JavaScriptとDOMが実際にどのように機能するかについて、見苦しい詳細を隠していることがよくあります。あなたが「JavaScriptを知っている」と言えるようになることが目的である場合、フレームワークに多くの時間を費やすことはそれとは反対です。

JavaScriptの機能の一部を以下に示します。JavaScriptの機能を理解するために知っておく必要があるのですが、すぐにわかりません。

• これobject.propとobject['prop']同じことです（あなたがストップ使用してくださいすることができeval、感謝し）。オブジェクトのプロパティは常に（配列の場合でも）文字列です。何for... inのためである（そして何それはないです）。

• プロパティスニッフィング; 何であるかundefined（そしてそれがなぜにおいがするか）; あまり知られていないように見えるin演算子が有益で、typeof/ undefinedchecks と異なる理由; hasOwnProperty; の目的delete。

• そのNumberデータ型は本当にフロートです。floatを使用する言語に依存しない問題。parseInt8進トラップを回避します。

• ネストされた関数スコープ。var偶発的なグローバルを回避したいスコープで使用する必要性。スコープをクロージャに使用する方法。閉鎖ループの問題。

• グローバル変数とwindowプロパティがどのように衝突するか。どのようにグローバル変数とドキュメント要素がIEで衝突するべきではなく衝突するか。varこれを回避するためにグローバルスコープでも使用する必要性。

• functionステートメントが、その前のコードの前に定義を「巻き上げる」ように機能する方法。関数ステートメントと関数式の違い。名前付き関数式を使用すべきではない理由。

• コンストラクタがどのように機能するか、prototypeプロパティとnew演算子は実際に機能します。これを利用して実際に必要な通常のクラス/サブクラス/インスタンスシステムを作成する方法。プロトタイピングの代わりにクロージャベースのオブジェクトを使用したい場合。（ほとんどのJSチュートリアルの資料は、これについてはひどいものです。頭の中でまっすぐに理解するのに何年もかかりました。）

• thisバインドではなく、呼び出し時にどのように決定されるか。その結果、メソッドの受け渡しが他の言語で期待するように機能しない。どのようにクロージャをFunction#bind使用するか、それを回避するために使用できるか。

• その他のECMAScript Fifth Editionの機能indexOf、forEachおよびの関数型プログラミングメソッドArray。古いブラウザを修正して使用できるようにする方法。インラインの無名関数式でそれらを使用して、コンパクトで読みやすいコードを取得します。

• ブラウザとユーザーコード間の制御の流れ。同期および非同期の実行。コントロールのフロー内で発生するイベント（フォーカスなど）と、コントロールが戻ったときに発生するイベントおよびタイムアウト。どうやら同期が必要な組み込み関数のようなものを呼び出すと、alert結局は悲惨な再入可能性が引き起こされる可能性があります。

• クロスウィンドウスクリプティングがどのように影響するかinstanceof。クロスウィンドウスクリプティングが異なるドキュメント間の制御フローにどのように影響するか。どのようにpostMessageうまくいけば、この問題を解決します。

最後の2つの項目については、この回答を参照してください。

何よりも、JavaScriptを批判的に表示し、それが歴史的な理由で不完全な言語（ほとんどの言語よりもさらに多い）であることを認め、その最悪の問題を回避する必要があります。この面でのクロックフォードの作品は間違いなく読む価値があります（「良い部分」について彼に100％同意するわけではありませんが）。

無効にできること。

CrockfordのJavascript：The Good Partsで記述されたものを理解することは、人がきちんとしたJSプログラマーであるというかなり良い仮定です。

JQueryのような優れたライブラリの使用方法をほとんど知っていても、Javascriptの隠れた部分を知らない場合があります。

もう1つの注意点は、さまざまなブラウザーのデバッグツールです。JSプログラマーは、さまざまなブラウザーでコードをデバッグする方法を知っている必要があります。

ああ！そして、JSLintを知ることはあなたの気持ちを完全に傷つけるでしょう!!

真のJavaScript忍者になりたい場合は、Perfectionのすべての質問に対する答えがJavaScriptクイズを殺すことを知っている必要があります。

食欲をそそる例：

(function f(f){ 
  return typeof f(); 
})(function(){ return 1; });

この式は何を返しますか？

• "数"
• "未定義"
• "関数"
• エラー

あなたが知らない場合、あなたはJavaScriptを知らない：

1. 閉鎖
2. プロトタイプベースの継承
3. モジュールパターン
4. W3C-DOM
5. イベントの仕組み

..そのjavascriptはjavaではありません:)

ウェブサイトの開発を始めた多くの人が、javascriptは単なるjavaだと言っています。

1. 少なくとも1つのJavascriptライブラリ（Jquery、Prototypeなど）をよく理解してください。

2. 主要なブラウザー（MSIE 7-8、Firefox、Chrome、Safari）のデバッグツールの使用方法を学ぶ

3. 業界の最新情報：Douglas CrockfordのWebサイトは宝の山ですが、Ajaxian.comは、JavaScriptの新しい、興味深い、または奇妙なアイデアを追いかけるのに適したブログです。他にも多くのリソースがありますが、それらは私を最も助けてくれたものです。

JavaScript オブジェクトとファーストクラスシチズン、コールバックとして機能し、イベントとJQueryを忘れないようにします。

そのJavascriptは1時間で学べるものではありません！

ローカルであると宣言されていない限り、変数はグローバルです!!

悪い（DoSomething（）は10回しか呼び出されません）：

function CountToTen()
{
  for(i=0; i< 10; i++)
  {
    DoSomething(i);
  }
}

function countToFive()
{
  for(i=0; i<5; i++)
  {
    CountToTen();
  }
}

CountToFive();

良い（意図的にDoSomething（）が50回呼び出されます）：

function CountToTen()
{
  var i;
  for(i=0; i< 10; i++)
  {
    DoSomething(i);
  }
}

function countToFive()
{
  var i;
  for(i=0; i<5; i++)
  {
    CountToTen();
  }
}

CountToFive();

方法の良い部品を使用して、ひどい部分を回避する方法。

Javascriptは元々LiveScriptと呼ばれており、JavaとJavascriptが関連しているため（関連していないため）、マーケティングの目的で「Java」接頭辞が付けられていたことを知るため。

ああ、David Flanaganの「Javascript：The Definitive Guide」のすべてのバージョンを所有している（この情報は2ページにあります）。

...そして、Jqueryのようなものが苦痛を取り除く前に、Internet Explorer 4のdocument.all []とNetscape Navigator 4のdocument.layers []を難読化しようとして以前に行ったことのある人たちに感謝します。

編集：

@Kinopikoが指摘したように、JavaScriptは当初プロジェクトMochaと呼ばれていました（一部のソースではProject LiveWire とも呼ばれていました）が、Javaプレフィックスが採用される前に（Brendan Eichによって作成された）言語がLiveScriptとしてリリースされる予定であったことは一般に受け入れられています1996年初頭にリリース。

「私はJavaScriptを知っています」と言うには、次のことに注意する必要があります。

1. JavaScriptは良いですが、DOMが問題です
2. クロスブラウザの問題はあなたを狂わせることができます
3. コードが4つ以上の優れたブラウザでテストされていない限り、バグがないとは言えません
4. 閉鎖 ..............知っている必要があります
5. そのプロトタイプベース ...........素敵な1つこれを学ぶのは楽しい
6. デバッガキーワード.....危機的状況に役立ちます

そのJavaScriptは、あなたが思っているよりも他の言語とははるかに異なります。このすばらしいGoogle Tech Talkを見て、印象をつかんでください：http : //www.youtube.com/watch?v=hQVTIJBZook

すべてのJavaScriptコーダーが知っておくべきことは何ですか？

では、2クリックであなたの努力を止めることができます。したがって、可能であればフォールバックを提供します。

Javascript：良い部分を読むことを強くお勧めします

Array、Number、String、Date、およびObjectを効果的に使用できるかどうか、JavaScriptを知っています。数学と正規表現のプラスポイント。関数を記述して変数を使用できるようにする必要があります（正しいスコープで、つまりオブジェクトの「メソッド」として）。

クロージャー、贅沢な関数構文、blablaについてのコメントがいくつかあります。これらすべては、この質問にはまったく関係ありません。それは、100mダッシュを11秒未満で走らせることができれば、ランナーだと言っているようなものです。

私は、JavaScriptに習熟するまでに数週間かかると言います。その後、専門家や忍者などになるには、何十年もの本と何千ものプログラミング行が必要です。

しかし、それは問題ではありませんでした。

DOMはJavaScriptの一部ではなく、jQueryでもありません。ですから、どちらも同じように問題には関係ないと思います。

JSLint http://www.JSLint.com/

上記をすべて読んだ後、jQueryのようなフレームワークを使用してJavascriptを学ぶのもまったく問題ありません。真実は、多くの人がJSを最初に取り上げた最初の方法です。その点で恥はありません。

配列。lengthmethodは配列の項目の数ではなく、最高のインデックスです。アイテムが設定されている場合でもundefined

var a = [];
a.length;   // === 0
a[10];      // === undefined
a[10] = undefined;
a.length;   // === 11
a.pop();    // === undefined
a.length;   // === 10

この動作は、言語設計のバグとほとんど区別できません。

jQueryは私の最高の推奨事項です。コード自体だけでなく、イディオム、スタイル、背後にある考え方がエミュレーションに最もふさわしいものです。

そのjavascriptは、世界で最も広く展開されている言語です。（多分）

言語を本当によく学び、そのさまざまな癖を理解することは、何年にもわたる経験から生まれます。あなたがより良いプログラマーになりたいのであれば、私は、デザインパターン、それらをいつどのように使用するのか、そして/またはそれを実現せずに使用しているときさえ理解することを言うでしょう。技術アーキテクチャとユーザーエクスペリエンス。

（JavaScript）言語を知っているということは、任意のフレームワークを選択して自由に使用できることを意味します。あなたは必然的にソースコードに飛び込む必要があります、そしてあなたが知っているすべてが構文またはフレームワークまたは2または3であるならば、あなたは遠くに行くことはありません。つまり、いくつかの異なるフレームワークのソースコードにアクセスすることは、おそらくJavaScriptの使用方法を確認するための最良の方法の1つです。FirebugまたはWeb Inspectorでコードをステップ実行し、JavaScriptドキュメント、特にMozillaとWebkitのドキュメントをチェックして、見ているものについてさらに理解を深めることで混乱します。

オブジェクト指向プログラミングと関数型プログラミングの違いを理解すると、JavaScriptは2つの魅力的な組み合わせであり、キラーコードベースと素晴らしいアプリケーションを作成するために両方をいつ、どのように使用するかは、より優れたJavaScriptプログラマーになります。

いくつかの本、特にJavaScriptの何が良いかについての彼の意見を提示しているだけのCrockfordの「良い部分」を読んでいるだけで、JavaScriptのほとんどの素晴らしい部分をスキップすると、間違った足がかりになります。

一方、Thomas Fuchsのような誰かによって書かれたコードをチェックアウトすると、驚くほど効率的なJavaScriptを書くことの力について、より多くの洞察が得られます。

いくつかの落とし穴やWTFを覚えようとしても、あまり役に立たないので、ライブラリ/フレームワークのコード、特に役立つコメントが付いたコードをコーディングしてステップスルーすると、それらが特定のものを使用した理由を確認できます。プロパティ/値であり、特定のオペランドと演算子を使用するのが適切な理由と理由は他にありません。これは、フレームワークの人々が使用するコードにすべて含まれています。例で学ぶよりも優れていますか？：^）

JavaScriptでは、パフォーマンスが重要です。

コードを最適化するインテリジェントなコンパイラはないので、JavaScriptコードを記述している間は、C＃、Javaなどの言語よりも注意が必要です...

オブジェクトリテラルは、書くのがとても良いためです。

次のことも重要です。

1）可変巻き上げ。2）スコープチェーンとアクティベーションオブジェクト。

そして、これらのようなもの：:)

3）wtfjs.com

4）すべてがオブジェクトですhttp://www.lifeinafolder.com/images/Js.jpg

1. with()線のあるところとないところ、どこに線を引くかという生活があることを知る。
2. throwステートメントを使用してカスタムエラーを作成し、JavaScriptランタイムを意図的に停止できます。

JavaScriptは、returnキーワードとreturnステートメントを次のコードのような改行文字で区切ることをサポートしていません（またはjsFiddleページで試してください）

function foo()
{
    return
    {
        bar: 'something'
    };
}

$(function()
{
    document.write(foo());
});

JavaScriptがデフォルトのスタイルのJavaScriptと比較すると、非常に複雑なJavaScriptソースコードを読みやすくなるため、JavaScriptがこのスタイルをサポートしない理由がわかりません。

PS。私はJavaScriptを6年近く書いています。しかし、私は次の関数を実行しようとしたときに自分でこのバグを見つけました。常に未定義を返します。デバッガーを使用してこの関数にステップインすると、すべて正常に動作します。私の人生で最悪のプログラミングバグになると思います。

function JqGridInlineEditor_GenerateTool(cellvalue, options, rowObject, disableEdit, disableDelete)
{
    return 
        (!disableEdit ? '<a class="button edit" href="javascript: void(0);" onclick="JqGridInlineEditor_EditRow(this, \'{0}\');return false;" title="{2}"><img src="{1}" alt="{2}" /></a>'.format(options.rowId, getUrl('~/Content/Icons/Edit.gif'), 'Click here to Edit or \nDouble-click row to edit.') : '') +
        (!disableDelete ? '<a class="button delete" href="javascript: void(0);" onclick="JqGridInlineEditor_DeleteRow(this, \'{0}\');return false;" title="{2}"><img src="{1}" alt="{2}" /></a>'.format(options.rowId, getUrl('~/Content/Icons/Delete.png'), 'Click here to Delete or \nSelect row and then press Delete') : '') +
        (!disableEdit ? '<a class="button save" style="display:none" href="javascript: void(0);" onclick="JqGridInlineEditor_SaveRow(this, \'{0}\');return false;" title="{2}"><img src="{1}" alt="{2}" /></a>'.format(options.rowId, getUrl('~/Content/Icons/Save.png'), 'Click here to Save or \nPress Enter') : '') +
        (!disableEdit ? '<a class="button cancel" style="display:none" href="javascript: void(0);" onclick="JqGridInlineEditor_RestoreRow(this, \'{0}\');return false;" title="{2}"><img src="{1}" alt="{2}" /></a>'.format(options.rowId, getUrl('~/Content/Icons/Cancel.png'), 'Click here to Cancel or \nPress Esc') : '');
}

JSは関数型言語であるため、きちんとしたJSプログラマーはY-combinatorを作成し、それがどのように機能するかを頭から理解できなければなりません。

... Google Web Toolkitについて。つまり、JavaScriptプロジェクトはおそらくもっと便利な方法で開発できるでしょう。