最初に JavaScript を体系的に学んだことがなかった私のような人間にとって、with を見たときの最初の感情は興奮でした。もう「element.style.xxx = ...」を何度も記述する必要はなく、
表示する
だけで済みます。クリップボードプリントにプレーンコピーしますか?
with (要素.スタイル) {
xxx = ...;
yyy = ...;
...
}
with (element.style) {
xxx = ...;
yyy = ...;
...
}しかし、JavaScript はインタープリタ型言語として、実行時に xxx/yyy が何であるかを判断する必要があります。名前ごとに (割り当てられただけでなく、変数も読み取られます!)、まず括弧で囲まれたオブジェクトのプロパティを検索し、次にローカル変数、最後にグローバル変数を検索します。 JavaScript 仮想マシンと JIT テクノロジが普及する前は、この種のパフォーマンスの問題には細心の注意を払う必要がありました。
正しいアプローチは、element.style のローカル変数キャッシュを作成することです
。
vares = 要素.スタイル;
es.xxx = ...;
es.yyy = ...;
...
var es = element.style;
es.xxx = ...;
es.yyy = ...;
...これにより、コード サイズが相対的に削減されるだけでなく、element.style.xxx = ... よりもパフォーマンスが大幅に向上します。