undefined

Javascript:void(0): что значит, какие задачи решает?

В языках программирования, включая JavaScript, функции и операторы возвращают данные. В веб-разработке эту особенность нужно учитывать, т. к. интегрированные в виде ссылок веб-приложения могут изменить контент страницы. Чтобы предотвратить возврат данных, используют ключевое слово void.

В этой статье мы кратко расскажем про конструкцию javascript:void(0) — что это, как использовать и актуален ли этот метод работы с данными. Если вы хотите подробнее познакомиться с этой темой и программированием в целом, рекомендуем курсы JS-разработчика.

Что такое void(0)

Для начала разберемся, что означает английское слово “void”. В переводе на русский получается “пустота”, “пустое пространство”. Это ключевое слово работает в соответствии со своим названием — вынуждает функцию вернуть пустое значение, т. е. undefined.

А теперь рассмотрим конструкцию javascript:void(0) по частям. Первая половина строки до двоеточия называется псевдо-URL. Когда браузер получает такое значение в качестве значения атрибута href, то интерпретирует строку не как ссылку на другую страницу, а в качестве JS-кода, который нужно выполнить.

К примеру, программист написал:

Тогда пользователь после выбора ссылки увидит:

Результат без использования void(0)

А оператор void вычисляет переданное в него выражение и всегда возвращает значение undefined. Не путайте void с null. Последний представляет собой маркер, указывающий на отсутствие объекта, к которому обращается функция. А undefined — это отсутствие значения.

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

Хотя внутри void выполняется операция сложения, на выходе программист видит, что результат не определен. На примере этого кода также можно понять, что операторы в скобках не имеют значения, т. к. результатом в любом случае будет undefined. Это делает void(0) универсальным решением.

 
Heading
  

На всякий случай проверим тип данных:

console.log(void(0) === undefined) // true

Какой в этом смысл?

Void позволяет внедрить в ссылку код, который не перезагрузит страницу и не изменит ее содержание. Благодаря ему разработчик может улучшить юзабилити и избавиться от лишних загрузок, а также запретить переход пользователя по ссылке.

В каких задачах используется

Рассмотрим три распространенных способа использования void.

Замена значений новым выражением

Команда со словом void до сих пор активно используется в веб-разработке, потому что ее значение можно переопределять и даже затирать во время выполнения программного кода.

     function sayHi(undefined) 
Поприветствуй пользователя, нажми на ссылку. 
  

В результате программист увидит в диалоговом окне слово “Привет”, хотя изначально возвращался другой параметр.

Создание букмарклетов

Так называют фрагменты javascript-код, которые сохраняются в качестве URL-адреса закладки в веб-браузере или гиперссылки. При этом они запускаются через протокол:

Выбирая букмарклет, пользователь запустит блок кода, который может делать запросы к серверу, править контент или выполнять другую функцию.

Код не должен возвращать значений, поэтому разработчики используют void для предотвращения обновления и перехода по ссылке. Заготовка будущего букмарклета выглядит следующим образом:

Внедрение веб-приложений

Если в ссылку требуется внедрить веб-приложение, т. е. функцию на языке JavaScript, то нужно использовать void. Это устранит риск изменения контента страницы. Сейчас этот прием редко используют, т. к. есть более удобные методы работы с интегрированным софтом, включая приложения, которые должны возвращать какое-то значение

Актуальность

Этот способ предотвратить изменение контента теряет востребованность, т. к. протокол javascript:url уходит в прошлое. Соответственно, void тоже теряет популярность, хотя с его помощью легко создавать букмарклеты.

Одной из причин стало то, что не все пользователи могут взаимодействовать с такими ссылками, если браузер не поддерживает JavaScript.

Заключение

Теперь вы знаете, как работать с оператором void и зачем он нужен. Однако опять же отметим постепенное устаревание этого метода. Если вы хотите стать веб-разработчиком, рекомендуем пройти наш курс. На нем вы получите актуальные знания, которые помогут попасть в IT.

Источник

Нужно ли использовать ‘#’ или ‘javascript:void(0)’ в href-атрибуте пустых ссылок

Стоит ли применять JavaScript void 0 ? Если использовать # , и тем самым препятствуя привычной работе ссылок, ( например, для прокрутки к верху страницы ), то приходится указывать и значение return false для функции в событии onclick :

Hey Hey  

Если вместо этого использовать javascript:void , то использовать return false не нужно, так как void(0) – самый миниатюрный скрипт, который расценивается как undefined . То есть:

Тот же эффект, что и при использовании href=»#» , только код с JavaScript void меньше и чище.

JavaScript: void(0)

