<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>數組常用方法</title>
</head>
<body>
</body>
</html>
<script>
var arr1 = [1, 2, 3, 4];
// push:向數組末尾添加一個或多個元素
arr1.push(66, 77, 88);
console.log(arr1);
//pop:刪除數組末尾一個元素
arr1.pop();
console.log(arr1)
//unshift:向數組頭部添加一個或多個元素
arr1.unshift(-1,0);
console.log(arr1)
//shift:刪除數組第一個元素
arr1.shift();
console.log(arr1);
//concat:合併兩個或多個數組，生成一個新數組，原數組不變
var arr2 = ['a','b','c'];
var arr3 = ['z','x','y'];
console.log(arr1.concat(arr2,arr3));
//join:將數組轉成字符串，默認逗號分隔
console.log(arr1.join());
console.log(arr1.join('-'));
console.log(arr1.join('&'));
// reverse 將數組倒序，原數組不變
arr1.reverse();
console.log(arr1)
// sort 對數組進行排序，按照UniCode碼排序，原數組改變、 (ES6)
// 從小到大
var sortNum = function(a,b) {
return a-b;
};
console.log(arr1.sort(sortNum));
// 從大到小
arr1.sort((a,b)=>{
return b-a;
});
console.log(arr1);
// 按照數組對象中的值進行排序
var list = [
{name:"小明",age:'21'},
{name:"小紅",age:'18'},
{name:"小張",age:'26'}
];
function compare(param) {
return function sortAge(a,b){
return a[param] - b[param];
};
};
console.log(list.sort(compare('age')));
// map原數組的每一項執行函數後，返回一個新數組 (ES6)
var mapArr = arr1.map((item,index)=>{
return item - 1;
});
console.log(mapArr);
// forEach (ES6)
// 和map區別，同樣寫法forEach返回值爲undefined
var eachList = arr1.forEach((item,index)=>{
return item-1
});
console.log('forEach')
console.log(eachList)
// splice
// 第一個參數從第幾位開始刪
// 第二個參數刪除幾個
// 第三個參數從刪除的位置添加
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.splice(2, 2, "Lemon", "Kiwi");
console.log(fruits)
// slice
// 從第幾個開始截取，截到第幾個
console.log(fruits.slice(2,4));
// filter根據條件做過濾 (ES6)
var arrFilter = arr1.filter((x)=>{
return x > 4;
});
console.log(arrFilter); //[77,66]
// every對數組中每一項做判斷 (ES6)
// 都符合返回true,否則返回false
var arr2 = [11,22,33,44,55,66]
var everyArr = arr2.every((item,index)=>{
// console.log(item);//11
// return item < 66; //false
return item < 69; //true
});
console.log(everyArr);
// some只要有一個符合條件就返回true，否則false (ES6)
var arr2 = [11,22,33,44,55,66]
var someArr = arr2.some((item,index)=>{
return item < 22; //true
});
console.log(someArr);
// reduce累加器 (ES6)
// 每次循環出的值會累加,累加之後的值會在加新循環出的值
var reduceArr = arr2.reduce((a,b)=>{
return a + b;
});
console.log(reduceArr)
// indexOf查找某個元素的索引值，若有重複的，則返回第一個查到的索引值若不存在，則返回 -1
console.log(arr2.indexOf(66)); //返回的對應索引值
console.log(arr2.indexOf(69)); //爲查找到該元素 返回-1
// of 將一組值轉成數組 (ES6)
var str = '11,22';
console.log(Array.of(str));
//includes 驗證數組是否存在該值，有返回true，無返回false
console.log(fruits.includes('Orange'));
// arr.keys() 遍歷數組的鍵名
// arr.values() 遍歷數組鍵值
// arr.entries() 遍歷數組的鍵名和鍵值
// es6去重並排序
const myArray = [1,6,2,2,3,3,4,4,5,5]
console.log([...new Set(myArray )].sort());// [1, 2, 3, 4, 5]
function dedupe(array) {
return Array.from(new Set(myArray));
}
let de = dedupe([1, 1, 2, 3]) // [1, 2, 3]
console.log(de.sort());
</script>
