[JavaScript] javascript:void(0); 란?

 

void ?

: “아무것도” 반환하지 않는다.

함수가 비어있단(void) 뜻은, 그 함수가 아무것도 반환하지 않은 것을 의미한다.

자바스크립트에서 함수가 직접적으로 undefined을 반환하는 것과 비슷하다.

 

 

javascript:void(0) 란?

   javascript:

이것은 가상 URL이라고 할 수 있다.

브라우저에서 <a>태그의 href의 값으로 javascript:을 받는다면 이 값을 참조된 경로로 취급하지 않고,

쌍점(:) 뒤에 오는 것을 자바스크립트의 코드로 해석한다.

 

 

 

void(0) 란?

void 연산자는 주어진 표현식을 평가하고 undefined를 반환한다.

const result = void (1 + 1);
console.log(result);
// undefined

1 + 1의 연산은 실행이 되지만 undefined가 반환된다.

 

 

 

 

javascript:와 void(0) 결합 ?

때에 따라 링크를 클릭했을 때,

다른 페이지로 이동하거나 페이지가 다시 로딩되는 것을 원하지 않을 때가 있다.

javascript:을 사용하면 현재 페이지에 아무런 변화 없이 코드를 실행할 수 있다.

void(0)를 사용하는 것은 아무것도 하지 말라는 뜻이다.

즉, 다시 로딩하지 않고 경로를 이동하지 않고 어떤 코드도 실행하지 말라는 것과 같다.

 

 

<a href="javascript:void(0)">Link</a>

위 코드는 링크로 처리되어 포커스를 줄 수는 있지만,

“Link”를 클릭하더라도 새 페이지로 이동하지 않는다.

0은 void에게 전달된 인수(Arguments)이며 아무것도 하지 않고 아무것도 반환하지 않는다.

 

 

 

정리

a 태그의 디자인성은 살리면서 링크 기능을 없애는 것이다.

클릭 시 페이지가 다른 페이지로 이동하거나 현재 페이지를 다시 로딩하지 않는 방법이다.