教你如何从数组中取值

数组的特点

1：数组有索引值 0 1 2 3
2：数组有长度，表示数组中元素的个数
3;数组结构，虽然可以存放任意类型的js数据，但是一般存放统一类型数据。
规则：数组内部的数据结构必须统一，特殊情况除外

 var arr = ['11', '22', '33']
        var stu = [
            { name: 'cieci', age: 12, dec: '无敌' },
            { name: 'cieci', age: 12, dec: '无敌' },
            { name: 'cieci', age: 12 }  // 不满足数组的结构要求 缺少 dec
        ]

以上为错误结构

数组的取值方式

array[索引值] 获取索引值对应的元素

var res = arr[1];
console.log(res)

数组遍历

取出数组中的元素

var num = ['11', '22', '33', '44', '55', '66', '77', '88', '99', '00']
        for (var a = 0; a < 11; a++) {
            console.log(num[a])
        }

如何获取组长度

var arr = [1, 3, 4, 5, 7];
var len = arr.length;
console.log(len);

多维数组

多维数组的遍历

循环嵌套方式 遍历多维数组

var arr = [
            ['1',1,2,3,4,5,6],
            ['3',1,2,3,4,5,326],
            ['4',1,2,3,4544,5,6],
            ['7',1,2,3,4,5,6],
        ];
         for (var i = 0; i < arr.length; i++) {
            // console.log(arr[i]);
            var data = arr[i];
            console.log(data, i, arr[i]);
            for (var j = 0; j < data.length; j++) {
                console.log(data[j]);
            },
        };

将下列的内容用列表方式打印到页面

var products = [
            [{
                name: '苹果',
                price: 3
            }, {
                name: '粒子',
                price: 21
            }],
            [{
                name: '苹果',
                price: 3
            }, {
                name: '粒子',
                price: 21
            }],
            [{
                name: '苹果',
                price: 3
            }, {
                name: '粒子',
                price: 21
            }],
            [{
                name: '苹果',
                price: 3
            }, {
                name: '粒子',
                price: 21
            }],
        ];
        for (var i = 0; i < products.length; i++) {
            products[i]
            for (var j = 0; j < products[i].length; j++) {
                // console.log(products[i][j].name);
                var name = products[i][j].name;
                var price = products[i][j].price
                    // ``模板字符串，${变量}
                document.write(`
                    <li style=list-style:none>
                       <span> 商品名称：${name} </span>
                       <span> 商品名称：${price} </span>
                    </li>
                `)
            }
        }

查询数组元素

查询数组中存在的某个元素
indexOf()查询数组中是否存在某个元素
不存在 返回-1
参数：被查询的元素

 var arr = [2, 3, 5, 6, 7, 8, 'dfd'];
        var res = arr.indexOf(8);
        console.log(res);

find()查询，数组中存在满足条件的元素
find()查询，数组中存在满足条件的元素
如果存在，返回第一个满足条件元素
不存在 返回 undefined
参数：函数
回调函数

        var res1 = arr.find(function(xieke) {
         xieke 回参 所有被查询过的元素 
            console.log(xieke, '=======');
            return xieke > 5;
        });
        console.log(res1);

删除数组元素

pop()从数组尾部删除元素，返回被删除元素
shift() 从数组头部删除元素，并返回被删除的元素

var arr = [2, 2, 23, 3, 5, 6, 'aaa'];

      
        var res = arr.pop();
        console.log(res);

       
        var res1 = arr.shift();
        console.log(arr, res1);

// 总结，增 删 都是该原来的数组

需求 从某一个位置删除几个元素

splice(index,len)从第几个索引开始 删除几个元素，并返回删除内容

        var arr1 = [1, 2, 3, 5, 4, 6, 7, 8, 9, 0];
        var res2 = arr1.splice(2, 3);
        console.log(arr1, res2);

数组其他API

reverse() 颠倒数组

var arr = [1, 2, 4, 6, 8, 0];
      
        var res = arr.reverse();
        console.log(res, arr);

数组变字符串

    var str = arr.toString();

    var str1 = arr.join('');