Từ void có nghĩa là “không gian hoàn toàn trống rỗng” theo từ điển. Thuật ngữ này, khi được sử dụng trong lập trình, đề cập đến việc trả về “không có gì” – có thể nói là một “giá trị trống”.
từ khóa void là gì?
Khi một hàm bị vô hiệu, điều đó có nghĩa là hàm đó không trả về gì cả. Điều này tương tự như các hàm trong JavaScript trả về undefined một cách rõ ràng, như vậy:
function und() {
return undefined
}
und()
hoặc ngầm định, như vậy:
function und() {
}
und()
Bất kể các biểu thức và câu lệnh trong các hàm trên (cộng 2 số với nhau, tìm trung bình cộng của 5 số, sao cũng được), đều không có kết quả trả về.
Bây giờ chúng ta biết những gì void từ khóa là tất cả về. Thế còn javascript:void(0)?
Là gì javascript:void(0)?
Nếu chúng ta tách cái này ra, chúng ta có javascript: và void(0). Hãy xem xét từng phần chi tiết hơn.
javascript:
Điều này được gọi là một URL giả. Khi một trình duyệt nhận được giá trị này là giá trị của href trên thẻ neo, nó diễn giải mã JS theo sau dấu hai chấm (:) thay vì coi giá trị là đường dẫn được tham chiếu.
Ví dụ:
<a href="https://www.freecodecamp.org/news/javascript-void-keyword-explained/javascript:console.log("javascript');alert('javascript')">Link</a>
Khi nhấp vào “Liên kết”, đây là kết quả:
Như đã thấy ở trên, trình duyệt không xử lý href như một đường dẫn được tham chiếu. Thay vào đó, nó coi nó như một số mã JavaScript bắt đầu sau “javascript:” và được phân tách bằng dấu chấm phẩy.
void(0)
Toán tử void đánh giá các biểu thức đã cho và trả về undefined.
Ví dụ:
const result = void(1 + 1);
console.log(result);
// undefined
1 + 1 được đánh giá nhưng undefined Được trả lại. Để xác nhận điều đó, đây là một ví dụ khác:
<body>
<h1>Heading</h1>
<script>
void(document.body.style.backgroundColor="red",
document.body.style.color="white"
)
</script>
</body>
Kết quả của đoạn mã trên là:
Đây là một ví dụ khác:
console.log(void(0) === undefined)
// true
kết hợp javascript: và void(0)
Đôi khi, bạn không muốn một liên kết điều hướng đến một trang khác hoặc tải lại một trang. sử dụng javascript:bạn có thể chạy mã không thay đổi trang hiện tại.
Điều này, được sử dụng với void(0) có nghĩa, không làm gì cả – không tải lại, không điều hướng, không chạy bất kỳ mã nào.
Ví dụ:
<a href="https://www.freecodecamp.org/news/javascript-void-keyword-explained/javascript:void(0)">Link</a>
Từ “Liên kết” được trình duyệt coi là một liên kết. Ví dụ: nó có thể đặt tiêu điểm, nhưng nó không điều hướng đến một trang mới.
là một đối số được chuyển đến void điều đó không làm gì cả, và không trả lại gì.
Mã JavaScript (như đã thấy ở trên) cũng có thể được chuyển thành đối số cho void phương pháp. Điều này làm cho phần tử liên kết chạy một số mã nhưng nó vẫn duy trì cùng một trang.
Ví dụ:
<a id='link' href="https://www.freecodecamp.org/news/javascript-void-keyword-explained/javascript:void(
document.querySelector("#link').style.color="green"
)">Link</a>
Khi bấm vào nút, đây là kết quả:
Với voidnó yêu cầu trình duyệt không trả lại bất cứ thứ gì (hoặc trả lại undefined).
Một trường hợp sử dụng khác của các liên kết với javascript:void(0) tham khảo là đôi khi, một liên kết có thể chạy một số mã JavaScript ở chế độ nền và việc điều hướng có thể không cần thiết. Trong trường hợp này, các biểu thức sẽ được sử dụng làm đối số được truyền cho void.
Phần kết luận
Trong bài viết đơn giản hóa này, chúng tôi đã học được những gì void toán tử là gì, nó hoạt động như thế nào và nó được sử dụng như thế nào với javascript: URL giả cho href các thuộc tính của liên kết.
Điều này đảm bảo rằng một trang không điều hướng đến một trang khác hoặc tải lại trang hiện tại khi được nhấp.
