[JavaScript] 자바스크립트 여러가지 유용한 팁

 

 

ㅇ try catch문

자바스크립트로 작업하다 보면 정말 어떨 때는 구문이 틀리지도 않았는데, 브라우저 버전에 따라 에러가 발생할 때도 있다.

그럴 때 다음의 try catch문을 사용하면 편리하다.

 

사용예 :

try {
    // 실제 실행시킬부분
    var a = opener.location.href;
}
catch (e) {
    // 위의 "실행시킬부분"에서 에러가 났을때 처리해줄 부분
    alert ("opener를 찾을수 없습니다.");
} 
finally {
    // 에러가 나든 나지 않든 무조건 실행시키는 부분
    window.status = "opener.locatoin.href 부분 실행되었음";
}

 

 

ㅇ typeof문

보통 데이터나 오브젝트 타입 등을 검사할 때 많이 사용하는데 만약 "undefined"이면 인식을 못한 거고 "unknown"이 나올 때가 있다.. 만약 부모창에서 새창을 열고 부모창을 닫았는지 새창에서 검사할 때 유용하다.

if (typeof (opener) == "unknown")

 ​

ㅇ regExp (정규표현식)

만약 <textarea name="taContent"></textarea>에 사용자가 입력한 value값 중에서 "/아싸1/" ~ "/아싸10/" 까지를 다 "/호호1/" ~ "/호호10/" 까지로 바꾸려면 어떻게 할까?

var sTaContent = taContent.value;
for (var nI = 1; nI <= 10; nI++)
{
    // i는 대소문자 구분없고, g는 중복되어도 다처리
    var expTest = new RegExp("/아싸" + nI + "/", "ig"); 
    sTaContent = sTaContent.replace (expTest, "/호호" + nI + "/");
}
taContent.value = sTaContent;

 

위의 expTest의 메서드들도 몇 개 있으므로 알아두면 많이 도움이 된다. 또한, 게시판의 글보기에 나오는 글들에 자동링크 걸 때도 사용한다.

 

ㅇ var a="08", b="09"일 때

parseInt (a)나 parseInt (b)의 값은 0이다.

Number (a)나 Number (b) 값을 해야 제대로 8과 9의 값이 나온다.

​

 

ㅇ <img> 태크 src주소값 변경

<img name="pic1" src="">
<img name="pic2" src="">
<img name="pic3" src="">

​

위와 같이 있고 javascript에서 pic1 ~ pic3의 src주소값을 바꾸고자 할 때 eval을 사용하면 편리하다.

for (var nI = 1; nI <= 3; nI ++) {
    eval("document.pic" + nI + ".src ='http://image.aaa.com/p" + nI + ".gif'");
}​

 

ㅇ 만약 a와 b와 c의 값을 구분자 ","로 구분하는 String (a, b, c)을 만들고 싶을 때

var oTmpArray = new Array ("a", "b", "c");
var sValue = oTmpArray.join (",");

 

ㅇ javascript 연관배열

var oMethod = {
    "ALERT" : goAlert,
    "MSG" : goMsg
}

oMethod ["ALERT"]는 goAlert가 됩니다.

 

ㅇ onLoad, onClick, onMousewheel... 등등의 이벤트를 붙이거나 떼기

window.attachEvent ("onscroll", procScroll);

하면 onscroll 이벤트 발생 시 procScroll 함수 실행

 

window.detachEvent ("onscroll", procScroll);

하면 onscroll 이벤트 떼기

 

움직이는 gif이미지를 key이벤트나 등등 이벤트를 사용하면 움직이던 gif이미지가 멈추어버린다.  return값 때문에 "event.returnValue = 'false'" 해주면 된다.

 

​

ㅇ F5번 누를 때 경고창(confirm 같은 것) 띄워서 새로고침 할 건지 물어보기

window.onbeforeunload = hoho ();
function hoho ()
{
    var sMsg = "새로고침을 정말로 정말로 정말로 할꺼예여?";
    return (sMsg);
}

 

물론 F5번 눌렀을 때를 key Event로 잡아서 함수 안에서 실행해도 된다.