目錄
菜鳥(niǎo)教程文檔地址: http://www.runoob.com/jsref/jsref-obj-array.html
1. push 向數(shù)組的末尾添加一個(gè)或更多元素祖灰,并返回新的長(zhǎng)度葛虐。
- unshift 向數(shù)組的開(kāi)頭添加一個(gè)或更多元素钱豁,并返回新的長(zhǎng)度。
- pop 刪除數(shù)組的最后一個(gè)元素并返回刪除的元素吉执。
- shift 刪除并返回?cái)?shù)組的第一個(gè)元素(知道即可,用得很少)疯淫。
- reverse 反轉(zhuǎn)數(shù)組的元素順序。
6. find 返回符合傳入測(cè)試(函數(shù))條件的數(shù)組元素戳玫。
7. findIndex 返回符合傳入測(cè)試(函數(shù))條件的數(shù)組元素索引熙掺。
8. slice 選取數(shù)組的的一部分,并返回一個(gè)新數(shù)組咕宿。
9. splice 從數(shù)組中添加或刪除元素币绩。
- join 把數(shù)組的所有元素放入一個(gè)字符串。
11. forEach 迭代數(shù)組府阀。
12. map 通過(guò)指定函數(shù)處理數(shù)組的每個(gè)元素缆镣,并返回處理后的數(shù)組。
13. filter 檢測(cè)數(shù)值元素试浙,并返回符合條件所有元素的數(shù)組董瞻。
- indexOf 搜索數(shù)組中的元素,并返回它所在的位置田巴。
- includes 判斷一個(gè)數(shù)組是否包含一個(gè)指定的值
- isArray 判斷對(duì)象是否為數(shù)組钠糊。
17. sort 數(shù)組排序
具體例子
1. push 從后面添加一個(gè)成員
var arr = [1,2,3];
arr.push(4);
console.log(arr); // [1,2,3,4]
- unshift 從數(shù)組前面添加一個(gè)成員
var arr = [1, 2, 3];
arr.unshift(0);
console.log(arr); // [0,1,2,3]
- pop 刪除數(shù)組的最后一個(gè)成員
var arr = [1,2,3,4];
arr.pop();
console.log(arr); // [1,2,3]
- shift 刪除數(shù)組的第一個(gè)成員
var arr = [1,2,3,4];
arr.shift();
console.log(arr); // [2,3,4]
- reverse 反轉(zhuǎn)數(shù)組的元素順序
var arr = [1,2,3];
arr.reverse();
console.log(arr); // [3,2,1]
6. find 查找符合條件的數(shù)組成員
var arr = [
{ name: '鄧紫棋', age: 20 },
{ name: '張碧晨', age: 30 },
{ name: '張靚穎', age: 25 },
{ name: '薛之謙', age: 28 }
]
// js5寫(xiě)法
var person = arr.find(function(item) {
return item.name === '薛之謙';
})
// es6寫(xiě)法
var person = arr.find(item => {
return item.name === '薛之謙';
})
console.log(person); // { name: "薛之謙", age: 28 }
7. findIndex 返回符合條件的成員在數(shù)組中的位置(下標(biāo))
var arr = [
{ name: '鄧紫棋', age: 20 },
{ name: '張碧晨', age: 30 },
{ name: '張靚穎', age: 25 },
{ name: '薛之謙', age: 28 },
]
// js5
var index = arr.findIndex(function(item) {
return item.name === '張靚穎';
})
// es6
var index = arr.findIndex(item => {
return item.name === '張靚穎';
})
console.log(index); // 2
8. slice 選取數(shù)組的的一部分挟秤,并返回一個(gè)新數(shù)組。
var arr = [1,2,3,4,5];
var newArr1 = arr.slice(2); // 從位置2(包含)開(kāi)始截取到最后
console.log(newArr1); // [3,4,5]
var newArr2 = arr.slice(2,4); // 從位置2(包含)開(kāi)始截取到位置4(不包含)
console.log(newArr2); // [3,4]
9. splice 刪除或添加元素
// 例1
var arr = [0,1,2,3,4,5];
arr.splice(2,1); // 從下標(biāo)為2的元素開(kāi)始,刪除一個(gè)元素
console.log(arr); // [0,1,3,4,5];
// 例2
var arr = [0,1,2,3,4,5];
arr.splice(2,2); // 從下標(biāo)為2的元素開(kāi)始,刪除2個(gè)元素
console.log(arr); // [0,1,4,5];
// 例3
var arr = [0,1,2,3,4,5];
arr.splice(2,0,'我是新成員'); // 在下標(biāo)為2地方添加一個(gè)新成員
console.log(arr); // [0, 1, "我是新成員", 2, 3, 4, 5]
// 例4
var arr = [0,1,2,3,4,5];
arr.splice(2,1,'我是新成員'); // 用新成員替換下標(biāo)為2的成員
console.log(arr); // [0, 1, "我是新成員", 3, 4, 5]
- join 把數(shù)組變成字符串
var arr = ['a','b','c'];
var str = arr.join('-');
console.log(str); // "a-b-c"
var str2 = arr.join(',');
console.log(str2); // "a,b,c"
11. forEach 迭代數(shù)組(遍歷數(shù)組)
var sum = 0;
var arr = [
{name: '小王',age: 10},
{name: '小李',age: 20},
{name: '小林',age: 15},
{name: '小明',age: 25}
]
// 計(jì)算這幾個(gè)同學(xué)的總年齡
var sum = 0;
arr.forEach(item=> {
sum += item.age;
})
console.log(sum);
12. map 通過(guò)指定函數(shù)處理數(shù)組的每個(gè)元素抄伍,并返回處理后的數(shù)組艘刚。
<script type="text/javascript">
var arr = [
{
name: '張三',
age:28
},
{
name: '李四',
age:28
},
{
name: '陳武',
age:28
}
];
// js5
var newArr = arr.map(function(item){
return {
username: item.name,
age: item.age+10
};
})
console.log(newArr);
// es6
var newArr = arr.map(item=>{
return {
username: item.name,
age: item.age+10
};
})
console.log(newArr);
</script>
13. filter 過(guò)濾
var arr = [
{name: '小王',age: 10},
{name: '小李',age: 20},
{name: '小林',age: 15},
{name: '小明',age: 25}
];
// 找出年齡大于或等于20歲的同學(xué)
// js5
var newArr = arr.filter(function(item){
return item.age >= 20;
});
console.log(newArr); // [{小明}, {小李}]
// es6
var newArr = arr.filter(item=> {
return item.age >= 20;
});
console.log(newArr); // [{小明}, {小李}]
- indexOf 返回?cái)?shù)組中某個(gè)成員的位置
var arr = ['a','b','c','d'];
var index = arr.indexOf('c');
console.log(index); // 2
var index2= arr.indexOf('f');
console.log(index2); // 找不到返回-1
- includes 判斷一個(gè)數(shù)組是否包含一個(gè)指定的值
var arr = ['a','b','c','d'];
var b1 = arr.includes ('c');
console.log(b1); // true
var b2 = arr.includes ('f');
console.log(b2); // false
- isArray 判斷一個(gè)對(duì)象是不是數(shù)組
// typeof 一個(gè)數(shù)組的結(jié)果是object,要判斷一個(gè)變量是不是數(shù)組可以用isArray
var obj = {
a: 2
}
Array.isArray(obj); // false
var arr = [1,2,3];
Array.isArray(arr); // true
- sort 數(shù)組排序
// 例1
var arr = [1,6,3,4];
arr.sort();
console.log(arr); // [1, 3, 4, 6]
// 例2 通過(guò)排序函數(shù)
var arr = [10,5,40,25,1000,1]
// 升序排列
// js5
arr.sort(function(a,b){
return a-b;
})
// es6
arr.sort((a,b)=> {
return a-b;
})
console.log(arr); // [1, 5, 10, 25, 40, 1000]
// 降序排列
// js5
arr.sort(function(a,b) {
// 升序排列
return b-a;
})
console.log(arr); // [1000, 40, 25, 10, 5, 1]
// es6
arr.sort((a,b)=> {
// 升序排列
return b-a;
})
console.log(arr); // [1000, 40, 25, 10, 5, 1]
數(shù)組排序比較函數(shù)原理解析
棧操作
棧操作的原則是先進(jìn)后出,我們可以使用數(shù)組的push和pop方法來(lái)實(shí)現(xiàn)棧操作
var arr = [];
arr.push('a');
console.log(arr);
arr.push('b');
console.log(arr);
arr.push('c');
console.log(arr); ['a','b','c']
var m1 = arr.pop(); // 刪除最后一個(gè)
console.log(m1); // c
var m2 = arr.pop();
console.log(m2); // b
var m1 = arr.pop();
console.log(m3); // a
在上面的例子里
push方法我們可以稱(chēng)它為入棧的方法,
pop方法我們可以稱(chēng)它出棧的方法,
這兩者我們就統(tǒng)稱(chēng)棧方法.
隊(duì)列操作
隊(duì)列操作的原則是先進(jìn)先出,跟排隊(duì)買(mǎi)東西一個(gè)道理,
我們可以使用push(入隊(duì))和shift(出隊(duì))方法實(shí)現(xiàn)隊(duì)列操作
var arr = [];
arr.push('a');
console.log(arr);
arr.push('b');
console.log(arr);
arr.push('c');
console.log(arr); ['a','b','c']
var m1 = arr.shift();
console.log(m1); // a
var m2 = arr.shift();
console.log(m2); // b
var m1 = arr.shift();
console.log(m3); // c