前端切圖仔，常用的14個數(shù)組方法

Array 對象方法

方法 描述
concat() 連接兩個或更多的數(shù)組，并返回結果。
join() 把數(shù)組的所有元素放入一個字符串。元素通過指定的分隔符進行分隔。
pop() 刪除并返回數(shù)組的最后一個元素
push() 向數(shù)組的末尾添加一個或更多元素，并返回新的長度。
reverse() 顛倒數(shù)組中元素的順序。
shift() 刪除并返回數(shù)組的第一個元素
slice() 從某個已有的數(shù)組返回選定的元素
sort() 對數(shù)組的元素進行排序
splice() 刪除元素，并向數(shù)組添加新元素。
toSource() 返回該對象的源代碼。
toString() 把數(shù)組轉(zhuǎn)換為字符串，并返回結果。
toLocaleString() 把數(shù)組轉(zhuǎn)換為本地數(shù)組，并返回結果。
unshift() 向數(shù)組的開頭添加一個或更多元素，并返回新的長度。
valueOf() 返回數(shù)組對象的原始值
1：concat()方法
定義和用法

concat() 方法用于連接兩個或多個數(shù)組。

該方法不會改變現(xiàn)有的數(shù)組，而僅僅會返回被連接數(shù)組的一個副本。

實例

例子 1

在本例中，我們將把 concat() 中的參數(shù)連接到數(shù)組 a 中：

<script type="text/javascript">

var a = [1,2,3];
document.write(a.concat(4,5));

</script>

輸出：

1,2,3,4,5

例子 2

在本例中，我們創(chuàng)建了兩個數(shù)組，然后使用 concat() 把它們連接起來：

<script type="text/javascript">

var arr = new Array(3)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"

var arr2 = new Array(3)
arr2[0] = "James"
arr2[1] = "Adrew"
arr2[2] = "Martin"

document.write(arr.concat(arr2))

</script>

輸出：

George,John,Thomas,James,Adrew,Martin

例子 3

在本例中，我們創(chuàng)建了三個數(shù)組，然后使用 concat() 把它們連接起來：

<script type="text/javascript">

var arr = new Array(3)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"

var arr2 = new Array(3)
arr2[0] = "James"
arr2[1] = "Adrew"
arr2[2] = "Martin"

var arr3 = new Array(2)
arr3[0] = "William"
arr3[1] = "Franklin"

document.write(arr.concat(arr2,arr3))

</script>

輸出：

George,John,Thomas,James,Adrew,Martin,William,Franklin
2：join()方法
定義和用法

join() 方法用于把數(shù)組中的所有元素放入一個字符串。

元素是通過指定的分隔符進行分隔的。

實例

例子 1

在本例中，我們將創(chuàng)建一個數(shù)組，然后把它的所有元素放入一個字符串：

<script type="text/javascript">

var arr = new Array(3)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"

document.write(arr.join())

</script>

輸出：

George,John,Thomas

例子 2

在本例中，我們將使用分隔符來分隔數(shù)組中的元素：

<script type="text/javascript">

var arr = new Array(3)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"

document.write(arr.join("."))

</script>

輸出：

George.John.Thomas
3：pop()方法
定義和用法

pop() 方法用于刪除并返回數(shù)組的最后一個元素。

實例

在本例中，我們將創(chuàng)建一個數(shù)組，然后刪除數(shù)組的最后一個元素。請注意，這也會改變數(shù)組的程度：

<script type="text/javascript">

var arr = new Array(3)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"

document.write(arr)

document.write("<br />")

document.write(arr.pop())

document.write("<br />")

document.write(arr)

</script>

輸出：

George,John,Thomas
Thomas
George,John
4：push()方法
定義和用法

push() 方法可向數(shù)組的末尾添加一個或多個元素，并返回新的長度。

實例

在本例中，我們將創(chuàng)建一個數(shù)組，并通過添加一個元素來改變其長度：

<script type="text/javascript">

var arr = new Array(3)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"

document.write(arr + "<br />")
document.write(arr.push("James") + "<br />")
document.write(arr)

