JavaScript是一種廣泛使用的前端編程語(yǔ)言，它的強(qiáng)大之處不僅在于其編程邏輯，更在于它所支持的控件功能。常見(jiàn)的控件有很多種，其中同名控件是一種比較常見(jiàn)的控件類型。

同名控件就是指在同一個(gè)表單中出現(xiàn)多個(gè)具有相同名稱的輸入框，當(dāng)使用表單提交數(shù)據(jù)時(shí)，這些同名控件的值會(huì)自動(dòng)以數(shù)組的形式提交到后臺(tái)。以下是一個(gè)例子：

<form><input type="text" name="name" /><input type="text" name="name" /><input type="text" name="name" /><input type="submit" value="Submit" /></form>

當(dāng)用戶在這個(gè)表單中填寫(xiě)數(shù)據(jù)并提交時(shí)，后臺(tái)接收到的數(shù)據(jù)將是一個(gè)類似這樣的數(shù)組：

[{"name":"John"},{"name":"Mike"},{"name":"Kathy"}]

同名控件的實(shí)踐運(yùn)用非常廣泛，例如一個(gè)多選框選擇多個(gè)選項(xiàng)時(shí)、上傳多張圖片等等。以下是一個(gè)選擇多個(gè)選項(xiàng)的例子：

<form><input type="checkbox" name="fruit[]" value="apple" />Apple
<input type="checkbox" name="fruit[]" value="banana" />Banana
<input type="checkbox" name="fruit[]" value="orange" />Orange
<input type="submit" value="Submit" /></form>

當(dāng)用戶選擇多個(gè)選項(xiàng)并提交時(shí)，后臺(tái)接收到的數(shù)據(jù)將是一個(gè)類似這樣的數(shù)組：

[{"fruit":["apple","banana","orange"]}]

同樣，同名控件在上傳多張圖片時(shí)也非常實(shí)用，以下是一個(gè)上傳多張圖片的例子：

<form><input type="file" name="image[]" multiple /><input type="submit" value="Submit" /></form>

當(dāng)用戶上傳多張圖片并提交時(shí)，后臺(tái)接收到的數(shù)據(jù)將是一個(gè)類似這樣的數(shù)組，每一個(gè)元素都是一個(gè)圖片的信息：

[{"image":[{"name":"image1.jpg","size":2445},{"name":"image2.jpg","size":3586},{"name":"image3.jpg","size":4578}]}]

總之，同名控件是一個(gè)非常實(shí)用的控件類型，在實(shí)際編程中經(jīng)常會(huì)用到，掌握同名控件的使用方法可以讓前端開(kāi)發(fā)更加輕松愉快。