Когда мы используем JavaScript в навигации, значение return в исполняемом скрипте становится содержимым нового документа, который отображается в браузере. Оператор void превращает значение return value в следующем за ним выражении в return undefined , что и предотвращает исполнение данного события.

Ссылка перенаправляет браузер на текстовую версию результатов, которые расценены как JavaScript . Однако если результатом будет undefined , то браузер останется на той же странице. JavaScript void 0 — что значит? Это миниатюрный скрипт, который определяется как undefined .

Однако javascript:void(0) ; нарушает Content Security Policy ( CSP, политика защиты контента ) у протокола HTTPS эта защита включена. Это помогает выявлять и нивелировать определенные типы атак, включая Cross-Site Scripting ( XSS ), инъекции вредоносных данных.

Следовательно, если вы суеверный разработчик, то пользуйтесь href=»#» вместо javascript:void и не беспокойтесь о нарушении политики защиты.

Href=»#»

Хэш безопаснее в тех случаях, когда у пользователей отключена поддержка JavaScript .

Хотя эту проблему можно легко обойти за счет jQuery :

Можно даже вернуть false в атрибут элемента onclick , и получить тот же эффект:

Несколько рекомендаций напоследок

В href javascript void 0 используется, если нужен четкий и быстрый результат.

href=»#» и предотвращение исполнения события используется тогда, когда не хочется нарушать стандарты JavaScript.

Пожалуйста, оставляйте свои комментарии по текущей теме статьи. За комментарии, подписки, дизлайки, отклики, лайки огромное вам спасибо!

Источник

Understanding the javascript:void(0) Statement

javascript: is a pseudo URL. A way to embed JavaScript code directly into an HTML document. It can be used as the value of a hyperlink’s href attribute or as the value of an event handler such as onclick. For example, if you have a link that needs to perform a specific JavaScript function when clicked, instead of navigating to a different page, you can use the «javascript:» pseudo URL:

 href="javascript:myFunction()">Click here 

When the user clicks on the link, the JavaScript function myFunction() will be executed, and the page will not navigate away.

 href="javascript:console.log('Code of Relevancy');">Click me 

It is important to note that this method can be a security risk as it allows for potentially malicious code to be executed on the user’s computer, so it should be used with caution.

void(0)

The void operator is a valuable tool in JavaScript that evaluates an expression and returns the undefined value. It is frequently used to simply obtain the undefined primitive value by using void(0) or void 0 . However, it’s worth noting that the global variable undefined can be used as a substitute for the void operator in most cases, provided it has not been reassigned to a non-default value.

Examples

 href="JavaScript:void(0)">Click me, nothing will happen 

This anchor tag specifies a hyperlink with a javascript:void(0) URL. When clicked, the JavaScript function void is executed, which returns undefined and has no effect on the page. The purpose of using javascript:void(0) as the href value is to prevent the page from refreshing and changing the URL when the link is clicked. It’s often used when a link is desired but no action is needed to happen.

 href="#section2">Go to Section 2  href="#">Click me 

This anchor tag specifies a hyperlink with a URL of # . The # symbol is often used as a placeholder URL, and clicking on the link jumps to the top of the page. It’s also used to create an internal link within the same page, allowing the user to jump to a specific section within the page. 🍀Conclusion:
javascript:void(0) is used as a placeholder URL when a link is needed but no action is desired, while # is used as a placeholder URL to jump to the top of the page or to create internal links within the same page. 🍀Support:
Please consider supporting us by subscribing to our channel. Your support is greatly appreciated and will help us continue creating content for you to enjoy. Thank you in advance for your support! YouTube
Discord
GitHub

Источник

What Does JavaScript:Void(0) Mean?

JavaScript’s void operator evaluates an expression and returns undefined.

You can use the console to verify the same:

Note: void, irrespective of any value passed along, *always returns undefined as shown above*. But, void with the operand 0 is preferred.

There are two ways of using operand 0: void(0) or void 0. Either of them is fine.

When to use Javascript void(0)

Use javascript:void(0) if, when a link is clicked, you don’t want the browser to load a new page or refresh the same page (depending on the URL specified).

Instead it will just perform the JavaScript attached to that link.

Example 1 with Javascript void(0):

Output:

When someone clicks on the ClickMe link, an alert pops up as below:

Example 2 with Javascript void(0):

Output:

When you double click the link, an alert will popup without any page refresh.

Example 3 with Javascript void(0):

Output:

When you double click the link, an alert will popup. Closing it will also not redirect to google.com.

Example without Javascript void(0):

Output:

When you double click the link, an alert will popup, but closing it will redirect to google.com.

Conclusion

The void operator is useful when you need to prevent any unwanted page refresh or redirection. Rather, it performs some JavaScript operation.

Источник