JavaScript を開発するときに注意すべき 5 つのこと_javascript のヒント

要素でのみ submit イベントを使用します

フォームでイベント ハンドラーをバインドする場合は、 要素でのみ submit イベントをバインドする必要があります。クリック イベントを送信ボタンにバインドしないでください。
3 月: この方法は確かに良いのですが、同社は開発中に Web フローを使用しており、1 ページが大きなフォーム内に複数の送信ボタンがある場合があるため、一部のイベント ハンドラーを送信ボタンにバインドする必要があります。ボタンのクリックイベントについて。

クリック可能な項目はすべてリンクである必要があります

クリック イベントをアンカー要素 () 以外の要素にバインドしないでください。これは、キーボードだけでは要素に焦点を合わせるのが難しいキーボード ユーザーにとって重要です。

3 月: ただし、個人的には、アンカー要素はリンクとしてのみ使用されるべきであり、一部の機能操作 (Google リーダーのすべてを新規としてマークするなど) は、アクセシビリティのために でマークするのが最適であると考えています。ショートカットキーやその他の方法で解決できます。これにより、HTML 要素のセマンティクスをより適切に復元できます。

簡単な for ループの最適化

for ループを作成するときに、パフォーマンスを向上させる非常に簡単なトリックがあります。

コードをコピー コードは次のとおりです:

for ( var i = 0; i < ; 要素。長さ; i )

上記の代わりに次のステートメントを使用します:

コード for ( var i = 0, j = elements.length; i < j; i )

このようにして、要素 (elements.length の値) 変数 j では、これにより、ループを通過するたびに要素の数をカウントする必要がなくなります。

イベント ハンドラーとして匿名関数を使用する

特に短い関数の場合、名前付き関数への参照を使用するよりも匿名関数を作成した方が読みやすくなります。

コードをコピー コードは次のとおりです。anchor.onclick = function() { map .goToPosition( home ); return false; }

March: より複雑な JavaScript を開発する場合は、名前付き関数を使用する方が効率的です。

文字列を連結する代わりに Array.join を使用します

多くの文字列、変数などを長い文字列に連結する場合、すべての文字列と変数を配列に入れます。次に、join メソッドを使用して長い文字列を形成します。コードの読みやすさとパフォーマンスの点で、文字列の連結よりも優れています。

コードをコピー コードは次のとおりです。var text = 'There are' 要素です。 length '要素配列のメンバー';

var text = ['存在します', elements.length, '要素配列のメンバー'].join(' ');