JavaScript數(shù)組函數(shù)unshift、shift、pop、push使用實例
更新時間：2014年08月27日 11:12:54 投稿：junjie
這篇文章主要介紹了JavaScript數(shù)組函數(shù)unshift、shift、pop、push使用實例,本文先是講解了聲明數(shù)組的方法,然后對4個函數(shù)使用給出了一些例子,需要的朋友可以參考下
如何聲明數(shù)組
s中數(shù)組的聲明可以有幾種方式聲明
復(fù)制代碼 代碼如下:
var tmp = []; // 簡寫模式
var tmp = new Array(); // 直接new一個
var tmp = Array(); // 或者new也可以
在new數(shù)組的時候可以傳入一個參數(shù)，表示數(shù)組的初始化長度
復(fù)制代碼 代碼如下:
// new的時候傳入一個參數(shù)表示初始化數(shù)組長度
var tmp = new Array(3);
alert(tmp.length); // 3
但如果你想創(chuàng)建一個只有一個元素3的數(shù)組，那么使用 new 方法是不能實現(xiàn)的，因為系統(tǒng)會把你傳入的3當(dāng)作數(shù)組的長度，除非你使用引號引起來當(dāng)作字符串，如
復(fù)制代碼 代碼如下:
var tmp = new Array('3');
alert(tmp); // 3
我們可以使用簡寫模式創(chuàng)建數(shù)組，這樣就可以創(chuàng)建只有一個數(shù)字元素3的數(shù)組
復(fù)制代碼 代碼如下:
var tmp = [3]
alert(typeof tmp[0]); // number
也可以初始多個元素，并且元素的值可以是任意類型
復(fù)制代碼 代碼如下:
// 簡約模式創(chuàng)建數(shù)組
// 數(shù)組的元素可以是任意一種數(shù)據(jù)類型
var tmp = [3,true,8.5,{'name':'lizhong'},['a','b']];
alert(tmp.length); // 5
一、unshift 在數(shù)組第一個元素前插入元素
復(fù)制代碼 代碼如下:
// 使用unshift在數(shù)組第一個元素前插入元素
// 返回數(shù)組長度
var tmp = ['a','b'];
var len = tmp.unshift('c');
alert(len); // 3
alert(tmp); // c,a,b
也可以一次插入多個元素，順序依次從左邊排起
復(fù)制代碼 代碼如下:
// 使用unshift在數(shù)組第一個元素前插入元素
// 返回數(shù)組長度
var tmp = ['a','b'];
var len = tmp.unshift('c','d');
alert(len); // 4
alert(tmp); // c,d,a,b
二、shift彈出數(shù)組第一個元素，返回被彈出的元素值
小實例：
復(fù)制代碼 代碼如下:
// 使用shift彈出數(shù)組第一個元素
// 返回被彈出的元素值
var tmp = ['a','b','c'];
var val = tmp.shift();
alert(val); // a
alert(tmp); // b,c
如果是一個空數(shù)組：
復(fù)制代碼 代碼如下:
// 使用shift彈出數(shù)組第一個元素
// 返回被彈出的元素值
var tmp = [];
var val = tmp.shift();
alert(val); // undefined
alert(tmp); // 空
三、push在數(shù)組末尾添加元素
跟unshift相反，push在數(shù)組末尾添加元素，返回添加元素以后的數(shù)組長度
復(fù)制代碼 代碼如下:
// 使用push在數(shù)組末尾添加多個元素
// 返回數(shù)組最新長度
var tmp = ['a','b','c'];
var len = tmp.push('d');
alert(len); // 4
alert(tmp); // a,b,c,d
也可以一次添加多個元素
復(fù)制代碼 代碼如下:
// 使用push在數(shù)組末尾添加多個元素
// 返回數(shù)組最新長度
var tmp = ['a','b','c'];
var len = tmp.push('d','e','f');
alert(len); // 6
alert(tmp); // a,b,c,d,e,f
四、pop函數(shù)刪除數(shù)組末尾元素
跟shift相反，pop彈出的是數(shù)組末尾元素，返回被彈出的元素值
復(fù)制代碼 代碼如下:
// 使用pop彈出數(shù)組末尾元素
// 返回被彈出的元素值
var tmp = ['a','b','c'];
var val = tmp.pop();
alert(val); // c
alert(tmp); // a,b
如果數(shù)組為空，返回undefined
復(fù)制代碼 代碼如下:
// 使用pop彈出數(shù)組末尾元素
// 返回被彈出的元素值
var tmp = [];
var val = tmp.pop();
alert(val); // undefined
alert(tmp); // 空
利用以上四個函數(shù)，我們可以做一些隊列處理，具體案例就不寫代碼了。
push功能其實也可以這么實現(xiàn)
復(fù)制代碼 代碼如下:
var tmp = ['a','b','c'];
tmp[tmp.length] = 'd';
alert(tmp); // a,b,c,d
注意：以上四個函數(shù)unshift、shift、pop、push函數(shù)操作都會在數(shù)組本身上修改。
相關(guān)文章
javascript解析json格式的數(shù)據(jù)方法詳解
這篇文章主要介紹了javascript解析json格式的數(shù)據(jù)方法詳解，文章通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-08-08
這篇文章介紹了gojs實現(xiàn)螞蟻線動畫效果的方法，文中通過示例代碼介紹的非常詳細(xì)。對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值，需要的朋友可以參考下2022-01-01
HTTP請求中,Content-Type頭部用于指定請求體或響應(yīng)體的類型,常見的有application/x-www-form-urlencoded、multipart/form-data、application/json、text/plain、application/xml等,常用請求方式包括Get、Post、Put、Delete2024-09-09
深拷貝和淺拷貝是面試中經(jīng)常出現(xiàn)的,主要考察對基本類型和引用類型的理解深度,這篇文章主要給大家介紹了關(guān)于js深拷貝和淺拷貝的相關(guān)資料,需要的朋友可以參考下2022-10-10
JavaScript報錯：Uncaught ReferenceError: XYZ is&
在 JavaScript 編程中,“Uncaught ReferenceError: XYZ is not defined” 是一種常見的錯誤,這種錯誤通常發(fā)生在試圖使用一個未聲明的變量或標(biāo)識符時,故本文給大家介紹了JavaScript報錯：Uncaught ReferenceError: XYZ is not defined的解決方法,需要的朋友可以參考下2024-07-07
這篇文章主要介紹了淺談webpack打包之后的文件過大的解決方法,小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-03-03
JavaScript筆記之?dāng)?shù)據(jù)屬性和存儲器屬性
本文給大家介紹js數(shù)據(jù)屬性和存儲器屬性，及兩種屬性的區(qū)別，對js數(shù)據(jù)屬性存儲器屬性相關(guān)知識感興趣的朋友一起學(xué)習(xí)2016-03-03
這篇文章主要為大家詳細(xì)介紹了微信小程序progress組件的使用，具有一定的參考價值，感興趣的小伙伴們可以參考一下2018-01-01
基于JavaScript實現(xiàn)點擊頁面任何位置返回
這篇文章主要介紹了基于JavaScript實現(xiàn)點擊頁面任何位置返回的實例代碼,需要的朋友可以參考下2016-08-08
本文主要介紹了JavaScript去除字符串兩端空格的三種方法，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2023-03-03