JS 阵列与物件常用方法

阵列常用的操作方式

宣告阵列运用索引存取资料列举阵列内容: 搭配迴圈按顺序操作资料: push、pop、shift、unshift从中间操作资料: splice (相似 slice:但不改变原有阵列)合併两个阵列: contact

宣告阵列

宣告空物件
const user = {} or let user = ""

使用方括号[] 和索引位置 array[n] 来读取物件/阵列/字串的指定位置资料

排序第一个为 0 开始起算， 0, 1, 2, 3...
例如:

animal = ['dog','cat','bird' ]console.log(animal[0])// dog

除了读取值外，也可用索引位置写入新资料来取代原值

例如: 若要取代上面排序2 的 bird, 改成rabbit

animal = ['dog','cat','bird' ]animal[2] = 'rabbit'console.log(animal[2])// rabbit

如果在阵列里新增资料的话，可以直接写成:

animal[3] = 'cow'console.log(animal)// ['dog','cat','rabbit','cow' ]

使用点记法object.属性 或 **括号记法[''] **新增物件的数值

obj['key'] = 'value'//括号记法(bracket notation)

使用 array.indexOf()会返回指定数值在阵列中出现的"第一个"位置，若没有在阵列中则会返回"-1"

const beasts = ['ant', 'bison', 'camel', 'duck', 'bison'];console.log(beasts.indexOf('bison'));// expected output: 1

其他改变阵列资料的常用方法:

array.push()

array.pop()

array.shift()

array.unshift()

(来源取自于Alpha Camp 2-1学习课程图片)

let nums = [0,1,2,3,4]nums.push(5)console.log(nums)//[0,1,2,3,4,5]nums.pop()console.log(nums)//[0,1,2,3,4]nums.shift()console.log(nums)//[1,2,3,4]nums.unshift(0.5)console.log(nums)//[0.5,1,2,3,4]

array.splice() vs. array.slice

(来源取自于Alpha Camp 2-1学习课程图片)

let nums = [0,1,2,3,4]nums.splice(2,0,99) //[0,1,99,2,3,4]

此三个参数分别为:

第一个:要发生变化的索引位置第二个:从索引位置开始算，总共要删掉几个数。此例为 0，代表不用删除第三个:从索引位置的地方需要新增的数字

splice()会改变原有的nums阵列，但若使用相似的slice()，可以取出阵列数值，但不改变原有阵列
slice() 方法会回传一个新的阵列物件，为原阵列选择从"开始"至"结束"(不含结束位置的数值)的浅拷贝(shallow copy)

arr.slice([begin[, end]])

const animals = ['dog','cat','rabbit','cow','sheep','lion']console.log(animals.slice(2))// 从第二个位置起开始出现至最后一个数值 (因为没有结束的位置)console.log(animals.slice(2,5))//['rabbit','cow','sheep']console.log(animals.slice(2,-1))//可使用负数索引，表示由阵列的最末项开始提取。slice(2,-1) 代表拷贝阵列中第三个元素至倒数第二个元素。//['rabbit','cow','sheep']console.log(animals.slice(-2))//slice(-2) 代表拷贝阵列中的最后两个元素。假如 begin 为 undefined，则 slice 会从索引 0 开始提取。['sheep','lion']console.log(animals.slice(-1))//['lion']

array.concat 合併阵列

concat (不会改变原有阵列) vs push (新增数值至阵列，原有阵列被改变)

array.concat
// 回传新的阵列

let daysOfWeek = ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday']let newDaysOfWeek = daysOfWeek.concat(['Saturday', 'Sunday'])console.log(daysOfWeek) // ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday']console.log(newDaysOfWeek) // ["Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday", "Sunday"]

array.push
// 直接修改原本阵列

let daysOfWeek = ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday']daysOfWeek.push('Saturday', 'Sunday')console.log(daysOfWeek) // ["Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday", "Sunday"]

笔记学习资源: Alpha Camp, W3School