數(shù)組對象常用方法

目錄

文檔地址: http://www.runoob.com/jsref/jsref-obj-array.html

  1. push 向數(shù)組的末尾添加一個(gè)或更多元素，并返回新的長度。
  2. unshift 向數(shù)組的開頭添加一個(gè)或更多元素，并返回新的長度。
  3. pop 刪除數(shù)組的最后一個(gè)元素并返回刪除的元素。
  4. shift 刪除并返回?cái)?shù)組的第一個(gè)元素(知道即可,用得很少)。
  5. reverse 反轉(zhuǎn)數(shù)組的元素順序。
  6. find 返回符合傳入測試（函數(shù)）條件的數(shù)組元素。
  7. findIndex 返回符合傳入測試（函數(shù)）條件的數(shù)組元素索引。
  8. slice 選取數(shù)組的的一部分，并返回一個(gè)新數(shù)組。
  9. splice 從數(shù)組中添加或刪除元素。
  10. join 把數(shù)組的所有元素放入一個(gè)字符串。
  11. forEach 迭代數(shù)組。
  12. map 通過指定函數(shù)處理數(shù)組的每個(gè)元素，并返回處理后的數(shù)組。
  13. filter 檢測數(shù)值元素，并返回符合條件所有元素的數(shù)組。
  14. indexOf 搜索數(shù)組中的元素，并返回它所在的位置。
  15. includes 判斷一個(gè)數(shù)組是否包含一個(gè)指定的值
  16. isArray 判斷對象是否為數(shù)組。
  17. sort 數(shù)組排序

具體例子

  1. push 從后面添加一個(gè)成員
var arr = [1,2,3];
    arr.push(4); 
    console.log(arr); // [1,2,3,4]
  1. unshift 從數(shù)組前面添加一個(gè)成員
 var arr = [1, 2, 3];
    arr.unshift(0);
    console.log(arr); // [0,1,2,3]
  1. pop 刪除數(shù)組的最后一個(gè)成員
var arr = [1,2,3,4];
arr.pop();
console.log(arr); // [1,2,3]
  1. shift 刪除數(shù)組的第一個(gè)成員
var arr = [1,2,3,4];
arr.shift();
console.log(arr); // [2,3,4]
  1. reverse 反轉(zhuǎn)數(shù)組的元素順序
var arr = [1,2,3];
arr.reverse(); 
console.log(arr); // [3,2,1]
  1. find 查找符合條件的數(shù)組成員
 var arr = [
        { name: '鄧紫棋', age: 20 },
        { name: '張碧晨', age: 30 },
        { name: '張靚穎', age: 25 },
        { name: '薛之謙', age: 28 }
    ]
    // js5寫法
    var person = arr.find(function(item) {
        return item.name === '薛之謙';
    })

    // es6寫法
    var person = arr.find(item => {
        return item.name === '薛之謙';
    })
    console.log(person);  // { name: "薛之謙", age: 28 }
  1. 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
  1. slice 選取數(shù)組的的一部分，并返回一個(gè)新數(shù)組。
var arr = [1,2,3,4,5];
var newArr1 = arr.slice(2);  // 從位置2(包含)開始截取到最后
console.log(newArr1); // [3,4,5]
var newArr2 = arr.slice(2,4); //  從位置2(包含)開始截取到位置4(不包含)
console.log(newArr2); // [3,4]
  1. splice 刪除或添加元素
// 例1
var arr = [0,1,2,3,4,5];
arr.splice(2,1);  // 從下標(biāo)為2的元素開始,刪除一個(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的元素開始,刪除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]
  1. 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"
  1. 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);
  1. map 通過指定函數(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>
  1. filter 過濾
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);  //  [{小明}, {小李}]
  1. 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
  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
  1. isArray 判斷一個(gè)對象是不是數(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
  1. sort 數(shù)組排序
// 例1
var arr = [1,6,3,4];
arr.sort();
console.log(arr);  // [1, 3, 4, 6]

// 例2 通過排序函數(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方法來實(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方法我們可以稱它為入棧的方法,
pop方法我們可以稱它出棧的方法,
這兩者我們就統(tǒng)稱棧方法.

隊(duì)列操作

隊(duì)列操作的原則是先進(jìn)先出,跟排隊(duì)買東西一個(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);   //
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成，瀏覽時(shí)請結(jié)合常識與多方信息審慎甄別。
平臺聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點(diǎn)，簡書系信息發(fā)布平臺，僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • 一.push 是用來做什么的? 以此數(shù)組為例: sum=[12,34,56,78,89,50],寫代碼示范; 作用...
    好難想的名字閱讀 685評論 0贊 1
  • 數(shù)組總共有22種方法，本文將其分為對象繼承方法、數(shù)組轉(zhuǎn)換方法、棧和隊(duì)列方法、數(shù)組排序方法、數(shù)組拼接方法、創(chuàng)建子數(shù)組...
    Sachie閱讀 1,016評論 0贊 7
  • 1.字符串轉(zhuǎn)數(shù)組：split 返回?cái)?shù)組 2. sort() 方法用于對數(shù)組的元素進(jìn)行排序。返回的是排序后的數(shù)組 ...
    who_rong閱讀 968評論 0贊 0
  • 作為一門研究大腦活動(dòng)與行為聯(lián)系的新興科學(xué)，認(rèn)知行為科學(xué)的橫空出世，顛覆了人們長久以來關(guān)于大腦的許多假設(shè)。在認(rèn)知行為...
    身體棒棒閱讀 150評論 0贊 1
  • 成長是對于我們一個(gè)新的開始和總結(jié)的一個(gè)不是詞語的詞語。對于成長我們有不同的見解，有人說成長是在現(xiàn)在的基礎(chǔ)上...
    卜怡博閱讀 342評論 1贊 2

友情鏈接更多精彩內(nèi)容