這篇文章主要介紹了JavaScript中中數組的相關知識,是JS入門學習中的基礎知識,需要的朋友可以參考下
創建數組
js中數組的聲明可以有如下幾種方式:
- var arr = []; // 簡寫模式
- var arr = new Array(); // new一個array對象
- var arr = new Array(arrayLength); // new一個確定長度的array對象
要說明的是:
雖然第三種方法聲明了數組的長度,但是實際上數組長度是可變的。也就是說,即使指定了長度為5,仍然可以將元素存儲在規定長度之外,這時數組的長度也會隨之改變。
此外,還需要明確的一點:
js是弱類型語言,也就是數組中的元素類型不需要一樣。
舉個數組中元素類型不一致的例子:
- var arr = [1, 2, 3, 4, 'wangzhengyi', 'bululu'];
- for (var i = 0; i < arr.length; i ++) {
- console.log(arr[i]);
- }
數組元素訪問
JavaScript數組的索引值也是從0開始的,我們可以直接通過數組名+下標的方式對數組元素進行訪問。
示例代碼如下:
- var arr = [1, 2, 3];
- console.log(arr[0]);
- console.log(arr[1]);
此外,數組的遍歷推薦使用連續for循環的模式,不推薦for-in,具體原因參考:Loop through array in JavaScript
遍歷數組示例代碼如下:
- var arr = [1, 2, 3, 4, 'wangzhengyi', 'bululu'];
- for (var i = 0, len = arr.length; i < len; i ++) {
- console.log(arr[i]);
- }
注意:
上述代碼中,一個小優化在于提前獲取數組的大小,這樣不需要每次遍歷都去查詢數組大小。對于超大數組來說,能提高一定的效率。
添加數組元素
有三種方法可以往一個數組中添加新的元素,分別是:push、unshift、splice。下面我分別來介紹一下這三種方法。
push
push方法,在數組末尾添加元素。示例代碼如下:
- var arr = [];
- arr.push(1);
- arr.push(2);
- arr.push(3);
- for (var i = 0, len = arr.length; i < len; i ++) {
- console.log(arr[i]);
- }
執行結果為:
- 1
- 2
- 3
unshift
unshift方法,是在數組頭部添加元素。示例代碼如下:
- var arr = [];
- arr.unshift(1);
- arr.unshift(2);
- arr.unshift(3);
- for (var i = 0, len = arr.length; i < len; i ++) {
- console.log(arr[i]);
- }
執行結果如下:
- 3
- 2
- 1
splice
splice方法是在數組的指定位置插入新元素,之前的元素則是自動順序后移。注意splice的函數原型為:
- array.splice(index, howMany, element...)
howMany表示要刪除的元素個數,如果只是添加元素,此時howMany需要置為0。
示例代碼如下:
- var arr = [1, 2, 3, 4];
- arr.splice(1, 0, 7, 8, 9);
- for (var i = 0, len = arr.length; i < len; i ++) {
- console.log(arr[i]);
- }
執行結果如下:
- 1
- 7
- 8
- 9
- 2
- 3
- 4
刪除數組元素
與增加數組元素一樣,刪除數組中的元素也有三個方法,分別是:pop、shift和splice。接下來,分別講解一下這三個函數的用法。
pop
pop方法是移除數組中的最后一個元素。push和pop的組合可以將數組實現類似于棧(先入后出)的功能。示例代碼如下:
- var arr = [];
- arr.push(1);
- arr.push(2);
- arr.push(3);
- while (arr.length != 0) {
- var ele = arr.pop();
- console.log(ele);
- }
shift
shift方法是移除第一個元素,數組中的元素自動前移。(這種方法肯定對應著效率問題,時間復雜度是O(n))。
- var arr = [];
- arr.push(1);
- arr.push(2);
- arr.push(3);
- function traverseArray(arr) {
- for (var i = 0, len = arr.length; i < len; i ++) {
- console.log(arr[i]);
- }
- }
- while (arr.length != 0) {
- var ele = arr.shift();
- traverseArray(arr);
- }
大家可以自己考慮運行結果。
splice
在增加數組元素的時候,我們就講過splice,這個函數原型中有一個howMany參數,代表從index開始刪除之后的多少個元素。
示例代碼如下:
- var arr = [1, 2, 3, 4, 5, 6, 7];
- function traverseArray(arr) {
- for (var i = 0, len = arr.length; i < len; i ++) {
- console.log(arr[i]);
- }
- }
- arr.splice(1, 3);
- traverseArray(arr);
執行結果為:
- 1
- 5
- 7
數組的拷貝和截取
舉個例子,代碼如下:
- var arr1 = [1, 2, 3, 4];
- var arr2 = arr1;
這個時候,arr2只是保存arr1數組在堆內存的地址,并沒有在堆內存重新申請內存搞一個數組出來。所以對arr2的修改會同時影響到arr1。因此,如果我們需要拷貝一份數組該怎么做呢?這就引出了需要學習的slice和concat函數。
slice
這里的slice和python語法的slice是一樣的,都是返回數組的切片。slice函數原型為:
- array.slice(begin, end)
返回從begin到end的所有元素,注意包含begin,但是不包含end。
缺省begin,默認從0開始。缺省end,默認到數組末尾。
因此,拷貝數組我們可以通過如下代碼實現:
- var arr1 = [1, 2, 3, 4];
- var arr2 = arr1.slice();
- arr2[2] = 10000
- function traverseArray(arr) {
- for (var i = 0, len = arr.length; i < len; i ++) {
- console.log(arr[i]);
- }
- }
- traverseArray(arr1);
- traverseArray(arr2);
執行結果如下:
- 1
- 2
- 3
- 4
- 1
- 2
- 10000
- 4
concat
concat方法將創建一個新數組,然后將調用它的對象(this 指向的對象)中的元素以及所有參數中的數組類型的參數中的元素以及非數組類型的參數本身按照順序放入這個新數組,并返回該數組.
示例代碼如下:
- var alpha = ["a", "b", "c"];
- var number = [1, 2, 3]
- // 新數組為["a", "b", "c", 1, 2, 3]
- var complex = alpha.concat(number);
新聞熱點
疑難解答
圖片精選