Efficient, Rapid, Accurate

💻 Programming/Javascript

[Javascript / 자바스크립트] 강좌 #15 - void 키워드

이번에는 void 키워드에 대해서 한번 알아보도록 할까요?

자바스크립트에서 사용되는 void는 자바의 void와 별반 다를게 없어보입니다.

우선 제가 조사한 바에 의하면 void의 역할을 아래와 같습니다.

void keyword evaluates the expression and always returns undefined.

한마디로 "표현식을 평가하고 항상 undefined를 반환한다"네요. 이게 무슨 말일까요? 아시는 분은 댓글좀 남겨주세요 ㅎㅎ

사실 포스팅은 하는데 이게 도대체 언제 어떻게 쓰이는지에 대해서는 저도 잘 모르겠습니다. 어쨌든 이런 것도 있구나 하시면서 보시면 되겠습니다.

일단 예제를 한번 보는게 낫겠죠?

아래에 기본적인 예제가 나와있네요.

<head>
<script type="text/javascript">
<!--
void func()
javascript:void func()

or:

void(func())
javascript:void(func())
//-->
</script>
</head>

예제 1:

void 키워드가 가장 많이 사용되는 곳은 클라이언트 사이드의 javascript: URL 이라고 하네요. 이 예제에서는 alert함수를 사용했는데요

한번 실행시켜 보세요. void ( )를 없애고 그냥 alert('Warning!!!')만 써도 결과는 똑같이 나옵니다. 차이가 뭔지 저도 아직 잘 모르겠네요.

<head>
<script type="text/javascript">
<!--
//-->
</script>
</head>
<body>
<a href="javascript:void(alert('Warning!!!'))">Click me!</a>
</body>

예제 2:

이번 예제에서는 void( )안에 "0" 만 써넣었네요. 사실 저도 이게 정확히 뭘 의미하는지 잘은 모르겠지만 제가 참조한 사이트에 의하면 다음처럼 얘기하고 있습니다. Here the expression "0" is evaluated but it is not loaded back into the current document. 0 이라는 값이 평가가 되기는 하는데 현재문서로 load되지는 않는다고 말이죠. 자, 결과가 예제 1과 뭐가 다른가요? 링크를 눌러도 아무런 변화가 안보이죠?

<head>
<script type="text/javascript">
<!--
//-->
</script>
</head>
<body>
<a href="javascript:void(0))">Click me!</a>
</body>

예제 3:

이번 예제에서는 void 키워드를 사용함으로써 고의적으로 undefined 값을 a에 할당하고 있습니다. 뭐 실제로 이렇게 쓸만한 일은 없을 것 같지만 이런 예제도 있구나 하시면 될 것 같네요.

<head>
<script type="text/javascript">
<!--
function getValue(){
   var a,b,c;

   a = void ( b = 5, c = 7 );
   document.write('a = ' + a + ' b = ' + b +' c = ' + c );
}
//-->
</script>
</head>
<body>
<p>Click the following to see the result:</p>
<form>
<input type="button" value="Click Me" onclick="getValue();" />
</body>

예제 4:

마지막 예제입니다. 이번 예제에서는 void( )안에서특정 변수에 값을 할당하고 할당된 값을 경고창을 이용해서 뿌려주고있습니다.

사실 void키워드가 없어도 결과는 동일하게 나옵니다만....도대체 왜 void키워드를 쓰는지는 모르겠네요 ㅎㅎ;;;;

<head>
<script type="text/javascript">
<!--
//-->
</script>
</head>
<body>
<a href="javascript: void(myNum=10);alert('myNum = '+myNum)">
Set myNum Please</a>
</body>

Reference : http://www.tutorialspoint.com/javascript/javascript_void_keyword.htm

저작자표시 비영리 변경금지

'💻 Programming > Javascript' 카테고리의 다른 글

[Javascript / 자바스크립트] 강좌 #17 - Error Handling ( 예외 처리 ) (0)	2015.08.05
[Javascript / 자바스크립트] 강좌 #16 - Object ( 객체 ) (0)	2015.08.05
[Javascript / 자바스크립트] 강좌 #14 - Dialog Boxes ( 다이얼로그 박스 ) (0)	2015.08.05
[Javascript / 자바스크립트] 강좌 #13 - Page Redirection ( 페이지 리디렉션 ) (0)	2015.08.05
[Javascript / 자바스크립트] 강좌 #12 - Cookie handling ( 쿠키 핸들링 ) (0)	2015.08.05

💻 Programming/Javascript

[Javascript / 자바스크립트] 강좌 #15 - void 키워드

예제 1:

예제 2:

예제 3:

예제 4:

'💻 Programming > Javascript' 카테고리의 다른 글

Category

Recent Posts

Recent Comments

티스토리툴바