</script>

輸出：

George,John,Thomas
4
George,John,Thomas,James
5：reverse()方法
定義和用法

reverse() 方法用于顛倒數(shù)組中元素的順序。

實例

在本例中，我們將創(chuàng)建一個數(shù)組，然后顛倒其元素的順序：

<script type="text/javascript">

var arr = new Array(3)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"

document.write(arr + "<br />")
document.write(arr.reverse())

</script>

輸出：

George,John,Thomas
Thomas,John,George
6：shift()方法
定義和用法

shift() 方法用于把數(shù)組的第一個元素從其中刪除，并返回第一個元素的值。

實例

在本例中，我們將創(chuàng)建一個數(shù)組，并刪除數(shù)組的第一個元素。請注意，這也將改變數(shù)組的長度：

<script type="text/javascript">

var arr = new Array(3)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"

document.write(arr + "<br />")
document.write(arr.shift() + "<br />")
document.write(arr)

</script>

輸出：

George,John,Thomas
George
John,Thomas
7：slice()方法
定義和用法

slice() 方法可從已有的數(shù)組中返回選定的元素。

實例

例子 1

在本例中，我們將創(chuàng)建一個新數(shù)組，然后顯示從其中選取的元素：

<script type="text/javascript">

var arr = new Array(3)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"

document.write(arr + "<br />")
document.write(arr.slice(1) + "<br />")
document.write(arr)

</script>

輸出：

George,John,Thomas
John,Thomas
George,John,Thomas

例子 2

在本例中，我們將創(chuàng)建一個新數(shù)組，然后顯示從其中選取的元素：

<script type="text/javascript">

var arr = new Array(6)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"
arr[3] = "James"
arr[4] = "Adrew"
arr[5] = "Martin"

document.write(arr + "<br />")
document.write(arr.slice(2,4) + "<br />")
document.write(arr)

</script>

輸出：

George,John,Thomas,James,Adrew,Martin
Thomas,James
George,John,Thomas,James,Adrew,Martin
8：sort()方法
定義和用法

sort() 方法用于對數(shù)組的元素進行排序。

實例

例子 1

在本例中，我們將創(chuàng)建一個數(shù)組，并按字母順序進行排序：

<script type="text/javascript">

var arr = new Array(6)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"
arr[3] = "James"
arr[4] = "Adrew"
arr[5] = "Martin"

document.write(arr + "<br />")
document.write(`arr.sort()`)

</script>

輸出：

George,John,Thomas,James,Adrew,Martin
Adrew,George,James,John,Martin,Thomas

例子 2

在本例中，我們將創(chuàng)建一個數(shù)組，并按字母順序進行排序：

<script type="text/javascript">

var arr = new Array(6)
arr[0] = "10"
arr[1] = "5"
arr[2] = "40"
arr[3] = "25"
arr[4] = "1000"
arr[5] = "1"

document.write(arr + "<br />")
document.write(`arr.sort()`)

</script>

輸出：

10,5,40,25,1000,1
1,10,1000,25,40,5

請注意，上面的代碼沒有按照數(shù)值的大小對數(shù)字進行排序，要實現(xiàn)這一點，就必須使用一個排序函數(shù)：

<script type="text/javascript">

function sortNumber(a,b)
{
return a - b
}

var arr = new Array(6)
arr[0] = "10"
arr[1] = "5"
arr[2] = "40"
arr[3] = "25"
arr[4] = "1000"
arr[5] = "1"

document.write(arr + "<br />")
document.write(`arr.sort(sortNumber)`)

</script>

輸出：

10,5,40,25,1000,1
1,5,10,25,40,1000
9：splice()方法
定義和用法

splice() 方法向/從數(shù)組中添加/刪除項目，然后返回被刪除的項目。

注釋：該方法會改變原始數(shù)組。

實例

例子 1

在本例中，我們將創(chuàng)建一個新數(shù)組，并向其添加一個元素：

<script type="text/javascript">

