JavaScript數組函數unshift、shift、pop、push使用實例
更新時間：2014年08月27日 11:12:54 投稿：junjie
這篇文章主要介紹了JavaScript數組函數unshift、shift、pop、push使用實例,本文先是講解了聲明數組的方法,然后對4個函數使用給出了一些例子,需要的朋友可以參考下
如何聲明數組
s中數組的聲明可以有幾種方式聲明
復制代碼 代碼如下:
var tmp = []; // 簡寫模式
var tmp = new Array(); // 直接new一個
var tmp = Array(); // 或者new也可以
在new數組的時候可以傳入一個參數，表示數組的初始化長度
復制代碼 代碼如下:
// new的時候傳入一個參數表示初始化數組長度
var tmp = new Array(3);
alert(tmp.length); // 3
但如果你想創(chuàng)建一個只有一個元素3的數組，那么使用 new 方法是不能實現的，因為系統(tǒng)會把你傳入的3當作數組的長度，除非你使用引號引起來當作字符串，如
復制代碼 代碼如下:
var tmp = new Array('3');
alert(tmp); // 3
我們可以使用簡寫模式創(chuàng)建數組，這樣就可以創(chuàng)建只有一個數字元素3的數組
復制代碼 代碼如下:
var tmp = [3]
alert(typeof tmp[0]); // number
也可以初始多個元素，并且元素的值可以是任意類型
復制代碼 代碼如下:
// 簡約模式創(chuàng)建數組
// 數組的元素可以是任意一種數據類型
var tmp = [3,true,8.5,{'name':'lizhong'},['a','b']];
alert(tmp.length); // 5
一、unshift 在數組第一個元素前插入元素
復制代碼 代碼如下:
// 使用unshift在數組第一個元素前插入元素
// 返回數組長度
var tmp = ['a','b'];
var len = tmp.unshift('c');
alert(len); // 3
alert(tmp); // c,a,b
也可以一次插入多個元素，順序依次從左邊排起
復制代碼 代碼如下:
// 使用unshift在數組第一個元素前插入元素
// 返回數組長度
var tmp = ['a','b'];
var len = tmp.unshift('c','d');
alert(len); // 4
alert(tmp); // c,d,a,b
二、shift彈出數組第一個元素，返回被彈出的元素值
小實例：
復制代碼 代碼如下:
// 使用shift彈出數組第一個元素
// 返回被彈出的元素值
var tmp = ['a','b','c'];
var val = tmp.shift();
alert(val); // a
alert(tmp); // b,c
如果是一個空數組：
復制代碼 代碼如下:
// 使用shift彈出數組第一個元素
// 返回被彈出的元素值
var tmp = [];
var val = tmp.shift();
alert(val); // undefined
alert(tmp); // 空
三、push在數組末尾添加元素
跟unshift相反，push在數組末尾添加元素，返回添加元素以后的數組長度
復制代碼 代碼如下:
// 使用push在數組末尾添加多個元素
// 返回數組最新長度
var tmp = ['a','b','c'];
var len = tmp.push('d');
alert(len); // 4
alert(tmp); // a,b,c,d
也可以一次添加多個元素
復制代碼 代碼如下:
// 使用push在數組末尾添加多個元素
// 返回數組最新長度
var tmp = ['a','b','c'];
var len = tmp.push('d','e','f');
alert(len); // 6
alert(tmp); // a,b,c,d,e,f
四、pop函數刪除數組末尾元素
跟shift相反，pop彈出的是數組末尾元素，返回被彈出的元素值
復制代碼 代碼如下:
// 使用pop彈出數組末尾元素
// 返回被彈出的元素值
var tmp = ['a','b','c'];
var val = tmp.pop();
alert(val); // c
alert(tmp); // a,b
如果數組為空，返回undefined
復制代碼 代碼如下:
// 使用pop彈出數組末尾元素
// 返回被彈出的元素值
var tmp = [];
var val = tmp.pop();
alert(val); // undefined
alert(tmp); // 空
利用以上四個函數，我們可以做一些隊列處理，具體案例就不寫代碼了。
push功能其實也可以這么實現
復制代碼 代碼如下:
var tmp = ['a','b','c'];
tmp[tmp.length] = 'd';
alert(tmp); // a,b,c,d
注意：以上四個函數unshift、shift、pop、push函數操作都會在數組本身上修改。
相關文章
Javascript圖像處理—圖像形態(tài)學(膨脹與腐蝕)
上一篇文章，我們講解了圖像處理中的閾值函數,這一篇文章我們來做膨脹和腐蝕函數2013-01-01
在以前，總是以為使用用戶代理字符串檢測瀏覽器是那種類型就行了，這樣確實大錯特錯啊，下面就來說說如何通過js判斷出當前瀏覽者使用的的設備類型呢2015-12-12
這篇文章主要介紹了詳解瀏覽器渲染頁面過程的相關資料,需要的朋友可以參考下2017-02-02![JS中的==運算： [''''] == false —>true](http://img.jbzj.com/images/xgimg/bcimg3.png)
JS中的==運算： [''''] == false —>true
這篇文章主要介紹了JS中的==運算： [''] == false —>true的相關資料,非常不錯，具有參考借鑒價值，需要的朋友可以參考下2016-07-07
這篇文章主要介紹了詳解使用webpack構建多頁面應用，小編覺得挺不錯的，現在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-12-12
javascript基礎知識之html5輪播圖實例講解（44）
這篇文章主要為大家詳細介紹了javascript基礎知識之html5輪播圖，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-02-02
javascript中不提供sleep功能，而我們時長會用到這個功能，下面與大家分享個不錯的解決方法，而且在不同的機器上的執(zhí)行速度是一致的2014-05-05
這篇文章主要介紹了CocosCreator通用框架設計之資源管理，對性能優(yōu)化感興趣的同學，一定要看一下2021-04-04
關于微信小程序獲取小程序碼并接受buffer流保存為圖片的方法
這篇文章主要介紹了關于微信小程序獲取小程序碼并接受buffer流保存為圖片的方法，文中通過示例代碼介紹的非常詳細，對大家學習或者使用小程序具有一定的參考學習價值，需要的朋友們下面來一起學習學習吧<BR>2019-06-06
關于javascript的“靜態(tài)類"...2006-10-10