javascript
025_JavaScript数组方法
1. 把數(shù)組轉(zhuǎn)換為字符串
1.1. toString()方法
1.1.1. toString()方法把數(shù)組轉(zhuǎn)換為數(shù)組值(逗號分隔)的字符串, 并返回結(jié)果。
1.1.2. 語法
arrayObject.toString()1.2. 自動toString()
1.2.1. JavaScript可通過引用數(shù)組名來訪問完整數(shù)組, 實際上進行了自動toString():
var fruits = ["Banana", "Orange", "Apple", "Mango"]; // 以下兩個輸出結(jié)果相同 document.write(fruits); document.write(fruits.toString());1.3. join()方法
1.3.1. join()方法用于把數(shù)組中的所有元素放入一個字符串。元素是通過指定的分隔符進行分隔的。它的行為類似toString()。
1.3.2. 語法
arrayObject.join(separator)1.3.3. 參數(shù)
1.3.4. join()方法返回一個字符串。該字符串是通過把arrayObject的每個元素轉(zhuǎn)換為字符串, 然后把這些字符串連接起來, 在兩個元素之間插入separator字符串而生成的。
1.3.5. 實例
var fruits = ["Banana", "Orange","Apple", "Mango"]; document.write(fruits.join(" | "));1.4. 例子
1.4.1. 代碼
<!DOCTYPE html> <html lang="zh-CN"><head><meta charset="utf-8" /><title>把數(shù)組轉(zhuǎn)換為字符串</title></head><body><script type="text/javascript">var fruits = ["Banana", "Orange", "Apple", "Mango"];document.write(fruits + '<br />'); document.write(fruits.toString() + '<br />'); document.write(fruits.join(" * "));</script></body> </html>1.4.2. 效果圖
2. 添加和刪除數(shù)組元素
2.1. pop()方法
2.1.1.?pop()方法從數(shù)組中刪除最后一個元素, 返回值是"被彈出"的值。
2.1.2.?語法
arrayObject.pop()2.1.3.?pop()方法將刪除arrayObject的最后一個元素, 把數(shù)組長度減1, 并且返回它刪除的元素的值。如果數(shù)組已經(jīng)為空, 則pop()不改變數(shù)組, 并返回undefined值。
2.2. push()方法
2.2.1.?push()方法可向數(shù)組的末尾添加一個或多個元素, 并返回新的長度。
2.2.2.?語法
arrayObject.push(newelement1, newelement2, ...., newelementX)2.2.3.?參數(shù)
2.2.4.?push()方法可把它的參數(shù)順序添加到arrayObject的尾部。它直接修改arrayObject, 而不是創(chuàng)建一個新的數(shù)組。push()方法和pop()方法使用數(shù)組提供的先進后出棧的功能。
2.3. 例子
2.3.1. 代碼
<!DOCTYPE html> <html lang="zh-CN"><head><meta charset="utf-8" /><title>添加和刪除數(shù)組元素</title></head><body><script type="text/javascript">var fruits = ["Banana", "Orange", "Apple", "Mango"];document.write(fruits + '<br />'); var fruits1 = fruits.pop(); document.write(fruits1 + '<br />'); document.write(fruits + '<br />'); var fruits2 = fruits.push("Pear"); document.write(fruits2 + '<br />');document.write(fruits + '<br />'); var fruits3 = fruits.push("Peach", "pineapple");document.write(fruits3 + '<br />');document.write(fruits + '<br />'); </script></body> </html>2.3.2. 效果圖
3. 位移數(shù)組元素
3.1. shift()方法
3.1.1. shift()方法會刪除首個數(shù)組元素, 并把所有其他元素"位移"到更低的索引, 方法返回被移出的元素。
3.1.2.?語法
arrayObject.shift()3.1.3.?如果數(shù)組是空的, 那么shift()方法將不進行任何操作, 返回undefined值。請注意, 該方法不創(chuàng)建新數(shù)組, 而是直接修改原有的arrayObject。
3.2. unshift()方法
3.2.1.?unshift()方法在開頭向數(shù)組添加新元素, 并"反向位移"舊元素, 方法返回新數(shù)組的長度。
3.2.2.?語法
arrayObject.unshift(newelement1, newelement2, ...., newelementX)3.2.3.?參數(shù)
3.2.4.?unshift()方法將把它的參數(shù)插入arrayObject的頭部, 并將已經(jīng)存在的元素順次地移到較高的下標處, 以便留出空間。該方法的第一個參數(shù)將成為數(shù)組的新元素0, 如果還有第二個參數(shù), 它將成為新的元素1, 以此類推。
3.3. 例子
3.3.1.?代碼
<!DOCTYPE html> <html lang="zh-CN"><head><meta charset="utf-8" /><title>位移數(shù)組元素</title></head><body><script type="text/javascript">var fruits = ["Banana", "Orange", "Apple", "Mango"];document.write(fruits + '<br />'); var fruits1 = fruits.shift(); document.write(fruits1 + '<br />'); document.write(fruits + '<br />');var fruits2 = fruits.unshift("Pear"); document.write(fruits2 + '<br />');document.write(fruits + '<br />');var fruits3 = fruits.unshift("Peach", "pineapple");document.write(fruits3 + '<br />');document.write(fruits + '<br />'); </script></body> </html>3.3.2.?效果圖
4. delete刪除數(shù)組元素
4.1. 因為數(shù)組是對象, 所以可以使用delete關(guān)鍵字來刪除數(shù)組元素, 元素改為undefined, 因此數(shù)組會留下未定義的空洞。
4.2. 例子
4.2.1.?代碼
<!DOCTYPE html> <html lang="zh-CN"><head><meta charset="utf-8" /><title>delete刪除數(shù)組元素</title></head><body><script type="text/javascript">var fruits = ["Banana", "Orange", "Apple", "Mango"];document.write(fruits + '<br />'); delete fruits[0];document.write(fruits + '<br />');document.write(fruits[0]);</script></body> </html>4.2.2. 效果圖
5. 指定數(shù)組位置添加和刪除元素
5.1. splice()方法既可以向數(shù)組中添加項目, 同時又可以從數(shù)組中刪除項目, 然后返回被刪除的項目。
5.2. 語法
arrayObject.splice(index, howmany, item1, ....., itemX)5.3. 參數(shù)
5.4. 返回值
5.5.?實例
5.5.1. 代碼
<!DOCTYPE html> <html lang="zh-CN"><head><meta charset="utf-8" /><title>指定數(shù)組位置添加和刪除元素</title></head><body><script type="text/javascript">var arr = ["JavaScript DOM編程藝術(shù)", "高性能JavaScript", "javascript高級程序設計", "JavaScript權(quán)威指南"];document.write('<b>原始數(shù)組:</b><br />' + arr + '<br /><br />'); // 從數(shù)組下標1的位置刪除2個元素var arr1 = arr.splice(1, 2);document.write('<b>刪除的元素數(shù)組:</b><br />' + arr1 + '<br /><br />'); document.write('<b>原始數(shù)組:</b><br />' + arr + '<br /><br />');// 從數(shù)組下標1的位置添加2個元素var arr2 = arr.splice(1, 0, "你不知道的JavaScript", "鋒利的jquery");document.write('<b>只是向數(shù)組中添加元素, 沒有返回值:</b><br />' + arr2 + '<br /><br />'); document.write('<b>原始數(shù)組:</b><br />' + arr + '<br /><br />');// 從數(shù)組下標2的位置刪除1個元素, 然后再添加2個元素var arr3 = arr.splice(2, 1, "高性能JavaScript", "javascript高級程序設計");document.write('<b>刪除的元素數(shù)組:</b><br />' + arr3 + '<br /><br />'); document.write('<b>原始數(shù)組:</b><br />' + arr + '<br /><br />');</script></body> </html>5.5.2. 效果圖
6. 合并數(shù)組
6.1. concat()方法用于連接兩個或多個數(shù)組。該方法不會改變現(xiàn)有的數(shù)組, 而僅僅會返回被連接數(shù)組的一個副本。
6.2. 語法
arrayObject.concat(arrayX, arrayX, ......, arrayX)6.3. 參數(shù)
6.4. 返回一個新的數(shù)組。該數(shù)組是通過把所有arrayX參數(shù)添加到arrayObject中生成的。如果要進行concat()操作的參數(shù)是數(shù)組, 那么添加的是數(shù)組中的元素, 而不是數(shù)組。
6.5. 實例
6.5.1. 代碼
<!DOCTYPE html> <html lang="zh-CN"><head><meta charset="utf-8" /><title>合并數(shù)組</title></head><body><script type="text/javascript">var arr1 = ["JavaScript DOM編程藝術(shù)"];var arr2 = ['高性能JavaScript', 'javascript高級程序設計'];document.write('<b>原始數(shù)組:</b><br />' + arr1 + '<br /><br />'); // 向數(shù)組中添加多個值var arr3 = arr1.concat("JavaScript權(quán)威指南", "鋒利的jquery");document.write('<b>向數(shù)組中添加多個值后的新數(shù)組:</b><br />' + arr3 + '<br /><br />'); document.write('<b>原始數(shù)組:</b><br />' + arr1 + '<br /><br />');// 向數(shù)組中添加數(shù)組var arr4 = arr1.concat(arr2);document.write('<b>向數(shù)組中添加數(shù)組后的新數(shù)組:</b><br />' + arr4 + '<br /><br />'); document.write('<b>原始數(shù)組:</b><br />' + arr1 + '<br /><br />');// 向數(shù)組中添加值和數(shù)組var arr5 = arr1.concat("JavaScript權(quán)威指南", "鋒利的jquery", arr2);document.write('<b>向數(shù)組中添加值和數(shù)組后的新數(shù)組:</b><br />' + arr5 + '<br /><br />'); document.write('<b>原始數(shù)組:</b><br />' + arr1 + '<br /><br />');</script></body> </html>6.5.2. 效果圖
7. 裁剪數(shù)組
7.1. slice()方法用數(shù)組的某個片段切出新數(shù)組。它不會從源數(shù)組中刪除任何元素。
7.2. 語法
arrayObject.slice(start, end)7.3. 參數(shù)
7.4. slice()方法有2個參數(shù), 第一個參數(shù)是開始位置, 第二個參數(shù)是結(jié)束位置, 從開始參數(shù)選取元素, 直到結(jié)束參數(shù)(不包括)為止。
7.5. slice()方法如果結(jié)束參數(shù)被省略, 則會切出數(shù)組的剩余部分。
7.6. 實例
7.6.1. 代碼
<!DOCTYPE html> <html lang="zh-CN"><head><meta charset="utf-8" /><title>裁剪數(shù)組</title></head><body><script type="text/javascript">var arr = ["JavaScript DOM編程藝術(shù)", "高性能JavaScript", "javascript高級程序設計", "JavaScript權(quán)威指南", "你不知道的JavaScript"];var arr1 = arr.slice(1, 3);var arr2 = arr.slice(1);document.write('<b>原始數(shù)組:</b><br />' + arr + '<br /><br />'); document.write('<b>裁剪下標1~3(不包含下標3的位置)位置的元素, 返回的新數(shù)組:</b><br />' + arr1 + '<br /><br />'); document.write('<b>裁剪下標1到結(jié)束位置的元素, 返回的新數(shù)組:</b><br />' + arr2); </script></body> </html>7.6.2. 效果圖
總結(jié)
以上是生活随笔為你收集整理的025_JavaScript数组方法的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 024_JavaScript数组
- 下一篇： 026_JavaScript数组排序