5 
while (div.hasChildNodes()) {
    fragment.appendChild(div.firstChild)
}

while (div.firstChild) {
    fragment.appendChild(div.firstChild)
}

上記の 2 つの疑似コードを比較すると、どちらも、子がなくなるまでdivtoの各子を追加します。fragment

  1. あなたはいつ好きですか、hasChildNodesまたはfirstChildそれらは同じように見えますか.
  2. API が非常に似ている場合、なぜ両方が存在するのでしょうか。toからhasChildNodes()強制できるのに、なぜ存在するのですかfirstChildnullfalse
4

5 に答える 5

4

a) マイクロ最適化!

b) 一般的な慣行のようですが、false/true の代わりに使用される null/null 以外の値に依存するのは好きではありません。これは、サーバーの圧縮が有効になっていると不要な省スペースです (そして、微妙なバグと呼ばれることもあります)。ボトルネックを引き起こしていることが実証されていない限り、毎回明確にすることを選択してください。

それはあなたの意図を完全に説明しているので、最初のオプションを選びます。

于 2012-04-13T01:21:06.693 に答える
4

2 つの実装に機能上の違いはありません。両方とも、すべての状況で同じ結果を生成します。

2 つの間にパフォーマンスの違いがあるかどうかを追跡したい場合は、目的のターゲット ブラウザーでパフォーマンス テストを実行して、意味のある違いがあるかどうかを確認する必要があります。

ここでは、2 つのパフォーマンス テストを示します。どちらが高速かはブラウザ固有のようです。 hasChildNodes()Chrome ではかなり高速ですがfirstChild、IE9 と Firefox では少し高速です。

ここに画像の説明を入力

于 2012-04-13T01:24:26.153 に答える
0

DOM呼び出しが遅いと仮定すると、次の呼び出しを1回使用することで、（読みやすさを犠牲にして）さらに最適化できますfirstChild。

var child;
while ( (child = div.firstChild) ) {
    fragment.appendChild(child);
}

...（奇妙なことに、私にとっては）これは明らかにまったく役に立たず、事態を悪化させますが、このjsPerfによると：http：//jsperf.com/haschildnodes-vs-firstchild/2

両方のメソッドが存在する理由については、DOMがJavaScript専用ではないことに注意してください。たとえば、Java DOM実装では、を明示的に比較するfirstChild（またはより可能性が高いfirstChild()）必要がありnullます。

于 2012-04-13T08:26:58.353 に答える
0

あなたの 2 つの例は、(おそらく) ごくわずかな速度の違いを除いて、通常*同じように動作します。

どちらか一方を優先する唯一の理由は明快さです。具体的には、コードを読んでいるときに視覚的に解析しやすいかどうかによって、コードの残りの部分が実装しているアイデアを各構成要素がどれだけうまく表現しているかということです。可能な限り、パフォーマンスや不必要に衒学的な正確さよりも明快さを優先することをお勧めします。

* 注: 漠然とした最新のブラウザーの Web ページでこのコードを実行していると仮定しています。コードを他のコンテキストで実行する必要がある場合、.hasChildNodes() と .firstChild の間には速度に大きな違いがあったり、機能的な (副作用) 違いさえあるかもしれません: 1 つは関数呼び出しを設定して実行する必要があり、もう 1 つは最初の子のスクリプト対応の DOM 準拠の表現がまだ利用可能でない場合は構築されること。

于 2012-04-13T01:50:04.333 に答える
0

;という理由だけで、 firstChildよりもhasChildNodes()をお勧めします。空白の場合は戻りますが、戻ります。これにより、データが存在するかどうかを確認する際に、データをより効率的に解析できます。実際には、結果を達成するために DOM をどのように操作するかによって異なります。returnhasChildNodes()falsefirstChildnull

于 2012-04-13T01:22:12.970 に答える