iT邦幫忙

第 11 屆 iThome 鐵人賽

DAY 4
2
自我挑戰組

JavaScript 試煉之旅系列 第 4

JavaScript 陣列(Array)的特性與使用

  • 分享至 

  • xImage
  •  

今天要學習的是陣列(Array)的部分,重點在於什麼是陣列及如何使用陣列。

Let's go!!!

關於陣列

陣列是什麼?在 JavaScript 大全(第六版)中提到了關於陣列的定義與一些特性:

  1. 一組值的有序群集,而值也稱為元素(element),值所在的位置稱為索引(index)

  2. 陣列的索引值從0開始

  1. 陣列中的元素可以是不同型別的組成
let a =[1,'Hello world',{name:'Bill'}];
  1. 陣列是 一種特殊形式的物件(Object),所以也可以透過物件指定值的方法將值新增到陣列

先複習一下將值指定給物件的其中一種方式:

let obj={};
obj['str'] = "Hello world";
console.log(obj.str); 

然後再看看下面的例子,透過任意字串(不包含字串型別的數字)作為索引值:

let a = [];
a["str"] = 2;
console.log(a); 
console.log(a.length); 

有一點需要注意的是,透過任意字串(不包含字串型別的數字,如: '5')作為索引值的所新增的元素,是不會計入陣列長度計算的。

但如果是透過字串型別的數字作為索引值,則 JavaScript 會將它轉為數字型別,並將指定的值加入至陣列。

從下方程式碼可以得到,數值 5 會存入陣列中索引值 5 的位置,而索引值 0 ~ 索引值 4 的值則為空值。

let a = [];
a["5"] = 5;
console.log(a);
  1. Array.prototype 繼承特性,且Array.prototype定義了ㄧ組陣列操作方法,不只可以在陣列使用,而部分的方法也可以在類陣列(array-like)中使用
//可以查看陣列的原型物件定義了哪些方法
console.log(Array.prototype);

建立陣列的方法

  1. 陣列字面值
let a = [];
let b = [1,2,3,4];
b[4] = 5;
console.log(b);
  1. Array 建構式:
  • 不帶引數的呼叫:等同空陣列[]
  • 帶入單一數值作為引數的呼叫:用於指定陣列的長度
  • 帶入兩個(含)以上的元素或者單一非數值作為引數的呼叫:建立陣列並將元素依序放入
let a = new Array();
console.log(a);

let b = new Array(10);
console.log(b);

let c = new Array(1,4,"test");
console.log(c);

https://ithelp.ithome.com.tw/upload/images/20190919/20120099XMqt6iv1HE.png

陣列讀取與寫入元素

  • 讀取:透過 array[index] 讀取陣列中 index 位置的元素
  • 寫入:透過 array[index] = element 的方式將元素新增到陣列索引值為 index 的位置
let a =['test'];
console.log(a[0]); 

a[1] = 'add element';
console.log(a); 

陣列長度

arr.length

可以得到該陣列的總長度

let arr = [1,2,3];
console.log(arr.length);

關於陣列的基本使用就先到這裡,明天要來看看陣列的方法。

明天見~


上一篇
範疇(Scope)與提升(Hoisting)
下一篇
JavaScript 陣列(Array)的方法 Part 1
系列文
JavaScript 試煉之旅30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言