2011-10-14 2 views
0

이전에 선택한 선택 목록 항목을 기반으로 값으로 선택 목록을 채우는 아약스 양식이 있습니다. 이 양식은 3 가지보기에서 사용되며 각보기에는 추가 선택 목록이 추가됩니다. 양식 프로세스를 동기화 상태로 유지하고 사용자를 혼란스럽게하지 않는 몇 가지 기본 유효성 검사 코드를 작성했습니다.javascript에서 정의되지 않은 변수를 사용하여 함수를 실행할 수 있습니까?

외부 스크립트 파일에서 3 가지 형식을 모두 처리하는 함수를 작성했습니다.

내 질문 : 일부 변수가 양식 및보기를 기반으로 정의되지 않은 경우 걱정할 필요가 있습니까?

여기 내 질문을 설명하는 샘플 코드입니다 : 참고 : 이들은 내 변수의 실제 이름이 아닙니다.

(function ($){ 
    var objects = {sl1:$('#SelectList1'),sl2:$('#SelectList2'),sl3:$('#SelectList3'),lbl1:$('#Label1'),lbl2:$('#Label2'),lbl3:$('#Label3')}; 
    objects.sl1.change(function(){ 
    mapValues(); 
    } 
    function mapValues(){ 
    objects.lbl1.text(objects.sl1.val()); 
    objects.lbl2.text(objects.sl2.val()); 
    objects.lbl3.text(objects.sl3.val());//What if this select list is undefined for View1? 
} 
    })(jQuery); 

보기 # 1 SelectList1 & SelectList2을 가지고 요약합니다. 뷰 # 2에는 모두 3이 있습니다. 성능 문제가 있습니까? 아니면 변수 중 일부가 정의되지 않은 함수를 호출하는 것은 좋지 않은 행동입니까?

감사합니다.

답변

2

이것은 jQuery 문제가 아니라 JS 문제입니다. 선택기의 빈 결과에 .text() 또는 .val()과 같은 메서드를 실행하면 jQuery는 아무 일도하지 않습니다 (심지어 실패하지 않습니다!). 성능 문제는 직접 테스트하십시오. 요소가 발견되지 않으면 요소가 존재할 때보 다 조금 더 나은 성능을 기대합니다.

따라서 이러한 코드를 사용하는 것이 유효합니다.

완전히 다른 사안 인 "정의되지 않은 변수"와 "사용할 수없는 요소"가 섞여 있음에 유의하십시오. 정의되지 않은 변수를 사용하는 것은 권장하지 않으며 종종 예기치 않은 동작으로 이어질 수 있습니다.

+0

정말 좋은 답변이 몇 가지 있습니다. 나는 누군가가 내 상황에 따라 '비가 용 요소'가 아닌 '정의되지 않은 변수'와 관련된 추가 의견이 있는지 살펴 보는 데 관심이있다. 실제로 스위치 문을 사용하여 값을 확인하고 있습니다. 나는 단지 궁금했다. 모두에게 감사드립니다. – trevorc

0

예, 좋지 않습니다. 그리고 버그의 근원입니다.

좋은 연습을 위해 기본값을 정의하고/또는 함수에서 확인하십시오.

0

그 이유는 || 운영자

예 : :

($('#SelectList1').length || '0') 
+1

이 경우에는'$ ('# SelectList1'). length'는 결코 정의되지 않거나 null이 될 것이므로 필요하지 않습니다. – Blazemonger

0

문제는 불확실성 수준을 도입하여 버그를 추적하기가 어렵다는 것입니다. 다른 JS 파서는 다르게 대응할 것입니다. 일부는 관대하고 아무것도하지 않을 것이고, 다른 JS 파서는 단지 충돌 할 것입니다. 이제 브라우저 간 문제가 발생할 수 있습니다.

또한 변수가 코드 내부를 통과 할 때 값을 알지 못하면 나머지 코드가 어떻게 상호 작용하는지 예측하기가 어려울 것입니다. 이제 잠재적 인 논리/프로그램 버그가 생겼습니다.

그렇다면 필요한 매개 변수가 전달되었는지 확인하고 그렇지 않은 경우 오류 처리를 수행하고 b) 선택적 매개 변수가 수신되는 즉시 처리하도록하십시오 (예 : 기본값을 지정하십시오 값, 정의되지 않은 경우 다른 함수로 전달되지 않도록하십시오. 응용 프로그램 논리에 가장 적합한 것이 무엇이든간에).

1

이 시점에서 가독성과 유지 관리 가능성에 대해 더 많이 생각합니다. 내 생각에 다른 개발자에게보기 # 1에 SelectList1이있는 JS를 살펴봄으로써 분명 할 것입니다. & SelectList2? 코드를 살펴보면 모든 양식이 동일한 JS를 사용하기 때문에이 코드가 모두 3 가지라고 생각할 것입니다. 개별 양식이 각 양식에 포함 된 selectLists를 지정할 수있는 곳을보다 유연하게 만들 수 있습니다.이 방법으로 전역 스크립트는 양식에 지정된 selectLists 만 사용하고 사용 가능한 것으로 가정하지는 않습니다.

+0

당신의 가독성 포인트가 좋습니다. – trevorc

관련 문제