DAY 10
0
Modern Web

## Array 陣列

let ary1 = []; //建立一個空陣列，裡面沒有任何元素
let ary2 = [1,2,3]; //有3個元素的陣列，元素型別為number
let ary3 = [1,'a',true]; //不同型別的元素
let ary4 = [ [1,2,3],[4,5,6] ]; //陣列中也可以包含陣列
let ary5 = [ {x:1,y:2},{x:3,y:4} ]; //陣列中也可以包含物件

#### 存取陣列

let a = []; //空陣列
a[0] = 1; //設定a陣列的索引值0，也就是第1個元素值為1
a[1] = 2; //設定a陣列的索引值1，也就是第2個元素值為2

#### 判斷陣列

let ary = [1, 2, 3, 4, 5, 6];
let obj = {
x: 2,
y: 6
};
console.log(Array.isArray(ary)); //true
console.log(Array.isArray(obj)); //false

#### 字串

let str = 'Hello';
console.log(str[1]); //e

let str = 'Hello';
console.log(str[1]); //e
console.log(typeof str); //string
console.log(Array.isArray(str)); //false

#### indexOf(searchElement,fromIndex)

searchElement：

fromIndex：

let ary = ['A', 'B', 'C', 'D', 'E', 'F'];
console.log(ary.indexOf('D')); //3
console.log(ary.indexOf('X')); //-1
console.log(ary.indexOf('D', 2)); //3
console.log(ary.indexOf('B', 2)); //-1

#### join( )

join( )方法可以將陣列中的所有元素轉成字串，並串接成一個字串，再回傳結果，若沒指定分隔符號，預設是逗號。

let ary = ['A', 'B', 'C', 'D'];
console.log(ary.join()); //A,B,C,D
console.log(ary.join('')); //ABCD
console.log(ary.join('-')); //A-B-C-D

#### reverse( )

let ary = ['A', 'B', 'C', 'D'];
console.log(ary.reverse()); //["D", "C", "B", "A"]
console.log(ary); //["D", "C", "B", "A"]

#### sort( )

let ary = ['Sun', 'Mon', 'Tue', 'Wed'];
console.log(ary.sort()); //["Mon", "Sun", "Tue", "Wed"]
console.log(ary); //["Mon", "Sun", "Tue", "Wed"]

let nums = [10, 9, 50, 35];
console.log(nums.sort()); //[10, 35, 50, 9]

let nums = [10, 9, 50, 35];
console.log(nums.sort(function (a, b) {
return a - b;
})); //[10, 35, 50, 9]

sort( )預設是將大寫排在前面。

let ary = ['Sun', 'mon', 'tue', 'Wed'];
console.log(ary.sort()); //["Sun", "Wed", "mon", "tue"]

#### concat( )

let ary1 = ['a', 'b', 'c'];
let ary2 = ['d', 'e', 'f'];
console.log(ary1.concat(ary2)); //["a", "b", "c", "d", "e", "f"]

let ary1 = ['a', 'b', 'c'];
let ary2 = ['d', 'e', 'f'];
let ary3 = ['g', 'h', 'i'];
console.log(ary1.concat(ary2, ary3)); //["a", "b", "c", "d", "e", "f", "g", "h", "i"]

let ary1 = ['a', 'b', 'c'];
let ary2 = ['d', 'e', 'f'];
let ary3 = ['g', 'h', 'i'];
console.log(ary1.concat(ary2, ary3, 'j', 'k', 1, 2));
//["a", "b", "c", "d", "e", "f", "g", "h", "i", "j", "k", 1, 2]

#### slice(start,end)

start：

end：

let ary = ['a', 'b', 'c', 'd', 'e', 'f'];
console.log(ary.slice(1)); //["b", "c", "d", "e", "f"]
console.log(ary.slice(2, 5)); //["c", "d", "e"]
console.log(ary.slice(2, -1)); //["c", "d", "e"]
console.log(ary.slice(-3)); //["d", "e", "f"]
console.log(ary.slice(-4, 4)); //["c", "d"]
console.log(ary.slice(-5, -2)); //["b", "c", "d"]

#### splice(start, deleteCount,value)

start：

deleteCount：

value：

