처음에 JavaScript를 체계적으로 배우지 않았던 저 같은 사람들이 with를 봤을 때 첫 느낌은 설렘이었습니다. 더 이상 "element.style.xxx = ..."라고 반복적으로 쓸 필요가 없고
보기
만 하면 됩니다.일반 복사를 클립보드 인쇄로?
(element.style) {
xxx = ...;
yyy = ...;
...
}
(element.style) {
xxx = ...;
yyy = ...;
...
}그러나 해석된 언어인 JavaScript는 런타임에 xxx/yyy가 무엇인지 확인해야 합니다. 각 이름(할당된 것뿐만 아니라 변수도 읽습니다!)에 대해 먼저 대괄호를 사용하여 개체의 속성을 찾은 다음 지역 변수, 마지막으로 전역 변수를 찾습니다. JavaScript 가상 머신과 JIT 기술이 대중화되기 전에는 이러한 성능 문제에 큰 주의가 필요했습니다.
올바른 접근 방식은 element.style에 대한 로컬 변수 캐시를 만드는 것입니다.
view plaincopy toclipboardprint?
바레스 = element.style;
es.xxx = ...;
es.yyy = ...;
...
var es = element.style;
es.xxx = ...;
es.yyy = ...;
...이것은 상대적으로 코드 크기를 줄일 뿐만 아니라 element.style.xxx = ...보다 훨씬 더 나은 성능을 발휘합니다.