JavaScript_javascript 개발 시 주의할 점 5가지 팁

요소에만 제출 이벤트를 사용하세요

양식에서 이벤트 핸들러를 바인딩하려면

요소에만 제출 이벤트를 바인딩해야 합니다. , 클릭 이벤트를 제출 버튼에 바인딩하지 마세요.
March: 이 방법은 확실히 좋은데 회사에서는 개발 중에 Web Flow를 사용했습니다. 한 페이지가 큰 형식이고 여러 개의 제출 버튼이 있을 수 있으므로 일부 이벤트 핸들러는 제출 버튼에 바인딩되어야 합니다. 버튼의 클릭 이벤트에서.

클릭 가능한 모든 항목은 링크여야 합니다

클릭 이벤트를 앵커 요소() 이외의 요소에 바인딩하지 마세요. 이는 키보드만으로는 요소에 초점을 맞추는 데 어려움을 겪는 키보드 사용자에게 중요합니다.

3월: 하지만 개인적으로 앵커 요소는 링크로만 사용해야 한다고 생각하며 일부 기능 작업(예: Google 리더의 모든 것을 새 것으로 표시)에는 접근성 문제가 있을 수 있습니다. 단축키 및 기타 방법을 통해 해결하세요. 이렇게 하면 HTML 요소의 의미를 더 잘 복원할 수 있습니다.

간단한 for 루프 최적화

for 루프를 작성할 때 성능을 향상할 수 있는 아주 간단한 트릭이 있습니다.

코드 복사 코드는 다음과 같습니다.

for ( var i = 0; i < ; elements.length; i )

위 문장 대신 다음 문장을 사용하세요:

코드 복사 for ( var i = 0, j = elements.length; i

이 방법으로 요소 수를 저장할 수 있습니다. 요소(elements.length의 값) 변수 j에서 이렇게 하면 루프를 통해 매번 요소 수를 계산할 필요가 없습니다.

익명 함수를 이벤트 핸들러로 사용

특히 짧은 함수의 경우 이름이 지정된 함수에 대한 참조를 사용하는 것보다 익명 함수를 만드는 것이 더 읽기 쉽습니다.

코드 복사 코드는 다음과 같습니다.anchor.onclick = function() { map .goToPosition( home ); return false; }

3월: 더 복잡한 JavaScript를 개발할 때는 명명된 함수를 사용하는 것이 더 효율적입니다.

문자열을 연결하는 대신 Array.join을 사용하세요

여러 문자열, 변수 등을 긴 문자열로 연결하는 경우 모두 문자열과 변수를 배열에 넣고, 그런 다음 조인 방법을 사용하여 긴 문자열을 형성합니다. 이는 코드 가독성과 성능 측면에서 문자열 연결보다 낫습니다.

코드 복사 코드는 다음과 같습니다.var text = '요소가 있습니다'. length '요소 배열에 멤버가 있습니다.';

var text = ['요소 배열에 멤버가 있습니다.'].join(' ');