let ary = ['a', 'b', 'c', 'd', 'e', 'f'];
console.log(ary.splice(4)); // ["e", "f"]
console.log(ary); //["a", "b", "c", "d"]
ary = ['a', 'b', 'c', 'd', 'e', 'f'];
console.log(ary.splice(3, 2)); //["d", "e"]
console.log(ary); // ["a", "b", "c", "f"]
ary = ['a', 'b', 'c', 'd', 'e', 'f'];
console.log(ary.splice(3, 0)); //[]
console.log(ary); //["a", "b", "c", "d", "e", "f"]
ary = ['a', 'b', 'c', 'd', 'e', 'f'];
console.log(ary.splice(-4, 2)); //["c", "d"]
console.log(ary); //["a", "b", "e", "f"]
ary = ['a', 'b', 'c', 'd', 'e', 'f'];
console.log(ary.splice(-4, -2)); //[]
console.log(ary); //["a", "b", "c", "d", "e", "f"]
ary = ['a', 'b', 'c', 'd', 'e', 'f'];
console.log(ary.splice(3, 0, 'A')); //[]
console.log(ary); //["a", "b", "c", "A", "d", "e", "f"]
ary = ['a', 'b', 'c', 'd', 'e', 'f'];
console.log(ary.splice(3, 1, 'A')); //["d"]
console.log(ary); //["a", "b", "c", "A", "e", "f"]

#### unshift( )

let a = [];
console.log(a.unshift('a')); //1
console.log(a.unshift('b')); //2
console.log(a.unshift('c', 'd')); //4
console.log(a); //["c", "d", "b", "a"]

#### toString( )

let ary = ['a', 'b', 'c'];
console.log(ary.toString()); //a,b,c

#### forEach(value,index,array)

value

index

array

let ary = [1, 2, 3, 4, 5, 6];
let sum = 0;
ary.forEach(function (v) {
sum += v;
})
console.log(sum); //21
ary.forEach(function (v, i, a) {
a[i] = v + 1;
})
console.log(ary); //[2, 3, 4, 5, 6, 7]

#### map( )

let ary = [1, 2, 3, 4, 5, 6];
console.log(ary.map(function (x) {
return x * x;
})); //[1, 4, 9, 16, 25, 36]

map( )對callbackfn的呼叫方式跟forEach一樣，差別在於map( )會回傳新陣列，不會修改原陣列。

#### filter( )

let ary = [1, 2, 3, 4, 5, 6];
console.log(ary.filter(function (x) {
return x < 4;
})); // [1, 2, 3]

let weeks = ['sunday', 'monday', 'tuesday', 'wednesday', 'thursday', 'friday', 'saturday'];

function filterWeeks(query) {
return weeks.filter(function (el) {
return el.toLowerCase().indexOf(query.toLowerCase()) > -1;
})
}
console.log(filterWeeks('ur')); //["thursday", "saturday"]
console.log(filterWeeks('nd')); //["sunday", "monday"]

#### every( )

callbackfn會對陣列中的每個元素條件運算，只有全部的元素都為true，every( )才會回傳true，不然則回傳false。

let ary = [1, 2, 3, 4, 5, 6];
console.log(ary.every(function (x) {
return x < 4;
})); //fasle
console.log(ary.every(function (x) {
return x > 0;
})); //true

every( )會在第一次遇到運算結果為false時，就停止繼續對元素運算：

let ary = [1, 2, 3, 4, 5, 6];
console.log(ary.every(function (x) {
console.log(x);
return x < 4;
}));

#### some( )

callbackfn會對陣列中的每個元素條件運算，只要有一個(以上)元素為true，some( )就會回傳true，不然則回傳false。

let ary = [1, 2, 3, 4, 5, 6];
console.log(ary.some(function (x) {
return x < 4;
})); //true

some( )會在第一次遇到運算結果為true時，就停止繼續對元素運算：

let ary = [1, 2, 3, 4, 5, 6];
console.log(ary.some(function (x) {
console.log(x);
return x < 4;
}));

#### reduce(callbackfn(accumulator, currentValue){}, initialValue)

let ary = [1, 2, 3, 4, 5, 6];
console.log(ary.reduce(function (x, y) {
return x + y;
}, 0)); //21

callbackfn第一次執行時，若有initialValue，則accumulator會等於initialValue，currentValue會等於陣列的第一個元素值。若無initialValue，則accumulator會等於陣列的第一個元素值，currentValue會等於陣列的第二個元素值。

MDN Array
JavaScript大全
Speaking JavaScript｜簡明完整的 JS 精要指南

JavaScript Note31