js数组

作者: hui树 | 来源:发表于2020-03-09 17:40 被阅读0次
    /* 新建一个数组:*/
    let array = [
        { id: 1, title:'js数组方法1' },
        { id: 2, title:'js数组方法2' }
       ]
    

    1. 数组元素增删改系列

    arr.push( ):数组尾部添加元素,返回数组的新长度,注意不是返回数组

    let obj =  { id: 3, title:'js数组方法3' },
    array.push(obj);    // 返回数组长度:3
    console.log(array)  
    // [{ id: 1, title:'js数组方法1' },{ id: 2, title:'js数组方法2' },{ id: 3, title:'js数组方法3' }]
    

    arr.unshift( ):数组头部添加元素,返回数组的新长度,注意不是返回数组。

    let obj =  { id: 3, title:'js数组方法3' },
    array.unshift(obj);  // 返回数组长度:3
    console.log(array)   // [{ id: 3, title:'js数组方法3' },{ id: 1, title:'js数组方法1' },{ id: 2, title:'js数组方法2' }]
    

    arr.pop( ):从数组中删除最后一个元素,并返回该元素的值(删除的元素)。

    array.pop();       // 返回删除元素:{ id: 2, title:'js数组方法2' }
    console.log(array)// [{ id: 1, title:'js数组方法1' }]
    

    arr.shift( ):从数组中删除第一个元素,并返回该元素的值(删除的元素)。

    array.shift();     // 返回删除元素:{ id: 1, title:'js数组方法1' }
    console.log(array) // [{ id: 2, title:'js数组方法2' }]
    

    arr.splice( ):数组删除、插入和替换一个或多个元素;并返回删除元素的值。

    /* 删除:指定2个参数,要删除的项的位置和要删除的个数 */
    array.splice(0,1);    // 从索引为0开始删除一项
    console.log(array);  // [{ id: 2, title:'js数组方法2' }]
    
    /* 插入:向指定位置插入任意数量的元素,需提供3个参数:起始位置、 0(要删除的项数)和要插入的元素。 */
    array.splice(2,0,{ id: 3, title:'js数组方法3' });
    console.log(array); 
    // [{ id: 1, title:'js数组方法1' },{ id: 2, title:'js数组方法2' },{ id: 3, title:'js数组方法3' }] 
    
    /* 替换:向指定位置插入任意数量的项,且同时删除任意数量的项,需指定 3 个参数:起始位置、要删除的项数和要插入的任意数量的项。插入的项数不必与删除的项数相等。 /
    array.splice(1,1,{ id: 3, title:'js数组方法3' });
    console.log(array);  
    // [{ id: 1, title:'js数组方法1' },{ id: 3, title:'js数组方法3' }]
    

    2. 数组循环遍历、筛选系列

    arr.forEach( )方法用于调用数组的每一个元素,并将元素传递给回调函数。这个方法没有返回值。
    语法:array.forEach(function(currentValue, index, arr), thisValue)

    array.forEach((value, index, arr) => {
      console.log(`${value} => ${index} => ${arr}`);
    })
    

    arr.filter( )方法用于对数组进行过滤。它创建一个新数组,新数组中的元素是通过检查指定数组中符合条件的所有元素。返回新数组。注意:不会对空数组进行检测、不会改变原始数组

    语法:array.filter(function(currentValue, indedx, arr), thisValue)

    let res = array.filter((item) => { 
        return item.id = 1; 
    }); 
    console.log(res); // [{ id: 1, title:'js数组方法1' }]
    

    arr.map( )方法返回一个新的数组,数组中的元素为原始数组调用函数处理后的值,也就是map()方法进行处理之后返回一个新的数组。注意:不会对空数组进行检测、不会改变原始数组

    语法:array.map(function(currentValue,index,arr), thisValue)

    let res = array.map(function (item) { return item.id; });
    console.log(res); // [1,2]
    

    arr.some( )方法用于检测数组中的元素是否满足指定条件,如果有一个元素满足条件,则表达式返回true , 剩余的元素不会再执行检测。如果没有满足条件的元素,则返回false。

    语法:array.some(function(currentValue,index,arr),thisValue)

    if (array.some(item => item.id < 10)) {  
    console.log('true')  
    }
    

    arr.every( )方法用于检测数组所有元素是否都符合指定条件。如果数组中检测到有一个元素不满足,则整个表达式返回false,且剩余的元素不会再进行检测。如果所有元素都满足条件,则返回 true。

    语法:array.every(function(currentValue,index,arr), thisValue)

    if (array.some(item => item.id < 10)) {  
    console.log('true')  
    }
    

    arr.findIndex( )方法返回数组中满足条件的第一个元素的索引(下标), 如果没有找到,返回-1
    语法:array.findIndex(function(currentValue, index, arr), thisValue)

    let res = array.findIndex(function (item) { return item.id = 1; });
    console.log(res); // 0
    

    arr.find( )方法返回数组中满足条件的第一个元素的值,如果没有,返回undefined
    语法:array.find(function(currentValue, index, arr),thisValue)

    let res = array.find(function (item) { return item.id = 1; });
    console.log(res); // [{ id: 1, title:'js数组方法1' }]
    

    arr.includes( )方法用来判断一个数组是否包含一个指定的值,如果是返回 true,否则false。
    语法:array.includes(searchElement, fromIndex);

    fromIndex:可选的参数,从该索引处开始查找searchElement。如果为负值,则按升序从array.length + fromIndex 的索引开始搜索。默认为0。

    let res = array.includes(function (item) { return item.id = 1; });
    console.log(res); // [{ id: 1, title:'js数组方法1' }]
    

    arr.indexOf( )方法判断数组中是否存在某个值,如果存在返回数组元素的下标,否则返回-1。
    语法:array.indexOf(item,start)

    start:可选的整数参数。规定在数组中开始检索的位置。

    let fruits=["Orange","Apple","Mango","Banana","Apple"];
    let a = fruits.indexOf("Apple",4);
    console.log(a);    // 4
    

    arr.fill()使用制定的元素填充数组

    接受两个参数:
    arr.fill(填充的东西,开始位置,结束位置)

    let arr = new Array(4)
    arr.fill('默认值')
    console.log(arr)//['默认值','默认值','默认值','默认值']
    arr.fill('默认值',1,2)
    console.log(arr)//[empty,'默认值','默认值',empty]
    

    3. 数组合并

    arr.concat( )方法用于合并两个或多个数组。此方法不会更改现有数组,返回值是一个新数组

    let array2 = [
        { id: 3, title:'js数组方法3' },
        { id: 4, title:'js数组方法4' }
    ]
    array.concat(array2)
    console.log(array)
    // [{ id: 1, title:'js数组方法2' },{ id: 2, title:'js数组方法2' }{ id: 3, title:'js数组方法3' },{ id: 4, title:'js数组方法4' }]
    

    4. 数组排序

    arr.sort()方法将数组里的项从小到大排序。注意:sort()方法比较的是字符串,没有按照数值的大小对数字进行排序,要实现这一点,就必须使用一个排序函数。原数组不会被改变。

    let arr1 = ["a", "d", "c", "b"];
    console.log(arr1.sort());      //  ["a", "b", "c", "d"]
    
    /* 数值排序 /
    function sortNumber(a,b)
    {
      return a - b
    }
    arr = [13, 24, 51, 3]; 
    console.log(arr.sort());        // [13, 24, 3, 51] 
    console.log(arr.sort(sortNumber));  // [3, 13, 24, 51]
    

    arr.reverse( )方法用于颠倒数组中元素的顺序。

    var fruits = ["a", "b", "c", "d"];  
    fruits.reverse();
    console.log(fruits);
    //  d,c,b,a
    

    5. 数组转字符串

    arr.join( )方法就是把数组转换成字符串,然后给他规定个连接字符,默认的是逗号","。原数组不会被改变。

    var arr = [1,2,3];
    console.log(arr.join());     // 1,2,3
    console.log(arr.join("-"));    // 1-2-3
    

    相关文章

      网友评论

          本文标题:js数组

          本文链接:https://www.haomeiwen.com/subject/xsapdhtx.html