Javascript是目前前端開發中不可或缺的一環，無論是頁面的動效、表單的驗證、還是與后臺的交互，都需要用到它。今天我們就來看看javascript的一些使用實例。

首先我們來看表單驗證，比如一個注冊表單，在提交前我們需要驗證輸入框內是否填寫正確。可以使用正則表達式來判斷輸入是否符合規則：

function validateForm() {
var email = document.getElementById("email").value;
var password = document.getElementById("password").value;
var emailPattern = /^\w+@[a-zA-Z_]+?\.[a-zA-Z]{2,3}$/;
var passwordPattern = /^(?=.*\d)(?=.*[a-z])(?=.*[A-Z])[a-zA-Z\d@$!%*?&]{8,}$/;
if(!emailPattern.test(email)) {
alert("請填寫正確的郵箱地址！");
return false;
}
if(!passwordPattern.test(password)) {
alert("密碼必須包含數字、大小寫字母且長度至少為8位！");
return false;
}
}

以上代碼中，emailPattern和passwordPattern均為正則表達式，test()函數可以判斷輸入是否符合規則，返回true或false。

接下來我們來看一下常用的頁面效果之一——輪播圖。下面的代碼實現一個簡易的輪播圖：

var slideIndex = 0;
showSlides();
function showSlides() {
var i;
var slides = document.getElementsByClassName("slide");
for (i = 0; i < slides.length; i++) {
slides[i].style.display = "none";
}
slideIndex++;
if (slideIndex > slides.length) {slideIndex = 1}
slides[slideIndex-1].style.display = "block";
setTimeout(showSlides, 2000);
}

以上代碼中，slideIndex代表輪播圖當前顯示第幾張圖片，showSlides()函數負責切換圖片并定時執行。通過style.display屬性可以隱藏或顯示元素。

最后，我們來看一下與后臺的交互，下面的代碼實現異步傳輸數據——

function loadData() {
var xmlhttp;
if (window.XMLHttpRequest) {
xmlhttp=new XMLHttpRequest();
} else {
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
var url="http://xxx.com/data";
xmlhttp.onreadystatechange=function() {
if (xmlhttp.readyState==4 && xmlhttp.status==200) {
document.getElementById("data").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET",url,true);
xmlhttp.send();
}

在上述代碼中，使用XMLHttpRequest對象與后臺進行數據交互，使用readyState與status屬性判斷傳輸狀態，使用responseText屬性獲取傳輸回來的數據，并將其插入到HTML頁面中。

以上就是javascript的一些使用實例，當然它還能做更多更復雜的事情，學無止境，讓我們一起加油！