var arr = new Array(6)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"
arr[3] = "James"
arr[4] = "Adrew"
arr[5] = "Martin"

document.write(arr + "<br />")
arr.splice(2,0,"William")
document.write(arr + "<br />")

</script>

輸出：

George,John,Thomas,James,Adrew,Martin
George,John,William,Thomas,James,Adrew,Martin

例子 2

在本例中我們將刪除位于 index 2 的元素，并添加一個新元素來替代被刪除的元素：

<script type="text/javascript">

var arr = new Array(6)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"
arr[3] = "James"
arr[4] = "Adrew"
arr[5] = "Martin"

document.write(arr + "<br />")
arr.splice(2,1,"William")
document.write(arr)

</script>

輸出：

George,John,Thomas,James,Adrew,Martin
George,John,William,James,Adrew,Martin

例子 3

在本例中我們將刪除從 index 2 ("Thomas") 開始的三個元素，并添加一個新元素 ("William") 來替代被刪除的元素：

<script type="text/javascript">

var arr = new Array(6)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"
arr[3] = "James"
arr[4] = "Adrew"
arr[5] = "Martin"

document.write(arr + "<br />")
arr.splice(2,3,"William")
document.write(arr)

</script>

輸出：

George,John,Thomas,James,Adrew,Martin
George,John,William,Martin
10：toSource()方法
定義和用法

toSource() 方法可把數(shù)組轉(zhuǎn)換為JavaScript源代碼。

實例
<script type="text/javascript">

    var arr = new Array()   
    arr[0] = "George"  
    arr[1] = "John"  
    arr[2] = "Thomas"   
    document.write(arr.toSource())  

</script>

輸出：

["George", "John", "Thomas"]
11：toString()方法
定義和用法

toString() 方法可把一個 Number 對象轉(zhuǎn)換為一個字符串，并返回結果。

實例

在本例中，我們將把一個數(shù)字轉(zhuǎn)換為字符串：

<script type="text/javascript">

var number = new Number(1337);
document.write (number.toString())

</script>

輸出：

1337
12：toLocaleString()方法
定義和用法

toLocaleString() 方法可根據(jù)本地時間把 Date 對象轉(zhuǎn)換為字符串，并返回結果。

實例

例子 1

在本例中，我們將根據(jù)本地時間把今天的日期轉(zhuǎn)換為字符串：

<script type="text/javascript">

var d = new Date()
document.write(d.toLocaleString())

</script>

輸出：

    var d = new Date()
    document.write (d.toLocaleString())

例子 2

在本例中，我們將根據(jù)本地時間把具體的日期轉(zhuǎn)換為字符串：

<script type="text/javascript">

var born = new Date("July 21, 1983 01:15:00")
document.write(born.toLocaleString())

</script>

輸出：

var born = new Date("July 21, 1983 01:15:00")
document.write(born.toLocaleString())
13：unshift()方法
定義和用法

unshift() 方法可向數(shù)組的開頭添加一個或更多元素，并返回新的長度。

實例

在本例中，我們將創(chuàng)建一個數(shù)組，并把一個元素添加到數(shù)組的開頭，并返回數(shù)組的新長度：

<script type="text/javascript">

var arr = new Array()
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"

document.write(arr + "<br />")
document.write(arr.unshift("William") + "<br />")
document.write(arr)

</script>

輸出：

George,John,Thomas
4
William,George,John,Thomas
14：valueOf()方法
定義和用法

valueOf() 方法返回 Array 對象的原始值。

該原始值由 Array 對象派生的所有對象繼承。

valueOf() 方法通常由 JavaScript 在后臺自動調(diào)用，并不顯式地出現(xiàn)在代碼中。

例子
<script type="text/javascript">

var fruits = ["Banana", "Orange", "Apple", "Mango"];
var v=fruits.valueOf(); 

</script>

輸出結果

Banana,Orange,Apple,Mango
?著作權歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成，瀏覽時請結合常識與多方信息審慎甄別。
平臺聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點，簡書系信息發(fā)布平臺，僅提供信息存儲服務。

相關閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容