Arrays

Declaration

let arr = new Array();
let arr = [];

// most time use [...]
let fruits = ["Apple", "Orange", "Plum"];
alert( fruits[0] ); // Apple
alert( fruits[1] ); // Orange
alert( fruits[2] ); // Plum

// replace
fruits[2] = 'Pear'; // now ["Apple", "Orange", "Pear"]

// add new one
fruits[3] = 'Lemon'; // now ["Apple", "Orange", "Pear", "Lemon"]

// length
let fruits = ["Apple", "Orange", "Plum"];
alert( fruits.length ); // 3

// store any type data
// mix of values
let arr = [ 'Apple', { name: 'John' }, true, function() { alert('hello'); } ];

// get the object at index 1 and then show its name
alert( arr[1].name ); // John

// get the function at index 3 and run it
arr[3](); // hello

Methods pop/push, shift/unshift

  • .pop() 從 array 最後拿走一個值。

    let fruits = ["Apple", "Orange", "Pear"];
    
    alert( fruits.pop() ); // remove "Pear" and alert it
    
    alert( fruits ); // Apple, Orange
  • .push() 從 array 最後增加一個或多個值。

    let fruits = ["Apple", "Orange"];
    
    fruits.push("Pear");
    fruits[fruits.length] = "Pear";
    
    alert( fruits ); // Apple, Orange, Pear
  • .shift() 從 array 前面拿走一個值。

    let fruits = ["Apple", "Orange", "Pear"];
    
    alert( fruits.shift() ); // remove Apple and alert it
    
    alert( fruits ); // Orange, Pear
  • .unshift() 從 array 前面增加一個或多個值。

    let fruits = ["Orange", "Pear"];
    
    fruits.unshift('Apple');
    
    alert( fruits ); // Apple, Orange, Pear

Internals

array 是特殊的物件, key 是有順序的數字,複製的物件一樣指向相同記憶體。

let fruits = ["Banana"]

let arr = fruits; // copy by reference (two variables reference the same array)

alert( arr === fruits ); // true

arr.push("Pear"); // modify the array by reference

alert( fruits ); // Banana, Pear - 2 items now

我們可以像一般的物件使用 array ,但會讓引擎認為他是一般的物件,而不能使用針對 array 做的優化及方法。誤用 array 的情況如下:

  • 增加非數字的屬性 arr.test = 5

  • 增加值但並非依照排列。增加 arr[0]arr[1000] 他們中間沒有任何值。

  • 新增值但順序相反 arr[1000]arr[999]

let fruits = []; // make an array

fruits[99999] = 5; // assign a property with the index far greater than its length

fruits.age = 25; // create a property with an arbitrary name

Performance

fruits.shift(); // take 1 element from the start
fruits.pop(); // take 1 element from the end

Loops

let arr = ["Apple", "Orange", "Pear"];

for (let i = 0; i < arr.length; i++) {
  alert( arr[i] );
}

// same
// iterates over array elements
for (let fruit of fruits) {
  alert( fruit );
}

// same
// 可以使用 for..in 但會造成一些問題;有些類似 array 的物件,有其他屬性也會被帶入迴圈;用這個方法效能比較差
for (let key in arr) {
  alert( arr[key] ); // Apple, Orange, Pear
}

A word about “length”

array 的 length 屬性準確地說是 index 值 +1,所以當 index 很大 length 也很大。

let fruits = [];
fruits[123] = "Apple";

alert( fruits.length ); // 124

減少 length 屬性會造成資料被刪除,所以要清除 array 的方法有 arr.length = 0。

let arr = [1, 2, 3, 4, 5];

arr.length = 2; // truncate to 2 elements
alert( arr ); // [1, 2]

arr.length = 5; // return length back
alert( arr[3] ); // undefined: the values do not return

new Array()

let arr = new Array("Apple", "Pear", "etc");

// 用 new 創造 array 可能會造成 array 存在但裡面沒有值。
let arr = new Array(2); // will it create an array of [2] ?

alert( arr[0] ); // undefined! no elements.

alert( arr.length ); // length 2

Multidimensional arrays

let matrix = [
  [1, 2, 3],
  [4, 5, 6],
  [7, 8, 9]
];

alert( matrix[1][1] ); // the central element

toString

array 轉換 string 會返回 , 分離的值,轉換用的方法為 toString()。

let arr = [1, 2, 3];
alert( arr ); // 1,2,3
alert( String(arr) === '1,2,3' ); // true

alert( [] + 1 ); // "1"
alert( [1] + 1 ); // "11"
alert( [1,2] + 1 ); // "1,21"

// same
alert( "" + 1 ); // "1"
alert( "1" + 1 ); // "11"
alert( "1,2" + 1 ); // "1,21"

Last updated